/* Unparroted: house styles. Tokens first, then base, layout, components, sections, pages, motion states. */

@font-face{font-family:"Inter Tight";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/inter-tight-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Inter Tight";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/inter-tight-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Inter Tight";font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/inter-tight-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Inter Tight";font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/inter-tight-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/ibm-plex-mono-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/ibm-plex-mono-latin-500-normal.woff2) format("woff2")}

/* metric matched fallbacks so the swap to web fonts barely moves the layout */
@font-face{font-family:"Inter Tight Fallback";src:local("Arial"),local("Helvetica Neue"),local("Roboto");size-adjust:97%;ascent-override:99%;descent-override:25%;line-gap-override:0%}
@font-face{font-family:"Plex Mono Fallback";src:local("Menlo"),local("Courier New"),local("Roboto Mono");size-adjust:100%;ascent-override:102.5%;descent-override:27.5%;line-gap-override:0%}

:root{
  --black:#0A0A0B;
  --graphite:#131315;
  --carbon:#1C1C1F;
  --line:rgba(255,255,255,.10);
  --steel:#6E6E73;
  --silver:#AEAEB2;
  --fog:#E5E5EA;
  --paper:#F5F5F7;
  --white:#FFFFFF;
  --ink:#0A0A0B;
  --sig:#FFD60A;
  --go:#30D158; --info:#0A84FF; --risk:#FF453A;
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-io:cubic-bezier(.87,0,.13,1);

  /* theme roles (dark default) */
  --bg:var(--black);
  --fg:var(--white);
  --fg-2:var(--silver);
  --fg-3:var(--silver);
  --rule:var(--line);
  --panel:var(--graphite);
  --panel-2:var(--carbon);

  --sans:"Inter Tight","Inter Tight Fallback",system-ui,sans-serif;
  --mono:"IBM Plex Mono","Plex Mono Fallback",ui-monospace,monospace;
  --gutter:clamp(20px,5vw,64px);
  --max:1320px;
  --sec:clamp(96px,11.2vw,160px);
  --nav-h:64px;

  --fs-display:clamp(48px,9vw,152px);
  --fs-h1:clamp(40px,6vw,96px);
  --fs-h2:clamp(32px,4.4vw,68px);
  --fs-h3:clamp(22px,2vw,30px);
  --fs-lead:clamp(19px,1.6vw,24px);
}
.light{
  --bg:var(--paper);
  --fg:var(--ink);
  --fg-2:var(--ink);
  --fg-3:var(--steel);
  --rule:var(--fog);
  --panel:var(--white);
  --panel-2:var(--fog);
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--nav-h) + 16px)}
body{margin:0;background:var(--black);color:var(--white);font-family:var(--sans);font-size:17px;line-height:1.55;font-weight:400;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip}
@media (min-width:1024px){body{font-size:18px}:root{--nav-h:76px}}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
p{margin:0 0 1em;text-wrap:pretty}
p:last-child{margin-bottom:0}
h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:-.035em;line-height:1.04;text-wrap:balance;overflow-wrap:normal;hyphens:manual}
ul,ol{margin:0;padding:0;list-style:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
::selection{background:var(--sig);color:var(--ink)}
:focus-visible{outline:2px solid var(--sig);outline-offset:3px}
:focus:not(:focus-visible){outline:none}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:fixed;left:16px;top:-80px;z-index:100;background:var(--white);color:var(--ink);padding:12px 18px;border-radius:999px;font-family:var(--mono);font-size:13px;text-transform:uppercase;letter-spacing:.12em}
.skip:focus{top:16px}

/* ---------- type ---------- */
.display,.h1,.h2,.h3{font-weight:600;letter-spacing:-.035em;text-wrap:balance}
.display{font-size:var(--fs-display);line-height:.98;letter-spacing:-.045em}
.h1{font-size:var(--fs-h1);line-height:1.0}
.h2{font-size:var(--fs-h2);line-height:1.04}
.h3{font-size:var(--fs-h3);line-height:1.12;letter-spacing:-.025em}
.lead{font-size:var(--fs-lead);line-height:1.45;color:var(--fg-2);max-width:34em}
.body{max-width:68ch;color:var(--fg-2)}
.body p{max-width:68ch}
.small{font-size:15px}
.mono{font-family:var(--mono);font-size:12px;font-weight:400;letter-spacing:.14em;text-transform:uppercase;line-height:1.5}
@media (min-width:1024px){.mono{font-size:13px}}
.num{font-weight:700;font-variant-numeric:tabular-nums}
.muted{color:var(--fg-2)}
.em{color:var(--sig)}
.light .em,.mark{color:inherit;background:linear-gradient(transparent 62%,var(--sig) 62%,var(--sig) 92%,transparent 92%);padding:0 .06em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.stop{display:inline-block;width:.18em;height:.18em;background:var(--sig);margin-left:.04em;vertical-align:baseline;overflow:hidden;color:transparent;line-height:1;transform-origin:50% 100%}
.tagline-mono{font-family:var(--sans);font-weight:500;text-transform:uppercase;letter-spacing:.32em;font-size:12px;color:var(--fg-2)}
@media (min-width:1024px){.tagline-mono{font-size:13px}}

/* ---------- layout ---------- */
.wrap{width:100%;max-width:calc(var(--max) + 2 * var(--gutter));margin-inline:auto;padding-inline:max(var(--gutter),env(safe-area-inset-left)) max(var(--gutter),env(safe-area-inset-right))}
.section{position:relative;padding-block:var(--sec);background:var(--bg);color:var(--fg);border-top:1px solid var(--rule)}
.section.light{border-top-color:var(--fog)}
.section--tight{padding-block:clamp(72px,9vw,128px)}
.g12{display:grid;grid-template-columns:minmax(0,1fr);gap:40px 24px}
@media (min-width:1024px){.g12{grid-template-columns:repeat(12,minmax(0,1fr))}}
.stack>*+*{margin-top:24px}

/* background grid: hero and method only */
.bg-grid{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:96px 96px;background-position:center top;-webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,#000 0%,transparent 75%);mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,#000 0%,transparent 75%);opacity:.6}

/* ---------- section label ---------- */
.label{display:flex;align-items:center;gap:12px;font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-2);margin:0 0 clamp(28px,4vw,48px)}
@media (min-width:1024px){.label{font-size:13px}}
.label::before{content:"";flex:none;width:6px;height:6px;background:var(--sig)}
.label .rule{flex:1;height:1px;background:var(--rule);transform-origin:0 50%}
.label b{font-weight:500;color:var(--fg)}
h2.label{font-weight:400;line-height:1.5;letter-spacing:.16em}

.head{max-width:none}
.head .h2+.lead,.head .h1+.lead{margin-top:clamp(20px,2.4vw,32px)}
@media (min-width:1024px){.head>.h2,.head>.h1,.head>.lead{max-width:calc(8/12*100%)}}

/* ---------- buttons, chips, links ---------- */
.btns{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 22px;border-radius:999px;font-family:var(--sans);font-weight:500;font-size:16px;letter-spacing:-.01em;line-height:1;white-space:nowrap;transition:background-color .25s,color .25s,border-color .25s}
.btn--primary{background:var(--white);color:var(--ink)}
.btn--primary:hover{background:var(--fog)}
.btn--ghost{box-shadow:inset 0 0 0 1px rgba(255,255,255,.55);color:var(--white)}
.btn--ghost:hover{box-shadow:inset 0 0 0 1px var(--white);background:rgba(255,255,255,.06)}
.light .btn--primary{background:var(--ink);color:var(--white)}
.light .btn--ghost{box-shadow:inset 0 0 0 1px rgba(10,10,11,.5);color:var(--ink)}
.arr{display:inline-block;transition:transform .25s var(--ease-out)}
a:hover .arr,button:hover .arr,a:focus-visible .arr{transform:translateX(4px)}
.link{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--fg);border-bottom:1px solid transparent}
@media (min-width:1024px){.link{font-size:13px}}
.link span:first-child{border-bottom:1px solid var(--rule);padding-bottom:2px;transition:border-color .25s}
.link:hover span:first-child{border-color:currentColor}

.chip{display:inline-flex;align-items:center;gap:8px;min-height:30px;padding:0 13px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--rule);font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-2);line-height:1;white-space:nowrap}
.chip .dot{width:6px;height:6px;border-radius:50%;background:var(--dot,var(--steel));flex:none}
.chip--sig{--dot:var(--sig)}
.chips{display:flex;flex-wrap:wrap;gap:8px}

/* ---------- source line ---------- */
.source{font-family:var(--mono);font-size:12px;letter-spacing:.04em;color:var(--fg-3);margin-top:16px}
.source b{font-weight:500;color:var(--fg)}

/* ---------- evidence frame ---------- */
.frame{position:relative;margin:0;--b:16px;--bw:1.5px;--bc:var(--white);--o:-8px}
.light .frame{--bc:var(--ink)}
.frame__label{display:flex;justify-content:space-between;gap:16px;font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-2);margin:0 0 14px;line-height:1.4}
.frame__box{position:relative;background:var(--panel)}
.frame__media{position:relative;overflow:hidden;aspect-ratio:var(--ar,16/9);background:var(--graphite)}
.frame__media img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05) brightness(.92);transition:filter .8s var(--ease-out)}
.frame:hover .frame__media img,.frame.is-centred .frame__media img,a:focus-visible .frame__media img{filter:none}
.c{position:absolute;width:var(--b);height:var(--b);border:0 solid var(--bc);pointer-events:none;transition:transform .25s var(--ease-out)}
.c.tl{top:var(--o);left:var(--o);border-top-width:var(--bw);border-left-width:var(--bw)}
.c.tr{top:var(--o);right:var(--o);border-top-width:var(--bw);border-right-width:var(--bw)}
.c.bl{bottom:var(--o);left:var(--o);border-bottom-width:var(--bw);border-left-width:var(--bw)}
.c.br{bottom:var(--o);right:var(--o);border-bottom-width:var(--bw);border-right-width:var(--bw)}
.scan{position:absolute;left:0;right:0;top:0;height:2px;background:var(--sig);opacity:0;pointer-events:none;z-index:2}
.ph{position:absolute;inset:0;display:grid;place-items:center;background:var(--graphite);font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--silver)}
.light .ph{background:var(--fog);color:var(--ink)}
.frame figcaption{margin-top:14px}

/* ---------- nav ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;height:calc(var(--nav-h) + env(safe-area-inset-top));padding-top:env(safe-area-inset-top);transition:background-color .35s,border-color .35s,-webkit-backdrop-filter .35s,backdrop-filter .35s;border-bottom:1px solid transparent}
.nav.is-solid{background:rgba(10,10,11,.8);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom-color:var(--line)}
.nav__in{height:100%;display:flex;align-items:center;justify-content:space-between;gap:24px}
.nav__logo{display:flex;align-items:center;min-height:44px}
.nav__logo img{height:22px;width:auto}
.nav__links{display:none;align-items:center;gap:clamp(20px,2.6vw,40px)}
.nav__links a{position:relative;display:inline-flex;align-items:center;gap:10px;min-height:44px;font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--silver);transition:color .25s}
.nav__links a:hover,.nav__links a[aria-current]{color:var(--white)}
.nav__links a[aria-current]::before{content:"";width:6px;height:6px;background:var(--sig)}
.nav__links .nav__yt{padding:0 16px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);color:var(--white)}
.nav__links .nav__yt:hover{box-shadow:inset 0 0 0 1px rgba(255,255,255,.5)}
.nav__menu{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 4px;font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.nav__menu i{position:relative;width:18px;height:8px;border-top:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transition:transform .3s var(--ease-out)}
@media (min-width:900px){.nav__links{display:flex}.nav__menu{display:none}}
@media (min-width:1024px){.nav__links a{font-size:13px}}

.sheet{position:fixed;inset:0;z-index:49;background:var(--black);padding:calc(var(--nav-h) + env(safe-area-inset-top) + 24px) 0 calc(32px + env(safe-area-inset-bottom));display:flex;flex-direction:column;visibility:hidden;opacity:0;transition:opacity .25s,visibility 0s .25s}
.sheet.is-open{visibility:visible;opacity:1;transition:opacity .3s}
.sheet .wrap{display:flex;flex-direction:column;height:100%}
.sheet__links a{display:flex;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid var(--line);font-size:clamp(36px,10vw,56px);font-weight:600;letter-spacing:-.035em;line-height:1.05}
.sheet__links a[aria-current]::after{content:"";width:.18em;height:.18em;background:var(--sig)}
.sheet__foot{margin-top:auto;padding-top:32px;display:flex;flex-direction:column;gap:6px}
.sheet__foot a{display:inline-flex;align-items:center;min-height:44px}
html.menu-open{overflow:hidden}
html.menu-open .nav{background:transparent;border-bottom-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
html.menu-open .nav__menu i{transform:scaleX(.7)}

/* ---------- footer ---------- */
.foot{background:var(--black);border-top:1px solid var(--line);padding:clamp(72px,9vw,128px) 0 calc(40px + env(safe-area-inset-bottom));color:var(--silver)}
.foot__top{display:grid;gap:40px;grid-template-columns:minmax(0,1fr)}
.foot__logo img{width:min(260px,70vw);height:auto}
.foot__desc{margin-top:24px;max-width:28em;font-size:15px}
.foot__cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px}
.foot__cols h2{font-family:var(--mono);font-weight:400;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--silver);margin-bottom:12px;line-height:1.5}
.foot__cols a,.foot__cols .mail{display:inline-flex;align-items:center;min-height:40px;font-size:15px;color:var(--white);transition:color .25s;overflow-wrap:anywhere}
.foot__cols a:hover{color:var(--silver)}
.foot__bottom{margin-top:clamp(56px,7vw,96px);padding-top:24px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;color:var(--silver)}
@media (min-width:768px){.foot__top{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}.foot__cols{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---------- hero ---------- */
.hero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;background:var(--black);padding-top:calc(var(--nav-h) + 48px)}
.hero__gfx{position:absolute;inset:0;opacity:.35;-webkit-mask-image:radial-gradient(ellipse 85% 75% at 50% 42%,#000 30%,transparent 85%);mask-image:radial-gradient(ellipse 85% 75% at 50% 42%,#000 30%,transparent 85%);pointer-events:none}
.hero__gfx svg{width:100%;height:100%}
.hero__gfx path,.hero__gfx line{fill:none;stroke:#fff;stroke-width:1;vector-effect:non-scaling-stroke}
.hero__gfx .pk{fill:#fff;stroke:none}
.hero__gfx .pk--sig{fill:var(--sig)}
.hero__shade{position:absolute;inset:auto 0 0 0;height:55%;background:linear-gradient(to top,var(--black) 10%,transparent);pointer-events:none}
.hero__in{position:relative;padding-bottom:clamp(40px,6vw,72px)}
.hero__kicker{color:var(--silver);margin-bottom:clamp(20px,3vw,32px)}
.hero h1{max-width:12.5em}
.hero h1 .s{display:block}
.hero__sub{margin-top:clamp(24px,3vw,40px);max-width:32em}
.hero__tag{margin-top:20px}
.hero .btns{margin-top:clamp(28px,3.4vw,44px)}
.strip{position:relative;border-top:1px solid var(--line);padding-block:16px calc(16px + env(safe-area-inset-bottom))}
.strip .wrap{display:flex;flex-wrap:wrap;gap:6px 18px;color:var(--silver)}
.strip .sep{color:var(--silver)}
.strip b{font-weight:500;color:var(--white)}

/* ---------- statement ---------- */
.statement{padding-block:var(--sec) 0;text-align:center}
.statement__lines p{font-size:clamp(26px,3.6vw,54px);font-weight:500;line-height:1.18;letter-spacing:-.028em;max-width:21em;margin:0 auto;text-wrap:balance}
.statement__lines p{position:relative}
.statement__lines .veil{position:absolute;inset:-.1em -.2em;background:var(--black);pointer-events:none}
.statement__lines p+p{margin-top:clamp(28px,4vw,56px)}
.closing{min-height:100svh;display:grid;place-items:center;text-align:center;padding-block:96px}
.closing p{font-size:var(--fs-display);font-weight:600;letter-spacing:-.045em;line-height:1;text-wrap:balance;margin:0}

/* ---------- focus / venn ---------- */
.focus__grid{margin-top:clamp(48px,6vw,88px);display:grid;gap:48px 24px;grid-template-columns:minmax(0,1fr)}
.venn{position:relative;max-width:560px;width:100%;margin-inline:auto}
.venn svg{width:100%;height:auto;overflow:visible}
.venn circle{fill:rgba(255,255,255,0);stroke:rgba(255,255,255,.7);stroke-width:1.25;vector-effect:non-scaling-stroke;transition:fill .3s,stroke .3s,opacity .3s}
.vl{position:absolute;transform:translate(-50%,-50%);font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--silver);transition:color .3s,opacity .3s;white-space:nowrap}
@media (min-width:1024px){.vl{font-size:13px}}
.venn.has-active circle{opacity:.28}
.venn.has-active .vl{opacity:.7}
.venn circle.on{opacity:1;fill:rgba(255,255,255,.06);stroke:#fff}
.vl.on{opacity:1;color:var(--white)}
.circles{display:grid;gap:0;margin-top:32px;border-top:1px solid var(--line)}
.circles li{display:grid;grid-template-columns:88px minmax(0,1fr);gap:16px;padding:16px 0;border-bottom:1px solid var(--line);color:var(--silver);transition:opacity .3s}
.circles li b{font-family:var(--mono);font-weight:400;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--white);padding-top:3px}
.has-active~.circles li:not(.on){opacity:.7}
.topics{display:flex;flex-wrap:wrap;gap:10px}
.topic{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 18px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--silver);transition:color .25s,box-shadow .25s,background-color .25s}
.topic .dot{width:6px;height:6px;border-radius:50%;background:var(--steel);transition:background-color .25s}
.topic:hover,.topic:focus-visible,.topic[aria-pressed="true"]{color:var(--white);box-shadow:inset 0 0 0 1px rgba(255,255,255,.55);background:rgba(255,255,255,.04)}
.topic.is-hot .dot{background:var(--sig)}
.topics-cap{margin-top:20px;color:var(--silver)}
.focus__hint{margin-top:28px;color:var(--fg-2)}
@media (min-width:1024px){.focus__grid{grid-template-columns:repeat(12,minmax(0,1fr));align-items:start}.focus__venn{grid-column:1/7}.focus__side{grid-column:8/13;padding-top:24px}}

/* ---------- method ---------- */
.method{overflow:clip}
.method .bg-grid{-webkit-mask-image:radial-gradient(ellipse 60% 50% at 70% 55%,#000 0%,transparent 75%);mask-image:radial-gradient(ellipse 60% 50% at 70% 55%,#000 0%,transparent 75%)}
.m-body{position:relative;margin-top:clamp(56px,7vw,96px)}
.m-index{display:none}
.step+.step{margin-top:clamp(72px,10vw,120px)}
.step__k{display:flex;gap:12px;align-items:center;color:var(--fg-2);margin-bottom:18px}
.step__k .num{font-family:var(--mono);font-weight:500;color:var(--fg)}
.step__text h3{margin-bottom:18px}
.step__text p{color:var(--fg-2);max-width:60ch}
.step__fig{margin-top:40px}
.m-close{margin-top:clamp(72px,9vw,120px);padding-top:28px;border-top:1px solid var(--line);font-size:var(--fs-h3);font-weight:500;letter-spacing:-.02em;line-height:1.25;color:var(--white);max-width:30em}
@media (min-width:768px) and (max-width:1023px){.step{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center}.step__fig{margin-top:0}}
@media (min-width:1024px){
  .step{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;align-items:center}
  .step__text{grid-column:1/6}
  .step__fig{grid-column:7/13;margin-top:0}
  /* pinned layout, toggled by JS */
  .m-body.is-pin{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:auto 1fr;column-gap:24px;min-height:min(620px,calc(100svh - var(--nav-h) - 80px))}
  .is-pin .m-index{display:block;grid-column:1/6;grid-row:1;position:relative;padding-left:22px;margin-bottom:40px}
  .is-pin .m-index li{font-family:var(--mono);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--silver);padding:6px 0;transition:color .3s}
  .is-pin .m-index li.on{color:var(--white);font-weight:500}
  .is-pin .m-track{position:absolute;left:0;top:6px;bottom:6px;width:1px;background:var(--line)}
  .is-pin .m-fill{position:absolute;inset:0;background:var(--sig);transform-origin:50% 0;transform:scaleY(0)}
  .is-pin .step{display:contents}
  .is-pin .step+.step{margin-top:0}
  .is-pin .step__text{grid-column:1/6;grid-row:2;align-self:start}
  .is-pin .step__fig{grid-column:7/13;grid-row:1/3;align-self:center}
}

/* method artefacts */
.art{position:relative;background:var(--graphite);padding:clamp(18px,2.4vw,28px);font-size:14px}
.art--paper{background:var(--carbon)}
.art table{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:12px;letter-spacing:.04em}
.art th{font-weight:400;text-align:left;color:var(--silver);text-transform:uppercase;letter-spacing:.14em;font-size:12px;padding:0 8px 10px 0;border-bottom:1px solid var(--line)}
.art td{padding:10px 8px 10px 0;border-bottom:1px solid var(--line);color:var(--silver);white-space:nowrap}
.art td .dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:8px;vertical-align:middle}
.d-go{background:var(--go)}.d-risk{background:var(--risk)}.d-steel{background:var(--steel)}.d-info{background:var(--info)}
.bar{display:flex;height:10px;margin-top:22px;gap:2px}
.bar i{display:block;height:100%;transform-origin:0 50%}
.legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:12px;font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--silver)}
.legend span{display:inline-flex;align-items:center;gap:8px}
.legend .dot{width:6px;height:6px;border-radius:50%}
.note{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:start}
.note__lines{font-family:var(--mono);font-size:13px;line-height:2.1;color:var(--silver);background-image:linear-gradient(transparent calc(2.1em - 1px),rgba(255,255,255,.08) calc(2.1em - 1px));background-size:100% 2.1em;padding-top:2px}
.note__lines p{margin:0}
.note__lines .strike{text-decoration:line-through}
.note__pin svg{width:clamp(88px,12vw,140px);height:auto}
.note__pin path,.note__pin line,.note__pin circle{fill:none;stroke:rgba(255,255,255,.6);stroke-width:1.2;vector-effect:non-scaling-stroke}
.note__pin .pin{fill:var(--white);stroke:none}
.board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.board figure{margin:0}
.board svg{width:100%;height:auto;aspect-ratio:4/3;background:var(--black)}
.board svg *{fill:none;stroke:rgba(255,255,255,.65);stroke-width:1.2;vector-effect:non-scaling-stroke}
.board svg .f{fill:rgba(255,255,255,.14);stroke:none}
.board figcaption{margin-top:8px;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--silver)}

/* ---------- films ---------- */
.cards{display:grid;gap:64px 24px;grid-template-columns:minmax(0,1fr);margin-top:clamp(48px,6vw,88px)}
@media (min-width:768px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
.card{position:relative;display:block}
.card .frame{transition:transform .25s var(--ease-out)}
.card:hover .frame,.card:focus-within .frame{transform:translateY(-4px)}
.card:hover .c.tl,.card:focus-within .c.tl{transform:translate(-4px,-4px)}
.card:hover .c.tr,.card:focus-within .c.tr{transform:translate(4px,-4px)}
.card:hover .c.bl,.card:focus-within .c.bl{transform:translate(-4px,4px)}
.card:hover .c.br,.card:focus-within .c.br{transform:translate(4px,4px)}
.card__body{margin-top:28px}
.card__body .chip{margin-bottom:18px}
.card__body h3{margin-bottom:12px}
.card__body p{color:var(--fg-2);max-width:40em}
.card__body .link{margin-top:14px}
.card__hit{position:absolute;inset:0;z-index:1}
.card .link{position:relative;z-index:2}

.tracker{margin-top:clamp(72px,9vw,120px)}
.tracker__label{margin-bottom:8px}
.trow{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;padding:28px 0;border-bottom:1px solid var(--line)}
.trow:first-of-type{border-top:1px solid var(--line)}
.trow h3{font-size:clamp(20px,1.8vw,26px);letter-spacing:-.02em}
.stages{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.stages .track,.stages .fill{position:absolute;top:6px;left:6px;right:calc(25% - 6px);height:1.5px;background:var(--steel)}
.stages .track{opacity:.6}
.stages .fill{background:var(--sig);transform-origin:0 50%;transform:scaleX(var(--p,0));right:calc(25% - 6px)}
.stage{position:relative;display:flex;flex-direction:column;gap:12px;font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--silver)}
.stage .node{position:relative;width:13px;height:13px;border-radius:50%;background:var(--black);box-shadow:inset 0 0 0 1.5px var(--steel);transition:background-color .3s,box-shadow .3s}
.stage.now span{font-weight:500}
.stage.done .node{background:var(--sig);box-shadow:none}
.stage.now{color:var(--white)}
.stage.now .node{background:var(--sig);box-shadow:0 0 0 4px rgba(255,214,10,.22)}
.stage .now-tag{color:var(--white);font-weight:500}
@media (min-width:768px){.trow{grid-template-columns:minmax(0,4fr) minmax(0,8fr);align-items:center;gap:24px}}

/* ---------- formats ---------- */
.cols3{display:grid;grid-template-columns:minmax(0,1fr);margin-top:clamp(48px,6vw,88px);border-top:1px solid var(--rule)}
.cols3>*{padding:32px 0;border-bottom:1px solid var(--rule)}
.cols3 h3{margin:18px 0 14px}
.cols3 p{color:var(--fg-2)}
@media (min-width:768px){.cols3{grid-template-columns:repeat(3,minmax(0,1fr));border-bottom:1px solid var(--rule)}.cols3>*{padding:36px 28px 40px;border-bottom:0;border-left:1px solid var(--rule)}.cols3>*:first-child{border-left:0;padding-left:0}}
.formats .btns{margin-top:48px}

/* ---------- origin ---------- */
.origin__text{color:var(--fg-2)}
.origin__text p{max-width:62ch}
.origin__text p:first-child{color:var(--fg)}
@media (min-width:1024px){.origin__head{grid-column:1/6}.origin__text{grid-column:6/13;padding-top:12px}.origin__fig{grid-column:1/13}}
.origin__fig{margin-top:clamp(32px,4vw,64px)}

/* ---------- standards ---------- */
.std{display:grid;grid-template-columns:minmax(0,1fr);gap:0 clamp(24px,4vw,64px);margin-top:clamp(48px,6vw,88px);counter-reset:std}
.std li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:8px 16px;padding:28px 0;border-top:1px solid var(--rule)}
.std .n{font-family:var(--mono);font-weight:500;font-size:13px;letter-spacing:.1em;color:var(--fg-2);padding-top:4px}
.std h3{font-size:clamp(20px,1.7vw,24px);letter-spacing:-.02em;line-height:1.2;margin-bottom:8px}
.std p{color:var(--fg-2)}
@media (min-width:768px){.std{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- people ---------- */
.people{display:grid;gap:56px clamp(24px,4vw,64px);max-width:980px;grid-template-columns:minmax(0,1fr);margin-top:clamp(48px,6vw,88px)}
@media (min-width:640px){.people{grid-template-columns:repeat(2,minmax(0,1fr))}}
.person .frame{--ar:4/5}
.person__body{margin-top:24px}
.person__role{color:var(--fg-2);margin:8px 0 12px}
.person p{color:var(--fg-2);max-width:36em}
.footnote{margin-top:40px;font-size:15px;color:var(--fg-3);max-width:60ch}
.people-more{margin-top:32px}

/* full bios (studio) */
.bios{margin-top:clamp(48px,6vw,88px)}
.bio{display:grid;gap:28px 24px;grid-template-columns:minmax(0,1fr);padding:clamp(40px,5vw,64px) 0;border-top:1px solid var(--rule)}
.bio .frame{--ar:4/5;max-width:360px}
.bio__role{color:var(--fg-2);margin:10px 0 20px}
.bio p{color:var(--fg-2);max-width:62ch}
.bio .chip{margin-top:16px}
@media (min-width:768px){.bio{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}.bio .frame{max-width:none}}
@media (min-width:1024px){.bio{grid-template-columns:repeat(12,minmax(0,1fr))}.bio .frame{grid-column:1/5}.bio__body{grid-column:6/13}}

/* ---------- work with us ---------- */
.tiles{display:grid;gap:16px;grid-template-columns:minmax(0,1fr);margin-top:clamp(48px,6vw,88px)}
@media (min-width:768px){.tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}
.tile{background:var(--graphite);border-radius:14px;padding:clamp(28px,3vw,40px);display:flex;flex-direction:column;gap:14px;transition:background-color .25s,transform .25s var(--ease-out)}
.tile:hover{background:var(--carbon);transform:translateY(-4px)}
.tile .n{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--silver)}
.tile p{color:var(--silver)}
.mailline{margin-top:clamp(56px,7vw,96px);font-size:var(--fs-h3);font-weight:500;letter-spacing:-.02em;line-height:1.3}
.mailline a,.bigmail a{border-bottom:1px solid rgba(255,255,255,.35);transition:border-color .25s;overflow-wrap:anywhere}
.mailline a:hover,.bigmail a:hover{border-color:var(--white)}
.bigmail{font-size:clamp(28px,5.4vw,84px);font-weight:600;letter-spacing:-.04em;line-height:1.05;overflow-wrap:anywhere}
.compare{display:grid;gap:16px;grid-template-columns:minmax(0,1fr);margin-top:40px}
@media (min-width:768px){.compare{grid-template-columns:repeat(2,minmax(0,1fr))}}
.compare>div{border-radius:14px;padding:clamp(28px,3vw,40px);background:var(--graphite)}
.compare>div.never{background:transparent;box-shadow:inset 0 0 0 1px var(--line)}
.compare h3{margin:16px 0 14px}
.compare p{color:var(--silver)}
.who{border-top:1px solid var(--line);padding-top:32px;display:grid;gap:16px;grid-template-columns:minmax(0,1fr)}
.who p{font-size:var(--fs-lead);line-height:1.45;color:var(--white);max-width:34em}
@media (min-width:1024px){.who{grid-template-columns:repeat(12,minmax(0,1fr))}.who h2{grid-column:1/5}.who p{grid-column:5/13}}

/* ---------- page headers ---------- */
.phead{padding-top:calc(var(--nav-h) + clamp(56px,9vw,128px));padding-bottom:clamp(56px,7vw,96px);position:relative}
.phead__line{color:var(--silver);margin-bottom:clamp(20px,3vw,32px);display:flex;flex-wrap:wrap;gap:6px 14px}
.phead .lead{margin-top:clamp(20px,2.4vw,32px)}
.phead .frame{margin-top:clamp(48px,6vw,88px)}
.phead h1{max-width:14em}
.question{font-size:clamp(24px,3vw,44px);font-weight:500;line-height:1.24;letter-spacing:-.025em;max-width:24em;text-wrap:pretty}
.looking{border-top:1px solid var(--rule)}
.looking li{display:grid;grid-template-columns:minmax(0,1fr);gap:14px 24px;padding:28px 0;border-bottom:1px solid var(--rule)}
.looking p{font-size:clamp(18px,1.5vw,22px);line-height:1.45;max-width:46em}
@media (min-width:768px){.looking li{grid-template-columns:200px minmax(0,1fr);align-items:baseline}}
.ground{font-size:var(--fs-lead);line-height:1.45;max-width:34em;color:var(--fg)}
.ground b{font-weight:600}
.receipts__empty{display:flex;gap:16px;align-items:flex-start;padding:32px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);color:var(--fg-2);font-size:var(--fs-lead);line-height:1.45}
.receipts__empty::before{content:"";flex:none;width:10px;height:10px;margin-top:.55em;box-shadow:inset 0 0 0 1.5px var(--fg-3)}
.next{display:block;padding-block:clamp(72px,9vw,128px);border-top:1px solid var(--line)}
.next .mono{color:var(--silver);margin-bottom:16px;display:block}
.next .h2{display:block;max-width:14em}
.next .nw{white-space:nowrap}
.next:hover .h2 .arr{transform:translateX(8px)}

/* 404 */
.lost{min-height:100svh;display:flex;align-items:center;padding-block:calc(var(--nav-h) + 48px) 64px}
.lost p{margin-top:24px}
.lost .btns{margin-top:40px}

/* ---------- motion states (JS only) ---------- */
.js .rv-hide{visibility:hidden}
.split-line{display:block;overflow:clip;overflow-clip-margin:0 0 .12em 0;padding-bottom:.06em;margin-bottom:-.06em}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.15s!important;animation:none!important;scroll-behavior:auto!important}
}
.todo{font-family:var(--mono);font-size:.85em;letter-spacing:.02em;color:var(--fg);background:rgba(255,255,255,.08);padding:1px 6px}
.light .todo{background:rgba(10,10,11,.07)}
@media (max-width:639px){.strip .sep2{display:none}.strip b{flex-basis:100%}}
@media (max-width:479px){.hero .btns{flex-direction:column;align-items:flex-start}}

/* ---------- contributors: compact rows ---------- */
.contribs{display:grid;gap:32px 24px;grid-template-columns:minmax(0,1fr);margin-top:clamp(56px,7vw,96px);padding-top:40px;border-top:1px solid var(--rule)}
@media (min-width:640px){.contribs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.contribs{grid-template-columns:repeat(4,minmax(0,1fr))}.contribs--3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.contrib{display:grid;grid-template-columns:80px minmax(0,1fr);gap:18px;align-items:start}
.frame--mini{--b:8px;--o:-5px;--ar:1/1}
.contrib h3{font-size:18px;letter-spacing:-.015em;line-height:1.25}
.contrib .chip{margin:8px 0 10px}
.contrib p{font-size:15px;color:var(--fg-2);line-height:1.5}

/* ---------- research focus map ---------- */
.mapgrid{display:grid;gap:24px;grid-template-columns:minmax(0,1fr)}
.mapgrid .frame{max-width:720px}
@media (min-width:1024px){.mapgrid{grid-template-columns:repeat(12,minmax(0,1fr));align-items:end}.mapgrid .frame{grid-column:1/9}.mapgrid .map__side{grid-column:9/13}}
.map__side p:not(.source){font-size:var(--fs-lead);line-height:1.45;color:var(--fg)}
.map__media{background:var(--black)}
.map svg{width:100%;height:100%;transform-origin:var(--px) var(--py)}
.map__grat{fill:none;stroke:rgba(255,255,255,.06);stroke-width:1;stroke-dasharray:2 5;vector-effect:non-scaling-stroke}
.map__land{fill:var(--graphite);stroke:rgba(255,255,255,.09);stroke-width:.75;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.map__in{fill:var(--carbon);stroke:rgba(255,255,255,.42);stroke-width:1;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.map__st{fill:none;stroke:rgba(255,255,255,.16);stroke-width:.75;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.map__pin{position:absolute;left:var(--px);top:var(--py);width:0;height:0}
.map__dot{position:absolute;left:-5px;top:-5px;width:10px;height:10px;background:var(--sig)}
.map__ring{position:absolute;left:-14px;top:-14px;width:28px;height:28px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--sig);opacity:.75}
.map.is-on .map__ring{animation:ring 1.6s var(--ease-out) 1s 1}
@keyframes ring{0%{transform:scale(1);opacity:.75}55%{transform:scale(2.8);opacity:0}56%{transform:scale(.4);opacity:0}100%{transform:scale(1);opacity:.75}}
.map__label{position:absolute;left:calc(var(--px) + 46px);top:var(--py);transform:translateY(-50%);display:flex;flex-direction:column;gap:1px;padding:8px 10px;background:rgba(10,10,11,.85);font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--silver);line-height:1.45;white-space:nowrap}
.map__label b{color:var(--white);font-weight:500}
.map__label::before{content:"";position:absolute;right:100%;top:50%;width:32px;height:1px;background:rgba(255,255,255,.6)}
@media (max-width:639px){.map svg{transform:scale(var(--s))}.map__label{left:calc(var(--px) + 36px)}.map__label::before{width:22px}.map--pl .map__label{left:auto;right:calc(100% - var(--px) + 36px)}.map--pl .map__label::before{right:auto;left:100%}}
@media (max-width:767px){.foot__cols>div:last-child{grid-column:1/-1}}
