/* HGB · Root to Yield — art direction
   World: dawn field over dark loam. Logo greens + harvest gold. Fraunces (heritage, authority)
   over Inter Tight (clarity), IBM Plex Mono for the field-instrument HUD. */
:root{
  --soil:#0d0b08; --loam:#15110b; --bark:#221b12; --umber:#3a2e1f;
  --leaf:#41B93C; --leaf-deep:#28963D; --leaf-ink:#1F7A31; --gold:#E2B64E; --gold-hi:#F3D27E;
  --dawn:#F6E7C1; --paper:#F3EEE2; --paper-2:#E9E2D2; --ink:#16130d; --ink-2:#4a4234;
  --cream:#EFE6D2; --muted:#B4A88F; --line:rgba(239,230,210,.16); --line-ink:rgba(22,19,13,.14);
  --f-display:"Fraunces", Georgia, serif; --f-body:"Inter Tight", system-ui, sans-serif; --f-mono:"IBM Plex Mono", ui-monospace, monospace;
  --pad: clamp(20px, 5vw, 72px);
  --seam:#1a140c;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:auto}
html,body{background:var(--soil)}
@supports (animation-timeline: scroll()){
  html,body{animation:toolbar-shift linear both;animation-timeline:scroll(root)}
  @keyframes toolbar-shift{0%{background:#1d160d}12%{background:#0d0b08}55%{background:#16130c}70%{background:#1a1a10}100%{background:#0f0d09}}
}
body{color:var(--cream);font:400 17px/1.55 var(--f-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
b{font-weight:600}
em{font-style:italic}
.wrap{max-width:1240px;margin:0 auto;padding:0 var(--pad)}
.eyebrow{font:500 12px/1.2 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:18px;display:flex;align-items:center;gap:12px}
.h-xl{font:300 clamp(34px,4.6vw,64px)/1.06 var(--f-display);letter-spacing:-.015em;max-width:20ch}
.h-lg{font:300 clamp(30px,3.4vw,48px)/1.1 var(--f-display);letter-spacing:-.01em}
.h-md{font:400 clamp(24px,2.2vw,32px)/1.15 var(--f-display)}
.sub{color:var(--muted);margin-top:14px}

/* ---------- loader ---------- */
#loader{position:fixed;inset:0;z-index:100;background:radial-gradient(120% 90% at 50% 30%,#241a0e 0%,#0b0906 70%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;transition:clip-path 1.1s cubic-bezier(.77,0,.18,1),opacity .4s 1s}
#loader.out{clip-path:inset(0 0 100% 0);opacity:0;pointer-events:none}
.ld-seed .ld-soil{stroke:rgba(226,182,78,.35);stroke-width:1;stroke-dasharray:3 5}
.ld-seed path{fill:none;stroke-linecap:round}
.ld-seed .ld-root{stroke:#efe2c2;stroke-width:1.6;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--g,0));filter:drop-shadow(0 0 3px rgba(243,210,126,.6))}
.ld-seed .ld-shoot{stroke:var(--leaf);stroke-width:2.2;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--s,0))}
.ld-seed .ld-kernel{fill:var(--gold);filter:drop-shadow(0 0 calc(4px + 14px*var(--g,0)) rgba(243,210,126,.85))}
.ld-word img{width:170px;opacity:.92}
.ld-meta{font:500 11px var(--f-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--muted);display:flex;gap:14px}
.ld-meta b{color:var(--gold);font-weight:500;min-width:4ch}

/* ---------- header / chrome ---------- */
#hdr{position:fixed;top:0;left:0;right:0;z-index:40;display:flex;align-items:center;gap:28px;padding:calc(14px + env(safe-area-inset-top)) var(--pad) 14px;color:var(--cream);transition:background .4s,backdrop-filter .4s}
#hdr.solid{background:rgba(13,11,8,.95);border-bottom:1px solid var(--line)}
.brand img{height:36px;width:auto}
.hdr-nav{display:flex;gap:26px;margin-left:auto;font:500 14px var(--f-body);opacity:0;transform:translateY(-6px);transition:.5s}
#hdr.solid .hdr-nav{opacity:1;transform:none}
.hdr-nav a{text-decoration:none;color:var(--cream);opacity:.78}
.hdr-nav a:hover{opacity:1}
.pill{margin-left:12px;text-decoration:none;font:600 14px var(--f-body);padding:11px 18px;border-radius:999px;background:var(--gold);color:#1b1408;opacity:0;transform:translateY(-8px);pointer-events:none;transition:opacity .5s,transform .5s,background .2s}
.pill.on{opacity:1;transform:none;pointer-events:auto}
.pill:hover{background:var(--gold-hi)}
.sound{position:fixed;z-index:41;right:calc(var(--pad) - 4px);bottom:calc(22px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:999px;border:1px solid var(--line);background:rgba(13,11,8,.78);color:var(--cream);font:500 11px var(--f-mono);letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
.sound.away{opacity:0;pointer-events:none}
.sound{transition:opacity .5s}
.sound .bars{display:flex;align-items:flex-end;gap:2px;height:14px}
.sound .bars i{width:2px;height:4px;background:var(--gold);border-radius:1px;transition:height .3s}
.sound[aria-pressed="true"] .bars i{animation:eq 1.1s ease-in-out infinite}
.sound[aria-pressed="true"] .bars i:nth-child(2){animation-delay:-.3s}.sound[aria-pressed="true"] .bars i:nth-child(3){animation-delay:-.6s}.sound[aria-pressed="true"] .bars i:nth-child(4){animation-delay:-.85s}
@keyframes eq{0%,100%{height:4px}50%{height:14px}}

/* ---------- film ---------- */
#film{position:relative;height:1050vh}
.stage{position:sticky;top:0;height:100vh;height:100dvh;overflow:hidden;background:#0b0906}
#bleed,#cv,#fx{position:absolute;inset:0;width:100%;height:100%}
#bleed{filter:blur(48px) brightness(.4) saturate(1.2);transform:scale(1.15);opacity:0}
#fx{pointer-events:none}
.grain{position:absolute;inset:-50%;pointer-events:none;opacity:calc(.05 + var(--v,0)*.1);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 1s steps(6) infinite;will-change:transform}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}
.vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(130% 100% at 50% 45%,transparent 55%,rgba(0,0,0,.55) 100%)}
.scrim{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(10,8,5,.9) 0%,rgba(10,8,5,.74) 28%,rgba(10,8,5,.35) 44%,transparent 60%);opacity:var(--scrimL,1);transition:opacity .6s}
.scrim.right{background:linear-gradient(270deg,rgba(10,8,5,.9) 0%,rgba(10,8,5,.74) 28%,rgba(10,8,5,.35) 44%,transparent 60%)}
.scrim-b{position:absolute;inset:0;pointer-events:none;opacity:0;background:linear-gradient(0deg,rgba(10,8,5,.86) 0%,rgba(10,8,5,.55) 32%,transparent 62%)}
.seam{position:absolute;left:0;right:0;bottom:0;height:45%;pointer-events:none;background:linear-gradient(to bottom,transparent,var(--seam));opacity:var(--seamA,0)}
.sweep{position:absolute;inset:0;pointer-events:none;opacity:0;background:linear-gradient(105deg,transparent 30%,rgba(255,214,130,.0) 38%,rgba(255,214,130,.55) 48%,rgba(255,236,190,.75) 50%,rgba(255,214,130,.5) 52%,transparent 64%);background-size:260% 100%;background-position:120% 0}
.sweep.go{animation:sweep 2.6s cubic-bezier(.4,0,.2,1) forwards}
@keyframes sweep{0%{opacity:0;background-position:130% 0}15%{opacity:1}100%{opacity:0;background-position:-40% 0}}

/* HUD */
.hud{position:absolute;right:var(--pad);top:50%;transform:translateY(-50%);width:190px;font:500 11px/1.3 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--cream);z-index:6;opacity:0;transition:opacity .6s}
.hud.on{opacity:.92}
.hud-row{display:flex;justify-content:space-between;align-items:baseline;padding:8px 0;border-bottom:1px solid var(--line)}
.hud-k{color:var(--muted)}
.hud-row b{font-weight:500;color:var(--dawn);font-size:12px}
.hud-gauge{position:relative;height:160px;width:2px;margin:16px 0 16px auto;background:linear-gradient(to bottom,rgba(239,230,210,.25),rgba(239,230,210,.08))}
.hud-gauge i{position:absolute;left:-5px;width:12px;height:12px;border-radius:50%;background:var(--gold);box-shadow:0 0 14px rgba(243,210,126,.9);top:var(--gy,30%);transition:top .2s linear}
.hud-zero{position:absolute;left:-14px;width:30px;height:1px;background:var(--gold);top:30%;opacity:.6}
.hud-modes{list-style:none;display:flex;gap:8px;justify-content:flex-end;margin-top:14px}
.hud-modes li{width:26px;height:26px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;color:var(--muted);transition:.4s}
.hud-modes li.on{border-color:var(--gold);color:#1b1408;background:var(--gold);box-shadow:0 0 18px rgba(243,210,126,.55)}

/* beats */
.beat{position:absolute;z-index:5;max-width:min(520px,36vw);opacity:0;will-change:opacity,transform;pointer-events:none}
.beat.live{pointer-events:auto}
.beat h1{font:300 clamp(40px,5.4vw,82px)/1.0 var(--f-display);letter-spacing:-.02em;color:#fff8e8;text-shadow:0 2px 30px rgba(0,0,0,.35)}
.beat h1 em,.beat h2 em{color:var(--gold-hi);font-weight:300}
.beat h2{font:300 clamp(30px,3.6vw,54px)/1.06 var(--f-display);letter-spacing:-.015em;color:#fff8e8;margin-bottom:18px;text-shadow:0 2px 24px rgba(0,0,0,.4)}
.beat p{font-size:clamp(16px,1.25vw,19px);color:rgba(246,238,220,.9);max-width:48ch}
.beat p b{color:var(--gold-hi)}
.b-hero{left:var(--pad);bottom:12vh;max-width:min(680px,56vw);opacity:1}
.b-hero .lede{margin-top:22px;font-size:clamp(17px,1.35vw,21px)}
.facts{list-style:none;display:flex;gap:28px;margin-top:30px;padding-top:22px;border-top:1px solid var(--line)}
.facts li{max-width:170px}
.facts b{display:block;font:300 34px/1 var(--f-display);color:var(--gold-hi);margin-bottom:6px}
.facts span{font-size:13px;line-height:1.35;color:var(--muted)}
.cue{margin-top:34px;display:flex;align-items:center;gap:14px;font:500 11px var(--f-mono)!important;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)!important}
.cue i{width:1px;height:34px;background:linear-gradient(var(--gold),transparent);animation:cue 2s ease-in-out infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.b-left{left:var(--pad);top:50%;transform:translateY(-50%)}
.b-right{right:calc(var(--pad) + 230px);top:50%;transform:translateY(-50%)}
.b-station{left:var(--pad);top:22vh}
.b-finale{left:50%;bottom:9vh;transform:translateX(-50%);text-align:center;max-width:min(1180px,92vw);width:100%}
.b-finale h2{font-size:clamp(36px,4.4vw,70px)}
.b-finale .eyebrow{justify-content:center;max-width:none}
.finale-ctas{display:flex;gap:14px;justify-content:center;margin-top:28px}
.mode-tag{display:inline-block;padding:4px 8px;border:1px solid var(--gold);border-radius:4px;color:var(--gold);letter-spacing:.12em}
.hint{font:500 12px var(--f-mono)!important;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-hi)!important}
.npk{list-style:none;display:flex;gap:26px;margin-top:20px}
.npk b{display:block;font:300 40px/1 var(--f-display);color:var(--gold-hi)}
.npk span{font:500 11px var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 26px;border-radius:999px;font:600 16px var(--f-body);text-decoration:none;cursor:pointer;border:0;transition:background .2s,color .2s,border-color .2s}
.btn-gold{background:var(--gold);color:#1b1408;box-shadow:0 10px 40px rgba(226,182,78,.35)}
.btn-gold:hover{background:var(--gold-hi)}
.btn-ghost{border:1px solid rgba(246,231,193,.45);color:var(--cream);background:rgba(13,11,8,.45)}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold-hi)}
.spring{will-change:transform}

/* station */
.station{position:absolute;z-index:8;left:var(--pad);bottom:11vh;display:flex;align-items:center;gap:18px;opacity:0;pointer-events:none;transition:opacity .22s}
.station.on{opacity:1;pointer-events:auto}
.station.done{opacity:0;pointer-events:none}
.station-btn{position:relative;width:104px;height:104px;border-radius:50%;border:0;background:rgba(20,15,8,.72);color:var(--gold-hi);cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;box-shadow:0 0 calc(10px + 50px*var(--c,0)) rgba(243,210,126,calc(.25 + .6*var(--c,0)))}
.station-btn>svg{position:absolute;inset:0;transform:rotate(-90deg)}
.st-track{fill:none;stroke:rgba(243,210,126,.22);stroke-width:2}
.st-fill{fill:none;stroke:var(--gold-hi);stroke-width:3;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--c,0))}
.st-core{position:absolute;inset:22px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,rgba(243,210,126,calc(.15 + .5*var(--c,0))),transparent 70%);animation:breathe 2.4s ease-in-out infinite}
@keyframes breathe{50%{transform:scale(1.08)}}
.station-label{font:500 12px var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dawn)}

/* ---------- sections ---------- */
.sec{position:relative;padding:clamp(80px,11vw,150px) 0}
.sec-what{background:linear-gradient(to bottom,var(--seam) 0%,#14120b 30%,var(--loam) 100%)}
.what-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(30px,5vw,80px);margin-top:46px}
.what-lede{font-size:clamp(18px,1.45vw,21px);color:rgba(246,238,220,.88)}
.what-list{list-style:none;display:grid;gap:18px}
.what-list li{padding:0 0 18px;border-bottom:1px solid var(--line);color:rgba(246,238,220,.82)}
.what-list b{color:var(--dawn);display:block;font-weight:600;margin-bottom:2px}

.sec-model{background:radial-gradient(90% 80% at 75% 50%,#2a2114 0%,var(--loam) 60%)}
.model-wrap{display:grid;grid-template-columns:minmax(320px,.85fr) 1.15fr;gap:clamp(24px,4vw,60px);align-items:center}
.mode-tabs{display:flex;flex-direction:column;gap:8px;margin:32px 0 22px}
.mode-tab{display:flex;align-items:center;gap:16px;text-align:left;padding:16px 18px;border-radius:12px;border:1px solid var(--line);background:transparent;color:var(--cream);font:500 17px var(--f-body);cursor:pointer;transition:.3s}
.mode-tab span{font:500 12px var(--f-mono);color:var(--muted);letter-spacing:.12em}
.mode-tab:hover{border-color:rgba(226,182,78,.5)}
.mode-tab.is-on{background:rgba(226,182,78,.12);border-color:var(--gold);color:#fff8e8}
.mode-tab.is-on span{color:var(--gold)}
.mode-panel{display:none;color:rgba(246,238,220,.86)}
.mode-panel.is-on{display:block;animation:fadeUp .5s ease both}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.mini-stat{margin-top:18px;padding:16px 18px;border-left:2px solid var(--gold);background:rgba(239,230,210,.04)}
.mini-stat b{display:block;font:400 26px/1.1 var(--f-display);color:var(--gold-hi);margin-bottom:4px}
.mini-stat span{font-size:14px;color:var(--muted)}
.model-note{margin-top:22px;font:500 11px var(--f-mono);letter-spacing:.08em;color:var(--muted);opacity:.8}
.model-view{position:relative;aspect-ratio:1/1.02;border-radius:24px;overflow:hidden;background:radial-gradient(70% 60% at 50% 40%,#3a2d1a 0%,#120e08 80%);border:1px solid var(--line)}
#model3d{width:100%;height:100%;display:block;cursor:grab}
#model3d:active{cursor:grabbing}
.model-hint{position:absolute;left:18px;bottom:16px;font:500 11px var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.model-legend{position:absolute;right:16px;bottom:14px;display:flex;gap:12px;font:500 11px var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--cream)}
.model-legend span{display:flex;align-items:center;gap:6px}
.model-legend i{width:8px;height:8px;border-radius:50%;background:var(--c)}

/* evidence — light section */
.sec-evidence,.sec-steward,.sec-team{background:var(--paper);color:var(--ink)}
.sec-evidence .eyebrow,.sec-steward .eyebrow,.sec-team .eyebrow{color:#7a5a12}
.sec-reg .eyebrow{color:var(--gold)}
.sec-evidence .sub{color:var(--ink-2)}
.chart-card{background:#fbf8f1;border:1px solid var(--line-ink);border-radius:20px;padding:clamp(20px,3vw,36px);margin-top:40px}
.chart-card h3{font:400 22px var(--f-display);margin-bottom:18px}
.chart-head{display:flex;gap:22px;font:500 12px var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);margin-bottom:22px}
.sw{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:8px;background:var(--c,#999);vertical-align:-1px}
.sw-root{--c:var(--leaf-deep)}.sw-wt{--c:#c9b98f}
.cat-rows{display:grid;gap:14px}
.cat-row{display:grid;grid-template-columns:minmax(150px,230px) 1fr;gap:18px;align-items:center}
.cat-name{font:500 15px var(--f-body)}
.cat-name small{display:block;font:400 12px var(--f-body);color:var(--ink-2)}
.cat-bars{display:grid;gap:4px}
.bar{position:relative;height:22px}
.bar>i{position:absolute;inset:0;border-radius:4px;background:var(--c);transform:scaleX(0);transform-origin:left;transition:transform 1.4s cubic-bezier(.2,.8,.2,1)}
.bar.grown>i{transform:none}
.bar>em{opacity:0;transition:opacity .5s .9s}.bar.grown>em{opacity:1}
.bar.sm{height:10px}
.bar em{position:absolute;right:-48px;top:50%;transform:translateY(-50%);font:500 13px var(--f-mono);font-style:normal;color:var(--ink);width:40px}
.cat-row.hgb .cat-name{color:var(--leaf-ink);font-weight:700}
.cat-row.hgb .bar:not(.sm)>i{box-shadow:0 6px 18px rgba(40,150,61,.25)}
.chart-foot{margin-top:20px;font-size:13px;color:var(--ink-2)}
.sec-reg .chart-foot{color:var(--muted)}
.ev-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:24px}
.yield-legend{display:flex;flex-wrap:wrap;gap:14px;font:500 11px var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);margin-bottom:18px}
.yield-rows{display:grid;gap:16px}
.y-row{display:grid;grid-template-columns:96px 1fr;gap:12px;align-items:center}
.y-row .y-name{font:500 14px var(--f-body)}
.y-bars{display:grid;gap:3px}
.y-bars .bar{height:8px}
.y-bars .bar.hgb{height:14px}
.y-bars .bar em{right:-40px;font-size:11px}
.npk-bars{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:end;height:280px;padding-top:20px}
.npk-group{display:flex;flex-direction:column;height:100%}
.npk-cols{flex:1;display:flex;gap:6px;align-items:flex-end}
.npk-col{flex:1;position:relative}
.npk-col>i{position:absolute;inset:0;background:var(--c);border-radius:4px 4px 0 0;transform:scaleY(0);transform-origin:bottom;transition:transform 1.3s cubic-bezier(.2,.8,.2,1)}
.npk-col.grown>i{transform:none}
.npk-col>em{opacity:0;transition:opacity .5s .8s}.npk-col.grown>em{opacity:1}
.npk-col em{position:absolute;top:-20px;left:50%;transform:translateX(-50%);font:500 11px var(--f-mono);font-style:normal;color:var(--ink)}
.npk-lbl{margin-top:10px;text-align:center;font:500 13px var(--f-mono);letter-spacing:.08em}
.npk-lbl small{display:block;color:var(--leaf-ink);font-size:12px}
.field-results{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin:60px 0 70px}
.fr{padding:22px 0;border-top:2px solid var(--ink)}
.fr b{font:300 clamp(46px,5vw,72px)/1 var(--f-display);color:var(--leaf-deep)}
.fr b::before{content:"+"}
.fr b::after{content:"%";font-size:.5em;vertical-align:.7em;margin-left:2px}
.fr span{display:block;margin-top:10px;font-size:14px;color:var(--ink-2)}
.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:26px 0 40px}
.compare{margin:0}
.cmp-media{position:relative;border-radius:16px;overflow:hidden;aspect-ratio:16/10;background:#ddd;touch-action:pan-y;user-select:none}
.cmp-media>img,.cmp-top img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cmp-top{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--x,50%)) 0 0)}
.cmp-handle{position:absolute;top:0;bottom:0;left:var(--x,50%);width:44px;margin-left:-22px;cursor:ew-resize;display:grid;place-items:center;touch-action:none}
.cmp-handle::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 12px rgba(0,0,0,.4)}
.cmp-handle span{position:relative;width:40px;height:40px;border-radius:50%;background:#fff;box-shadow:0 4px 16px rgba(0,0,0,.3)}
.cmp-handle span::before,.cmp-handle span::after{content:"";position:absolute;top:50%;width:0;height:0;border:6px solid transparent;margin-top:-6px}
.cmp-handle span::before{left:6px;border-right-color:var(--ink)}.cmp-handle span::after{right:6px;border-left-color:var(--ink)}
.cmp-handle:focus-visible span{outline:3px solid var(--gold)}
.cmp-tag{position:absolute;top:14px;padding:6px 10px;border-radius:6px;background:rgba(22,19,13,.75);color:#fff;font:500 11px var(--f-mono);letter-spacing:.12em;text-transform:uppercase}
.cmp-l{left:14px}.cmp-r{right:14px;background:var(--leaf-ink)}
.compare figcaption,.photo-grid figcaption,.team-photos figcaption{margin-top:12px;font-size:14px;color:var(--ink-2)}
.photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.photo-grid figure{margin:0}
.photo-grid img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px}
.methods{display:grid;grid-template-columns:1fr 1.1fr;gap:40px;margin-top:80px;padding:clamp(24px,3vw,40px);background:var(--ink);color:var(--cream);border-radius:20px}
.methods .eyebrow{color:var(--gold)}
.methods-list{list-style:none;counter-reset:m;display:grid;grid-template-columns:1fr 1fr;gap:10px 24px}
.methods-list li{counter-increment:m;padding:10px 0;border-bottom:1px solid var(--line);font-size:15px}
.methods-list li::before{content:counter(m,decimal-leading-zero);font:500 11px var(--f-mono);color:var(--gold);margin-right:12px}

/* registration */
.sec-reg{background:radial-gradient(100% 70% at 30% 0%,#231b10 0%,var(--soil) 70%)}
.reg-wrap{display:grid;grid-template-columns:1.6fr 1fr;gap:clamp(24px,4vw,60px);margin-top:46px;align-items:start}
.reg-map{display:grid;grid-template-columns:repeat(11,1fr);gap:6px}
.st{aspect-ratio:1;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;font:600 13px var(--f-mono);letter-spacing:.04em;background:rgba(239,230,210,.05);color:rgba(239,230,210,.3);border:1px solid rgba(239,230,210,.06);transition:background-color .4s,color .4s,border-color .4s;cursor:default}
.st.void{visibility:hidden}
.st.lit.ok{background:var(--leaf-ink);color:#f2ffec;border-color:rgba(65,185,60,.6)}
.st.lit.prog{background:transparent;color:var(--gold-hi);border:1px dashed var(--gold)}
.st.lit.na{background:transparent;color:rgba(239,230,210,.35);border:1px solid rgba(239,230,210,.2)}
.st:hover,.st.sel{transform:scale(1.12);z-index:2;box-shadow:0 0 0 2px var(--gold-hi),0 10px 30px rgba(0,0,0,.4)}
.reg-count b{display:block;font:300 clamp(80px,9vw,128px)/.9 var(--f-display);color:var(--leaf)}
.reg-count span{font:500 12px var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.reg-key{list-style:none;margin:28px 0 22px;display:grid;gap:10px}
.reg-key li{display:flex;align-items:center;gap:12px;font-size:15px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.reg-key b{margin-left:auto;font:500 14px var(--f-mono)}
.reg-key i{width:16px;height:16px;border-radius:4px}
.k-ok{background:var(--leaf-ink)}.k-prog{border:1px dashed var(--gold)}.k-na{border:1px solid rgba(239,230,210,.3)}
.reg-detail{min-height:74px;padding:14px 16px;border-radius:12px;background:rgba(239,230,210,.05);font-size:15px;color:rgba(246,238,220,.85)}
.reg-detail strong{display:block;font:400 22px var(--f-display);color:#fff8e8;margin-bottom:2px}
.reg-also{list-style:none;margin-top:22px;display:grid;gap:8px;font-size:14px;color:var(--muted)}
.reg-also li::before{content:"✓";color:var(--leaf);margin-right:10px}

/* stewardship */
.steward-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:46px}
.st-card{padding:26px 22px;border-radius:16px;background:#fbf8f1;border:1px solid var(--line-ink)}
.st-card h3{font:400 22px var(--f-display);margin-bottom:10px;color:var(--leaf-ink)}
.st-card p{font-size:15px;color:var(--ink-2)}
.econ{display:grid;grid-template-columns:1fr 1.2fr;gap:40px;align-items:center;margin-top:70px;padding:clamp(24px,3vw,44px);border-radius:24px;background:linear-gradient(120deg,#e7dcc2,#f1e7cf)}
.econ-copy p{margin-top:12px;color:var(--ink-2)}
.econ-copy b{color:var(--ink)}
.econ-flow{display:flex;align-items:center;gap:12px}
.econ-flow i{flex:0 0 28px;height:2px;background:var(--ink);position:relative}
.econ-flow i::after{content:"";position:absolute;right:-1px;top:-4px;border:5px solid transparent;border-left:7px solid var(--ink)}
.ef{flex:1;padding:20px 16px;border-radius:14px;background:#fbf8f1;text-align:center}
.ef b{display:block;font:300 clamp(30px,3vw,44px)/1 var(--f-display);color:var(--ink)}
.ef span{display:block;margin-top:6px;font-size:13px;color:var(--ink-2)}
.ef-gold{background:var(--ink)}.ef-gold b{color:var(--gold-hi)}.ef-gold span{color:var(--muted)}

/* voices */
.sec-voices{background:var(--loam)}
.voices{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.voices blockquote{padding:28px;border-radius:18px;border:1px solid var(--line);background:rgba(239,230,210,.03)}
.voices blockquote p{font:300 clamp(19px,1.6vw,24px)/1.35 var(--f-display);color:#fff8e8}
.voices cite{display:block;margin-top:16px;font:500 12px var(--f-mono);font-style:normal;letter-spacing:.06em;color:var(--gold)}
.voices .v-big{grid-column:1/-1;padding:clamp(28px,4vw,52px);background:linear-gradient(120deg,rgba(226,182,78,.12),rgba(65,185,60,.06));border-color:rgba(226,182,78,.35)}
.voices .v-big p{font-size:clamp(26px,3vw,42px);line-height:1.18}

/* team */
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:46px}
.person{padding-bottom:10px}
.person img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%;border-radius:14px;filter:saturate(.92) contrast(1.02)}
.person h3{font:400 23px var(--f-display);margin-top:18px}
.person .role{font:500 12px var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--leaf-ink);margin:6px 0 14px}
.person ul{list-style:none;display:grid;gap:8px}
.person li{font-size:14px;line-height:1.45;color:var(--ink-2);padding-left:14px;position:relative}
.person li::before{content:"";position:absolute;left:0;top:.6em;width:5px;height:5px;border-radius:50%;background:var(--gold)}
.initials{width:100%;aspect-ratio:4/5;border-radius:14px;display:grid;place-items:center;background:linear-gradient(150deg,#2a2114,#100c07);color:var(--gold-hi);font:300 72px var(--f-display);letter-spacing:.04em}
.team-photos{display:grid;grid-template-columns:1fr 1.3fr 1.3fr;gap:22px;margin-top:60px}
.team-photos figure{margin:0}
.team-photos img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px}
.roster{margin-top:60px;padding-top:28px;border-top:1px solid var(--line-ink)}
.roster ul{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:12px 24px}
.roster li{font-size:14px;color:var(--ink-2);padding:10px 0;border-bottom:1px solid var(--line-ink)}

/* CTA */
.sec-cta{background:linear-gradient(160deg,#1d170d 0%,#0d0b08 70%)}
.cta-wrap{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(30px,5vw,80px);align-items:start}
.cta-copy>p{margin-top:20px;color:rgba(246,238,220,.85);max-width:46ch}
.contact{list-style:none;margin-top:30px;display:grid;gap:10px}
.contact li{display:flex;gap:18px;padding:12px 0;border-bottom:1px solid var(--line)}
.contact span{width:64px;font:500 11px var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding-top:3px}
.contact a{color:var(--gold-hi);text-decoration:none}
.cta-form{padding:clamp(24px,3vw,40px);border-radius:22px;background:var(--paper);color:var(--ink);display:grid;gap:16px;box-shadow:0 30px 80px rgba(0,0,0,.45)}
.cta-form h3{font:400 28px var(--f-display);margin-bottom:6px}
.cta-form label{display:grid;gap:6px;font:600 13px var(--f-body);color:var(--ink-2)}
.cta-form label span{font-weight:400}
.cta-form input,.cta-form textarea{font:400 16px var(--f-body);padding:13px 14px;border-radius:10px;border:1px solid rgba(22,19,13,.2);background:#fff;color:var(--ink)}
.cta-form input:focus,.cta-form textarea:focus{outline:2px solid var(--leaf-deep);border-color:transparent}
.cta-form .btn{margin-top:6px}
.form-note{font-size:13px;color:var(--ink-2)}
.form-note.err{color:#a3361f}
.form-note a{color:inherit;font-weight:600}
.cta-form .form-body{display:grid;gap:16px}
.cta-form [aria-invalid="true"]{border-color:#a3361f;box-shadow:0 0 0 1px #a3361f}
.cta-form button[disabled]{opacity:.7;cursor:progress}
.hp{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}
.form-done h3{font:400 28px var(--f-display);margin-bottom:10px;color:var(--leaf-ink)}
.form-done p{color:var(--ink-2)}.form-done a{color:var(--ink);font-weight:600}
.form-done:focus{outline:none}
.foot{background:#080705;padding:56px 0 calc(40px + env(safe-area-inset-bottom));color:var(--muted);font-size:14px}
.foot-wrap{display:grid;grid-template-columns:auto 1fr;gap:12px 40px;align-items:center}
.foot-logo{height:42px;width:auto}
.foot em{color:var(--gold)}
.foot-fine{grid-column:1/-1;font-size:12px;opacity:.7;margin-top:14px}

/* ---------- reveal on scroll ---------- */
.rv{opacity:0;transform:translateY(46px);transition:opacity 1s cubic-bezier(.16,.8,.24,1) var(--d,0ms),transform 1.15s cubic-bezier(.16,.8,.24,1) var(--d,0ms)}
.rv.in{opacity:1;transform:none}

/* ---------- phone / narrow ---------- */
@media (max-width:900px){
  #film{height:900vh}
  .grain{display:none}
  .hdr-nav{display:none}
  .brand img{height:28px}
  .pill{padding:9px 14px;font-size:13px}
  .hud{display:none}
  .beat{max-width:none;left:var(--pad)!important;right:var(--pad)!important}
  .b-hero{bottom:14vh}
  .b-left,.b-right{top:auto;bottom:22vh;transform:none}
  .b-station{top:16vh}
  .b-finale{left:var(--pad);transform:none;bottom:14vh;width:auto}
  .finale-ctas{flex-direction:column}
  .facts{gap:16px;flex-wrap:wrap}
  .facts li{max-width:none;flex:1 1 40%}
  .facts b{font-size:26px}
  .scrim{background:linear-gradient(0deg,rgba(10,8,5,.92) 0%,rgba(10,8,5,.78) 50%,rgba(10,8,5,.45) 78%,rgba(10,8,5,.25) 100%)!important}
  .b-hero{top:calc(78px + env(safe-area-inset-top));bottom:auto}
  .b-hero .lede{font-size:16px;margin-top:14px}
  .b-hero .facts{margin-top:18px;padding-top:14px}
  .b-hero .cue{margin-top:18px}
  .station{top:auto;bottom:calc(120px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);flex-direction:column}
  .what-grid,.model-wrap,.ev-grid,.compare-grid,.reg-wrap,.econ,.cta-wrap,.methods{grid-template-columns:1fr}
  .model-view{aspect-ratio:1/1.1}
  .field-results,.steward-grid,.team-grid{grid-template-columns:1fr 1fr}
  .photo-grid,.team-photos{grid-template-columns:1fr 1fr}
  .voices{grid-template-columns:1fr}
  .roster ul{grid-template-columns:1fr 1fr}
  .reg-map{grid-template-columns:repeat(11,1fr);gap:3px}
  .st{font-size:8.5px;border-radius:4px}
  .econ-flow{flex-direction:column}
  .econ-flow i{width:2px;height:20px;flex:0 0 20px}
  .econ-flow i::after{display:none}
  .cat-row{grid-template-columns:1fr}
  .bar em{right:auto;left:calc(100% + 6px)}
  .methods-list{grid-template-columns:1fr}
}
@media (max-width:520px){
  .field-results,.steward-grid,.team-grid,.photo-grid,.team-photos{grid-template-columns:1fr}
  .npk{gap:16px}.npk b{font-size:32px}
}

/* ---------- reduced motion: the editorial fallback ---------- */
.still-fallback{display:none}
html.reduced #film{height:auto}
html.reduced .stage{position:relative;height:auto;background:none}
html.reduced #bleed,html.reduced #cv,html.reduced #fx,html.reduced .grain,html.reduced .sweep,html.reduced .seam,html.reduced .hud,html.reduced .station,html.reduced .vignette,html.reduced .scrim{display:none}
html.reduced .beat{position:relative;inset:auto!important;transform:none!important;opacity:1!important;max-width:none;padding:clamp(60px,10vw,120px) var(--pad);min-height:80vh;display:flex;flex-direction:column;justify-content:flex-end;background:var(--bg) center/cover no-repeat;pointer-events:auto}
html.reduced .beat::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,8,5,.9),rgba(10,8,5,.35) 70%);z-index:-1}
html.reduced .beat{isolation:isolate}
html.reduced .b-station .hint{display:none}
html.reduced #loader{display:none}
html.reduced .rv{opacity:1;transform:none}


/* =====================================================================
   MOBILE + TABLET (≤900px) — designed for the thumb, not a shrunk desktop.
   Desktop rules above are untouched; everything below is gated.
   ===================================================================== */
.menu-btn,.menu-sheet,.mbar,.reg-list,.swipe-count,.person-more{display:none}

@media (max-width:900px){
  /* header: logo + Menu, 44px targets */
  #hdr{gap:12px;padding:calc(8px + env(safe-area-inset-top)) var(--pad) 8px}
  .brand{display:flex;align-items:center;min-height:44px}
  .pill{display:none}
  .menu-btn{display:flex;align-items:center;gap:10px;margin-left:auto;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid rgba(239,230,210,.28);background:rgba(13,11,8,.55);color:var(--cream);font:600 14px var(--f-body);cursor:pointer}
  .mb-lines{display:grid;gap:5px}.mb-lines i{display:block;width:16px;height:1.5px;background:currentColor;border-radius:1px;transition:transform .3s}
  .menu-btn[aria-expanded="true"] .mb-lines i:first-child{transform:translateY(3.25px) rotate(45deg)}
  .menu-btn[aria-expanded="true"] .mb-lines i:last-child{transform:translateY(-3.25px) rotate(-45deg)}

  /* menu sheet: full-screen, big targets, thumb-weighted */
  .menu-sheet{display:block;position:fixed;inset:0;z-index:60;background:rgba(10,8,5,.97);opacity:0;transition:opacity .3s}
  .menu-sheet[hidden]{display:none}
  .menu-sheet.open{opacity:1}
  .menu-sheet nav{position:absolute;left:0;right:0;bottom:0;padding:24px var(--pad) calc(28px + env(safe-area-inset-bottom));display:grid;gap:4px;transform:translateY(24px);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
  .menu-sheet.open nav{transform:none}
  .menu-sheet a{display:flex;align-items:baseline;gap:16px;min-height:60px;padding:14px 0;border-bottom:1px solid var(--line);color:#fff8e8;text-decoration:none;font:300 32px/1.1 var(--f-display)}
  .menu-sheet a span{font:500 12px var(--f-mono);color:var(--gold);letter-spacing:.12em}
  .menu-sheet .menu-cta{justify-content:center;margin-top:18px;min-height:56px;border:0;border-radius:999px;background:var(--gold);color:#1b1408;font:600 17px var(--f-body);align-items:center}
  .menu-sheet .menu-tel{justify-content:center;align-items:center;min-height:52px;border:1px solid rgba(239,230,210,.3);border-radius:999px;font:600 16px var(--f-body);color:var(--cream);margin-top:8px}
  .menu-close{justify-self:end;min-height:44px;padding:0 18px;margin-bottom:18px;border-radius:999px;border:1px solid var(--line);background:none;color:var(--cream);font:600 14px var(--f-body)}
  html.menu-open,html.menu-open body{overflow:hidden}

  /* sticky action bar: Call + Request briefing, in thumb reach */
  .mbar{display:flex;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:45;padding:10px var(--pad) calc(10px + env(safe-area-inset-bottom));background:linear-gradient(to top,rgba(10,8,5,.96) 55%,rgba(10,8,5,0));transform:translateY(110%);transition:transform .45s cubic-bezier(.2,.8,.2,1);pointer-events:none}
  .mbar.on{transform:none;pointer-events:auto}
  .mbar a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:52px;border-radius:999px;text-decoration:none;font:600 16px var(--f-body)}
  .mbar-call{flex:0 0 auto;padding:0 20px;border:1px solid rgba(239,230,210,.35);color:var(--cream);background:rgba(13,11,8,.6)}
  .mbar-brief{flex:1;background:var(--gold);color:#1b1408;box-shadow:0 8px 28px rgba(226,182,78,.3)}

  /* sound moves out of the bar's way (top right, under the header) */
  .sound{top:calc(8px + env(safe-area-inset-top));bottom:auto;right:calc(var(--pad) + 104px);width:44px;height:44px;padding:0;justify-content:center;z-index:46}
  .sound em{display:none}
  .contact .sep{display:none}

  /* film: full-bleed portrait; the HUD comes back as a compact field readout */
  .hud{display:flex;align-items:center;gap:12px;position:absolute;top:calc(70px + env(safe-area-inset-top));left:var(--pad);right:auto;bottom:auto;transform:none;width:auto;padding:8px 12px;border-radius:999px;background:rgba(13,11,8,.62);border:1px solid var(--line);font-size:11px}
  .hud .hud-row{padding:0;border:0;gap:8px}
  .hud .hud-row:first-child .hud-k{display:none}
  .hud .hud-row b{font-size:12px}
  .hud-gauge{display:none}
  .hud-modes{margin:0;gap:4px}.hud-modes li{width:20px;height:20px;font-size:10px}
  .scrim{background:linear-gradient(0deg,rgba(10,8,5,.9) 0%,rgba(10,8,5,.72) 34%,rgba(10,8,5,.28) 62%,rgba(10,8,5,.18) 100%)!important}
  .b-hero{top:auto;bottom:calc(84px + env(safe-area-inset-bottom))}
  .b-hero h1{text-shadow:0 2px 24px rgba(0,0,0,.55)}
  .b-left,.b-right,.b-finale{bottom:calc(96px + env(safe-area-inset-bottom))}
  .b-station{top:calc(124px + env(safe-area-inset-top))}
  .station{bottom:calc(150px + env(safe-area-inset-bottom))}
  .station-btn{width:112px;height:112px}

  /* 3D model: heading → model → mode switch → explanation (tap and see it change) */
  .model-wrap{display:flex;flex-direction:column;gap:0}
  .model-copy{display:contents}
  .model-copy>.eyebrow{order:1}.model-copy>h2{order:2;margin-bottom:22px}
  .model-view{order:3;aspect-ratio:1/1.02}
  .mode-tabs{order:4;flex-direction:row;gap:6px;margin:14px 0 18px}
  .mode-tab{flex:1;flex-direction:column;align-items:flex-start;gap:4px;min-height:64px;padding:10px 10px;font-size:14px;line-height:1.2}
  .mode-panels{order:5}.model-note{order:6}

  /* registration: number, map, tapped state right under the map, then the key + full list */
  .reg-wrap{display:flex;flex-direction:column;gap:18px}
  .reg-side{display:contents}
  .reg-count{order:1}.reg-map{order:2;width:100%;align-self:stretch}.reg-detail{order:3;min-height:0}.reg-key{order:4;margin:0}.reg-also{order:5;margin:0}.reg-list{order:6}
  .st{font-size:10px;font-weight:700}
  .reg-list{display:block;border:1px solid var(--line);border-radius:14px;background:rgba(239,230,210,.03)}
  .reg-list summary{display:flex;align-items:baseline;gap:10px;min-height:52px;padding:16px;cursor:pointer;font:600 16px var(--f-body);color:#fff8e8;list-style:none}
  .reg-list summary::-webkit-details-marker{display:none}
  .reg-list summary::after{content:"+";margin-left:auto;font:300 26px/1 var(--f-display);color:var(--gold)}
  .reg-list[open] summary::after{content:"−"}
  .reg-list summary span{font:400 13px var(--f-body);color:var(--muted)}
  .reg-list ul{list-style:none;padding:0 16px 10px;columns:1}
  .reg-list li{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-top:1px solid var(--line);font-size:15px}
  .reg-list li span{color:var(--muted);font-size:14px;text-align:right}
  .reg-list .rl-prog span{color:var(--gold-hi)}

  /* swipe rows: trial photos + voices (next card peeks in) */
  [data-swipe]{display:flex!important;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 calc(-1 * var(--pad));padding:4px var(--pad) 6px;scroll-padding:0 var(--pad);scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
  [data-swipe]::-webkit-scrollbar{display:none}
  [data-swipe]>*{flex:0 0 84%;scroll-snap-align:start;margin:0}
  .voices>blockquote{display:flex;flex-direction:column;justify-content:space-between}
  .voices .v-big p{font-size:24px;line-height:1.22}
  .swipe-count{display:flex;align-items:center;gap:6px;margin-top:12px;font:500 12px var(--f-mono);letter-spacing:.1em;color:var(--ink-2)}
  .sec-voices .swipe-count{color:var(--muted)}
  .swipe-count b{color:var(--leaf-ink);font-weight:600}.sec-voices .swipe-count b{color:var(--gold)}
  .swipe-count span{margin-left:auto;text-transform:uppercase}
  .swipe-count span::after{content:" →"}

  /* team: compact cards, background folds open */
  .team-grid{gap:28px 22px}
  .person{display:grid;grid-template-columns:96px 1fr;column-gap:16px;align-items:center}
  .person>img,.person>.initials{grid-row:1/4;width:96px;aspect-ratio:4/5;border-radius:12px}
  .person>.initials{font-size:34px}
  .person h3{margin-top:0;font-size:22px}
  .person .role{margin:4px 0 0}
  .person-more{display:flex;align-items:center;justify-content:space-between;grid-column:1/-1;margin-top:14px;min-height:44px;padding:0 14px;border-radius:10px;border:1px solid var(--line-ink);background:#fbf8f1;color:var(--ink);font:600 14px var(--f-body);cursor:pointer}
  .person-more i{width:10px;height:10px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-3px);transition:transform .3s}
  .person.expanded .person-more i{transform:rotate(-135deg) translateY(-3px)}
  .person>ul{grid-column:1/-1;display:none;margin-top:14px}
  .person.expanded>ul{display:grid}

  /* legibility floor + contrast on light sections */
  .eyebrow{font-size:12px}
  .cmp-tag,.model-hint,.model-note,.yield-legend,.chart-head,.npk-col em,.bar em,.hud-k,.npk span,.facts span{font-size:12px}
  .y-bars .bar em{font-size:12px}

  /* contact rows: every number is a real tap target */
  .contact li{flex-wrap:wrap;align-items:center;min-height:52px;padding:6px 0}
  .contact a{display:inline-flex;align-items:center;min-height:44px}
  .cta-form{scroll-margin-top:80px}
  .sec{padding-bottom:calc(clamp(80px,11vw,150px) + 40px)}
  .foot{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
}
@media (max-width:520px){
  .team-grid{grid-template-columns:1fr}
  .mode-tab{font-size:13px;padding:10px 8px}
}

/* touch: pressed states replace hover; no sticky hover on tap */
@media (hover:none){
  .btn:active,.mbar a:active,.menu-sheet a:active,.mode-tab:active,.person-more:active,.menu-btn:active,.sound:active{transform:scale(.97);transition:transform .08s}
  .st:hover{transform:none;box-shadow:none}
  .st:active,.st.sel{transform:scale(1.12);box-shadow:0 0 0 2px var(--gold-hi)}
  .mode-tab:hover{border-color:var(--line)}
}

[data-swipe]:focus-visible{outline:3px solid var(--gold);outline-offset:4px;border-radius:8px}

/* keyboard: skip link, faded header controls appear on focus */
.skip{position:fixed;left:16px;top:-80px;z-index:200;padding:12px 18px;border-radius:10px;background:var(--gold);color:#1b1408;font:600 15px var(--f-body);text-decoration:none;transition:top .2s}
.skip:focus{top:calc(12px + env(safe-area-inset-top))}
#hdr .hdr-nav:focus-within{opacity:1;transform:none}
.pill:focus-visible{opacity:1;transform:none;pointer-events:auto}

/* wide touch screens (iPad landscape, touch laptops): desktop layout, finger-sized targets */
@media (min-width:901px) and (pointer:coarse){
  .brand{display:flex;align-items:center;min-height:44px}
  .hdr-nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 4px}
  .pill{min-height:44px;display:inline-flex;align-items:center}
  .sound{min-height:44px}
  .contact a{display:inline-flex;align-items:center;min-height:44px}
}


/* ==========================================================================
   Motion pass: nothing overlaps, staged reveals, testimonial film
   ========================================================================== */
@property --ps{syntax:'<number>';inherits:false;initial-value:1.14}
#pgbar{position:fixed;left:0;right:0;top:0;height:2px;z-index:60;background:linear-gradient(90deg,var(--leaf),var(--gold));transform:scaleX(0);transform-origin:0 50%;pointer-events:none}
/* header tucks away while reading down the page, returns on the way back up */
#hdr{transition:background .4s,backdrop-filter .4s,transform .45s cubic-bezier(.2,.7,.2,1),opacity .35s}
#hdr.tuck{transform:translateY(-110%)}
#hdr:focus-within{transform:none}
.sec{scroll-margin-top:84px}
/* the circle: lower-left corner, clear of the seed, the roots and all copy */
.b-station .hint{display:none}
.station-label{transition:opacity .25s}
.station.busy .station-label{opacity:0}
.st-next{position:absolute;z-index:6;left:50%;bottom:5vh;width:1px;height:54px;background:linear-gradient(var(--gold-hi),transparent);opacity:0;transition:opacity .6s .9s;animation:cue 2s ease-in-out infinite;pointer-events:none}
.st-next.on{opacity:1}
/* while the seed charges the frame is pure film: no copy, gauge or chrome */
html.st-clear #hdr,html.st-clear .sound,html.st-clear .hud{opacity:0!important;pointer-events:none}
html.st-clear .scrim{opacity:0!important}
.hud{transition:opacity .35s}
/* hero arrives line by line once the loader lifts */
@keyframes lineUp{from{opacity:0;transform:translateY(44px)}to{opacity:1;transform:none}}
#loader.out~main .b-hero>*{animation:lineUp 1.1s cubic-bezier(.16,.8,.24,1) backwards}
#loader.out~main .b-hero>:nth-child(2){animation-delay:.12s}
#loader.out~main .b-hero>:nth-child(3){animation-delay:.24s}
#loader.out~main .b-hero>:nth-child(4){animation-delay:.36s}
#loader.out~main .b-hero>:nth-child(5){animation-delay:.48s}
/* headlines rise word by word from behind a mask */
.split.rv{opacity:1;transform:none}
.split .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.12em;margin-bottom:-.12em}
.split .w>span{display:inline-block;transform:translateY(112%);transition:transform 1s cubic-bezier(.16,.8,.24,1);transition-delay:calc(var(--wi,0)*38ms)}
.split.in .w>span{transform:none}
/* photographs settle into their frames, and drift with the scroll */
.photo-grid figure,.team-photos figure{overflow:hidden}
.photo-grid figure img,.team-photos figure img{transform:translateY(var(--py,0px)) scale(var(--ps));transition:--ps 1.6s cubic-bezier(.16,.8,.24,1);will-change:transform}
.photo-grid figure.in img,.team-photos figure.in img{--ps:1.07}
@media (pointer:coarse){.photo-grid figure img,.team-photos figure img{transform:none;will-change:auto}}
/* testimonial film */
.sec-film{background:radial-gradient(90% 60% at 50% 42%,#2a2113 0%,#100c07 62%,#0a0805 100%);overflow:hidden;color:var(--cream)}
.tm-head{text-align:center;margin-bottom:clamp(36px,5vw,64px)}
.tm-head .eyebrow{justify-content:center}
.tm-head .h-xl{margin:0 auto;max-width:18ch;color:#fff8e8}
.tm-head .sub{max-width:56ch;margin:18px auto 0;color:rgba(239,230,210,.82)}
.tm-stage{padding:0 clamp(16px,3vw,48px)}
.tm-frame{position:relative;max-width:1500px;margin:0 auto;aspect-ratio:16/9;overflow:hidden;border-radius:10px;background:#000;transform-origin:50% 50%;will-change:transform;box-shadow:0 0 0 1px rgba(243,210,126,.5),0 40px 120px rgba(0,0,0,.65),0 0 120px rgba(226,182,78,.16)}
.tm-frame video{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.tm-play{position:absolute;inset:0;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;border:0;cursor:pointer;color:#1b1408;background:linear-gradient(0deg,rgba(10,8,5,.62),rgba(10,8,5,.12) 55%,rgba(10,8,5,.28));transition:opacity .4s,background .3s}
.tm-play:hover{background:linear-gradient(0deg,rgba(10,8,5,.5),rgba(10,8,5,.04) 55%,rgba(10,8,5,.18))}
.tm-disc{position:relative;display:grid;place-items:center;width:clamp(84px,9vw,132px);height:clamp(84px,9vw,132px);border-radius:50%;background:var(--gold);box-shadow:0 16px 60px rgba(226,182,78,.55);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.tm-disc::before,.tm-disc::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(243,210,126,.75);animation:tmPulse 2.6s ease-out infinite}
.tm-disc::after{animation-delay:1.3s}
@keyframes tmPulse{from{transform:scale(1);opacity:.85}to{transform:scale(1.75);opacity:0}}
.tm-play:hover .tm-disc{transform:scale(1.08)}
.tm-tag{display:flex;flex-direction:column;align-items:center;gap:6px;color:#fff8e8;text-shadow:0 2px 18px rgba(0,0,0,.7)}
.tm-tag b{font:300 clamp(24px,2.6vw,38px)/1.1 var(--f-display)}
.tm-tag i{font:500 12px var(--f-mono);font-style:normal;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-hi)}
.tm-frame.playing .tm-play{opacity:0;pointer-events:none}
.tm-chapters{list-style:none;display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:clamp(28px,4vw,48px)}
.tm-chapters button{width:100%;min-height:76px;padding:14px 16px;text-align:left;border-radius:12px;border:1px solid var(--line);background:rgba(239,230,210,.03);color:var(--cream);cursor:pointer;transition:border-color .25s,background .25s,transform .25s}
.tm-chapters button:hover{border-color:var(--gold);background:rgba(226,182,78,.08);transform:translateY(-3px)}
.tm-chapters b{display:block;font:400 18px/1.2 var(--f-display);color:#fff8e8}
.tm-chapters span{display:block;margin-top:6px;font:500 11px/1.35 var(--f-mono);letter-spacing:.05em;color:var(--gold)}
@media (max-width:1100px){.tm-chapters{grid-template-columns:repeat(2,1fr)}.tm-chapters li:last-child{grid-column:1/-1}}
@media (max-width:900px){
  .station{left:50%;bottom:calc(46px + env(safe-area-inset-bottom));transform:translateX(-50%);flex-direction:column;gap:10px}
  .mbar{background:rgba(10,8,5,.97)}
  .tm-stage{padding:0}
  .tm-frame{border-radius:0!important;transform:none!important}
  .tm-tag{display:none}
}
html.reduced .tm-frame{transform:none}
html.reduced .tm-disc::before,html.reduced .tm-disc::after{animation:none;opacity:0}
html.reduced .split .w>span{transform:none}

/* camera push: follows --px set by the film engine */
#cv,#fx{transform:translateX(calc(var(--px,0)*7vw)) scale(calc(1 + var(--px,0)*.16));will-change:transform}
.hud::before{content:"";position:absolute;inset:-40px calc(-1*var(--pad)) -40px -60px;z-index:-1;background:linear-gradient(270deg,rgba(10,8,5,.78),rgba(10,8,5,.5) 60%,transparent);pointer-events:none}

/* play control sits lower-left so it never covers the speaker */
.tm-play{flex-direction:row;align-items:flex-end;justify-content:flex-start;gap:clamp(16px,2vw,28px);padding:clamp(18px,3.4vw,52px);text-align:left;background:linear-gradient(35deg,rgba(10,8,5,.82) 0%,rgba(10,8,5,.35) 30%,rgba(10,8,5,0) 58%)}
.tm-play:hover{background:linear-gradient(35deg,rgba(10,8,5,.9) 0%,rgba(10,8,5,.42) 32%,rgba(10,8,5,0) 60%)}
.tm-tag{align-items:flex-start;padding-bottom:6px}
@media (max-width:900px){.tm-disc{width:72px;height:72px}.tm-disc svg{width:28px;height:28px}.tm-tag{display:flex}.tm-tag b{font-size:20px}.tm-tag i{font-size:10px}}

@media (max-width:900px){.hud::before{display:none}}
@media (max-width:620px){.tm-tag{display:none}}

.tm-stage,.tm-frame{box-sizing:border-box;width:100%;min-width:0}
.tm-frame video{max-width:100%}
.sec-film{max-width:100vw}