/*
  Senva GmbH, senva.de, 2026
  "Nachtlabor": dark hero, labs and footer; light reading sections.
  Plain CSS, no framework. Edit the tokens first, components second.
*/

/* ---------- Fonts (self-hosted, SIL OFL, see /assets/fonts/OFL-Geist.txt) ---------- */
@font-face{font-family:"Geist";src:url("/assets/fonts/Geist-Variable.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Geist Mono";src:url("/assets/fonts/GeistMono-Variable.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}

/* ---------- Tokens ---------- */
:root{
  /* night */
  --night-950:#06090D;
  --night-900:#090D12;
  --night-850:#0D131A;
  --night-800:#121A23;
  --night-line:rgba(230,237,243,.11);
  --on-night:#E6EDF3;
  --on-night-2:#A6B4C0;
  --on-night-3:#77879A;
  /* paper */
  --paper:#F3F5F4;
  --paper-2:#FFFFFF;
  --ink:#0E1318;
  --ink-2:#36434D;
  --ink-3:#5F6C76;
  --rule:#D6DDDA;
  /* brand */
  --mint:#6ECFB0;
  --mint-ink:#06231B;
  --mint-deep:#13705A;      /* mint for text and lines on paper, AA on --paper */
  --mint-wash:#E1F2EC;
  --amber:#F0B44C;          /* data highlights only */
  /* type */
  --f-sans:"Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --f-mono:"Geist Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --fs-hero:clamp(2.45rem, 1.2rem + 4.4vw, 5.1rem);
  --fs-h2:clamp(1.85rem, 1.15rem + 2.3vw, 3.1rem);
  --fs-h3:clamp(1.2rem, 1.02rem + .55vw, 1.55rem);
  --fs-lead:clamp(1.08rem, 1rem + .35vw, 1.3rem);
  --fs-body:1.0625rem;
  --fs-small:.9rem;
  --fs-label:.74rem;
  /* space */
  --gutter:max(20px, env(safe-area-inset-left, 0px));
  --gutter-r:max(20px, env(safe-area-inset-right, 0px));
  --max:1280px;
  --read:68ch;
  --sec:clamp(72px, 9vw, 136px);
  --r:6px;
  --ease:cubic-bezier(.2,.7,.2,1);
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:88px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f-sans);font-size:var(--fs-body);line-height:1.65;font-feature-settings:"ss01","cv11";-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,video,svg{display:block;max-width:100%;height:auto}
a{color:inherit;text-underline-offset:.18em;text-decoration-thickness:1px}
p,ul,ol,dl,figure,blockquote,h1,h2,h3,h4{margin:0}
h1,h2,h3,h4{font-weight:500;line-height:1.08;letter-spacing:-.025em;text-wrap:balance}
p{text-wrap:pretty}
ul,ol{padding-left:1.2em}
::selection{background:var(--mint);color:var(--mint-ink)}
:focus-visible{outline:2px solid var(--mint);outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--mint);color:var(--mint-ink);padding:10px 14px;font-weight:600;border-radius:var(--r);transition:top .2s}
.skip:focus{top:12px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- Layout ---------- */
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-left:var(--gutter);padding-right:var(--gutter-r)}
.sec{padding-block:var(--sec)}
.sec--tight{padding-block:calc(var(--sec) * .6)}
.night{background:var(--night-900);color:var(--on-night)}
.night-2{background:var(--night-850);color:var(--on-night)}
.white{background:var(--paper-2)}
.rule-top{border-top:1px solid var(--rule)}
.night .rule-top,.night-2 .rule-top{border-color:var(--night-line)}
.grid-12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px}
.stack{display:grid;gap:var(--stack,20px);align-content:start}
.measure{max-width:var(--read)}

/* ---------- Type helpers ---------- */
.label{font-family:var(--f-mono);font-size:var(--fs-label);font-weight:450;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3)}
.night .label,.night-2 .label{color:var(--on-night-3)}
.label--mint{color:var(--mint-deep)}
.night .label--mint,.night-2 .label--mint{color:var(--mint)}
.label .br{color:var(--mint-deep)}
.night .label .br{color:var(--mint)}
.h2{font-size:var(--fs-h2)}
.h3{font-size:var(--fs-h3);letter-spacing:-.015em;line-height:1.2}
.lead{font-size:var(--fs-lead);line-height:1.55;color:var(--ink-2)}
.night .lead,.night-2 .lead{color:var(--on-night-2)}
.muted{color:var(--ink-3)}
.night .muted,.night-2 .muted{color:var(--on-night-2)}
.num{font-variant-numeric:tabular-nums}
.sec-head{display:grid;gap:18px;max-width:52rem;margin-bottom:clamp(36px,5vw,64px)}

/* ---------- Buttons and links ---------- */
.btn{display:inline-flex;align-items:center;gap:.6em;font:inherit;font-size:.98rem;font-weight:550;line-height:1;padding:.95em 1.3em;border-radius:var(--r);border:1px solid transparent;text-decoration:none;cursor:pointer;transition:background-color .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease),transform .2s var(--ease)}
.btn:active{transform:translateY(1px)}
.btn--mint{background:var(--mint);color:var(--mint-ink)}
.btn--mint:hover{background:#8BDCC2}
.btn--ink{background:var(--ink);color:var(--paper)}
.btn--ink:hover{background:#26313B}
.btn--line{border-color:currentColor;color:inherit;background:transparent}
.night .btn--line,.night-2 .btn--line{border-color:rgba(230,237,243,.32)}
.btn--line:hover{background:rgba(127,140,150,.12)}
.btns{display:flex;flex-wrap:wrap;gap:12px}
.arrow{display:inline-flex;align-items:center;gap:.45em;font-weight:550;text-decoration:none;color:var(--mint-deep)}
.arrow::after{content:"→";transition:transform .2s var(--ease)}
.arrow:hover::after{transform:translateX(3px)}
.night .arrow,.night-2 .arrow{color:var(--mint)}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:50;background:rgba(9,13,18,.86);backdrop-filter:saturate(140%) blur(12px);-webkit-backdrop-filter:saturate(140%) blur(12px);border-bottom:1px solid var(--night-line);color:var(--on-night);padding-top:env(safe-area-inset-top,0px)}
.site-header.is-over-hero{background:linear-gradient(180deg,rgba(6,9,13,.7),rgba(6,9,13,0));border-color:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
.site-header .wrap{display:flex;align-items:center;gap:28px;min-height:72px}
.brand{display:flex;align-items:center;flex:none}
.brand img{height:26px;width:auto}
.nav{margin-left:auto}
.nav ul{list-style:none;padding:0;display:flex;gap:4px}
.nav a{display:block;padding:8px 11px;border-radius:var(--r);font-size:.94rem;color:var(--on-night-2);text-decoration:none;transition:color .15s,background-color .15s}
.nav a:hover{color:var(--on-night);background:rgba(230,237,243,.06)}
.nav a[aria-current="page"]{color:var(--on-night)}
.nav a[aria-current="page"]::after{content:"";display:block;height:1px;margin-top:3px;background:var(--mint)}
.header-tools{display:flex;align-items:center;gap:10px}
.lang{font-family:var(--f-mono);font-size:.78rem;letter-spacing:.08em;color:var(--on-night-2);text-decoration:none;padding:8px 6px}
.lang:hover{color:var(--on-night)}
.header-cta{padding:.75em 1.05em;font-size:.9rem}
.nav-cta{display:none}
.menu-btn{display:none;background:none;border:1px solid var(--night-line);color:var(--on-night);border-radius:var(--r);padding:9px 12px;font:inherit;font-size:.9rem;cursor:pointer}
@media (max-width:1080px){
  .nav{position:fixed;inset:0;top:0;z-index:60;background:var(--night-950);padding:calc(88px + env(safe-area-inset-top,0px)) var(--gutter-r) 40px var(--gutter);display:none;overflow-y:auto}
  .nav.is-open{display:block}
  .nav ul{flex-direction:column;gap:0}
  .nav a{font-size:1.5rem;padding:14px 0;border-bottom:1px solid var(--night-line);border-radius:0;color:var(--on-night)}
  .nav a[aria-current="page"]::after{display:none}
  .nav-cta{display:block;margin-top:28px}
  .nav .nav-cta a{display:inline-flex;font-size:1.05rem;border:0;padding:14px 20px;border-radius:var(--r);background:var(--mint);color:var(--mint-ink);font-weight:550}
  .menu-btn{display:inline-flex;position:relative;z-index:70}
  .header-tools{margin-left:auto}
  .header-cta{display:none}
  .brand{position:relative;z-index:70}
}

/* ---------- Hero ---------- */
.hero{position:relative;isolation:isolate;background:var(--night-900);color:var(--on-night);margin-top:-73px;overflow:hidden}
.hero__media{position:absolute;inset:0;z-index:-2}
.hero__media picture,.hero__media video{position:absolute;inset:0}
.hero__media img,.hero__media video{width:100%;height:100%;object-fit:cover;object-position:68% 42%}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:
  linear-gradient(90deg,rgba(9,13,18,.96) 0%,rgba(9,13,18,.86) 34%,rgba(9,13,18,.42) 62%,rgba(9,13,18,.12) 100%),
  linear-gradient(0deg,rgba(9,13,18,1) 0%,rgba(9,13,18,0) 34%),
  linear-gradient(180deg,rgba(9,13,18,.65) 0%,rgba(9,13,18,0) 22%)}
.hero__body{padding-top:calc(73px + clamp(64px,9.5vw,140px));padding-bottom:clamp(48px,6vw,84px);display:grid;gap:24px;max-width:min(900px,100%)}
.hero h1{font-size:var(--fs-hero);font-weight:500;letter-spacing:-.035em;line-height:1.01}
.hero h1 .soft{color:var(--on-night-2)}
.hero .lead{max-width:36em}
.trustbar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--night-line)}
.trustbar li{list-style:none;padding:18px 20px 22px 0;font-family:var(--f-mono);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--on-night-2);display:flex;gap:10px;align-items:baseline}
.trustbar li+li{padding-left:20px;border-left:1px solid var(--night-line)}
.trustbar li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--mint);transform:translateY(-1px)}
.trustbar ul{display:contents}
@media (max-width:760px){
  .hero{margin-top:-73px}
  .hero::before{background:linear-gradient(0deg,rgba(9,13,18,1) 8%,rgba(9,13,18,.82) 52%,rgba(9,13,18,.5) 100%)}
  .trustbar{grid-template-columns:1fr}
  .trustbar li+li{padding-left:0;border-left:0;border-top:1px solid var(--night-line)}
  .trustbar li{padding:14px 0}
}

/* page hero (inner pages) */
.page-hero{background:var(--night-900);color:var(--on-night);margin-top:-73px;padding-top:calc(73px + clamp(64px,9vw,128px));padding-bottom:clamp(48px,6vw,88px);position:relative;overflow:hidden;isolation:isolate}
.page-hero__media{position:absolute;inset:0;z-index:-2}
.page-hero__media img{width:100%;height:100%;object-fit:cover;opacity:.55}
.page-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(9,13,18,.97) 0%,rgba(9,13,18,.8) 50%,rgba(9,13,18,.35) 100%),linear-gradient(0deg,rgba(9,13,18,1) 0%,rgba(9,13,18,0) 40%)}
.page-hero .inner{display:grid;gap:22px;max-width:52rem}
.page-hero h1{font-size:clamp(2.2rem,1.2rem + 3.4vw,4.2rem);letter-spacing:-.032em;line-height:1.03}
.crumbs{font-family:var(--f-mono);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--on-night-3)}
.crumbs ol{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.crumbs li+li::before{content:"/";margin-right:8px;color:var(--night-line)}
.crumbs a{text-decoration:none}
.crumbs a:hover{color:var(--on-night)}

/* dark-context colours inside heroes (they are dark without carrying .night) */
.hero .label,.page-hero .label{color:var(--on-night-3)}
.hero .label--mint,.page-hero .label--mint,.hero .label .br,.page-hero .label .br{color:var(--mint)}
.hero .lead,.page-hero .lead,.hero .muted,.page-hero .muted{color:var(--on-night-2)}
.page-hero .caption{color:var(--on-night-3)}
.page-hero .arrow{color:var(--mint)}
.hero .btn--line,.page-hero .btn--line{border-color:rgba(230,237,243,.32)}
.page-hero__media picture,.page-hero__media video{position:absolute;inset:0}
.page-hero__media video{width:100%;height:100%;object-fit:cover;opacity:.55}
@media (prefers-reduced-motion:reduce){.page-hero__media video{display:none}}

/* ---------- Grid lines (decorative, night sections) ---------- */
.gridlines{position:relative}
.gridlines::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:linear-gradient(90deg,var(--night-line) 1px,transparent 1px);
  background-size:calc((min(100vw,var(--max)) - 40px) / 4) 100%;
  background-position:calc(50% - (min(100vw,var(--max)) - 40px) / 2) 0;opacity:.55;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 18%,#000 82%,transparent);mask-image:linear-gradient(180deg,transparent,#000 18%,#000 82%,transparent)}
.gridlines > *{position:relative;z-index:1}

/* ---------- Logo strip ---------- */
.logos{background:var(--night-850);color:var(--on-night-3);border-top:1px solid var(--night-line);border-bottom:1px solid var(--night-line)}
.logos .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:20px 56px;padding-block:30px}
.logos .label{flex:none;margin-right:auto}
.logos ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:24px 56px}
.logos img{height:26px;width:auto;filter:grayscale(1) brightness(0) invert(1);opacity:.6}
.logos img.tall{height:32px}
.logos img.wide{height:16px}
.logos img.on-white{filter:grayscale(1) brightness(.9) contrast(12);mix-blend-mode:screen;opacity:.6;height:34px}

/* ---------- Service index (rows, not cards) ---------- */
.index-list{list-style:none;padding:0;border-top:1px solid var(--rule)}
.index-list > li{border-bottom:1px solid var(--rule)}
.index-row{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,6fr) minmax(0,2fr);gap:24px 40px;padding-block:34px;text-decoration:none;align-items:start}
.index-row h3{font-size:var(--fs-h3);letter-spacing:-.015em;line-height:1.2}
.index-row p{color:var(--ink-2)}
.index-row .proof{display:block;margin-top:12px;font-family:var(--f-mono);font-size:.78rem;letter-spacing:.04em;color:var(--ink-3)}
.index-row .go{justify-self:end;align-self:center}
a.index-row:hover h3{color:var(--mint-deep)}
@media (max-width:860px){.index-row{grid-template-columns:1fr;gap:12px}.index-row .go{justify-self:start}}

/* ---------- Feature case ---------- */
.case-feature{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,4vw,64px);align-items:start}
.case-feature figure{position:relative}
.case-feature figure img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r)}
.caption{margin-top:10px;font-family:var(--f-mono);font-size:.74rem;letter-spacing:.05em;color:var(--ink-3)}
.night .caption,.night-2 .caption{color:var(--on-night-3)}
.steps{display:grid;gap:0;border-top:1px solid var(--rule)}
.steps > div{display:grid;grid-template-columns:9rem minmax(0,1fr);gap:16px;padding-block:18px;border-bottom:1px solid var(--rule)}
.steps dt{font-family:var(--f-mono);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mint-deep);padding-top:4px}
.steps dd{margin:0;color:var(--ink-2)}
@media (max-width:900px){.case-feature{grid-template-columns:1fr}.steps > div{grid-template-columns:1fr;gap:6px}}

/* ---------- Two-zone model ---------- */
.zones{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:0;border:1px solid var(--night-line);border-radius:var(--r);overflow:hidden}
.zone{padding:clamp(24px,3vw,40px);display:grid;gap:16px;align-content:start;background:var(--night-850)}
.zone h3{font-size:var(--fs-h3);display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.zone ul{list-style:none;padding:0;display:grid;gap:10px;color:var(--on-night-2)}
.zone li{padding-left:22px;position:relative}
.zone li::before{content:"";position:absolute;left:0;top:.62em;width:10px;height:1px;background:var(--mint)}
.zone--hanoi li::before{background:var(--on-night-3)}
.boundary{width:1px;background:repeating-linear-gradient(180deg,var(--mint) 0 6px,transparent 6px 12px);position:relative}
.boundary span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-90deg);white-space:nowrap;background:var(--night-900);padding:6px 10px;font-family:var(--f-mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mint)}
.zone-foot{grid-column:1/-1;border-top:1px solid var(--night-line);padding:18px clamp(24px,3vw,40px);font-family:var(--f-mono);font-size:.78rem;letter-spacing:.04em;color:var(--on-night-2);background:var(--night-900)}
@media (max-width:820px){
  .zones{grid-template-columns:1fr}
  .boundary{width:auto;height:1px;background:repeating-linear-gradient(90deg,var(--mint) 0 6px,transparent 6px 12px);min-height:1px}
  .boundary span{transform:translate(-50%,-50%)}
}
.signature{font-size:clamp(2.2rem,1.1rem + 4vw,4.6rem);font-weight:500;letter-spacing:-.035em;line-height:1.02}
.signature em{font-style:normal;color:var(--mint)}

/* ---------- Labs teaser / paper cards ---------- */
.papers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,2.4vw,36px)}
.paper-card{display:grid;gap:14px;text-decoration:none;align-content:start}
.paper-card figure{overflow:hidden;border-radius:var(--r);background:var(--night-800)}
.paper-card img{aspect-ratio:3/2;object-fit:cover;width:100%;transition:transform .6s var(--ease),opacity .3s}
.paper-card:hover img{transform:scale(1.03)}
.paper-card h3{font-size:1.22rem;line-height:1.25;letter-spacing:-.01em}
.paper-card p{color:var(--on-night-2);font-size:.97rem}
.white .paper-card p,.paper-card.on-paper p{color:var(--ink-2)}
.status{display:inline-flex;align-items:center;gap:8px;font-family:var(--f-mono);font-size:.7rem;letter-spacing:.11em;text-transform:uppercase;color:var(--on-night-3)}
.status::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--amber)}
.status[data-s="replicated"]::before{background:var(--mint)}
.status[data-s="exploratory"]::before{background:var(--amber)}
.status[data-s="replication-planned"]::before{background:transparent;border:1px solid var(--amber)}
.status[data-s="essay"]::before{background:var(--on-night-3)}
.status[data-s="practice"]::before{background:var(--mint-deep)}
.paper-card.on-paper .status,.white .status,.article .status{color:var(--ink-3)}
@media (max-width:900px){.papers{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.papers{grid-template-columns:1fr}}

/* ---------- Quotes ---------- */
.quotes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--rule)}
.quote{padding:32px 32px 8px 0;display:grid;gap:22px;align-content:space-between}
.quote+.quote{padding-left:32px;border-left:1px solid var(--rule)}
.quote blockquote p{font-size:1.18rem;line-height:1.5;letter-spacing:-.01em}
.quote blockquote p::before{content:"„"}
.quote blockquote p::after{content:"“"}
.quote figcaption{font-size:.92rem}
.quote figcaption b{display:block;font-weight:600}
.quote figcaption span{color:var(--ink-3)}
@media (max-width:900px){.quotes{grid-template-columns:1fr}.quote+.quote{padding-left:0;border-left:0;border-top:1px solid var(--rule)}.quote{padding:28px 0}}

/* ---------- Offers (Einstieg) ---------- */
.offers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--rule)}
.offer{padding:30px 28px 34px 0;display:grid;gap:14px;align-content:start}
.offer+.offer{padding-left:28px;border-left:1px solid var(--rule)}
.offer .meta{font-family:var(--f-mono);font-size:.76rem;letter-spacing:.06em;color:var(--mint-deep)}
.offer h3{font-size:1.35rem;letter-spacing:-.015em;line-height:1.2}
.offer p{color:var(--ink-2)}
.offer ul{color:var(--ink-2);font-size:.96rem;display:grid;gap:6px}
@media (max-width:900px){.offers{grid-template-columns:1fr}.offer+.offer{padding-left:0;border-left:0;border-top:1px solid var(--rule)}.offer{padding:28px 0}}

/* ---------- Final CTA ---------- */
.cta-final{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,5vw,80px);align-items:end}
.cta-final h2{font-size:var(--fs-h2)}
.contact-card{border:1px solid var(--night-line);border-radius:var(--r);padding:26px;display:grid;gap:14px;background:var(--night-850)}
.contact-card .who b{display:block;font-size:1.1rem;font-weight:550}
.contact-card .who span{color:var(--on-night-2);font-size:.94rem}
.contact-card dl{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;font-size:.98rem}
.contact-card dt{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--on-night-3);padding-top:4px}
.contact-card dd{margin:0}
.contact-card a{text-decoration:none;border-bottom:1px solid rgba(110,207,176,.45)}
.contact-card a:hover{border-color:var(--mint)}
@media (max-width:900px){.cta-final{grid-template-columns:1fr}}

/* ---------- Generic content blocks ---------- */
.cols-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,4vw,64px)}
.cols-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,40px)}
@media (max-width:900px){.cols-2,.cols-3{grid-template-columns:1fr}}
.split{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(24px,5vw,80px);align-items:start}
.split > :first-child{position:sticky;top:96px}
@media (max-width:900px){.split{grid-template-columns:1fr}.split > :first-child{position:static}}
.prose{max-width:var(--read);display:grid;gap:1.05em}
.prose h2{font-size:clamp(1.5rem,1.15rem + 1.2vw,2.1rem);margin-top:1.2em;letter-spacing:-.022em}
.prose h3{font-size:1.2rem;margin-top:.8em;letter-spacing:-.01em;line-height:1.25}
.prose ul,.prose ol{display:grid;gap:.45em}
.prose a{color:var(--mint-deep)}
.night .prose a{color:var(--mint)}
.prose strong{font-weight:600}
.facts{display:grid;grid-template-columns:auto 1fr;gap:10px 22px;font-size:.97rem}
.facts dt{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);padding-top:4px}
.facts dd{margin:0}
@media (max-width:620px){.facts{grid-template-columns:1fr;gap:2px}.facts dd + dt{margin-top:14px}}
.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0}
.chips li{font-family:var(--f-mono);font-size:.76rem;letter-spacing:.03em;padding:5px 10px;border:1px solid var(--rule);border-radius:999px;color:var(--ink-2);background:var(--paper-2)}
.night .chips li,.night-2 .chips li{border-color:var(--night-line);color:var(--on-night-2);background:transparent}
.figure img{width:100%;border-radius:var(--r)}
.wide-img{width:100%;aspect-ratio:21/9;object-fit:cover;border-radius:var(--r)}
.callout{border-left:2px solid var(--mint-deep);padding:4px 0 4px 20px;color:var(--ink-2)}
.night .callout{border-color:var(--mint);color:var(--on-night-2)}

/* tables */
.table-wrap{overflow-x:auto;border:1px solid var(--rule);border-radius:var(--r);background:var(--paper-2)}
table{border-collapse:collapse;width:100%;font-size:.95rem}
th,td{text-align:left;vertical-align:top;padding:14px 16px;border-bottom:1px solid var(--rule)}
thead th{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);font-weight:450;background:var(--paper)}
tbody tr:last-child td{border-bottom:0}
td.yes{color:var(--mint-deep);font-weight:550}
td.no{color:var(--ink-3)}


/* stacked table on phones (opt-in: .table-wrap.table-stack, cells carry data-label) */
@media (max-width:640px){
  .table-stack{overflow:visible;border:0;border-radius:0;background:none}
  .table-stack table,.table-stack tbody,.table-stack tr,.table-stack th,.table-stack td{display:block;width:auto}
  .table-stack thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  .table-stack tbody{border-top:1px solid var(--rule)}
  .table-stack tr{padding:16px 0 10px;border-bottom:1px solid var(--rule)}
  .table-stack tbody th{padding:0 0 8px;border:0;font-size:1.05rem}
  .table-stack td{display:grid;grid-template-columns:6.5rem minmax(0,1fr);gap:12px;padding:6px 0;border:0}
  .table-stack td::before{content:attr(data-label);font-family:var(--f-mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);font-weight:450;padding-top:4px}
}
.night-2 .prose a{color:var(--mint)}

/* FAQ */
.faq{border-top:1px solid var(--rule)}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{list-style:none;cursor:pointer;padding:22px 40px 22px 0;font-size:1.12rem;font-weight:500;letter-spacing:-.01em;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:18px;font-size:1.5rem;font-weight:300;color:var(--mint-deep);transition:transform .2s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq .a{padding:0 0 24px;max-width:var(--read);color:var(--ink-2);display:grid;gap:.8em}

/* lists of cases / articles */
.rows{list-style:none;padding:0;border-top:1px solid var(--rule)}
.rows li{border-bottom:1px solid var(--rule)}
.rows a{display:grid;grid-template-columns:7rem minmax(0,1fr) minmax(0,1.2fr) auto;gap:16px 32px;padding:24px 0;text-decoration:none;align-items:baseline}
.rows .yr{font-family:var(--f-mono);font-size:.8rem;color:var(--ink-3)}
.rows h3{font-size:1.18rem;letter-spacing:-.01em;line-height:1.3}
.rows p{color:var(--ink-2);font-size:.97rem}
.rows a:hover h3{color:var(--mint-deep)}
@media (max-width:860px){.rows a{grid-template-columns:1fr;gap:6px}}

/* ---------- Article (Labs / Insights) ---------- */
.article-head{background:var(--night-900);color:var(--on-night);margin-top:-73px;padding-top:calc(73px + clamp(56px,7vw,110px))}
.article-head .inner{display:grid;gap:20px;max-width:56rem;padding-bottom:clamp(36px,4vw,56px)}
.article-head h1{font-size:clamp(2rem,1.1rem + 2.9vw,3.6rem);letter-spacing:-.03em;line-height:1.05}
.article-head .dek{font-size:var(--fs-lead);color:var(--on-night-2);max-width:44em;line-height:1.5}
.article-head .byline{display:flex;flex-wrap:wrap;gap:6px 18px;font-family:var(--f-mono);font-size:.74rem;letter-spacing:.06em;color:var(--on-night-3);text-transform:uppercase}
.article-head .byline span+span::before{content:"·";margin-right:18px;color:var(--night-line)}
.article-cover{background:linear-gradient(180deg,var(--night-900) 0 50%,var(--paper) 50% 100%)}
.article-cover img{width:100%;aspect-ratio:2/1;object-fit:cover;border-radius:var(--r)}
.article-layout{display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr);gap:clamp(32px,5vw,88px);padding-block:clamp(40px,5vw,72px) var(--sec)}
.toc{position:sticky;top:96px;align-self:start;font-size:.88rem;max-height:calc(100vh - 120px);overflow:auto}
.toc .label{display:block;margin-bottom:12px}
.toc ol{list-style:none;padding:0;display:grid;gap:2px;border-left:1px solid var(--rule)}
.toc a{display:block;padding:5px 0 5px 14px;margin-left:-1px;border-left:1px solid transparent;color:var(--ink-3);text-decoration:none;line-height:1.35}
.toc a:hover{color:var(--ink)}
.toc a.is-active{color:var(--ink);border-color:var(--mint-deep)}
@media (max-width:980px){.article-layout{grid-template-columns:1fr}.toc{position:static;max-height:none}.toc ol{grid-template-columns:1fr}}
.paper{max-width:72ch;display:grid;gap:1.05em;font-size:1.075rem;line-height:1.72;color:#1C252D}
.paper > section{display:grid;gap:1.05em}
.paper h2{font-size:clamp(1.45rem,1.15rem + 1vw,1.95rem);letter-spacing:-.022em;line-height:1.15;margin-top:1.6em;color:var(--ink)}
.paper h3{font-size:1.2rem;letter-spacing:-.01em;line-height:1.3;margin-top:1em;color:var(--ink)}
.paper a{color:var(--mint-deep)}
.paper strong{font-weight:600;color:var(--ink)}
.paper ul,.paper ol{display:grid;gap:.45em}
.paper code{font-family:var(--f-mono);font-size:.86em;background:#E7ECEA;padding:.1em .35em;border-radius:4px}
.paper pre{margin:.4em 0;background:var(--night-900);color:#D7E1E8;padding:20px 22px;border-radius:var(--r);overflow-x:auto;font-size:.84rem;line-height:1.6}
.paper pre code{background:none;padding:0;font-size:inherit;color:inherit}
.paper figure{margin:1em 0;display:grid;gap:10px}
.paper figure img,.paper figure video{width:100%;border-radius:var(--r);background:var(--night-850)}
.paper figcaption{font-size:.9rem;color:var(--ink-3);line-height:1.5}
.paper .fig-n{font-family:var(--f-mono);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);margin-right:.4em}
.paper blockquote{border-left:2px solid var(--mint-deep);padding-left:20px;color:var(--ink-2)}
.paper table{font-size:.92rem}
.paper .table-wrap{margin:.6em 0}
.paper .cite{text-decoration:none;font-size:.82em;vertical-align:.25em;font-family:var(--f-mono)}
.paper aside.claims{background:var(--paper-2);border:1px solid var(--rule);border-radius:var(--r);padding:22px 24px;display:grid;gap:10px}
.paper aside.claims h2{font-size:.74rem;font-family:var(--f-mono);letter-spacing:.12em;text-transform:uppercase;margin:0;color:var(--mint-deep);font-weight:500}
.paper aside.claims h2:nth-of-type(2){color:var(--ink-3);margin-top:8px}
.paper aside.claims ul{font-size:.98rem}
.paper aside.note{background:var(--mint-wash);border-radius:var(--r);padding:16px 20px;font-size:.98rem}
.paper .abstract{background:var(--paper-2);border-top:2px solid var(--ink);padding:22px 24px;border-radius:0 0 var(--r) var(--r)}
.paper .abstract h2{margin-top:0;font-size:.74rem;font-family:var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);font-weight:500}
.paper .enterprise{background:var(--night-900);color:var(--on-night-2);border-radius:var(--r);padding:clamp(22px,3vw,34px);margin-top:1.4em}
.paper .enterprise h2{color:var(--on-night);margin-top:0}
.paper .enterprise strong{color:var(--on-night)}
.paper .enterprise a{color:var(--mint)}
.paper .references ol{font-size:.92rem;line-height:1.55;color:var(--ink-2);padding-left:1.6em}
.paper .references li:target{background:var(--mint-wash)}
.paper .changelog ul{list-style:none;padding:0;font-size:.92rem;color:var(--ink-2)}
.paper .changelog time{font-family:var(--f-mono);font-size:.78rem;color:var(--ink-3);margin-right:.6em}

.article-cta{margin-top:56px;max-width:72ch}

/* ---------- Footer ---------- */
.site-footer{background:var(--night-950);color:var(--on-night-2);padding-block:clamp(56px,7vw,96px) 32px;font-size:.94rem}
.footer-top{display:grid;grid-template-columns:minmax(0,4fr) repeat(3,minmax(0,2fr));gap:40px;padding-bottom:48px;border-bottom:1px solid var(--night-line)}
.footer-top img{height:24px;width:auto;margin-bottom:18px}
.footer-top h2{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--on-night-3);font-weight:450;margin-bottom:14px}
.footer-top ul{list-style:none;padding:0;display:grid;gap:8px}
.footer-top a{text-decoration:none}
.footer-top a:hover{color:var(--on-night)}
.footer-bottom{display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;padding-top:24px;font-size:.84rem;color:var(--on-night-3)}
.footer-bottom ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px 22px}
.footer-bottom a,.linklike{color:inherit;text-decoration:none;background:none;border:0;padding:0;font:inherit;cursor:pointer}
.footer-bottom a:hover,.linklike:hover{color:var(--on-night)}
@media (max-width:900px){.footer-top{grid-template-columns:1fr 1fr}.footer-top > :first-child{grid-column:1/-1}}

/* ---------- Consent banner ---------- */
.consent{position:fixed;left:0;right:0;bottom:0;z-index:90;padding:0 var(--gutter-r) calc(16px + env(safe-area-inset-bottom,0px)) var(--gutter);pointer-events:none}
.consent__box{pointer-events:auto;max-width:880px;margin-inline:auto;background:var(--night-850);color:var(--on-night);border:1px solid var(--night-line);border-radius:10px;box-shadow:0 24px 60px -20px rgba(0,0,0,.6);padding:20px 22px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px 24px;align-items:center}
.consent__box h2{font-size:1rem;font-weight:600;letter-spacing:0;margin-bottom:4px}
.consent__box p{font-size:.9rem;color:var(--on-night-2);line-height:1.5}
.consent__box a{color:var(--mint)}
.consent__btns{display:flex;gap:10px}
.consent__btns .btn{min-width:8.5rem;justify-content:center}
@media (max-width:680px){.consent__box{grid-template-columns:1fr}.consent__btns .btn{flex:1}}

/* ---------- Reveal (content is visible by default; JS only adds a gentle lift) ---------- */
@media (prefers-reduced-motion:no-preference){
  .js .reveal{transition:transform .8s var(--ease),opacity .8s var(--ease)}
  .js .reveal.is-pending{transform:translateY(14px);opacity:.001}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .hero__media video{display:none}
}

/* ---------- Small utilities (keep this list short) ---------- */
.small{font-size:var(--fs-small)}
.mt-2{margin-top:32px}
.mt-3{margin-top:40px}
.stack--lg{--stack:24px}
.btns--center{align-items:center}
.title-m{font-size:clamp(1.7rem,1.1rem + 1.8vw,2.6rem)}
.trustbar a{text-decoration:none;border-bottom:1px solid rgba(110,207,176,.35)}
.trustbar a:hover{color:var(--on-night);border-color:var(--mint)}

/* ---------- Review markers (must be gone before launch; build.py check lists them) ---------- */
mark.todo{background:#FDE68A;color:#3B2A00;padding:0 .25em;border-radius:3px;font-size:.92em}

/* ---------- Print ---------- */
@media print{
  .site-header,.site-footer,.consent,.toc,.hero__media,.page-hero__media{display:none!important}
  body{background:#fff;color:#000}
  .hero,.page-hero,.article-head,.night,.night-2{background:#fff!important;color:#000!important;margin-top:0}
}