:root {
  --paper: #fff9ef;
  --paper-light: #fffdf8;
  --paper-deep: #f7ecdc;
  --ink: #3e352f;
  --muted: #776c64;
  --milk: #c89f76;
  --milk-deep: #875936;
  --coral: #d97e68;
  --terracotta: #b04e2e;
  --butter: #f2d58a;
  --sage: #a7aea0;
  --hairline: #e5d4bf;
  --line: #bb7f43;
  --line-green: #35bd55;
  --display: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif;
  --body: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif;
  --shell: 1240px;
  --header-h: 84px;
  --ease: cubic-bezier(.22, .75, .25, 1);
  --shadow-paper: 0 2px 0 rgba(135, 89, 54, .05), 0 16px 45px rgba(84, 57, 39, .08);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body { margin: 0; min-width: 320px; color: var(--ink); background: var(--paper); font-family: var(--body); font-size: 17px; line-height: 1.75; overflow-x: hidden; }
body::before { content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 1000; opacity: .04; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E"); mix-blend-mode: multiply; }
body.modal-open { overflow: hidden; }
button, input, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
img, svg { display: block; max-width: 100%; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: var(--display); font-weight: 700; line-height: 1.18; letter-spacing: -.035em; }
.hero h1 { font-weight: 900; }
h2 { font-size: clamp(2.4rem, 5vw, 4.5rem); }
h3 { font-size: clamp(1.6rem, 2.3vw, 2.35rem); }
button { color: inherit; }
::selection { background: var(--butter); color: var(--ink); }
:focus-visible { outline: 3px solid var(--terracotta); outline-offset: 4px; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: 8px; left: 8px; z-index: 2000; padding: 10px 16px; background: var(--ink); color: var(--paper); transform: translateY(-160%); transition: transform .2s; }
.skip-link:focus { transform: translateY(0); }
.section-shell { width: min(calc(100% - 96px), var(--shell)); margin-inline: auto; }
.chapter { position: relative; border-top: 1px solid var(--hairline); }
.chapter-number { margin: 0; color: var(--milk); font-family: var(--display); font-size: 1.75rem; font-variant-numeric: tabular-nums; line-height: 1; }
.eyebrow { margin-bottom: 12px; font-size: .72rem; font-weight: 700; letter-spacing: .18em; line-height: 1.4; text-transform: uppercase; }
.button { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; gap: 10px; padding: 12px 24px; border: 1px solid transparent; border-radius: 999px; font-size: .92rem; font-weight: 700; line-height: 1; cursor: pointer; transition: transform .25s var(--ease), background-color .25s, color .25s, border-color .25s; }
.button:hover { transform: translateY(-2px); }
.button--primary { background: var(--terracotta); color: #fffaf3; }
.button--primary:hover { background: #8f3f24; }
.button--outline { border-color: var(--terracotta); background: transparent; color: var(--terracotta); }
.button--outline:hover { background: var(--terracotta); color: #fffaf3; }
.button--cream { background: var(--paper-light); color: var(--milk-deep); }
.button--cream:hover { background: var(--butter); }
.button--ghost-cream { border-color: rgba(255, 249, 239, .7); color: var(--paper); }
.button--ghost-cream:hover { background: var(--paper); color: var(--milk-deep); }
.button--line { background: var(--line-green); color: #07310f; }
.button--line:hover { background: #56ce70; }
.button--line span { display: inline-flex; width: 38px; height: 20px; align-items: center; justify-content: center; border-radius: 999px; background: #fff; color: #149235; font-size: .56rem; font-weight: 900; }
.button--wide { width: 100%; }
.button-reset { padding: 0; border: 0; background: none; }
.btn-paw { flex: 0 0 auto; fill: currentColor; }
.text-link { display: inline-flex; align-items: center; gap: 9px; border-bottom: 1px solid currentColor; font-size: .91rem; font-weight: 700; line-height: 1.8; }
.text-link span { transition: transform .25s var(--ease); }
.text-link:hover span { transform: translateX(4px); }
.back-link { display: inline-block; margin-bottom: 48px; color: var(--muted); font-size: .88rem; font-weight: 600; }

/* Loader */
.loader { position: fixed; inset: 0; z-index: 2500; display: grid; place-items: center; background: var(--paper); transition: opacity .35s var(--ease), visibility .35s; }
.loader.is-done { opacity: 0; visibility: hidden; }
.loader__mark { display: grid; justify-items: center; gap: 12px; color: var(--milk-deep); }
.loader__mark svg { width: 88px; overflow: visible; }
.loader__mark path, .loader__mark ellipse { fill: transparent; stroke: var(--milk-deep); stroke-width: 2; stroke-dasharray: 150; stroke-dashoffset: 150; animation: draw-paw .7s var(--ease) forwards, fill-paw .25s 1s forwards; }
.loader__toe--1 { animation-delay: .12s, 1s !important; }.loader__toe--2 { animation-delay: .24s, 1s !important; }.loader__toe--3 { animation-delay: .36s, 1s !important; }.loader__toe--4 { animation-delay: .48s, 1s !important; }
.loader__mark span { font-size: .78rem; letter-spacing: .22em; opacity: 0; animation: loader-copy .35s .85s forwards; }
@keyframes draw-paw { to { stroke-dashoffset: 0; } }
@keyframes fill-paw { to { fill: var(--milk-deep); } }
@keyframes loader-copy { to { opacity: 1; } }

/* Header */
.site-header { position: fixed; top: 0; left: 0; right: 0; z-index: 1200; height: var(--header-h); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 clamp(24px, 4vw, 72px); transition: height .3s var(--ease), background-color .3s, border-color .3s; }
.site-header.is-scrolled, .site-header.is-solid { height: 68px; border-bottom: 1px solid var(--hairline); background: rgba(255, 249, 239, .96); }
.site-header .header-cta { justify-self: end; min-height: 42px; padding: 10px 20px; }
.site-header.is-scrolled .header-cta { background: var(--milk-deep); color: var(--paper-light); }
.brand { --brand-image-width: 176px; position: relative; display: block; width: 176px; height: 60px; overflow: hidden; background-color: var(--paper); background-image: url("assets/brand/paw-for-good-logo.png"); background-repeat: no-repeat; background-position: left center; background-size: var(--brand-image-width) auto; background-blend-mode: multiply; }
.brand__logo { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.brand--footer { --brand-image-width: 210px; width: 210px; height: 96px; background-color: var(--paper-light); }
.desktop-nav { display: flex; gap: clamp(24px, 3vw, 48px); align-items: center; }
.desktop-nav a { position: relative; padding: 10px 0; font-size: .85rem; font-weight: 650; }
.desktop-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 6px; height: 1px; background: var(--milk-deep); transition: right .25s var(--ease); }
.desktop-nav a:hover::after { right: 0; }
.menu-toggle, .mobile-nav { display: none; }

/* Shared dog illustration */
.dog-art { position: relative; }
.dog-art svg { width: 100%; height: 100%; overflow: visible; filter: drop-shadow(0 14px 12px rgba(94, 64, 40, .09)); }
.dog-art .dog { transform-box: fill-box; transform-origin: 50% 100%; animation: dog-breathe 4.8s ease-in-out infinite; }
.dog-art .dog-tail { transform-box: fill-box; transform-origin: 10% 80%; animation: tail-wag 2.9s ease-in-out infinite; }
.dog-art .dog-eyes { transform-box: fill-box; transform-origin: center; animation: dog-blink 5.5s infinite; }
.dog-art .dog-ear-right { transform-box: fill-box; transform-origin: 25% 15%; animation: ear-twitch 6.7s ease-in-out infinite; }
.dog-art:hover .dog-tail, .teacher-card:hover .dog-tail { animation-duration: .55s; }
@keyframes dog-breathe { 0%, 100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-2px) rotate(.2deg); } }
@keyframes tail-wag { 0%, 80%, 100% { transform: rotate(0); } 86% { transform: rotate(-8deg); } 92% { transform: rotate(7deg); } }
@keyframes dog-blink { 0%, 43%, 47%, 100% { transform: scaleY(1); } 45% { transform: scaleY(.08); } }
@keyframes ear-twitch { 0%, 75%, 81%, 100% { transform: rotate(0); } 78% { transform: rotate(5deg); } }

/* Animator-designed raster character rigs */
.dog-art--raster { display: grid; place-items: center; }
.dog-raster { position: relative; display: block; width: 100%; height: 100%; filter: drop-shadow(0 14px 12px rgba(94, 64, 40, .09)); transform-origin: 50% 90%; animation: dog-breathe 4.8s ease-in-out infinite; }
.dog-raster__frame { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; opacity: 0; animation-duration: 10.5s; animation-delay: var(--dog-delay, 0s); animation-timing-function: steps(1, end); animation-iteration-count: infinite; animation-fill-mode: both; }
.dog-raster__neutral { animation-name: raster-neutral; }
.dog-raster__blink { animation-name: raster-blink; }
.dog-raster__glance { animation-name: raster-glance; }
.dog-raster__action { animation-name: raster-action; }
@keyframes raster-neutral { 0%, 43%, 48%, 68%, 75%, 86%, 94%, 100% { opacity: 1; } 44%, 47%, 69%, 74%, 87%, 93% { opacity: 0; } }
@keyframes raster-blink { 0%, 43%, 48%, 100% { opacity: 0; } 44%, 47% { opacity: 1; } }
@keyframes raster-glance { 0%, 68%, 75%, 100% { opacity: 0; } 69%, 74% { opacity: 1; } }
@keyframes raster-action { 0%, 86%, 94%, 100% { opacity: 0; } 87%, 93% { opacity: 1; } }
.dog-art[data-dog-pose] .dog-raster__frame { animation: none; opacity: 0; }
.dog-art[data-dog-pose="neutral"] .dog-raster__neutral,
.dog-art[data-dog-pose="glance"] .dog-raster__glance,
.dog-art[data-dog-pose="action"] .dog-raster__action { opacity: 1; }
.dog-art--raster:hover .dog-raster__frame,
.teacher-card:hover .dog-raster__frame { animation: none; }
.dog-art--raster:hover .dog-raster__neutral,
.dog-art--raster:hover .dog-raster__blink,
.dog-art--raster:hover .dog-raster__glance,
.teacher-card:hover .dog-raster__neutral,
.teacher-card:hover .dog-raster__blink,
.teacher-card:hover .dog-raster__glance { opacity: 0; }
.dog-art--raster:hover .dog-raster__action,
.teacher-card:hover .dog-raster__action { opacity: 1; }
.dog-raster--sleeping { position: relative; display: block; width: 100%; height: 100%; animation: sleep-breathe 5.5s ease-in-out infinite; }
.dog-raster--sleeping img { width: 100%; height: 100%; object-fit: contain; }
@keyframes sleep-breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.012, .995); } }

/* Hero */
.hero { min-height: 100svh; padding-top: var(--header-h); border-top: 0; overflow: hidden; }
.hero__grid { min-height: calc(100svh - var(--header-h) - 80px); display: grid; grid-template-columns: 7fr 5fr; align-items: center; gap: 48px; padding-block: 80px 48px; }
.hero__copy { position: relative; z-index: 2; }
.hero .chapter-number { position: absolute; left: -48px; top: 10px; }
.hero__eyebrow { opacity: 0; animation: hero-in .55s .2s forwards; }
.hero__eyebrow span { margin-left: 16px; color: var(--muted); }
.hero h1 { margin: 20px 0 32px; font-size: clamp(5rem, 8.8vw, 8.2rem); font-weight: 500; line-height: .98; letter-spacing: -.065em; }
.hero h1 span { display: block; opacity: 0; transform: translateY(26px); animation: hero-in .8s .38s var(--ease) forwards; }
.hero h1 span + span { margin-left: .55em; animation-delay: .55s; }
.hero__intro { max-width: 590px; margin-bottom: 32px; color: #51463f; font-size: 1.05rem; line-height: 1.9; opacity: 0; animation: hero-in .65s .75s forwards; }
.hero__actions { display: flex; align-items: center; gap: 28px; opacity: 0; animation: hero-in .65s .92s forwards; }
/* Two-act hero intro: Act 1 = photos deal in one by one; Act 2 = scroll (--reveal 0→1) tucks
   the photos into a top cluster while the illustrated 奶茶 avatar rises to take the stage. */
.hero__visual { --reveal: 0; position: relative; min-height: 660px; display: flex; align-items: flex-end; justify-content: center; }
.hero__visual::after { content: ""; position: absolute; left: 8%; right: 4%; bottom: 44px; height: 40px; border-radius: 50%; background: rgba(138, 101, 72, .12); transform: rotate(-1deg); filter: blur(3px); opacity: var(--reveal); transition: opacity .25s var(--ease); }

/* the fan overlays the whole visual; cards sit centered (Act 1), lift + shrink on --reveal (Act 2) */
.hero-photo-fan { position: absolute; inset: 0; z-index: 4; pointer-events: none; display: flex; justify-content: center; align-items: center; gap: clamp(14px, 1.6vw, 22px); }
.hero-photo {
  flex: 0 0 auto; position: relative;
  width: clamp(190px, 16vw, 240px); aspect-ratio: 4 / 5;
  --p: clamp(0, calc((var(--reveal) - var(--s, 0)) / .42), 1);
  opacity: calc(1 - var(--p));
  transform: translateY(calc(var(--p) * -46px)) scale(calc(1 - var(--p) * .08));
  transition: transform .18s linear, opacity .18s linear;
}
.hero-photo--left  { --s: 0; }
.hero-photo--right { --s: .12; }
.hero-photo--front { --s: .24; }

.hero-photo__card {
  position: relative; width: 100%; height: 100%; padding: 9px 9px 34px;
  background: #fffdf8; border: 1px solid rgba(135, 89, 54, .18); border-radius: 7px 8px 6px 7px;
  box-shadow: 0 2px 5px rgba(73, 47, 30, .09), 0 22px 44px rgba(73, 47, 30, .17);
}
.js .hero-photo__card { opacity: 0; transform: translateY(14px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.js .hero-photo.is-visible .hero-photo__card { opacity: 1; transform: none; }

.hero-photo__card img { width: 100%; height: 100%; object-fit: cover; border-radius: 3px; filter: saturate(.9) contrast(.99) sepia(.03); }
.hero-photo--left  img { object-position: 50% 40%; }
.hero-photo--right img { object-position: 42% 42%; }
.hero-photo--front img { object-position: 50% 30%; }
.hero-photo__cap { position: absolute; left: 9px; right: 9px; bottom: 9px; color: var(--milk-deep); font-family: var(--display); font-weight: 700; font-size: .62rem; letter-spacing: .1em; text-align: center; }

/* 奶茶 avatar — hidden during Act 1, rises as --reveal → 1 */
.dog-art--hero { z-index: 2; width: min(100%, 520px); aspect-ratio: 1; opacity: var(--reveal); transform: translateY(calc((1 - var(--reveal)) * 40px)); transition: opacity .2s linear, transform .2s linear; }
.hero__dog-note { position: absolute; z-index: 3; right: 2%; bottom: 14px; margin: 0; color: var(--muted); font-size: .65rem; letter-spacing: .15em; writing-mode: vertical-rl; opacity: var(--reveal); transition: opacity .25s var(--ease); }
.hero__dog-note span { color: var(--ink); font-size: .9rem; font-weight: 700; letter-spacing: .05em; }
.star { position: absolute; z-index: 3; color: #d99222; font-family: serif; font-size: 3.2rem; line-height: 1; animation: star-pulse 3.5s ease-in-out infinite; }
.star--one { top: 11%; right: 21%; }.star--two { top: 20%; right: 5%; font-size: 2rem; animation-delay: .6s; }.star--three { top: 27%; left: 2%; font-size: 2.4rem; animation-delay: 1.1s; }
@keyframes hero-in { to { opacity: 1; transform: translateY(0); } }
@keyframes hero-dog-in { to { opacity: 1; transform: translateY(0); } }
@keyframes star-pulse { 0%, 100% { transform: scale(1) rotate(0); opacity: .9; } 50% { transform: scale(.86) rotate(6deg); opacity: .55; } }
.hero__path { position: absolute; left: -4vw; right: -4vw; bottom: 75px; height: 150px; border-top: 2px solid rgba(187, 127, 67, .55); border-radius: 50%; transform: rotate(.8deg); }
.hero__path::after { content: ""; position: absolute; right: 3%; top: -94px; width: 170px; height: 90px; border: 2px solid rgba(187, 127, 67, .65); border-left-color: transparent; border-radius: 50%; transform: rotate(8deg); }
.proof-strip { position: relative; z-index: 4; min-height: 80px; border-top: 1px solid var(--hairline); background: rgba(255,253,248,.62); }
.proof-strip__inner { min-height: 80px; display: flex; align-items: center; justify-content: center; gap: 34px; color: #584a40; font-size: .78rem; font-weight: 700; letter-spacing: .08em; }
.proof-strip i { color: var(--milk); font-style: normal; }

/* Section headings and reveal */
.section-heading { display: grid; grid-template-columns: 80px minmax(0, 1fr); gap: 24px; align-items: start; }
.section-heading h2 { margin: 10px 0 20px; }
.section-heading p:last-child { max-width: 520px; color: var(--muted); }
.js .reveal { opacity: 0; transform: translateY(24px); transition: opacity .75s var(--ease), transform .75s var(--ease); }
.js .reveal.is-visible { opacity: 1; transform: translateY(0); }

/* Teachers */
.teachers { padding: 144px 0; background: var(--paper-light); overflow: hidden; }
.teachers .section-heading { max-width: 600px; }
.teacher-stage { --dog-accent: #d2a265; position: relative; min-height: 570px; display: grid; grid-template-columns: 1.2fr .8fr; align-items: center; gap: 72px; margin: 72px auto 48px; padding: 24px clamp(32px, 6vw, 80px); border: 1px solid var(--hairline); border-radius: 96px 24px 84px 28px / 38px 76px 42px 70px; background: color-mix(in srgb, var(--dog-accent) 10%, var(--paper-light)); box-shadow: var(--shadow-paper); transition: background-color .5s var(--ease); }
.teacher-stage::before, .teacher-stage::after { content: ""; position: absolute; width: 70px; height: 1px; background: var(--milk); opacity: .7; }
.teacher-stage::before { left: -30px; top: 24%; }.teacher-stage::after { right: -30px; bottom: 23%; }
.teacher-stage.is-switching .teacher-stage__art-wrap { opacity: 0; transform: translateX(-24px) scale(.96); }
.teacher-stage.is-switching .teacher-stage__copy { opacity: 0; transform: translateX(18px); }
.teacher-stage__art-wrap, .teacher-stage__copy { transition: opacity .24s, transform .35s var(--ease); }
.teacher-stage__art-wrap { position: relative; height: 500px; display: grid; place-items: center; }
.teacher-stage__art-wrap::after { content: ""; position: absolute; left: 13%; right: 13%; bottom: 35px; height: 22px; border-radius: 50%; background: rgba(85, 56, 38, .12); filter: blur(3px); }
.teacher-stage__counter { position: absolute; z-index: 5; top: 0; left: 0; padding: 9px 18px; border-radius: 4px 18px 18px 4px; background: var(--milk-deep); color: white; font-size: .7rem; font-weight: 700; letter-spacing: .14em; }
.registration-mark { position: absolute; color: var(--milk-deep); font-size: 2rem; opacity: .55; }.registration-mark--a { left: 0; bottom: 20px; }.registration-mark--b { right: 0; top: 40px; }
.dog-art--teacher { z-index: 2; width: 100%; height: 100%; }
.teacher-stage__copy { max-width: 390px; }
.teacher-stage__copy h3 { margin: 8px 0 18px; font-size: clamp(3.4rem, 6vw, 6rem); font-weight: 500; }
.teacher-stage__meta { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 24px; }
.teacher-stage__meta span { padding: 8px 13px; border-radius: 999px; background: rgba(255,255,255,.7); font-size: .77rem; font-weight: 700; }
.teacher-stage__copy > p { color: var(--muted); line-height: 1.9; }
.teacher-deck { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
.teacher-card { position: relative; min-width: 0; padding: 16px 12px 18px; border: 1px solid var(--hairline); border-radius: 16px 26px 18px 22px; background: var(--paper); cursor: pointer; color: var(--ink); transition: transform .35s var(--ease), border-color .3s, background-color .3s; }
.teacher-card:nth-child(even) { transform: rotate(.5deg); }.teacher-card:nth-child(3n) { transform: rotate(-.5deg); }
.teacher-card:hover { transform: translateY(-7px) rotate(0); }
.teacher-card.is-active { border-color: var(--milk-deep); background: #f7e8d2; transform: translateY(-7px); }
.teacher-card.is-active::before { content: "正在陪你"; position: absolute; z-index: 2; top: -10px; right: 10px; padding: 4px 10px; border-radius: 99px; background: var(--coral); color: white; font-size: .58rem; letter-spacing: .08em; }
.teacher-card__art { display: block; height: 150px; }
.teacher-card__art .dog-art { width: 100%; height: 100%; }
.teacher-card__name { display: flex; flex-direction: column; margin-top: 4px; line-height: 1.3; }
.teacher-card__name strong { font-family: var(--display); font-size: 1.25rem; }.teacher-card__name small { margin-top: 3px; color: var(--muted); font-size: .52rem; letter-spacing: .12em; }
.teacher-card__tag { display: block; margin-top: 12px; color: var(--muted); font-size: .7rem; }

/* Documentary field notes */
.field-notes { padding: 128px 0 144px; border-top: 1px solid var(--hairline); background: #f8eddc; overflow: hidden; }
.field-notes__heading { display: grid; grid-template-columns: 1.25fr .75fr; align-items: end; gap: clamp(48px, 8vw, 120px); margin-bottom: 64px; }
.field-notes__heading h2 { max-width: 800px; margin-bottom: 0; font-size: clamp(3rem, 5.8vw, 5.8rem); }
.field-notes__intro { max-width: 480px; padding-bottom: 8px; }
.field-notes__intro p { margin-bottom: 18px; color: var(--muted); line-height: 1.9; }
.field-notes__intro span { display: inline-flex; align-items: center; gap: 8px; color: var(--milk-deep); font-size: .66rem; font-weight: 700; letter-spacing: .08em; }
.field-notes__intro span::before { content: ""; width: 28px; height: 1px; background: currentColor; }
.field-notes__gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: minmax(430px, 46vw) 300px; gap: 18px; }
.field-photo { position: relative; min-width: 0; margin: 0; overflow: hidden; border: 8px solid var(--paper-light); background: var(--paper-light); box-shadow: var(--shadow-paper); }
.field-photo:nth-child(3) { transform: rotate(.45deg); }.field-photo:nth-child(4) { transform: rotate(-.55deg); }
.field-photo::after { content: ""; position: absolute; inset: 0; border: 1px solid rgba(255,255,255,.28); pointer-events: none; }
.field-photo--feature { grid-column: 1 / -1; }
.field-photo--feature::before { content: ""; position: absolute; z-index: 3; top: -4px; left: 50%; width: 112px; height: 30px; background: rgba(226, 202, 163, .82); transform: translateX(-50%) rotate(-1.5deg); }
.field-photo img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.82) contrast(.96) sepia(.05); transform: scale(1.01); transition: transform .7s var(--ease), filter .5s; }
.field-photo--feature img { object-position: 50% 50%; }
.field-photo:nth-child(2) img { object-position: 50% 48%; }.field-photo:nth-child(4) img { object-position: 50% 32%; }.field-photo:nth-child(5) img { object-position: 50% 32%; }
.field-photo:hover img { filter: saturate(.98) contrast(1); transform: scale(1.035); }
.field-photo figcaption { position: absolute; z-index: 2; left: 16px; right: 16px; bottom: 16px; display: flex; align-items: end; justify-content: space-between; gap: 18px; padding: 13px 16px; background: rgba(255, 249, 239, .92); color: var(--ink); backdrop-filter: blur(8px); }
.field-photo figcaption span { flex: 0 0 auto; color: var(--milk-deep); font-size: .55rem; font-weight: 800; letter-spacing: .14em; }
.field-photo figcaption strong { font-family: var(--display); font-size: .86rem; font-weight: 600; line-height: 1.45; text-align: right; }
.field-notes__gallery--compact { grid-template-columns: minmax(0, 1.65fr) minmax(250px, .55fr); grid-template-rows: 520px; align-items: stretch; }
.field-notes__gallery--compact .field-photo--feature { grid-column: auto; }
.field-notes__proof { display: grid; grid-template-columns: 42px 1fr; align-content: center; gap: 5px 14px; padding: 36px 30px; border: 1px solid var(--hairline); border-radius: 18px 46px 20px 38px; background: rgba(255, 253, 248, .7); box-shadow: var(--shadow-paper); }
.field-notes__proof span { grid-row: span 2; color: var(--milk); font-family: var(--display); font-size: 1.2rem; }
.field-notes__proof strong { font-family: var(--display); font-size: 1.2rem; }
.field-notes__proof p { margin: 0 0 30px; color: var(--muted); font-size: .78rem; line-height: 1.75; }
.field-notes__proof p:last-child { margin-bottom: 0; }

/* Questions */
.questions { min-height: 2000px; padding: 144px 0 180px; overflow: hidden; }
.chapter-path { position: absolute; z-index: 0; top: 150px; left: 50%; width: min(92%, 1320px); height: calc(100% - 200px); transform: translateX(-50%); pointer-events: none; }
.chapter-path path { fill: none; stroke: var(--line); stroke-width: 2; stroke-linecap: round; stroke-dasharray: 2800; stroke-dashoffset: var(--path-offset, 2800); opacity: .55; }
.questions .section-shell { position: relative; z-index: 2; }
.section-heading--questions { margin-bottom: 96px; }
.question { min-height: 520px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: clamp(48px, 8vw, 112px); margin-bottom: 96px; }
.question--right .question__copy { order: 2; }.question--right .scene { order: 1; }
.question__copy { max-width: 520px; }
.question__number { margin: 0 0 18px; color: var(--milk); font-family: var(--display); font-size: 1.4rem; }
.question__copy h3 { margin: 10px 0 20px; font-size: clamp(2.6rem, 4.6vw, 4.8rem); }
.question__copy > p:last-of-type { color: var(--muted); line-height: 1.95; }
.outcome-list { display: flex; gap: 10px; flex-wrap: wrap; padding: 0; margin: 28px 0 0; list-style: none; }
.outcome-list li { padding: 7px 13px; border: 1px solid var(--hairline); border-radius: 999px; background: var(--paper-light); font-size: .75rem; }
.scene { position: relative; min-height: 460px; display: grid; place-items: center; }
.scene--human { aspect-ratio: 1; min-height: 0; overflow: hidden; border: 1px solid var(--hairline); border-radius: 44% 18% 40% 22% / 20% 44% 24% 38%; background: #fffdf9; box-shadow: var(--shadow-paper); isolation: isolate; }
.scene--human::after { content: ""; position: absolute; z-index: 1; inset: 0; border: 1px solid rgba(255,255,255,.55); border-radius: inherit; pointer-events: none; }
.scene__human { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.dog-art--scene { position: absolute; z-index: 3; }
.scene--together .dog-art--scene { right: 5%; bottom: 5%; width: 47%; height: 56%; }
.scene--evaluation .dog-art--scene { right: 5%; bottom: 13%; width: 43%; height: 52%; }
.scene--guided .dog-art--scene { left: 34%; bottom: 19%; width: 34%; height: 46%; }
.scene--guided .scene__human { object-position: 50% 32%; }
.scene-caption { position: absolute; z-index: 5; top: 8%; right: 7%; max-width: 40%; display: grid; gap: 2px; padding: 10px 13px; border-radius: 4px 18px 16px 14px; background: rgba(255,253,248,.9); box-shadow: 0 8px 24px rgba(84,57,39,.1); }
.scene-caption strong { font-family: var(--display); font-size: .84rem; }
.scene-caption span { color: var(--muted); font-size: .61rem; line-height: 1.55; }
.assessment-props { position: absolute; z-index: 5; top: 7%; right: 6%; display: flex; align-items: end; gap: 3px; }
.assessment-props svg { width: 62px; height: 62px; opacity: 0; transform: translateY(10px) rotate(4deg); transition: opacity .35s, transform .55s var(--ease); }
.assessment-props svg + svg { width: 52px; height: 52px; margin-left: -14px; transform: translateY(12px) rotate(-4deg); transition-delay: .14s; }
.assessment-props.is-explained svg { opacity: 1; transform: translateY(0) rotate(4deg); }
.assessment-props.is-explained svg + svg { transform: translateY(0) rotate(-4deg); }
.evaluation-checkpoints, .outcome-sequence { position: absolute; z-index: 6; left: 5%; right: 5%; bottom: 4%; display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; padding: 0; margin: 0; list-style: none; }
.evaluation-checkpoints li, .outcome-sequence li { display: grid; min-height: 31px; place-items: center; border: 1px solid rgba(135,89,54,.2); border-radius: 999px; background: rgba(255,253,248,.92); color: var(--milk-deep); font-size: .61rem; font-weight: 700; letter-spacing: .08em; box-shadow: 0 5px 16px rgba(84,57,39,.08); }
.evaluation-evidence { position: absolute; z-index: 5; left: 5%; bottom: 14%; width: 26%; margin: 0; padding: 5px 5px 24px; border-radius: 7px; background: var(--paper-light); box-shadow: 0 9px 25px rgba(84,57,39,.16); transform: rotate(-3deg); }
.evaluation-evidence img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 4px; }
.evaluation-evidence figcaption { position: absolute; left: 7px; bottom: 4px; color: var(--muted); font-size: .46rem; font-weight: 700; letter-spacing: .04em; }
.outcome-sequence { grid-template-columns: repeat(3, 1fr); }
.outcome-sequence li { position: relative; }
.outcome-sequence li + li::before { content: "→"; position: absolute; left: -8px; color: var(--milk); }

/* Journey */
.journey { height: 330vh; background: #f9efdf; }
.journey__sticky { position: sticky; top: 0; height: 100vh; display: flex; align-items: center; overflow: hidden; }
.journey__shell { width: min(calc(100% - 64px), 1400px); }
.section-heading--journey { grid-template-columns: 58px auto; position: absolute; z-index: 10; left: max(32px, calc((100vw - 1400px)/2)); top: 110px; }
.section-heading--journey h2 { font-size: clamp(1.5rem, 2vw, 2.05rem); white-space: nowrap; }
.journey__viewport { margin-left: 400px; overflow: visible; }
.journey__track { display: flex; width: max-content; align-items: stretch; gap: 32px; transform: translateX(0); will-change: transform; }
.journey-stop { position: relative; width: min(31vw, 410px); min-width: 340px; padding: 28px 30px 32px; border: 1px solid var(--hairline); border-radius: 80px 18px 70px 26px / 40px 66px 36px 70px; background: rgba(255,253,248,.82); }
.journey-stop__index { position: absolute; top: 22px; left: 24px; color: var(--milk); font-family: var(--display); font-size: 1.1rem; }
.journey-stop__scene { position: relative; height: 260px; }
.journey-stop__scene::after { content: ""; position: absolute; left: 12%; right: 12%; bottom: 20px; height: 13px; border-radius: 50%; background: rgba(71,45,27,.1); }
.dog-art--journey { position: absolute; z-index: 2; left: 20%; bottom: 5px; width: 66%; height: 90%; }
.journey-stop h3 { margin: 10px 0 12px; font-size: 1.6rem; }.journey-stop p { margin-bottom: 0; color: var(--muted); font-size: .88rem; }
.stage-toolkit { position: absolute; z-index: 4; display: flex; align-items: flex-end; }
.stage-toolkit svg { width: 66px; height: 66px; opacity: 0; transform: translateY(12px) rotate(5deg) scale(.92); transition: opacity .35s, transform .55s var(--ease); }
.stage-toolkit svg:nth-child(2) { transform: translateY(12px) rotate(-5deg) scale(.92); transition-delay: .12s; }
.stage-toolkit svg:nth-child(3) { transform: translateY(12px) rotate(3deg) scale(.92); transition-delay: .24s; }
.stage-toolkit.is-explained svg { opacity: 1; transform: translateY(0) rotate(5deg) scale(1); }
.stage-toolkit.is-explained svg:nth-child(2) { transform: translateY(0) rotate(-5deg) scale(1); }
.stage-toolkit.is-explained svg:nth-child(3) { transform: translateY(0) rotate(3deg) scale(1); }
.stage-toolkit--street { left: 2%; bottom: 22px; align-items: center; flex-direction: column; }
.stage-toolkit--street svg { width: 92px; height: 108px; }
.stage-toolkit--street span { margin-top: -9px; padding: 3px 8px; border-radius: 999px; background: var(--paper-light); color: var(--muted); font-size: .52rem; font-weight: 700; }
.stage-toolkit--evaluation { right: 1%; top: 20%; }
.stage-toolkit--training { left: 0; bottom: 18px; gap: 0; }
.stage-toolkit--training svg { width: 56px; height: 56px; margin-right: -15px; }
.stage-toolkit--graduate { right: 1%; top: 18%; }
.stage-toolkit--classroom { right: 0; top: 5%; }
.stage-toolkit--classroom svg { width: 72px; height: 72px; }
.journey-stop__scene--ensemble { overflow: visible; }
.journey-ensemble { position: absolute; z-index: 3; left: 0; right: 2%; bottom: 10px; height: 72%; display: flex; align-items: flex-end; justify-content: center; }
.journey-ensemble .dog-art { width: 24%; height: 82%; margin-inline: -4%; }
.journey-ensemble .dog-art:nth-child(2), .journey-ensemble .dog-art:nth-child(4) { height: 72%; }
.journey-ensemble .dog-art:nth-child(3) { z-index: 2; height: 93%; }
.journey__progress { position: absolute; left: max(420px, calc((100vw - 620px)/2)); right: 5vw; bottom: 70px; height: 2px; background: var(--hairline); }
.journey__progress span { display: block; width: 100%; height: 100%; background: var(--milk-deep); transform: scaleX(0); transform-origin: left; }

/* Courses */
.courses { padding: 144px 0 160px; background: var(--paper-light); }
.courses .section-heading { margin-bottom: 64px; }
.course-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 20px; }
.course-card { position: relative; min-height: 500px; display: flex; flex-direction: column; align-items: flex-start; padding: 28px 28px 30px; border: 1px solid var(--hairline); border-radius: 24px 34px 18px 30px; background: var(--paper); overflow: hidden; }
.course-card--featured { background: #fff1dc; }
.course-card__top { width: 100%; display: flex; align-items: start; justify-content: space-between; gap: 16px; }
.course-card__number { font-family: var(--display); font-size: 2rem; color: var(--milk-deep); }
.status { padding: 5px 11px; border-radius: 999px; background: #dde1d6; color: #445046; font-size: .62rem; font-weight: 700; letter-spacing: .08em; }.status--open { background: #ef9b6b; color: #4a2917; }.status--partner { background: var(--butter); color: #59450c; }
.course-card__media { position: relative; width: 100%; aspect-ratio: 4 / 3; margin: 12px 0 14px; overflow: hidden; border: 1px solid var(--hairline); border-radius: 20px 28px 16px 24px; background: #f8ecda; }
.course-card__media > img { width: 100%; height: 100%; object-fit: cover; }
.course-card__media--guided > img { object-position: center; }
.dog-art--course { position: absolute; z-index: 3; }
.course-card__media--guided .dog-art--course { left: 32%; bottom: 8%; width: 38%; height: 53%; }
.course-card__media--guided figcaption { position: absolute; z-index: 4; left: 10px; right: 10px; bottom: 9px; padding: 5px 10px; border-radius: 999px; background: rgba(255,253,248,.91); color: var(--milk-deep); font-size: .58rem; font-weight: 800; letter-spacing: .08em; text-align: center; }
.course-card__media--toolkit { background: #f4e7d1; }
.course-card__media--toolkit .dog-art--course { right: -1%; bottom: 2%; width: 55%; height: 70%; }
.course-card__media--toolkit > span { position: absolute; z-index: 5; left: 9px; bottom: 9px; padding: 5px 9px; border-radius: 999px; background: rgba(255,253,248,.92); color: var(--milk-deep); font-size: .54rem; font-weight: 800; letter-spacing: .06em; }
.evaluator-tools { position: absolute; z-index: 4; left: 2%; top: 8%; width: 55%; height: 60%; }
.evaluator-tools svg { position: absolute; width: 66px; height: 66px; opacity: 0; transform: translateY(10px) rotate(-6deg); transition: opacity .35s, transform .55s var(--ease); }
.evaluator-tools svg:nth-child(2) { left: 44px; top: 26px; width: 58px; height: 58px; transform: translateY(10px) rotate(7deg); transition-delay: .13s; }
.evaluator-tools svg:nth-child(3) { left: 2px; top: 60px; width: 54px; height: 54px; transform: translateY(10px) rotate(4deg); transition-delay: .26s; }
.evaluator-tools.is-explained svg { opacity: 1; transform: translateY(0) rotate(-6deg); }
.evaluator-tools.is-explained svg:nth-child(2) { transform: translateY(0) rotate(7deg); }
.evaluator-tools.is-explained svg:nth-child(3) { transform: translateY(0) rotate(4deg); }
.course-card__media--photo > img { object-position: 50% 32%; filter: saturate(.85) contrast(.96); }
.course-card__media--photo figcaption { position: absolute; z-index: 3; left: 9px; right: 9px; bottom: 9px; display: flex; justify-content: center; gap: 5px; }
.course-card__media--photo figcaption span { padding: 4px 8px; border-radius: 999px; background: rgba(255,253,248,.92); color: var(--milk-deep); font-size: .55rem; font-weight: 800; }
.course-card h3 { margin: 10px 0 14px; font-size: 2rem; }.course-card > p { color: var(--muted); font-size: .83rem; }.course-card .text-link { margin-top: auto; }
.course-card__price { color: var(--ink) !important; font-weight: 700; }.course-card__price small { font-weight: 500; }

/* Numbers */
.numbers { padding: 96px 0 112px; overflow: hidden; }
.numbers__heading { display: flex; align-items: center; gap: 32px; margin-bottom: 56px; }
.numbers__heading .eyebrow { margin: 0; }
.numbers__grid { display: grid; grid-template-columns: .9fr .9fr 1.5fr .65fr .55fr .55fr; align-items: end; gap: 20px; }
.stat { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; }
.stat strong { position: relative; z-index: 2; font-family: var(--display); font-size: clamp(2.3rem, 4.2vw, 4rem); font-weight: 500; line-height: 1; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.stat span { margin-top: 12px; font-size: .72rem; font-weight: 700; letter-spacing: .06em; }
.stat--hero strong { font-size: clamp(3rem, 6vw, 6.4rem); }.stat--hero::before { content: ""; position: absolute; z-index: 1; left: 0; right: 0; top: 25%; height: 55%; background: var(--butter); transform: rotate(-1deg); clip-path: polygon(2% 12%, 98% 0, 95% 93%, 0 100%); opacity: .85; }
.stat--small strong { font-size: clamp(1.6rem, 2.6vw, 2.6rem); }
.numbers__note { margin: 64px auto 0; text-align: center; font-family: var(--display); font-size: 1rem; font-weight: 600; }
.paw-field { position: absolute; inset: 30% -5% auto; color: var(--milk); font-size: 1.5rem; opacity: .14; transform: rotate(-4deg); word-spacing: 8vw; }

/* Stories */
.stories { padding: 128px 0 120px; background: #f7eedf; overflow: hidden; }
.stories__grid { display: grid; grid-template-columns: .75fr 1.55fr; gap: 70px; align-items: start; }
.stories .section-heading { grid-template-columns: 60px 1fr; }.stories .section-heading h2 { font-size: clamp(2.7rem, 4vw, 4.2rem); }.stories .section-heading .text-link { margin-top: 18px; }
.story-notes { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; padding-top: 20px; }
.story-note { position: relative; min-height: 260px; margin: 0; padding: 42px 36px; border: 1px solid #e0ceb5; background: #fffaf0; box-shadow: 0 8px 30px rgba(70,45,29,.06); transform: rotate(-.7deg); }
.js .story-note.reveal { transform: translateY(24px) rotate(-.7deg); }.js .story-note.reveal.is-visible { transform: translateY(0) rotate(-.7deg); }
.story-note::before { content: ""; position: absolute; top: -12px; left: 38%; width: 80px; height: 24px; background: rgba(210,174,123,.45); transform: rotate(-2deg); }
.story-note span { color: var(--muted); font-size: .66rem; letter-spacing: .16em; }.story-note p { margin: 26px 0 0; font-family: var(--display); font-size: 1.15rem; line-height: 2; }.story-note i { position: absolute; right: 24px; bottom: 14px; color: var(--coral); font-size: 2.2rem; font-style: normal; }
.story-note--tilt { transform: rotate(.9deg); }.js .story-note--tilt.reveal { transform: translateY(24px) rotate(.9deg); }.js .story-note--tilt.reveal.is-visible { transform: translateY(0) rotate(.9deg); }
.story-note--photo { min-height: 500px; padding: 0; overflow: hidden; }
.story-note--photo img { width: 100%; height: 310px; object-fit: cover; filter: saturate(.82) contrast(.96) sepia(.04); }
.story-note--photo:first-child img { object-position: 50% 32%; }
.story-note--photo figcaption { padding: 26px 28px 30px; }
.story-note--photo figcaption span { display: block; color: var(--milk-deep); font-size: .58rem; font-weight: 700; letter-spacing: .08em; }
.story-note--photo blockquote { margin: 16px 0 0; font-family: var(--display); font-size: 1rem; line-height: 1.9; }
.sleeping-dog { grid-column: 2; justify-self: end; position: relative; width: 330px; height: 190px; margin-top: -26px; margin-right: 40px; }.dog-art--sleep { width: 100%; height: 100%; }.dog-art--sleep.dog-art--raster { transform: none; }.sleeping-dog > span { position: absolute; right: -16px; top: 0; color: var(--milk-deep); font-family: var(--display); font-size: .9rem; letter-spacing: .35em; }

/* Ready */
.ready { padding: 80px 0; border-top: 0; background: #a56636; color: var(--paper-light); overflow: hidden; }
.ready__grid { display: grid; grid-template-columns: 1.25fr .75fr .45fr; align-items: center; gap: 48px; }
.ready .chapter-number, .ready .eyebrow { color: var(--butter); }.ready h2 { margin: 16px 0 28px; font-size: clamp(3rem, 5.5vw, 5.5rem); font-weight: 500; }.ready__copy > p:not(.eyebrow) { max-width: 580px; color: #fff4e8; }
.ready__companion { margin: -12px 0 24px; font-family: var(--display); font-size: .9rem; }
.ready__proof { display: flex; gap: 12px; flex-wrap: wrap; }.ready__proof span { padding: 7px 12px; border: 1px solid rgba(255,249,239,.38); border-radius: 999px; font-size: .67rem; }
.ready__actions { display: flex; flex-direction: column; gap: 14px; }.ready__actions .button { width: 100%; }
.ready__dog { position: relative; height: 240px; align-self: end; }.ready__dog .dog-art { position: absolute; left: 0; right: -60px; bottom: -80px; height: 300px; }.speech-bubble { position: absolute; z-index: 3; right: -20px; top: 0; display: grid; min-width: 90px; min-height: 75px; place-items: center; padding: 10px; border-radius: 50%; background: var(--paper); color: var(--milk-deep); font-family: var(--display); font-size: .77rem; text-align: center; transform: rotate(6deg); }.speech-bubble::after { content: ""; position: absolute; left: 12px; bottom: -9px; border-width: 10px 8px 0; border-style: solid; border-color: var(--paper) transparent transparent; }

/* Footer */
.site-footer { position: relative; padding-top: 64px; background: var(--paper-light); overflow: hidden; }
/* footer landscape band removed */
.footer__grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr .75fr; gap: 56px; padding: 64px 0 56px; border-top: 1px solid var(--hairline); }
.footer__title { display: grid; grid-template-columns: 50px 1fr; align-content: start; }.footer__title h2 { margin: 0; font-size: 2.8rem; }.footer__title p:last-child { grid-column: 2; color: var(--muted); font-size: .85rem; }
.footer__links { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; font-size: .78rem; }.footer__links strong { margin-bottom: 10px; font-size: .68rem; letter-spacing: .12em; }.footer__links a, .footer__links button { padding: 2px 0; border: 0; background: none; cursor: pointer; color: var(--muted); }.footer__links a:hover, .footer__links button:hover { color: var(--milk-deep); }.footer__links--large a, .footer__links--large button { color: var(--ink); font-family: var(--display); font-size: 1rem; }
.footer__bottom { display: flex; align-items: center; justify-content: space-between; gap: 32px; padding: 20px 0 28px; border-top: 1px solid var(--hairline); color: var(--muted); font-size: .65rem; }
.footer__brand { position: relative; flex: 0 0 auto; display: block; width: 180px; height: 76px; overflow: hidden; background-color: var(--paper-light); background-image: url("assets/brand/paw-for-good-logo.png"); background-repeat: no-repeat; background-position: left center; background-size: 180px auto; background-blend-mode: multiply; }.footer__brand img { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.footer__legal { display: flex; flex: 1; align-items: center; justify-content: space-between; gap: 32px; }
.marquee { overflow: hidden; padding: 12px 0; background: var(--butter); color: var(--ink); font-family: var(--display); font-size: .78rem; font-weight: 700; letter-spacing: .12em; }
.marquee__track { display: flex; width: max-content; animation: marquee 60s linear infinite; }
.marquee__group { flex: 0 0 auto; white-space: nowrap; }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* Modal */
.assessment-modal { width: min(660px, calc(100% - 32px)); max-height: calc(100dvh - 32px); padding: 0; border: 0; border-radius: 28px 32px 24px 36px; background: var(--paper-light); color: var(--ink); box-shadow: 0 24px 90px rgba(45,30,20,.28); overflow: auto; }
.assessment-modal::backdrop { background: rgba(50,39,31,.48); backdrop-filter: blur(2px); }
.assessment-modal[open] { animation: modal-in .38s var(--ease); }
@keyframes modal-in { from { opacity: 0; transform: translateY(20px) scale(.98); } }
.assessment-modal__panel { position: relative; padding: 48px; }
.modal-close { position: absolute; top: 18px; right: 18px; width: 40px; height: 40px; border: 1px solid var(--hairline); border-radius: 50%; background: transparent; cursor: pointer; font-size: 1.5rem; line-height: 1; }
.modal-kicker { display: flex; justify-content: space-between; align-items: center; margin-bottom: 28px; padding-right: 54px; color: var(--muted); font-size: .72rem; font-weight: 700; letter-spacing: .12em; }
.line-dot { display: inline-grid; width: 46px; height: 25px; place-items: center; border-radius: 99px; background: var(--line-green); color: white; font-size: .57rem; letter-spacing: 0; }
.modal-step { display: none; }.modal-step.is-active { display: block; animation: step-in .35s var(--ease); }@keyframes step-in { from { opacity: 0; transform: translateX(12px); } }
.modal-step h2 { margin: 6px 0 28px; font-size: clamp(2.1rem, 5vw, 3.2rem); }
.field { display: flex; flex-direction: column; gap: 9px; margin-bottom: 24px; font-size: .82rem; font-weight: 700; }
.field input, .field textarea { width: 100%; padding: 13px 15px; border: 1px solid var(--hairline); border-radius: 12px; background: var(--paper); color: var(--ink); font-size: .92rem; resize: vertical; }
.field input:focus, .field textarea:focus { border-color: var(--milk-deep); outline: 3px solid rgba(200,159,118,.25); }
.modal-step fieldset { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 0; margin: 0 0 28px; border: 0; }.modal-step legend { margin-bottom: 10px; font-size: .82rem; font-weight: 700; }.modal-step fieldset label { position: relative; cursor: pointer; }.modal-step fieldset input { position: absolute; opacity: 0; }.modal-step fieldset span { display: flex; min-height: 56px; align-items: center; padding: 10px 14px; border: 1px solid var(--hairline); border-radius: 12px; background: var(--paper); font-size: .75rem; line-height: 1.35; }.modal-step fieldset input:checked + span { border-color: var(--milk-deep); background: #f4e3cd; }.modal-step fieldset input:focus-visible + span { outline: 3px solid var(--coral); outline-offset: 2px; }
.demo-note { padding: 14px 16px; border-left: 3px solid var(--butter); background: #f9efdf; color: var(--muted); font-size: .72rem; }
.modal-back { margin: 18px auto 0; display: flex; }
.modal-success { text-align: center; padding-block: 54px; }.modal-success > span { display: block; margin-bottom: 16px; font-size: 3.5rem; }.modal-success p { color: var(--muted); }
.toast { position: fixed; z-index: 3000; left: 50%; bottom: 28px; padding: 12px 18px; border-radius: 999px; background: var(--ink); color: var(--paper); font-size: .76rem; transform: translate(-50%, 25px); opacity: 0; pointer-events: none; transition: opacity .3s, transform .3s var(--ease); }.toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

/* Profile page */
.profile-page { padding-top: 68px; }
.profile-hero { position: relative; min-height: calc(100svh - 68px); display: flex; align-items: center; padding: 64px 0 88px; overflow: hidden; }
.profile-hero__grid { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: clamp(56px, 8vw, 120px); }
.profile-hero__copy h1 { margin: 14px 0 12px; font-size: clamp(5.5rem, 10vw, 9.5rem); font-weight: 500; }.profile-hero__copy h1 small { display: block; margin-top: 12px; color: var(--muted); font-family: var(--body); font-size: .7rem; font-weight: 700; letter-spacing: .25em; }
.profile-hero__persona { display: inline-block; padding: 7px 14px; border: 1px solid var(--milk); border-radius: 999px; color: var(--milk-deep); font-size: .78rem; font-weight: 700; }
.profile-hero__intro { max-width: 500px; margin: 22px 0 26px; color: var(--muted); font-size: 1.05rem; line-height: 1.9; }
.profile-facts { display: flex; gap: 28px; margin: 0 0 32px; }.profile-facts div { min-width: 92px; }.profile-facts dt { color: var(--muted); font-size: .65rem; letter-spacing: .1em; }.profile-facts dd { margin: 4px 0 0; font-weight: 700; font-size: .88rem; }
.profile-card { position: relative; aspect-ratio: .82; max-height: 700px; padding: 44px; border: 1px solid var(--hairline); border-radius: 42px 20px 55px 24px / 26px 60px 32px 54px; background: #f4e2c7; box-shadow: var(--shadow-paper); transform: rotate(.5deg); }
.profile-card::before { content: ""; position: absolute; inset: 22px; border: 1px solid rgba(135,89,54,.38); border-radius: 28px 14px 40px 18px / 20px 42px 24px 38px; }
.profile-card__number { position: absolute; z-index: 3; top: 28px; left: 32px; color: var(--milk-deep); font-size: .7rem; font-weight: 800; letter-spacing: .14em; }.profile-card__star { position: absolute; top: 28px; right: 38px; color: #c88320; letter-spacing: .3em; }
.dog-art--profile { position: absolute; inset: 9% 5% 13%; }.profile-card__label { position: absolute; z-index: 4; left: 44px; right: 44px; bottom: 35px; display: flex; justify-content: space-between; align-items: end; border-top: 1px solid rgba(135,89,54,.45); padding-top: 13px; }.profile-card__label strong { font-family: var(--display); font-size: 2rem; }.profile-card__label span { color: var(--muted); font-size: .57rem; letter-spacing: .12em; }
.measure { position: absolute; z-index: 5; color: var(--milk-deep); font-size: .6rem; letter-spacing: .12em; }.measure--height { top: 47%; right: -42px; transform: rotate(90deg); }.measure--width { left: 36%; bottom: 5px; }
.profile-hero__scribble { position: absolute; left: -5%; right: -5%; bottom: 12px; height: 45px; border-top: 2px solid rgba(187,127,67,.5); border-radius: 50%; transform: rotate(.5deg); }

.profile-story { padding: 144px 0; background: #f8eddc; }
.profile-section-heading { max-width: 1000px; margin-bottom: 96px; }.profile-section-heading h2 { margin: 12px 0 20px; }.profile-section-heading > p:last-child { max-width: 650px; color: var(--muted); }
.profile-story__layout { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(70px, 10vw, 150px); align-items: start; }
.profile-story__portrait { position: sticky; top: 120px; height: 640px; display: grid; place-items: center; }
.profile-story__halo { position: absolute; width: 95%; aspect-ratio: 1; border: 1px solid var(--hairline); border-radius: 46% 52% 45% 55%; background: var(--paper); transform: rotate(-4deg); transition: background-color .6s; }.profile-story__halo::before, .profile-story__halo::after { content: ""; position: absolute; border: 1px dashed var(--milk); border-radius: 50%; opacity: .55; }.profile-story__halo::before { inset: 9%; }.profile-story__halo::after { inset: 19%; }
.dog-art--story { z-index: 2; width: 94%; height: 94%; transition: transform .7s var(--ease); }.dog-art--story[data-state="meeting"] { transform: translateX(-6%) scale(.9) rotate(-2deg); }.dog-art--story[data-state="learning"] { transform: translateX(0) scale(.95); }.dog-art--story[data-state="together"] { transform: translateX(4%) scale(1.02) rotate(1deg); }
.story-state-label { position: absolute; z-index: 4; bottom: 28px; padding: 7px 14px; border-radius: 999px; background: var(--milk-deep); color: var(--paper); font-size: .66rem; letter-spacing: .1em; }
.story-beat { position: relative; min-height: 75vh; display: flex; flex-direction: column; justify-content: center; padding: 80px 0; border-top: 1px solid var(--hairline); }.story-beat > span { position: absolute; top: 32px; right: 0; color: var(--milk); font-family: var(--display); font-size: 4rem; opacity: .3; }.story-beat h3 { margin: 12px 0 22px; font-size: clamp(2.7rem, 4vw, 4.5rem); }.story-beat > p:not(.eyebrow, .placeholder-label) { color: var(--muted); line-height: 1.95; }.placeholder-label { margin-top: 24px; color: var(--milk-deep); font-size: .62rem; letter-spacing: .08em; }

.manual { padding: 144px 0; background: var(--paper-light); }.manual .section-heading { margin-bottom: 64px; }.manual-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }.manual-card { position: relative; min-height: 420px; padding: 34px; border: 1px solid var(--hairline); border-radius: 26px 38px 22px 40px; background: var(--paper); }.manual-card > span { color: var(--milk); font-family: var(--display); }.manual-card__dog { width: 150px; height: 140px; margin: -6px auto 6px; }.manual-card h3 { margin: 10px 0 18px; font-size: 2.1rem; }.manual-card > p:last-child { color: var(--muted); font-size: .86rem; }.manual-card--featured { background: #f4e2c7; transform: translateY(-18px) rotate(.5deg); }.js .manual-card--featured.reveal { transform: translateY(8px) rotate(.5deg); }.js .manual-card--featured.reveal.is-visible { transform: translateY(-18px) rotate(.5deg); }.content-caveat { margin: 50px auto 0; max-width: 700px; color: var(--muted); text-align: center; font-size: .68rem; }

.profile-quote { min-height: 80vh; display: grid; place-items: center; padding: 100px 0; background: #f7ecdc; overflow: hidden; }.profile-quote__inner { position: relative; min-height: 520px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }.profile-quote blockquote { position: relative; z-index: 3; margin: 0; font-family: var(--display); font-size: clamp(2.8rem, 6vw, 6rem); font-weight: 500; line-height: 1.4; letter-spacing: -.04em; }.profile-quote__inner > span { position: relative; z-index: 3; margin-top: 28px; color: var(--muted); font-size: .72rem; letter-spacing: .14em; }.dog-art--quote { position: absolute; right: -6%; bottom: -25%; width: 38%; height: 68%; opacity: .18; transform: rotate(-5deg); }
.ready--profile .ready__grid { grid-template-columns: 1.3fr .75fr .45fr; }.ready--profile h2 { font-size: clamp(3rem, 5vw, 5rem); }
.profile-footer { padding-top: 56px; background: var(--paper-light); }.profile-footer__inner { min-height: 140px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }.profile-footer__inner > p { margin: 0; font-family: var(--display); font-size: 1.3rem; }

/* Responsive */
@media (max-width: 1080px) {
  .section-shell { width: min(calc(100% - 64px), var(--shell)); }
  .desktop-nav { gap: 22px; }.desktop-nav a { font-size: .76rem; }
  .hero__grid { grid-template-columns: 1.08fr .92fr; }.hero h1 { font-size: clamp(4.6rem, 9vw, 7rem); }.hero__visual { min-height: 510px; }
  .teacher-stage { gap: 32px; }.teacher-stage__art-wrap { height: 440px; }
  .field-notes__gallery { grid-template-rows: minmax(390px, 50vw) 270px; }
  .journey__viewport { margin-left: 330px; }.section-heading--journey { grid-template-columns: 50px 270px; }.section-heading--journey h2 { font-size: 2.25rem; white-space: normal; }.journey-stop { min-width: 320px; }
  .numbers__grid { grid-template-columns: repeat(4, 1fr); row-gap: 42px; }.stat--hero { grid-column: span 2; grid-row: 1; grid-column: 2 / 4; }.stat:nth-child(1) { grid-row: 2; }.stat:nth-child(2) { grid-row: 2; }.stat:nth-child(4) { grid-row: 2; }.stat--small { grid-row: 2; }
  .ready__grid, .ready--profile .ready__grid { grid-template-columns: 1.2fr .8fr; }.ready__dog { display: none; }
  .profile-story__portrait { height: 560px; }
}

@media (max-width: 820px) {
  :root { --header-h: 70px; }
  body { font-size: 16px; }
  .section-shell { width: min(calc(100% - 40px), var(--shell)); }
  .text-link { min-height: 44px; align-items: center; }
  .footer__links a, .footer__links button { min-width: 44px; min-height: 44px; display: flex; align-items: center; }
  .site-header { height: 70px; grid-template-columns: 1fr auto; padding: 0 20px; }.site-header.is-scrolled, .site-header.is-solid { height: 64px; }.desktop-nav, .site-header .header-cta { display: none; }.brand { --brand-image-width: 152px; width: 152px; height: 54px; }.brand--footer { --brand-image-width: 190px; width: 190px; height: 88px; }
  .menu-toggle { position: relative; z-index: 2; display: grid; width: 44px; height: 44px; place-items: center; padding: 0; border: 0; border-radius: 50%; background: transparent; cursor: pointer; }.menu-toggle span { position: absolute; width: 23px; height: 1.5px; background: var(--ink); transition: transform .3s var(--ease); }.menu-toggle span:first-child { transform: translateY(-4px); }.menu-toggle span:last-child { transform: translateY(4px); }.menu-toggle[aria-expanded="true"] span:first-child { transform: rotate(45deg); }.menu-toggle[aria-expanded="true"] span:last-child { transform: rotate(-45deg); }
  .mobile-nav { position: fixed; z-index: 1; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 22px; background: var(--paper); transform: translateY(-105%); transition: transform .45s var(--ease); }.mobile-nav.is-open { transform: translateY(0); }.mobile-nav a { font-family: var(--display); font-size: 1.8rem; }
  .hero { padding-top: 70px; }.hero__grid { min-height: auto; grid-template-columns: 1fr; gap: 0; padding: 72px 0 40px; }.hero .chapter-number { position: static; margin-bottom: 24px; }.hero h1 { margin: 16px 0 26px; font-size: clamp(4rem, 15vw, 6.2rem); }.hero h1 span + span { margin-left: .45em; }.hero__intro br { display: none; }.hero__visual { min-height: 560px; margin-top: 16px; }.hero-photo { width: clamp(160px, 24vw, 210px); }.dog-art--hero { width: min(100%, 400px); }.star--one { top: 5%; }.hero__dog-note { right: 4%; bottom: 6px; }.hero__path { bottom: 75px; }.proof-strip__inner { justify-content: flex-start; overflow-x: auto; }.proof-strip__inner span { flex: 0 0 auto; }
  .section-heading { grid-template-columns: 52px 1fr; gap: 12px; }
  .teachers, .courses, .profile-story, .manual { padding: 104px 0; }
  .teacher-stage { min-height: 670px; grid-template-columns: 1fr; gap: 8px; margin-top: 56px; padding: 24px 32px 40px; border-radius: 40px 18px 50px 22px; }.teacher-stage__art-wrap { height: 360px; }.teacher-stage__copy { max-width: none; }.teacher-stage__copy h3 { font-size: 4rem; }.teacher-stage__meta { margin-bottom: 14px; }.teacher-deck { display: flex; margin-inline: -20px; padding: 10px 20px 24px; overflow-x: auto; scroll-snap-type: x mandatory; }.teacher-card { flex: 0 0 155px; scroll-snap-align: center; }.teacher-card__art { height: 120px; }
  .field-notes { padding: 104px 0 112px; }.field-notes__heading { grid-template-columns: 1fr; gap: 30px; margin-bottom: 48px; }.field-notes__intro { max-width: 620px; }.field-notes__gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: 360px 260px 260px; }.field-notes__gallery.field-notes__gallery--compact { grid-template-columns: 1fr; grid-template-rows: 440px auto; }.field-notes__gallery--compact .field-photo--feature { grid-column: auto; }.field-photo--feature { grid-column: 1 / -1; }.field-photo figcaption { align-items: flex-start; flex-direction: column; gap: 2px; }.field-photo figcaption strong { text-align: left; }.field-notes__proof { grid-template-columns: 42px 1fr 42px 1fr; }
  .questions { min-height: auto; padding: 104px 0 112px; }.section-heading--questions { margin-bottom: 72px; }.question { min-height: auto; grid-template-columns: 1fr; gap: 24px; margin-bottom: 120px; }.question--right .question__copy, .question--right .scene { order: initial; }.question__copy h3 { font-size: clamp(2.8rem, 9vw, 4rem); }.scene { min-height: 390px; }.scene--human { min-height: 0; }.chapter-path { left: auto; right: 4px; width: 42%; transform: none; opacity: .55; }
  .journey { height: auto; padding: 104px 0; }.journey__sticky { position: static; height: auto; overflow: visible; }.journey__shell { width: min(calc(100% - 40px), var(--shell)); }.section-heading--journey { position: static; display: grid; grid-template-columns: 52px 1fr; margin-bottom: 64px; }.section-heading--journey h2 { font-size: 2.8rem; white-space: normal; }.journey__viewport { margin: 0; overflow: visible; }.journey__track { position: relative; width: 100%; display: grid; gap: 32px; transform: none !important; }.journey__track::before { content: ""; position: absolute; left: 32px; top: 80px; bottom: 80px; border-left: 2px dashed var(--milk); }.journey-stop { width: 100%; min-width: 0; padding-left: 72px; border-radius: 24px 42px 20px 34px; }.journey-stop__index { left: 20px; top: 26px; }.journey__progress { display: none; }
  .course-grid { grid-template-columns: 1fr; }.course-card, .course-card:last-child { grid-column: auto; min-height: 420px; }.course-card__media { width: min(100%, 620px); }.course-card h3 { font-size: 1.8rem; }
  .numbers__grid { grid-template-columns: repeat(2, 1fr); }.stat--hero { grid-column: 1 / -1; grid-row: 1; }.stat:nth-child(n) { grid-row: auto; }.stat strong, .stat--small strong { font-size: clamp(2.5rem, 11vw, 4.2rem); }.stat--hero strong { font-size: clamp(4rem, 18vw, 6.5rem); }
  .stories__grid { grid-template-columns: 1fr; gap: 40px; }.story-notes { grid-template-columns: 1fr 1fr; }.sleeping-dog { grid-column: 1; }
  .ready__grid, .ready--profile .ready__grid { grid-template-columns: 1fr; }.ready__actions { max-width: 500px; }.ready h2 { font-size: clamp(3rem, 10vw, 4.6rem); }
  .site-footer { padding-top: 56px; }.footer__grid { grid-template-columns: 1.4fr 1fr 1fr; }.footer__title { grid-column: 1 / -1; }.footer__bottom { align-items: flex-start; flex-direction: column; }.footer__legal { width: 100%; }
  .profile-page { padding-top: 64px; }.profile-hero { min-height: auto; padding-top: 58px; }.profile-hero__grid { grid-template-columns: 1fr; }.profile-hero__copy h1 { font-size: clamp(5.5rem, 18vw, 8rem); }.profile-card { width: min(100%, 560px); justify-self: center; }
  .profile-story__layout { grid-template-columns: 1fr; }.profile-story__portrait { position: sticky; top: 64px; z-index: 4; height: 350px; width: 100%; background: rgba(248,237,220,.92); backdrop-filter: blur(8px); }.profile-story__halo { width: 320px; }.dog-art--story { width: 330px; }.story-beats { position: relative; z-index: 5; }.story-beat { min-height: 65vh; padding: 120px 0 70px; }
  .manual-grid { grid-template-columns: 1fr; }.manual-card--featured { transform: none; }.js .manual-card--featured.reveal, .js .manual-card--featured.reveal.is-visible { transform: translateY(0); }.manual-card { min-height: 340px; }.manual-card__dog { width: 130px; height: 115px; }.profile-quote { min-height: 70vh; }
  .profile-footer__inner { flex-wrap: wrap; padding-bottom: 40px; }.profile-footer__inner > p { order: 3; width: 100%; }
}

@media (max-width: 560px) {
  .section-shell { width: min(calc(100% - 32px), var(--shell)); }
  .brand { --brand-image-width: 140px; width: 140px; }
  .hero__grid { padding-top: 46px; }.hero h1 { font-size: clamp(3.7rem, 18vw, 5.3rem); }.hero__eyebrow span { display: block; margin: 6px 0 0; }.hero__actions { align-items: flex-start; flex-direction: column; gap: 16px; }.hero__visual { min-height: auto; display: block; margin-top: 8px; transform: none; padding-bottom: 12px; }.hero-photo-fan { position: static; flex-direction: column; gap: 16px; margin: 0 auto 26px; max-width: 340px; }.hero-photo { width: min(84vw, 340px); opacity: 1; transform: none; }.hero-photo__card { padding: 6px 6px 22px; }.hero-photo__cap { left: 6px; right: 6px; bottom: 6px; font-size: .52rem; }.dog-art--hero { width: 320px; max-width: none; opacity: 1; transform: none; margin: 0 auto; }.hero__dog-note { position: static; display: block; writing-mode: horizontal-tb; text-align: center; margin: 10px 0 0; opacity: 1; }.hero__visual::after { display: none; }.star { display: none; }.proof-strip__inner { gap: 16px; }.proof-strip i { display: none; }
  .section-heading { grid-template-columns: 38px 1fr; }.section-heading h2 { font-size: clamp(2.5rem, 10.5vw, 3.5rem); }.chapter-number { font-size: 1.35rem; }
  .teacher-stage { margin-inline: 0; padding: 18px 22px 32px; }.teacher-stage__art-wrap { height: 300px; }.teacher-stage__copy h3 { font-size: 3.5rem; }.teacher-stage__copy > p { font-size: .88rem; }.teacher-stage__counter { top: 8px; }.teacher-deck { margin-inline: -16px; padding-inline: 16px; }
  .field-notes { padding: 88px 0 96px; }.field-notes__heading h2 { font-size: clamp(2.75rem, 13vw, 4rem); }.field-notes__intro p { font-size: .9rem; }.field-notes__gallery { gap: 10px; grid-template-rows: 250px 220px 220px; }.field-notes__gallery.field-notes__gallery--compact { grid-template-rows: 280px auto; }.field-notes__proof { grid-template-columns: 34px 1fr; padding: 28px 24px; }.field-photo { border-width: 5px; }.field-photo figcaption { left: 8px; right: 8px; bottom: 8px; padding: 9px 10px; }.field-photo figcaption span { font-size: .47rem; }.field-photo figcaption strong { font-size: .72rem; }
  .questions .section-heading { grid-template-columns: 38px 1fr; }.question { margin-bottom: 96px; }.scene { min-height: 310px; }.scene--human { min-height: 0; border-radius: 28px 16px 32px 18px; }.scene--together .dog-art--scene { right: 2%; bottom: 4%; width: 49%; height: 57%; }.scene--evaluation .dog-art--scene { right: 2%; bottom: 15%; width: 44%; height: 52%; }.scene--guided .dog-art--scene { left: 33%; bottom: 18%; width: 36%; height: 46%; }.scene-caption { top: 5%; right: 5%; max-width: 43%; padding: 8px 9px; }.scene-caption span { display: none; }.assessment-props { top: 4%; right: 2%; }.assessment-props svg { width: 48px; height: 48px; }.assessment-props svg + svg { width: 42px; height: 42px; }.evaluation-evidence { left: 4%; bottom: 15%; width: 27%; padding-bottom: 20px; }.evaluation-evidence figcaption { font-size: .37rem; }.evaluation-checkpoints, .outcome-sequence { left: 3%; right: 3%; gap: 3px; }.evaluation-checkpoints li, .outcome-sequence li { min-height: 26px; font-size: .5rem; }
  .section-heading--journey { grid-template-columns: 38px 1fr; }.section-heading--journey h2 { font-size: 2.5rem; white-space: normal; }.journey-stop { padding-left: 58px; }.journey-stop__scene { height: 210px; }.journey__track::before { left: 25px; }
  .course-card { padding: 24px; }.course-card__media { margin-top: 10px; }
  .numbers { padding: 80px 0; }.numbers__heading { gap: 14px; }.stat span { font-size: .65rem; }.numbers__note { font-size: .86rem; }
  .stories { padding: 96px 0; }.story-notes { grid-template-columns: 1fr; }.story-note { min-height: 230px; padding: 34px 28px; }.sleeping-dog { margin-right: 0; }
  .ready { padding: 64px 0; }.ready__proof { flex-direction: column; align-items: flex-start; }.ready__proof span { width: max-content; }
  .site-footer { padding-top: 48px; }.footer__grid { grid-template-columns: 1fr 1fr; gap: 36px 22px; }.footer__title { grid-template-columns: 38px 1fr; }.footer__title h2 { font-size: 2.4rem; }.footer__links:last-child { grid-column: 2; }.footer__bottom { font-size: .6rem; }.footer__legal { align-items: flex-start; flex-direction: column; gap: 8px; }
  .assessment-modal { width: 100%; max-height: 92dvh; margin: auto 0 0; border-radius: 26px 26px 0 0; }.assessment-modal__panel { padding: 40px 22px 30px; }.modal-step fieldset { grid-template-columns: 1fr; }
  .profile-hero__grid { gap: 56px; }.profile-hero__copy h1 { font-size: clamp(4.8rem, 25vw, 7rem); }.profile-facts { gap: 14px; justify-content: space-between; }.profile-facts div { min-width: 0; }.profile-card { padding: 26px; }.profile-card__label { left: 28px; right: 28px; bottom: 25px; }.profile-card__label span { max-width: 100px; text-align: right; }.measure { display: none; }.back-link { margin-bottom: 34px; }
  .profile-section-heading { margin-bottom: 60px; }.profile-section-heading h2 { font-size: 3rem; }.profile-story__portrait { margin-inline: -16px; width: calc(100% + 32px); }.story-beat h3 { font-size: 3rem; }.profile-quote blockquote { font-size: clamp(2.4rem, 11vw, 4rem); }.dog-art--quote { width: 70%; right: -25%; }
  .profile-footer__inner { align-items: flex-start; flex-direction: column; }.profile-footer__inner > p { order: initial; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .loader { display: none; }
  .js .reveal { opacity: 1; transform: none; }
  /* reduced motion: rest at Act 1 — the 3 photos fanned + visible (avatar/note stay at --reveal 0) */
  .js .hero-photo__card { opacity: 1; transform: none; }
  .chapter-path path { stroke-dashoffset: 0 !important; }
  .journey { height: auto; padding: 112px 0; }
  .journey__sticky { position: static; height: auto; overflow: visible; }
  .section-heading--journey { position: static; margin-bottom: 56px; }
  .journey__viewport { margin-left: 0; }
  .journey__track { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); transform: none !important; }
  .journey-stop { width: 100%; min-width: 0; }
  .journey__progress { display: none; }
  .assessment-props svg, .evaluator-tools svg, .stage-toolkit svg { opacity: 1; transform: none !important; }
}

html.reduced-motion { scroll-behavior: auto; }
html.reduced-motion *, html.reduced-motion *::before, html.reduced-motion *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
html.reduced-motion .loader { display: none; }
html.reduced-motion .js .reveal { opacity: 1; transform: none; }
html.reduced-motion .js .hero-photo__card { opacity: 1; transform: none; }
html.reduced-motion .chapter-path path { stroke-dashoffset: 0 !important; }
html.reduced-motion .journey { height: auto; padding: 112px 0; }
html.reduced-motion .journey__sticky { position: static; height: auto; overflow: visible; }
html.reduced-motion .section-heading--journey { position: static; margin-bottom: 56px; }
html.reduced-motion .journey__viewport { margin-left: 0; }
html.reduced-motion .journey__track { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); transform: none !important; }
html.reduced-motion .journey-stop { width: 100%; min-width: 0; }
html.reduced-motion .journey__progress { display: none; }
html.reduced-motion .assessment-props svg,
html.reduced-motion .evaluator-tools svg,
html.reduced-motion .stage-toolkit svg { opacity: 1; transform: none !important; }

@media (max-width: 820px) {
  html.reduced-motion .journey__track { grid-template-columns: 1fr; }
}

@media (max-width: 820px) and (prefers-reduced-motion: reduce) {
  .journey__track { grid-template-columns: 1fr; }
}