/* Deep Fried Mobile — "Broadcast" production stylesheet (baseline v1.0)
   Approved by Marco 2026-08-15. samples/_baselines/v1.0 is the reference.

   One scrolling home: boot → wordmark hero → pinned manifesto → THE WALL
   (embedded control room) → services columns → studio prose → contact.
   Scenes alternate dark / bone with 1px hairline boundaries. Legal pages
   (.doc) sit on the bone ground. Ticker: banned (RULES.md §11). */

@font-face{font-family:"Archivo";font-style:normal;font-weight:400 800;font-stretch:100% 125%;font-display:swap;
  src:url("fonts/archivo-var-latin.woff2") format("woff2")}
@font-face{font-family:"Space Mono";font-style:normal;font-weight:400;font-display:swap;
  src:url("fonts/spacemono-400.woff2") format("woff2")}
@font-face{font-family:"Space Mono";font-style:normal;font-weight:700;font-display:swap;
  src:url("fonts/spacemono-700.woff2") format("woff2")}

:root{
  --room:#101214; --room-2:#15181B; --bezel:#23272C; --bezel-2:#2C3137;
  --ink:#E8ECEF; --dim:#8B949C; --ghost:rgba(232,236,239,.14);
  --tally:#FF3B30; --amber:#FFB020;
  --bone:#EDEAE2; --ink-l:#15120D; --dim-l:#6E6759;
  --hair-l:rgba(21,18,13,.22); --amber-l:#B4530A;
  --disp:"Archivo",system-ui,sans-serif;
  --mono:"Space Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --gut:clamp(1.1rem,4vw,3.4rem);
  --bar:52px;
}
*,*::before,*::after{box-sizing:border-box}
html{color-scheme:dark;scroll-behavior:smooth;scroll-padding-top:calc(var(--bar) + 10px)}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--room);color:var(--ink);
  font-family:var(--disp);font-size:16px;line-height:1.55;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;touch-action:manipulation}
img{max-width:100%;display:block}
a{color:inherit}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--amber);outline-offset:2px}
.skip{position:fixed;left:12px;top:-70px;z-index:600;background:var(--amber);color:var(--room);
  padding:.7rem 1.1rem;font:700 .78rem/1 var(--mono);text-decoration:none;transition:top .15s}
.skip:focus{top:12px}

/* faint CRT scanlines over the whole transmission (static, decorative) */
body::after{content:"";position:fixed;inset:0;z-index:2000;pointer-events:none;opacity:.05;
  background:repeating-linear-gradient(to bottom,rgba(255,255,255,.7) 0 1px,transparent 1px 3px)}
.tag{font:400 .64rem/1.4 var(--mono);letter-spacing:.26em;text-transform:uppercase;color:var(--dim)}

html.nojs .boot{display:none}
@media(prefers-reduced-motion:reduce){.boot{display:none}}

/* ── boot ──────────────────────────────────────────────────────────────── */
.boot{position:fixed;inset:0;z-index:500;background:var(--room);
  display:flex;align-items:center;justify-content:center;
  transition:opacity .5s ease,visibility 0s .5s}
.boot.done{opacity:0;visibility:hidden;pointer-events:none}
.boot-in{text-align:center;display:flex;flex-direction:column;align-items:center;gap:1.2rem;
  max-width:70ch;padding:0 1.2rem}
.boot-mark{display:flex;gap:.14em;font:800 clamp(1.3rem,4.5vw,2.6rem)/1 var(--disp);
  font-stretch:125%;letter-spacing:.04em;color:var(--dim);overflow:hidden}
.boot-mark .sp{color:var(--tally)}
.boot-mark span{display:inline-block;transform:translateY(120%);opacity:0}
@media(prefers-reduced-motion:no-preference){
  .boot.go .boot-mark span{animation:markin .7s cubic-bezier(.2,.8,.2,1) forwards}
  .boot.go .boot-mark span:nth-child(2){animation-delay:.05s}
  .boot.go .boot-mark span:nth-child(3){animation-delay:.1s}
  .boot.go .boot-mark span:nth-child(4){animation-delay:.15s}
  .boot.go .boot-mark span:nth-child(5){animation-delay:.2s}
  .boot.go .boot-mark span:nth-child(6){animation-delay:.25s}
  .boot.go .boot-mark span:nth-child(7){animation-delay:.3s}
  .boot.go .boot-mark span:nth-child(8){animation-delay:.35s}
  .boot.go .boot-mark span:nth-child(9){animation-delay:.4s}
  .boot.go .boot-mark span:nth-child(10){animation-delay:.45s}
  @keyframes markin{to{transform:none;opacity:1}}
}
.boot-word{font:800 clamp(1.6rem,5.5vw,3.4rem)/1 var(--disp);font-stretch:125%;
  letter-spacing:.02em;text-transform:uppercase;color:var(--amber)}
.boot-num{font:400 .9rem/1 var(--mono);letter-spacing:.3em;color:var(--dim)}
.boot-live{font:700 .78rem/1 var(--mono);letter-spacing:.3em;text-transform:uppercase;
  color:var(--room);background:var(--tally);padding:.6rem 1rem;opacity:0;transform:scale(.9)}
.boot-live.stamp{opacity:1;transform:none;transition:opacity .2s,transform .25s cubic-bezier(.2,1.4,.3,1)}
.boot-skip{position:fixed;right:clamp(1rem,4vw,2.6rem);bottom:clamp(1rem,4vh,2.2rem);
  background:none;border:1px solid var(--ghost);color:var(--dim);cursor:pointer;
  font:400 .66rem/1 var(--mono);letter-spacing:.2em;text-transform:uppercase;
  padding:.7rem 1.1rem;transition:.15s}
.boot-skip:hover{color:var(--ink);border-color:var(--ink)}
.boot-note{position:fixed;left:clamp(1rem,4vw,2.6rem);bottom:clamp(1rem,4vh,2.2rem);
  font:400 .6rem/1 var(--mono);letter-spacing:.3em;text-transform:uppercase;color:var(--dim)}

/* ── top bar ───────────────────────────────────────────────────────────── */
.topbar{position:fixed;top:0;left:0;right:0;z-index:100;height:var(--bar);
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  padding:0 clamp(1rem,3vw,2rem);
  background:color-mix(in srgb,var(--room) 84%,transparent);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--ghost)}
.topbar-right{justify-self:end}
/* transmission progress hairline */
.progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:101;pointer-events:none}
.progress i{display:block;height:100%;width:0;background:var(--amber);
  box-shadow:0 0 8px rgba(255,176,32,.6)}
.brand{font:700 .78rem/1 var(--mono);letter-spacing:.3em;text-decoration:none}
.pages{display:flex;gap:1.4rem}
.pages a{font:400 .68rem/1 var(--mono);letter-spacing:.2em;text-transform:uppercase;
  color:var(--dim);text-decoration:none;transition:color .15s;position:relative;padding:.4rem 0}
.pages a:hover{color:var(--ink)}
.pages a[aria-current]{color:var(--amber)}
.pages a[aria-current]::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--tally)}
@media(max-width:640px){
  .topbar{grid-template-columns:1fr;justify-items:center;row-gap:.1rem;height:auto;
    padding-block:.55rem}
  .brand{font-size:.68rem}
}

/* ══ HOME — the long scroll ═════════════════════════════════════════════ */
main{padding-top:var(--bar)}
.hero{min-height:calc(100svh - var(--bar));position:relative;
  display:flex;flex-direction:column;justify-content:center;
  padding:clamp(2rem,6vh,4rem) var(--gut);overflow:clip}
.wordmark{margin:0;font:800 clamp(3.4rem,15.5vw,13.5rem)/0.86 var(--disp);
  font-stretch:125%;letter-spacing:-.015em;text-transform:uppercase;
  display:flex;flex-direction:column}
.wordmark .wl{display:block;width:fit-content}
.wordmark .stroke{color:transparent;-webkit-text-stroke:2.5px var(--ink)}
.standfirst{position:absolute;right:var(--gut);bottom:clamp(5rem,14vh,8.5rem);
  max-width:34ch;font-size:.98rem;color:var(--dim);text-align:right;margin:0}
.hero-cta{position:absolute;left:var(--gut);bottom:clamp(4.6rem,12vh,7.5rem);
  display:inline-flex;align-items:center;gap:.8rem;text-decoration:none;
  font:600 .82rem/1 var(--disp);letter-spacing:.04em;text-transform:uppercase;
  border:1px solid var(--ghost);padding:.85rem 1.2rem;transition:.18s}
.hero-cta:hover{background:var(--tally);border-color:var(--tally);color:var(--room)}
.cue{position:absolute;left:50%;bottom:1.1rem;transform:translateX(-50%);
  display:flex;align-items:center;gap:.7rem;
  font:400 .62rem/1 var(--mono);letter-spacing:.3em;text-transform:uppercase;color:var(--dim)}
.cue span{width:44px;height:1px;background:var(--dim);position:relative;overflow:hidden}
@media(prefers-reduced-motion:no-preference){
  .cue span::after{content:"";position:absolute;inset:0;background:var(--amber);
    animation:cue 1.8s cubic-bezier(.76,0,.24,1) infinite}
  @keyframes cue{0%{transform:translateX(-100%)}55%,100%{transform:translateX(100%)}}
}
@media(max-width:760px){
  .standfirst{position:static;text-align:left;margin-top:2rem;max-width:36ch}
  .hero-cta{position:static;margin-top:1.6rem;align-self:flex-start}
}

/* ══ scene system — alternation, thin hairline rules between scenes ══════
   hero dark → manifesto bone → wall dark → services bone → studio bone →
   contact dark. Each boundary carries a simple 1px line (the G rule). */
.mani-wrap{background:var(--bone);color:var(--ink-l)}
.mani-sticky .tag{color:var(--dim-l)}
.mani-wrap .mani .w.lit.hot{color:var(--amber-l)}

.cr{border-top:1px solid var(--hair-l)}

.svc{background:var(--bone);color:var(--ink-l);border-top:1px solid var(--hair-l)}
.svc .tag{color:var(--dim-l)}
.svc .sec-head h2::first-line{color:var(--amber-l)}
.svc .sv-cols article{border-top-color:var(--ink-l)}
.svc .sv-cols p{color:#544E40}
.svc .sv-cols li{color:var(--ink-l);border-bottom:1px solid var(--hair-l)}
.svc .sv-cols li:hover{color:var(--amber-l)}

.firm{background:var(--bone);color:var(--ink-l);border-top:1px solid var(--hair-l)}
.firm .tag{color:var(--dim-l)}
.firm .firm-prose p{color:#544E40}

.contact{border-top:1px solid var(--hair-l)}

/* section scaffolding */
.sec-head{display:grid;grid-template-columns:1fr auto;align-items:end;gap:1rem 2rem;
  padding:clamp(3rem,8vh,5.5rem) var(--gut) clamp(1.6rem,4vh,2.6rem)}
.sec-head h2{margin:.8rem 0 0;font:800 clamp(2.2rem,6.5vw,5.2rem)/0.92 var(--disp);
  font-stretch:125%;text-transform:uppercase;letter-spacing:-.015em}
.sec-head h2::first-line{color:var(--amber)}

/* manifesto — sticky, fills word by word */
.mani-wrap{min-height:190svh}
.mani-sticky{position:sticky;top:var(--bar);min-height:calc(100svh - var(--bar));
  display:flex;flex-direction:column;justify-content:center;gap:1.4rem;
  padding:clamp(2rem,6vh,4rem) var(--gut)}
.mani{margin:0;max-width:24ch;
  font:700 clamp(1.7rem,5vw,4.1rem)/1.16 var(--disp);font-stretch:112%;letter-spacing:-.015em}
.mani .w{opacity:.14;transition:opacity .2s}
.mani .w.lit{opacity:1}
.mani .w.lit.hot{color:var(--amber)}
@media(prefers-reduced-motion:reduce){.mani .w{opacity:1}.mani-wrap{min-height:0}}

/* ══ THE WALL — embedded in the home scroll ═════════════════════════════ */
.cr{padding-bottom:clamp(2.5rem,6vh,4.5rem)}
.cr-sub{grid-column:1/-1;margin:.8rem 0 0;color:var(--dim);max-width:52ch;font-size:.95rem}
.cr-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,330px);
  gap:clamp(.55rem,1.3vw,.95rem);padding:0 var(--gut)}
.program{display:flex;flex-direction:column;min-height:0;gap:clamp(.4rem,.9vw,.6rem)}
.mon{position:relative;aspect-ratio:16/9;background:#000;
  border:1px solid var(--bezel-2);
  box-shadow:inset 0 0 0 6px var(--bezel),0 24px 60px rgba(0,0,0,.5);overflow:hidden}
.tally{position:absolute;top:12px;left:14px;z-index:6;width:10px;height:10px;border-radius:50%;
  background:var(--tally);box-shadow:0 0 10px var(--tally)}
@media(prefers-reduced-motion:no-preference){
  .tally{animation:tl 2.2s ease-in-out infinite}
  @keyframes tl{50%{opacity:.35}}
}
.pn{position:absolute;top:50%;transform:translateY(-50%);z-index:7;
  width:38px;height:56px;background:rgba(0,0,0,.45);border:1px solid var(--ghost);
  color:var(--ink);font:700 1.5rem/1 var(--disp);cursor:pointer;transition:.15s}
.pn:hover{background:var(--amber);color:var(--room);border-color:var(--amber)}
.pn.prev{left:10px}
.pn.next{right:10px}
.feed{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#000}
.feed img{width:100%;height:100%;object-fit:contain;object-position:center}
@media(prefers-reduced-motion:no-preference){
  .feed.on img{animation:kb 16s ease-in-out infinite alternate}
  @keyframes kb{from{transform:scale(1)}to{transform:scale(1.045)}}
}
.feed{opacity:0;transition:opacity .12s}
.feed.on{opacity:1}
@media(prefers-reduced-motion:no-preference){
  .feed.on{animation:cutin .26s steps(4)}
  @keyframes cutin{
    0%{opacity:0;filter:brightness(2.6) saturate(0);transform:translateX(-4px)}
    40%{opacity:.85;transform:translateX(2px)}
    70%{opacity:.6;transform:none}
    100%{opacity:1;filter:none}
  }
  .sweep{position:absolute;inset:0;z-index:8;pointer-events:none;opacity:0;
    background:linear-gradient(to bottom,transparent 0%,rgba(255,176,32,.16) 48%,rgba(255,255,255,.28) 50%,rgba(255,176,32,.16) 52%,transparent 100%)}
  .sweep.go{animation:sw .38s ease-out}
  @keyframes sw{0%{opacity:1;transform:translateY(-100%)}100%{opacity:0;transform:translateY(100%)}}
}
@media(prefers-reduced-motion:reduce){.sweep{display:none}}
.mon-osd{position:absolute;left:14px;bottom:12px;z-index:6;
  font:700 .68rem/1 var(--mono);letter-spacing:.18em;color:#fff;
  background:rgba(0,0,0,.55);border:1px solid var(--ghost);padding:.45rem .6rem}
.mon-osd.flash{color:var(--amber)}
.mon-osd b{color:var(--tally)}

/* underbar */
.underbar{flex:none;background:var(--room-2);border:1px solid var(--ghost);
  min-height:52px;display:flex;align-items:stretch;overflow:hidden}
.ub-in{display:none;align-items:center;gap:1rem;padding:.65rem .95rem;width:100%}
.ub-in.on{display:flex;animation:ubin .35s ease}
@keyframes ubin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.ub-in b{font:800 .92rem/1 var(--disp);font-stretch:118%;text-transform:uppercase;white-space:nowrap}
.ub-in span:not(.off):not(.tags){color:var(--dim);font-size:.84rem;flex:1;min-width:0}
.ub-in .tags{font:400 .62rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;
  color:var(--dim);white-space:nowrap}
.ub-in a,.ub-in .off{font:700 .66rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;
  text-decoration:none;border-bottom:2px solid var(--tally);padding-bottom:.25rem;white-space:nowrap}
.ub-in a:hover{color:var(--tally)}
.ub-in .off{border-bottom-style:dotted;border-bottom-color:var(--dim);color:var(--dim)}
@media(max-width:1080px){.ub-in .tags{display:none}}
@media(max-width:760px){.ub-in span:not(.off):not(.tags){display:none}}

/* reel */
.reel{flex:none;display:flex;align-items:center;gap:.55rem;
  background:var(--room-2);border:1px solid var(--ghost);padding:.42rem .55rem .68rem}
.reel-k{font:700 .56rem/1 var(--mono);letter-spacing:.26em;color:var(--amber);
  writing-mode:vertical-rl;transform:rotate(180deg);align-self:stretch;display:grid;place-items:center}
.reel-track{position:relative;flex:1;display:grid;grid-template-columns:repeat(5,1fr);gap:4px}
.rclip{position:relative;height:44px;border:1px solid var(--ghost);background:#000;
  cursor:pointer;overflow:hidden;padding:0;text-align:left;transition:border-color .15s,transform .15s}
.rclip img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  object-position:top center;opacity:.8;transition:opacity .15s}
.rclip b{position:absolute;left:5px;bottom:4px;right:3px;z-index:2;
  font:400 .5rem/1.1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#fff;
  text-shadow:0 1px 3px rgba(0,0,0,.9);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rclip::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--c);z-index:2}
.rclip:hover{border-color:var(--amber);transform:translateY(-2px)}
.rclip:hover img{opacity:1}
.rclip.on{border-color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}
.rhead{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--tally);
  cursor:ew-resize;touch-action:none;z-index:3}
.rhead::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
  border:6px solid transparent;border-top:8px solid var(--tally)}
.rgrip{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:14px;height:22px;background:var(--tally);border-radius:2px;
  box-shadow:0 2px 5px rgba(0,0,0,.4)}

/* wall — right column of the embedded room */
.wall{grid-column:2;display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(.42rem,.85vw,.65rem);align-content:start;min-height:0;padding:2px}
.monwall{position:relative;background:#000;border:1px solid var(--bezel-2);
  box-shadow:inset 0 0 0 3px var(--bezel);padding:0;cursor:pointer;
  aspect-ratio:16/10;overflow:hidden;transition:border-color .15s,transform .15s;text-align:left}
.monwall img{width:100%;height:100%;object-fit:cover;object-position:top center;
  opacity:.78;transition:opacity .2s}
@media(prefers-reduced-motion:no-preference){
  .monwall::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.5;
    background:repeating-linear-gradient(0deg,rgba(255,255,255,.03) 0 1px,transparent 1px 3px);
    animation:noise 1.2s steps(3) infinite}
  @keyframes noise{0%{background-position:0 0}50%{background-position:0 2px}100%{background-position:0 1px}}
}
.monwall i{position:absolute;top:6px;left:8px;font:700 .6rem/1 var(--mono);
  font-style:normal;color:var(--amber);z-index:2}
.monwall b{position:absolute;left:8px;bottom:6px;right:8px;z-index:2;
  font:700 .56rem/1.2 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#fff;
  text-shadow:0 1px 4px #000;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.monwall:hover img{opacity:1}
.monwall:hover{border-color:var(--amber);transform:translateY(-2px)}
.monwall.on{border-color:var(--tally)}
.monwall.on::after{content:"";position:absolute;top:6px;right:7px;width:8px;height:8px;border-radius:50%;
  background:var(--tally);box-shadow:0 0 8px var(--tally);z-index:2}
.wall-note{grid-column:1/-1;margin:.4rem 0 .2rem;font:400 .58rem/1.6 var(--mono);
  letter-spacing:.18em;text-transform:uppercase;color:var(--dim);text-align:center}

/* embedded wall: narrow screens stack */
@media(max-width:900px){
  .cr-body{grid-template-columns:minmax(0,1fr)}
  .program{min-width:0}
  .underbar,.reel{min-width:0}
  .wall{grid-template-columns:repeat(3,1fr)}
  .pn{display:none}
}
@media(max-width:560px){.wall{grid-template-columns:repeat(2,1fr)}.rclip b{display:none}}

/* no-JS: channels stack as a log inside the section */
html.nojs .feed{position:static;opacity:1;aspect-ratio:16/10}
html.nojs .ub-in{display:flex}

/* services — three clear top-ruled columns */
.sv-cols{display:grid;grid-template-columns:1.35fr 1fr 1fr;
  gap:clamp(1.2rem,3vw,2.4rem);padding:0 var(--gut) clamp(3rem,8vh,5.5rem)}
.sv-cols article{border-top:2px solid var(--ink);padding-top:1.1rem;
  transition:border-top-color .2s}
.sv-n{font:400 .74rem/1 var(--mono);color:var(--tally)}
.sv-cols h3{margin:.5rem 0 .6rem;font:800 clamp(1.6rem,3.4vw,2.6rem)/1 var(--disp);
  font-stretch:120%;text-transform:uppercase;letter-spacing:-.01em}
.sv-cols .sv-lead h3{font-size:clamp(1.9rem,4vw,3.1rem)}
.sv-cols p{margin:0 0 1.15rem;color:var(--dim);font-size:.94rem;max-width:46ch}
.sv-cols ul{list-style:none;margin:0;padding:0}
.sv-cols li{font:400 .76rem/1 var(--mono);letter-spacing:.04em;padding:.68rem 0;
  border-bottom:1px solid var(--ghost);transition:color .15s,padding-left .2s}
.svc .sv-cols li:hover{color:var(--amber-l);padding-left:.45rem}
/* hovering any deliverable — or the column head — lights the column's rule */
.sv-cols article:has(ul li:hover, h3:hover){border-top-color:var(--amber)}
@media(max-width:900px){.sv-cols{grid-template-columns:1fr}}

/* studio prose */
.firm{padding-bottom:clamp(3rem,8vh,5.5rem)}
.firm-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);
  gap:clamp(2rem,5vw,4.5rem);padding:0 var(--gut)}
.firm-rail{display:flex;flex-direction:column;gap:.9rem;align-self:start}
.firm-rail h2{margin:0;font:800 clamp(2.2rem,6vw,4.6rem)/0.92 var(--disp);
  font-stretch:125%;text-transform:uppercase;letter-spacing:-.015em}
.firm-prose{display:flex;flex-direction:column;gap:1.6rem;justify-content:center}
.firm-prose p{margin:0;font-size:clamp(1rem,1.5vw,1.2rem);line-height:1.7;color:var(--dim);max-width:58ch}
.firm-prose .hl{background:var(--tally);color:var(--room);padding:0 .3em;font-weight:700}
@media(max-width:860px){.firm-grid{grid-template-columns:1fr}.firm-rail{position:static}}

/* contact finale */
.contact{padding:clamp(4rem,10vh,7rem) var(--gut) clamp(2rem,5vh,3rem);
  display:flex;flex-direction:column;align-items:flex-start;gap:1.2rem}
.ct-big{margin:.4rem 0 1rem;font:800 clamp(2rem,10.6vw,10rem)/0.88 var(--disp);
  font-stretch:125%;text-transform:uppercase;letter-spacing:-.02em}
.ct-big::first-line{color:var(--tally)}
.ct-mail{font:800 clamp(1.2rem,4.2vw,3.2rem)/1.05 var(--disp);font-stretch:112%;
  text-transform:uppercase;text-decoration:none;
  border-bottom:.09em solid var(--tally);padding-bottom:.08em;overflow-wrap:anywhere;transition:color .2s}
.ct-mail:hover{color:var(--tally)}
.ct-sub{margin:0;color:var(--dim);max-width:46ch;font-size:.95rem}

/* footer (layout-level, all pages) */
.foot{width:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:baseline;
  gap:.8rem 2.2rem;
  border-top:1px solid var(--ghost);
  padding:1.3rem var(--gut) 2rem;
  font:400 .68rem/1 var(--mono);letter-spacing:.08em;color:var(--dim)}
.foot > .f-links{grid-column:2;justify-self:center}
.foot > .f-brand-cell{grid-column:1;justify-self:start;color:var(--ink)}
.foot > .f-copy-cell{grid-column:3;justify-self:end}
.f-links{display:flex;gap:1.5rem}
.foot a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--ghost)}
.foot a:hover{color:var(--amber);border-bottom-color:var(--amber)}
@media(max-width:560px){
  .foot{grid-template-columns:1fr;justify-items:center;row-gap:.7rem;text-align:center}
  .foot > .f-links{grid-column:1}
  .foot > .f-brand-cell,.foot > .f-copy-cell{grid-column:1;justify-self:center}
}

/* home reveals */
@media(prefers-reduced-motion:no-preference){
  html:not(.nojs) .rv{opacity:0;transform:translateY(20px);
    transition:opacity .6s ease,transform .6s cubic-bezier(.2,.8,.2,1)}
  html:not(.nojs) .rv.in{opacity:1;transform:none}
  html:not(.nojs) .wordmark .wl{opacity:0;transform:translateY(30%)}
  html:not(.nojs) .go .wordmark .wl{animation:wlup 1s cubic-bezier(.2,.8,.2,1) forwards}
  html:not(.nojs) .go .wordmark .wl:nth-child(2){animation-delay:.1s}
  html:not(.nojs) .go .wordmark .wl:nth-child(3){animation-delay:.2s}
  @keyframes wlup{to{opacity:1;transform:none}}
}

/* ══ legal pages (.doc) — bone ground, broadcast trim ═══════════════════ */
.doc{background:var(--bone);color:var(--ink-l);
  min-height:calc(100svh - var(--bar));
  padding:clamp(3rem,7vh,5rem) 0 clamp(4rem,8vh,6rem)}
.doc .wrap{max-width:880px;margin-inline:auto;padding-inline:var(--gut)}
.doc .eyebrow{font:400 .68rem/1.4 var(--mono);letter-spacing:.26em;text-transform:uppercase;
  color:var(--amber-l);margin:0 0 .8rem}
.doc h1{margin:0 0 1.6rem;font:800 clamp(2.4rem,6vw,4.2rem)/0.95 var(--disp);
  font-stretch:125%;text-transform:uppercase;letter-spacing:-.02em}
.doc h2{font:800 clamp(1.15rem,2vw,1.5rem)/1.2 var(--disp);font-stretch:118%;
  text-transform:uppercase;letter-spacing:-.01em;margin:2.4rem 0 .7rem}
.doc-body{max-width:70ch}
.doc p{margin:0 0 1rem;color:#443F33;font-size:.98rem;line-height:1.7}
.doc p.lead{font-size:clamp(1.05rem,1.6vw,1.25rem);color:var(--ink-l);max-width:58ch;margin-bottom:2.2rem}
.doc strong{color:var(--ink-l)}
.doc a{color:var(--ink-l);text-decoration:none;border-bottom:2px solid var(--amber-l);padding-bottom:.1rem}
.doc a:hover{color:var(--amber-l)}
.doc ul{padding-left:1.2rem;margin:0 0 1rem}
.doc li{margin-bottom:.5rem;color:#443F33;font-size:.98rem;line-height:1.6}
.doc .stamp{font:400 .72rem/1.6 var(--mono);letter-spacing:.08em;color:var(--dim-l);
  margin-top:2.6rem;padding-top:1.2rem;border-top:1px solid var(--hair-l)}

@media print{
  .topbar,.reel,.boot,.skip,.cue,.progress,body::after{display:none!important}
  body{overflow:visible;background:#fff;color:#000}
  main{padding-top:0}
  .doc{background:#fff}
}