/* Project A&R — homepage.
   Performance rules: only transform + opacity animate. No blend modes, no backdrop-filter,
   no fixed backgrounds, no glows on giant type, no infinite animations on big text. */

@font-face{font-family:Archivo;src:url(/assets/fonts/archivo-800-900.94330f46b2.woff2) format("woff2");font-weight:800 900;font-stretch:88% 100%;font-style:normal;font-display:swap}
@font-face{font-family:"Space Mono";src:url(/assets/fonts/space-mono-400.e3c2c5620d.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Space Mono";src:url(/assets/fonts/space-mono-700.bc1c51ed78.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}

:root{
  --cobalt-900:#01142E;--cobalt-800:#031835;--cobalt-700:#02255A;--cobalt-600:#033B86;--cobalt-500:#0B4E92;--cobalt-100:#A7CEFF;
  --orange-500:#FF7B00;--orange-300:#FFA24D;--orange-label:#FF8A1F;
  --bone:#F2EEE5;--ice:#D3E6FF;
  --line:rgba(167,206,255,.22);
  --bloom:radial-gradient(120% 92% at 86% 18%,#1165A3 0%,#0B4E92 30%,#033B86 64%);
  --px:clamp(16px,4vw,48px);
  --ease:cubic-bezier(.16,.84,.44,1);
  --display:Archivo,"Helvetica Neue",Helvetica,Arial,sans-serif;
  --mono:"Space Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --grain:url(/assets/img/grain.b5032efe17.png);
}

*,*:before,*:after{box-sizing:border-box}
html{background:var(--cobalt-900);-webkit-text-size-adjust:100%;text-size-adjust:100%}
.sec[id],#main{scroll-margin-top:64px}
body{margin:0;background:var(--cobalt-900);color:var(--bone);font-family:var(--mono);font-size:15px;line-height:1.62;-webkit-font-smoothing:antialiased;overflow-x:hidden}
@supports (overflow:clip){body{overflow-x:clip}}
h1,h2,h3,p,ul,ol,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
img{display:block;max-width:100%;height:auto}
a{color:var(--orange-500);text-decoration:none}
::selection{background:var(--orange-500);color:var(--cobalt-900)}
:focus-visible{outline:2px solid var(--orange-500);outline-offset:3px}
.accent{color:var(--orange-500)}
.px{position:absolute;width:1px;height:1px;opacity:0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;padding:10px 14px;background:var(--orange-500);color:var(--cobalt-900);font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.skip:focus{top:12px}

.brand{display:flex;align-items:center;gap:12px;color:var(--bone)}
.brand img{height:20px;width:auto}
.brand span{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--cobalt-100)}

.ln{display:block;overflow:hidden;padding-bottom:.04em}
.ln>span{display:block}
@keyframes rise{0%{transform:translateY(104%)}to{transform:translateY(0)}}
@keyframes blink{50%{opacity:.15}}

/* =====================================================================
   BAR — one fixed header; transparent over the gate, solid after it
   ===================================================================== */
.bar{position:fixed;left:0;right:0;top:0;z-index:40;display:flex;justify-content:space-between;align-items:center;gap:16px;
  height:64px;padding:0 var(--px);padding-top:env(safe-area-inset-top);border-bottom:1px solid transparent;
  transition:background-color .3s,border-color .3s}
.bar.solid{background:rgba(1,20,46,.94);border-bottom-color:var(--line)}
.bar-nav{display:flex;align-items:center;gap:clamp(14px,2.4vw,32px)}
.bar-nav a{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ice);transition:color .15s}
.bar-nav a:hover{color:var(--bone)}
.bar-nav .bar-cta{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border:1px solid var(--orange-500);color:var(--bone);transition:background-color .15s,color .15s}
.bar-nav .bar-cta:hover{background:var(--orange-500);color:var(--cobalt-900)}
@media (max-width:760px){.bar-nav .opt{display:none}}

/* =====================================================================
   GATE — tall scroll track with a sticky stage. JS maps scroll → charge.
   ===================================================================== */
.gate{position:relative;height:100vh;height:100svh;background:var(--cobalt-900)}
.js .gate{height:180vh;height:180svh}
.stage{position:relative;height:100vh;height:100svh;overflow:hidden;color:var(--bone);background:var(--cobalt-900)}
.js .stage{position:sticky;top:0}
/* grain: a plain low-opacity texture, painted once (no blend mode) */
.stage:after{content:"";position:absolute;inset:0;background-image:var(--grain);background-size:320px;opacity:.12;pointer-events:none;z-index:6}

/* warms up as you scroll — only its opacity changes */
.glow{position:absolute;inset:0;z-index:0;opacity:0;pointer-events:none;
  background:radial-gradient(90% 70% at 50% 110%,rgba(255,123,0,.55) 0%,rgba(255,123,0,.12) 38%,rgba(255,123,0,0) 62%),var(--bloom)}

/* the wall of background type: static text, moved only by transform */
.wall{position:absolute;inset:64px 0 70px;z-index:1;display:flex;flex-direction:column;justify-content:space-between}
.row{white-space:nowrap}
.row>span{display:inline-block;transition:transform 1s var(--ease),opacity .6s var(--ease)}
.js .wall .row{will-change:transform}
.wall .row.d{margin-left:-12vw}
.wall .row.d:nth-child(3){margin-left:-38vw}
.row.d{font-family:var(--display);font-weight:900;font-stretch:92%;text-transform:uppercase;letter-spacing:-.035em;line-height:.86;
  font-size:clamp(58px,17vh,210px);color:transparent;-webkit-text-stroke:1px rgba(167,206,255,.16);transition:color .3s,-webkit-text-stroke-color .3s}
.row.m{font-size:clamp(10px,1.4vh,13px);letter-spacing:.32em;text-transform:uppercase;color:rgba(167,206,255,.2);transition:color .3s}
.wall .row.m{margin-left:-30vw}
.row.d.lit{color:rgba(242,238,229,.1);-webkit-text-stroke-color:rgba(242,238,229,.8)}
.row.d.hot.lit{color:var(--orange-500);-webkit-text-stroke-color:var(--orange-500)}
.row.m.lit{color:var(--orange-label)}

/* centre */
.core{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 var(--px);pointer-events:none}
.core:before{content:"";position:absolute;left:50%;top:50%;width:min(1100px,120vw);height:62vh;transform:translate(-50%,-50%);z-index:-1;
  background:radial-gradient(closest-side,rgba(1,20,46,.88) 0%,rgba(1,20,46,.6) 55%,rgba(1,20,46,0) 100%);transition:opacity .6s}
.kicker{font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--orange-label);margin-bottom:22px;transition:opacity .4s}
.gate-h{font-family:var(--display);font-weight:900;font-stretch:92%;text-transform:uppercase;letter-spacing:-.045em;line-height:.84;
  font-size:clamp(34px,min(8vw,13vh),150px)}
@media (min-width:600px){.gate-h .ln>span{white-space:nowrap}}
.gate-h em{font-style:normal;color:var(--orange-500)}
.gate-h .ln{transition:transform .9s var(--ease)}
.gate-h .ln>span{animation:rise 1s var(--ease) both .1s}
.gate-h .ln:nth-child(2)>span{animation-delay:.22s}
.gate-h .ln:nth-child(3)>span{animation-delay:.34s}
.granted{position:absolute;left:0;right:0;top:50%;transform:translateY(-30%);opacity:0;display:flex;flex-direction:column;align-items:center;gap:14px;
  transition:opacity .5s var(--ease) .25s,transform .8s var(--ease) .25s}
.granted{gap:0}
.granted span{display:block;font-family:var(--display);font-weight:900;font-stretch:92%;text-transform:uppercase;letter-spacing:-.04em;line-height:.88;font-size:clamp(40px,8.4vw,128px);color:var(--cobalt-900)}
.granted span+span{color:var(--bone)}
.js .granted span{will-change:transform,opacity}
/* rises as the orange leaves: the next section's blue wipes up over it, meeting it with no seam */
.seam{position:absolute;inset:0;z-index:7;pointer-events:none;background:#033B86;transform-origin:50% 100%;transform:scaleY(0);will-change:transform}
.worked{margin-top:clamp(22px,3.4vh,36px);max-width:62ch;font-size:11px;line-height:1.9;letter-spacing:.16em;text-transform:uppercase;color:var(--cobalt-100);
  animation:fadeUp .9s var(--ease) both .55s;transition:opacity .4s}
.worked span{color:var(--orange-label)}
@keyframes fadeUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* foot: signal / cue / charge, then the meter line */
.gate-foot{position:absolute;left:var(--px);right:var(--px);bottom:calc(26px + env(safe-area-inset-bottom));z-index:5;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;
  font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--ice);transition:opacity .4s}
.cue{display:inline-flex;align-items:center;gap:10px;color:var(--bone);pointer-events:auto}
.cue i{font-style:normal;color:var(--orange-500);display:inline-block;animation:nudge 1.6s var(--ease) infinite}
@keyframes nudge{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
.est{justify-self:end}
.meter{position:absolute;left:0;right:0;bottom:0;z-index:5;height:3px;background:rgba(167,206,255,.14)}
.meter span{display:block;height:100%;background:var(--orange-500);transform-origin:0 50%;transform:scaleX(0)}
html:not(.js) .meter{display:none}

/* opened: headline splits like blinds, wall clears, stage turns orange */
.stage{transition:background-color .6s var(--ease)}
.stage.open{background-color:var(--orange-500)}
.stage.open .glow{opacity:0!important;transition:opacity .4s}
.stage.open .row>span{opacity:0}
.stage.open .row:nth-child(odd)>span{transform:translateX(-60vw)}
.stage.open .row:nth-child(even)>span{transform:translateX(60vw)}
.stage.open .gate-h .ln:nth-child(odd){transform:translateX(-110vw)}
.stage.open .gate-h .ln:nth-child(even){transform:translateX(110vw)}
.stage.open .kicker,.stage.open .gate-foot,.stage.open .core:before{opacity:0}
.stage.open .worked{animation:none;opacity:0}
.stage.open .granted{opacity:1;transform:translateY(-50%)}
.stage.open .meter span{background:var(--cobalt-900)}

@media (max-width:600px){
  .gate-foot{font-size:10px;letter-spacing:.16em}
  .worked{font-size:10px;letter-spacing:.12em}
  .kicker{font-size:10px;letter-spacing:.18em}
  .row.d{font-size:clamp(52px,13vh,120px)}
}

/* =====================================================================
   TOUCH — phones/tablets get a self-playing gate + a separate closing panel.
   Everything here runs on CSS transitions, so a swipe can't make it stutter.
   ===================================================================== */
.answer{display:none}
.touch .gate{height:100vh;height:100svh}
.touch .stage{position:relative}
.touch .granted,.touch .seam{display:none}
.touch .wall .row{transition:transform 2.8s var(--ease)}
.touch .stage.play .wall .row[data-dir="-1"]{transform:translate3d(-12vw,0,0)}
.touch .stage.play .wall .row[data-dir="1"]{transform:translate3d(12vw,0,0)}
.touch .glow{transition:opacity 2.6s ease}
.touch .stage.play .glow{opacity:.85}
.touch .meter span{transition:transform 2.6s var(--ease)}
.touch .stage.play .meter span{transform:scaleX(1)}

.touch .answer{display:flex;align-items:center;justify-content:center;min-height:100vh;min-height:100svh;padding:64px var(--px) 0;background:var(--orange-500);overflow:hidden;text-align:center}
.say span{display:block;font-family:var(--display);font-weight:900;font-stretch:92%;text-transform:uppercase;letter-spacing:-.04em;line-height:.88;font-size:clamp(40px,11vw,128px);color:var(--cobalt-900)}
.say span+span{color:var(--bone)}
.js.touch .say span{opacity:0;transform:translate3d(-24vw,0,0);transition:transform .9s var(--ease),opacity .6s var(--ease)}
.js.touch .say span+span{transform:translate3d(24vw,0,0);transition-delay:.12s}
.answer.in .say span,.js.touch .answer.in .say span{opacity:1;transform:none}

/* a swipe settles on each beat instead of flying past the closing panel */
html.touch{scroll-snap-type:y proximity}
.touch .gate,.touch .answer,.touch .intro{scroll-snap-align:start}
.touch .answer{scroll-snap-stop:always}

/* =====================================================================
   CONTENT
   ===================================================================== */
.sec{position:relative;padding:clamp(72px,11vw,150px) 0}
.wrap{max-width:1360px;margin:0 auto;padding:0 var(--px)}

/* scroll reveal — only hidden when JS is running, and only opacity/transform */
.js .rv{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .rv.in{opacity:1;transform:none}

.label{display:flex;justify-content:space-between;gap:16px;padding-bottom:14px;margin-bottom:clamp(28px,4vw,48px);border-bottom:1px solid var(--line);
  font-family:var(--mono);font-weight:400;font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--cobalt-100)}
.label span:first-child{color:var(--orange-label)}
.label--sub{margin-top:clamp(64px,8vw,110px)}
.h2{font-family:var(--display);font-weight:900;font-stretch:92%;text-transform:uppercase;letter-spacing:-.04em;line-height:.88;
  font-size:clamp(40px,6.6vw,104px);max-width:15ch}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:56px;padding:0 26px;border:1px solid var(--orange-500);background:var(--orange-500);color:var(--cobalt-900);
  font:700 12px/1 var(--mono);letter-spacing:.22em;text-transform:uppercase;transition:background-color .18s,border-color .18s,color .18s}
.btn:hover{background:var(--orange-300);border-color:var(--orange-300)}
.btn--ghost{background:transparent;color:var(--bone);border-color:rgba(242,238,229,.45)}
.btn--ghost:hover{background:transparent;border-color:var(--bone);color:var(--bone)}
.btn--dark{background:var(--cobalt-900);border-color:var(--cobalt-900);color:var(--bone)}
.btn--dark:hover{background:var(--cobalt-700);border-color:var(--cobalt-700)}

/* 00 intro */
.intro{background:var(--cobalt-600);background-image:linear-gradient(to bottom,#033B86 0,rgba(3,59,134,0) 26vh),var(--bloom);padding-top:clamp(96px,12vw,160px)}
.intro-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:clamp(24px,4vw,44px);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--ice)}
.eyebrow{color:var(--orange-label)}
.intro-h{font-family:var(--display);font-weight:900;font-stretch:92%;text-transform:uppercase;letter-spacing:-.045em;line-height:.84;font-size:clamp(40px,11vw,176px)}
.intro-grid{display:grid;gap:32px;margin-top:clamp(32px,5vw,64px);padding-top:28px;border-top:1px solid rgba(242,238,229,.35)}
.lede{max-width:52ch;font-size:clamp(15px,1.3vw,18px);color:var(--ice)}
.intro-cta{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-start}
@media (min-width:900px){.intro-grid{grid-template-columns:1.2fr 1fr;align-items:end}.intro-cta{justify-content:flex-end}}

/* ticker — small type, one compositor layer */
.ticker{overflow:hidden;background:var(--orange-500);color:var(--cobalt-900);border-block:1px solid var(--orange-500)}
.ticker-track{display:flex;width:max-content;animation:tick 70s linear infinite}
.ticker ul{display:flex;flex-shrink:0}
.ticker li{padding:16px 0;font-family:var(--display);font-weight:900;font-stretch:92%;text-transform:uppercase;letter-spacing:-.01em;font-size:clamp(18px,2vw,26px);white-space:nowrap}
.ticker li:after{content:"/";margin:0 .7em;opacity:.45}
@keyframes tick{to{transform:translateX(-50%)}}
.ticker:hover .ticker-track{animation-play-state:paused}

/* 01 philosophy */
.philo{background:var(--cobalt-900)}
.cols{display:grid;gap:24px 56px;margin-top:clamp(36px,5vw,64px);color:var(--ice);max-width:1100px}
@media (min-width:860px){.cols{grid-template-columns:1fr 1fr}}

/* 02 who */
.who{background:var(--cobalt-900);padding-top:0}
.who-grid{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
@media (min-width:700px){.who-grid{grid-template-columns:1fr 1fr}}
@media (min-width:1100px){.who-grid{grid-template-columns:repeat(4,1fr)}}
.card{background:var(--cobalt-900);padding:clamp(24px,2.6vw,36px);min-height:260px;display:flex;flex-direction:column;transition:background-color .25s}
.card:hover{background:var(--cobalt-800)}
.card .k{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--orange-label)}
.card h3{margin-top:auto;padding-top:48px;font-family:var(--display);font-weight:900;font-stretch:92%;text-transform:uppercase;letter-spacing:-.03em;line-height:.9;font-size:clamp(28px,2.6vw,40px)}
.card p{margin-top:14px;font-size:13px;color:var(--ice)}

/* 03 pillars */
.pillars{background:var(--cobalt-600);background-image:var(--bloom)}
.pillars .h2{margin-bottom:clamp(40px,6vw,80px);max-width:18ch}
.pillar{position:relative;display:grid;gap:20px 48px;padding:clamp(28px,3.5vw,48px) 0;border-top:1px solid rgba(242,238,229,.3)}
.pillar:last-child{border-bottom:1px solid rgba(242,238,229,.3)}
@media (min-width:900px){.pillar{grid-template-columns:140px 1fr 1.25fr;align-items:start}}
.num{font-family:var(--display);font-weight:900;line-height:.8;font-size:clamp(56px,7vw,104px);color:var(--orange-500);transition:color .25s}
.pillar:hover .num{color:var(--bone)}
.tag{display:block;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--orange-label);margin-bottom:12px}
.pillar-h h3{font-family:var(--display);font-weight:900;font-stretch:92%;text-transform:uppercase;letter-spacing:-.035em;line-height:.88;font-size:clamp(32px,3.6vw,56px)}
.pillar-b p{color:var(--ice)}
.pillar-b ul{margin-top:18px;border-top:1px solid var(--line)}
.pillar-b li{padding:10px 0;border-bottom:1px solid var(--line);font-size:13px}
.pillar-b li:before{content:"→";color:var(--orange-500);margin-right:12px}

/* 04 proof */
.proof{background:var(--cobalt-900)}
.counters{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
@media (min-width:800px){.counters{grid-template-columns:repeat(3,1fr)}}
.counter{background:var(--cobalt-900);padding:clamp(24px,3vw,40px);display:flex;flex-direction:column-reverse;gap:12px}
.counter dt{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--cobalt-100)}
.counter dd{font-family:var(--display);font-weight:900;font-stretch:92%;letter-spacing:-.04em;line-height:.85;font-size:clamp(64px,9vw,148px);color:var(--orange-500);font-variant-numeric:tabular-nums}
.cases{display:grid;gap:20px}
@media (min-width:860px){.cases{grid-template-columns:1fr 1fr}}
.case{border:1px solid var(--line);padding:clamp(24px,3vw,40px);background:var(--cobalt-800);transition:border-color .25s}
.case:hover{border-color:var(--orange-500)}
.case h3{font-family:var(--display);font-weight:900;font-stretch:92%;text-transform:uppercase;letter-spacing:-.03em;line-height:.92;font-size:clamp(26px,2.6vw,38px)}
.case-m{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 14px;margin:22px 0 18px;padding:16px 0;border-block:1px solid var(--line)}
.case-m strong{font-family:var(--display);font-weight:900;font-stretch:92%;letter-spacing:-.03em;font-size:clamp(36px,4vw,56px);line-height:1;color:var(--orange-500)}
.case-m span{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--cobalt-100)}
.case p{font-size:13px;color:var(--ice)}

/* 05 loop */
.loop{background:var(--cobalt-800)}
.loop-head{display:grid;gap:24px 56px}
.loop-head p{color:var(--ice);max-width:52ch}
@media (min-width:960px){.loop-head{grid-template-columns:1.3fr 1fr;align-items:end}}
.phases{display:grid;gap:20px;margin-top:clamp(40px,6vw,72px);counter-reset:none}
@media (min-width:900px){.phases{grid-template-columns:repeat(3,1fr)}}
.phase{position:relative;padding:clamp(24px,3vw,36px);border:1px solid var(--line);overflow:hidden;min-height:300px;display:flex;flex-direction:column}
.phase .big{position:absolute;right:-6px;top:-14px;font-family:var(--display);font-weight:900;line-height:.8;font-size:clamp(110px,12vw,180px);color:transparent;-webkit-text-stroke:1px rgba(167,206,255,.22)}
.phase h3{margin-top:auto;font-family:var(--display);font-weight:900;font-stretch:92%;text-transform:uppercase;letter-spacing:-.03em;font-size:clamp(26px,2.4vw,36px);line-height:.95}
.phase h3 b{display:block;margin-bottom:10px;font-family:var(--mono);font-weight:700;font-size:11px;letter-spacing:.24em;color:var(--orange-label)}
.phase p{margin-top:14px;font-size:13px;color:var(--ice)}
.loop-note{margin-top:28px;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--cobalt-100)}
.loop-note span{color:var(--orange-500);font-size:16px;margin-left:6px}

/* 06 contact — the payoff, in full orange */
.contact{background:var(--orange-500);color:var(--cobalt-900)}
.contact .label{border-bottom-color:rgba(1,20,46,.3);color:var(--cobalt-900)}
.contact .label span:first-child{color:var(--cobalt-900)}
.contact-h{font-family:var(--display);font-weight:900;font-stretch:92%;text-transform:uppercase;letter-spacing:-.045em;line-height:.84;font-size:clamp(52px,11vw,184px);max-width:12ch}
.contact-h .ul{color:var(--bone)}
.contact-body{display:grid;gap:28px;margin-top:clamp(36px,5vw,64px);padding-top:28px;border-top:1px solid rgba(1,20,46,.3)}
.contact-body p{max-width:52ch}
.contact-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px}
.mail{color:var(--cobalt-900);font-weight:700;font-size:13px;letter-spacing:.08em;border-bottom:1px solid currentColor;padding-bottom:2px}
.mail:hover{color:var(--bone)}
@media (min-width:960px){.contact-body{grid-template-columns:1.2fr 1fr;align-items:end}.contact-cta{justify-content:flex-end}}

/* footer — static type wall, nothing moves */
.ftr{background:var(--cobalt-900);overflow:hidden;padding-top:clamp(40px,6vw,80px)}
.ftr-wall{display:flex;flex-direction:column;gap:clamp(4px,1vw,12px)}
.ftr .row.d{font-size:clamp(56px,10vw,170px);margin-left:-4vw;-webkit-text-stroke-color:rgba(242,238,229,.3)}
.ftr .row.d.hot{color:var(--orange-500);-webkit-text-stroke-color:var(--orange-500);margin-left:-28vw}
.ftr-bar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px 24px;margin-top:clamp(24px,4vw,48px);
  padding:22px var(--px) calc(22px + env(safe-area-inset-bottom));border-top:1px solid var(--line);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--cobalt-100)}
.ftr-bar nav{display:flex;gap:20px}
.ftr-bar nav a{color:var(--bone)}
.ftr-bar nav a:hover{color:var(--orange-500)}
@media (max-width:700px){.ftr-bar>span{display:none}}

/* =====================================================================
   Reduced motion: no scroll gate, no drift, no reveals
   ===================================================================== */
@media (prefers-reduced-motion:reduce){
  .js .gate{height:100vh;height:100svh}
  .js .stage{position:relative}
  .meter,.seam{display:none}
  .js.touch .say span{opacity:1;transform:none;transition:none}
  .touch .wall .row,.touch .glow{transition:none}
  .worked{animation:none}
  .gate-h .ln>span{animation:none}
  .cue i{animation:none}
  .ticker-track{animation:none}
  .js .rv{opacity:1;transform:none;transition:none}
  .js .wall .row{will-change:auto}
}