/* alethiom.ai — marketing site. Tokens lifted from the Alethiom design system (styles.css, dark mode). */

/* Self-hosted IBM Plex, latin subset (delta from handoff: no Google Fonts, no third-party
   requests at runtime). Only the faces the pages actually reach are shipped:
   Sans var 400-500 — body/p 400, h1+h2 450, h3/.brand/.btn/.node b 500
   Sans italic 400  — <em> outside .thesis/.dgm-note (Security "the contract you negotiated")
   Mono 400         — eyebrows, labels, diagram annotations, counters
   Serif italic 400 — .quote pull-quotes, Company's italic "aletheia" */
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400 500;font-display:swap;src:url("/fonts/ibm-plex-sans-latin-var.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Sans";font-style:italic;font-weight:400;font-display:swap;src:url("/fonts/ibm-plex-sans-latin-italic.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/ibm-plex-mono-latin-400.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Serif";font-style:italic;font-weight:400;font-display:swap;src:url("/fonts/ibm-plex-serif-latin-italic.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
--font-sans:"IBM Plex Sans",ui-sans-serif,system-ui,sans-serif;
--font-mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,monospace;
--font-serif:"IBM Plex Serif",ui-serif,Georgia,serif;
--radius-sm:4px;--radius-md:6px;--radius-lg:10px;
--ease-out:cubic-bezier(0.2,0.8,0.2,1);--dur-2:140ms;--dur-3:220ms;--dur-4:360ms;
--accent-hue:48;--accent-chroma:0.14;--accent-l:0.74;
color-scheme:dark;
--bg:oklch(0.155 0.004 60);--bg-1:oklch(0.185 0.004 60);--bg-2:oklch(0.215 0.005 60);--bg-3:oklch(0.255 0.005 60);--bg-inset:oklch(0.125 0.004 60);
--line:oklch(0.285 0.005 60);--line-strong:oklch(0.34 0.006 60);
--fg:oklch(0.96 0.005 60);--fg-1:oklch(0.82 0.005 60);--fg-2:oklch(0.62 0.006 60);--fg-3:oklch(0.46 0.005 60);
--accent:oklch(var(--accent-l) var(--accent-chroma) var(--accent-hue));
--accent-fg:oklch(0.18 0.01 var(--accent-hue));
--accent-soft:oklch(0.35 0.08 var(--accent-hue) / 0.22);
--accent-line:oklch(var(--accent-l) var(--accent-chroma) var(--accent-hue) / 0.5);
--success:oklch(0.72 0.14 155);--danger:oklch(0.70 0.17 25);
--shadow-2:0 1px 0 0 oklch(1 0 0 / 0.04) inset,0 4px 12px oklch(0 0 0 / 0.5);
--shadow-3:0 1px 0 0 oklch(1 0 0 / 0.05) inset,0 12px 32px oklch(0 0 0 / 0.55);
}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--fg);font-family:var(--font-sans);font-size:17px;line-height:1.65;font-feature-settings:"ss01","ss02","cv11";-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{background:var(--accent-soft);color:var(--fg)}
a{color:var(--fg);text-decoration:none}
a:hover{color:var(--accent)}
p a,li a{color:var(--accent);border-bottom:1px solid var(--accent-line)}
p a:hover,li a:hover{border-bottom-color:var(--accent)}
.mono{font-family:var(--font-mono);font-feature-settings:"ss02","zero","cv11"}
.serif{font-family:var(--font-serif)}
img{max-width:100%;display:block}

/* ---- layout ---- */
.wrap{max-width:1140px;margin:0 auto;padding:0 32px}
.section{padding:104px 0}
.section+.section{border-top:1px solid var(--line)}
.eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:0.16em;text-transform:uppercase;color:var(--accent);margin:0 0 18px}
h1,h2,h3{margin:0;font-weight:450;letter-spacing:-0.02em;text-wrap:pretty}
h2{font-size:clamp(28px,3.4vw,40px);line-height:1.15;letter-spacing:-0.025em;max-width:22ch}
h3{font-size:19px;font-weight:500;letter-spacing:-0.01em}
.lede{font-size:19px;color:var(--fg-1);max-width:60ch;text-wrap:pretty}
p{color:var(--fg-1)}
.muted{color:var(--fg-2)}
.small{font-size:14px}
.tiny{font-size:12.5px}

/* ---- nav ---- */
.nav{position:sticky;top:0;z-index:50;background:oklch(0.155 0.004 60 / 0.86);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav-in{max-width:1140px;margin:0 auto;padding:0 32px;height:60px;display:flex;align-items:center;gap:36px}
.brand{display:flex;align-items:center;gap:11px;font-size:19px;font-weight:500;letter-spacing:-0.03em}
.brand:hover{color:var(--fg)}
.brand-dot{width:14px;height:14px;border-radius:50%;border:1.5px solid var(--fg);position:relative;flex:none}
.brand-dot::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--accent)}
.nav-links{display:flex;gap:26px;margin-left:auto;align-items:center}
.nav-links a{font-size:14.5px;color:var(--fg-1)}
.nav-links a:hover{color:var(--fg)}
.nav-links a[aria-current="page"]{color:var(--fg);border-bottom:2px solid var(--accent);padding:19px 0 17px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:42px;padding:0 20px;border-radius:var(--radius-sm);font-size:15px;font-weight:500;border:1px solid transparent;cursor:pointer;transition:background var(--dur-2) var(--ease-out),border-color var(--dur-2) var(--ease-out),color var(--dur-2) var(--ease-out);white-space:nowrap}
.btn-primary{background:var(--accent);color:var(--accent-fg)}
.btn-primary:hover{background:oklch(calc(var(--accent-l) + 0.05) var(--accent-chroma) var(--accent-hue));color:var(--accent-fg)}
.btn-ghost{border-color:var(--line-strong);color:var(--fg)}
.btn-ghost:hover{border-color:var(--fg-2);color:var(--fg)}
.btn-sm{height:34px;padding:0 14px;font-size:14px}
.nav .btn{margin-left:2px}
.menu-btn{display:none;border:1px solid var(--line-strong);background:transparent;color:var(--fg-1);font-family:var(--font-mono);font-size:11px;letter-spacing:0.1em;text-transform:uppercase;border-radius:var(--radius-sm);padding:7px 12px;cursor:pointer;order:99}
.menu-btn:hover{color:var(--fg)}

/* ---- hero ---- */
.hero{padding:110px 0 96px;position:relative;overflow:hidden}
.hero h1{font-size:clamp(42px,5.4vw,72px);line-height:1.04;letter-spacing:-0.035em;max-width:16ch}
.hero .lede{margin:26px 0 34px}
.hero-cta{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.hero-cta .after{font-size:14px;color:var(--fg-2)}
.hero-grid{display:grid;grid-template-columns:1.05fr 0.95fr;gap:64px;align-items:center}

[data-hero-variant="combo"] .accent-word{color:var(--accent)}
[data-hero-variant="combo"] h1{font-size:clamp(38px,4.2vw,60px);max-width:none;white-space:nowrap}
@media(max-width:960px){[data-hero-variant="combo"] h1{white-space:normal}}

/* ---- diagram ---- */
.dgm{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-lg);padding:26px;position:relative}
.dgm-title{font-family:var(--font-mono);font-size:10.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--fg-2);margin-bottom:18px;display:flex;justify-content:space-between;gap:12px}
.acct{border:1.5px dashed var(--accent-line);border-radius:var(--radius-md);padding:38px 22px 22px;position:relative}
.acct-lbl{position:absolute;top:-9px;left:16px;background:var(--bg-1);padding:0 8px;font-family:var(--font-mono);font-size:10.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--accent)}
.node{background:var(--bg-2);border:1px solid var(--line-strong);border-radius:var(--radius-md);padding:13px 16px;min-width:150px}
.node b{display:block;font-size:14.5px;font-weight:500;letter-spacing:-0.01em}
.node span{display:block;font-family:var(--font-mono);font-size:10.5px;color:var(--fg-2);margin-top:3px}
.node--engine{border-color:var(--accent-line);background:linear-gradient(180deg,var(--accent-soft),transparent 130%)}
.node--ghost{background:transparent;border-style:dashed;border-color:var(--line)}
.pipe{position:relative;height:2px;background:var(--line-strong);flex:1;min-width:56px}
.pipe::after{content:"";position:absolute;right:-1px;top:-3px;border:4px solid transparent;border-left:6px solid var(--line-strong)}
.pipe .dot{position:absolute;top:-2.5px;left:0;width:7px;height:7px;border-radius:50%;background:var(--accent);animation:pipeDot 2.6s linear infinite}
.pipe .dot.d2{animation-delay:1.3s}
.pipe--rev .dot{animation-name:pipeDotRev}
@keyframes pipeDot{from{left:0;opacity:0}12%{opacity:1}88%{opacity:1}to{left:calc(100% - 7px);opacity:0}}
@keyframes pipeDotRev{from{left:calc(100% - 7px);opacity:0}12%{opacity:1}88%{opacity:1}to{left:0;opacity:0}}
@keyframes pipeDotV{from{top:0;opacity:0}12%{opacity:1}88%{opacity:1}to{top:calc(100% - 7px);opacity:0}}
@keyframes pipeDotVRev{from{top:calc(100% - 7px);opacity:0}12%{opacity:1}88%{opacity:1}to{top:0;opacity:0}}
.pipe-lbl{font-family:var(--font-mono);font-size:10.5px;color:var(--fg-2);text-align:center;line-height:1.45}
.dgm-row{display:flex;align-items:center;gap:14px}
.dgm-note{font-family:var(--font-mono);font-size:11px;color:var(--fg-2);line-height:1.6}
.dgm-note em{color:var(--accent);font-style:normal}
@media(prefers-reduced-motion:reduce){.pipe .dot{animation:none;opacity:0}}

/* ---- problem ---- */
.deadends{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:48px}
.deadend{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-md);padding:30px 30px 26px}
.deadend .tag{font-family:var(--font-mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--danger);display:flex;align-items:center;gap:8px;margin-bottom:14px}
.deadend .tag::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--danger);opacity:0.8}
.deadend h3{margin-bottom:10px}
.deadend p{font-size:15.5px;margin:0 0 10px;color:var(--fg-1)}
.deadend p:last-child{margin:0}

/* ---- how it works ---- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:48px 0 56px;counter-reset:step}
.step{border-top:2px solid var(--line-strong);padding-top:20px;position:relative}
.step::before{counter-increment:step;content:"0" counter(step);font-family:var(--font-mono);font-size:12px;color:var(--accent);letter-spacing:0.1em;display:block;margin-bottom:12px}
.step h3{margin-bottom:8px}
.step p{font-size:15px;margin:0;color:var(--fg-1)}

/* ---- persona tabs ---- */
.tabs{margin-top:44px;background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden}
.tab-list{display:flex;border-bottom:1px solid var(--line);background:var(--bg-inset)}
.tab-list button{flex:1;border:0;background:transparent;color:var(--fg-2);font-family:var(--font-mono);font-size:12.5px;letter-spacing:0.06em;padding:16px 12px;cursor:pointer;border-bottom:2px solid transparent;transition:color var(--dur-2) var(--ease-out)}
.tab-list button:hover{color:var(--fg)}
.tab-list button[aria-selected="true"]{color:var(--fg);border-bottom-color:var(--accent);background:var(--bg-1)}
.tab-panel{display:none;padding:36px 40px;grid-template-columns:1fr 300px;gap:44px}
.tab-panel.on{display:grid}
.tab-panel h3{font-size:22px;margin-bottom:16px;letter-spacing:-0.015em}
.tab-panel ul{margin:0;padding:0;list-style:none;display:grid;gap:12px}
.tab-panel li{font-size:15.5px;color:var(--fg-1);padding-left:20px;position:relative}
.tab-panel li::before{content:"—";position:absolute;left:0;color:var(--accent)}
.tab-side{border-left:1px solid var(--line);padding-left:32px;display:flex;flex-direction:column;gap:12px;justify-content:center}
.tab-side .fwd-lbl{font-family:var(--font-mono);font-size:10.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--fg-3)}
.tab-side a.fwd{font-size:15px;color:var(--accent)}

/* ---- proof ---- */
.proof-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px}
.proof{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-md);padding:26px}
.proof .stat{font-family:var(--font-mono);font-size:26px;letter-spacing:-0.02em;color:var(--fg);margin-bottom:10px}
.proof p{font-size:14.5px;margin:0;color:var(--fg-1)}
.slot{color:var(--accent);border-bottom:1px dashed var(--accent-line)}
.honesty{margin-top:28px;font-size:14.5px;color:var(--fg-2);max-width:66ch}

/* ---- CTA band ---- */
.cta-band{background:var(--bg-1);border-top:1px solid var(--line)}
.cta-in{padding-block:96px;display:grid;grid-template-columns:1fr auto;gap:48px;align-items:center}
.cta-band h2{max-width:18ch}
.cta-band .next{margin-top:16px;font-size:15px;color:var(--fg-2);max-width:52ch}
.cta-actions{display:flex;flex-direction:column;gap:10px;align-items:flex-end}
.pending{font-family:var(--font-mono);font-size:10.5px;color:var(--fg-3)}

/* ---- shots (product captures) ---- */
.shot{background:var(--bg-inset);border:1px solid var(--line-strong);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-3)}
.shot-bar{display:flex;align-items:center;gap:6px;height:34px;padding:0 14px;background:var(--bg-2);border-bottom:1px solid var(--line)}
.shot-bar i{width:9px;height:9px;border-radius:50%;background:var(--bg-3);border:1px solid var(--line-strong)}
.shot-bar .shot-t{margin-left:8px;font-family:var(--font-mono);font-size:11px;color:var(--fg-2)}
.shot-body{aspect-ratio:16/9.4;position:relative;background:repeating-linear-gradient(-45deg,var(--bg-inset) 0 14px,oklch(0.145 0.004 60) 14px 28px)}
.shot-body .vid{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.vid video{width:100%;height:100%;object-fit:cover}
.vid-ph{display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center;padding:24px}
.vid-play{width:56px;height:56px;border-radius:50%;border:1.5px solid var(--accent-line);position:relative;background:var(--accent-soft)}
.vid-play::after{content:"";position:absolute;left:22px;top:17px;border:11px solid transparent;border-left:16px solid var(--accent)}
.vid-lbl{font-family:var(--font-mono);font-size:11.5px;color:var(--fg-2);line-height:1.7;max-width:46ch}

/* ---- feature rows (Product) ---- */
.feat{display:grid;grid-template-columns:0.9fr 1.1fr;gap:64px;align-items:center;padding:88px 0}
.feat+.feat{border-top:1px solid var(--line)}
.feat.flip .feat-copy{order:2}
.feat h2{font-size:clamp(26px,2.8vw,34px)}
.feat p{font-size:16px;color:var(--fg-1)}
.feat-points{margin:20px 0 0;padding:0;list-style:none;display:grid;gap:10px}
.feat-points li{font-size:15px;color:var(--fg-1);padding-left:20px;position:relative}
.feat-points li::before{content:"—";position:absolute;left:0;color:var(--accent)}
.feat.feat-wide{grid-template-columns:1fr;gap:40px}
.feat.feat-wide .feat-copy{max-width:64ch}

/* ---- security page ---- */
.sec-answer{background:var(--bg-inset);border:1px solid var(--accent-line);border-radius:var(--radius-md);padding:28px 32px;margin-top:40px;font-family:var(--font-mono);font-size:14px;line-height:1.8;color:var(--fg-1)}
.sec-answer b{color:var(--fg);font-weight:600}
.sec-answer .k{color:var(--accent)}
.spec{display:grid;grid-template-columns:220px 1fr;gap:16px 40px;margin-top:44px}
.spec dt{font-family:var(--font-mono);font-size:12px;letter-spacing:0.08em;text-transform:uppercase;color:var(--fg-2);padding-top:3px}
.spec dd{margin:0;font-size:15.5px;color:var(--fg-1);padding-bottom:20px;border-bottom:1px solid var(--line)}
.spec dd:last-of-type{border-bottom:0}
ol.plain{margin:28px 0 0;padding:0;list-style:none;counter-reset:n;display:grid;gap:18px}
ol.plain li{position:relative;padding-left:44px;font-size:15.5px;color:var(--fg-1)}
ol.plain li::before{counter-increment:n;content:counter(n,decimal-leading-zero);position:absolute;left:0;top:1px;font-family:var(--font-mono);font-size:12px;color:var(--accent)}
.allow{margin-top:32px;border:1px solid var(--line);border-radius:var(--radius-md);overflow:hidden}
.allow-row{display:grid;grid-template-columns:250px 1fr;gap:24px;padding:16px 22px;border-bottom:1px solid var(--line);font-size:14.5px}
.allow-row:last-child{border-bottom:0}
.allow-row .mono{font-size:13px;color:var(--fg)}
.allow-row span:last-child{color:var(--fg-2)}
.allow-head{background:var(--bg-inset);font-family:var(--font-mono);font-size:10.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--fg-3)}
.allow-head span{color:var(--fg-3)}
.kill{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:36px}
.kill .st{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-md);padding:24px 26px}
.kill .st .mode{font-family:var(--font-mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.kill .st .mode::before{content:"";width:8px;height:8px;border-radius:50%}
.kill .off .mode{color:var(--fg-2)}.kill .off .mode::before{background:var(--fg-3)}
.kill .on .mode{color:var(--success)}.kill .on .mode::before{background:var(--success)}
.kill p{font-size:14.5px;margin:0 0 8px}
.kill p:last-child{margin:0}

/* ---- company ---- */
.bio{display:grid;grid-template-columns:200px 1fr;gap:44px;padding:44px 0;border-top:1px solid var(--line);align-items:start}
.bio-name h3{font-size:21px}
.bio-name .role{font-family:var(--font-mono);font-size:11.5px;color:var(--fg-2);margin-top:6px;letter-spacing:0.06em}
.bio p{margin:0 0 10px;font-size:15.5px}
.draft-flag{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-mono);font-size:10.5px;letter-spacing:0.1em;text-transform:uppercase;color:var(--accent);border:1px dashed var(--accent-line);border-radius:var(--radius-sm);padding:4px 9px;margin-bottom:14px}

/* ---- footer ---- */
footer{border-top:1px solid var(--line);padding:52px 0 60px;margin-top:0}
.foot-in{display:flex;align-items:flex-start;gap:48px;flex-wrap:wrap}
.foot-brand{margin-right:auto}
.foot-brand .tag{font-family:var(--font-mono);font-size:11.5px;color:var(--fg-2);margin-top:12px}
.foot-col{display:grid;gap:9px;font-size:14px}
.foot-col a{color:var(--fg-1)}
.foot-col .h{font-family:var(--font-mono);font-size:10.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--fg-3);margin-bottom:4px}
.foot-legal{margin-top:44px;padding-top:20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:11px;color:var(--fg-3)}

/* ---- reveal ---- */
.rv{opacity:0;transform:translateY(14px);transition:opacity var(--dur-4) var(--ease-out),transform var(--dur-4) var(--ease-out)}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

/* ---- page hero (subpages) ---- */
.page-hero{padding:88px 0 64px}
.page-hero h1{font-size:clamp(36px,4.4vw,56px);line-height:1.06;letter-spacing:-0.03em;max-width:18ch}
.page-hero .lede{margin-top:22px}

@media(max-width:960px){
.hero-grid,.feat,.deadends,.kill{grid-template-columns:1fr}
.dgm-row,.flow-outer{flex-direction:column;align-items:stretch}
.dgm-row .pipe,.flow-outer .pipe{width:2px;height:40px;min-width:0;flex:none;margin:0 auto}
.dgm-row .pipe::after,.flow-outer .pipe::after{right:-3px;top:auto;bottom:-1px;border:4px solid transparent;border-top:6px solid var(--line-strong)}
.dgm-row .pipe .dot,.flow-outer .pipe .dot{left:-2.5px;animation-name:pipeDotV}
.dgm-row .pipe--rev .dot,.flow-outer .pipe--rev .dot{animation-name:pipeDotVRev}
.acct{flex-direction:column;align-items:stretch!important}
.steps,.proof-grid{grid-template-columns:1fr}
.tab-panel{grid-template-columns:1fr}
.tab-side{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:20px}
.cta-in{grid-template-columns:1fr}
.cta-actions{align-items:flex-start}
.spec{grid-template-columns:1fr;gap:6px 0}
.spec dd{margin-bottom:14px}
.bio{grid-template-columns:1fr;gap:16px}
.nav-links{gap:16px}
.nav-links a:not(.btn){font-size:13px}
.nav-links a[aria-current="page"]{padding:20px 0 16px}
.feat.flip .feat-copy{order:0}
}
/* ---- problem quotes + thesis (home) ---- */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px}
.quote{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-md);padding:26px}
.quote .n{font-family:var(--font-mono);font-size:12px;letter-spacing:0.1em;color:var(--accent);display:block;margin-bottom:14px}
.quote p{margin:0;font-family:var(--font-serif);font-style:italic;font-size:16.5px;line-height:1.6;color:var(--fg-1)}
.thesis{margin:48px 0 0;font-size:clamp(21px,2.4vw,27px);line-height:1.4;letter-spacing:-0.015em;color:var(--fg);max-width:36ch;text-wrap:pretty}
.thesis em{color:var(--accent);font-style:normal}
.worst{margin:24px 0 0;background:var(--bg-inset);border:1px dashed var(--line-strong);border-radius:var(--radius-md);padding:18px 22px;font-size:15px;color:var(--fg-1)}
/* ---- why now (home) ---- */
.shifts{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px;counter-reset:shift}
.shift{border-top:2px solid var(--line-strong);padding-top:20px}
.shift::before{counter-increment:shift;content:"0" counter(shift);font-family:var(--font-mono);font-size:12px;color:var(--accent);letter-spacing:0.1em;display:block;margin-bottom:12px}
.shift h3{margin-bottom:16px}
.tn{display:grid;gap:12px}
.tn .row{font-size:14.5px;color:var(--fg-1);line-height:1.55}
.tn .k{font-family:var(--font-mono);font-size:10px;letter-spacing:0.16em;text-transform:uppercase;display:block;margin-bottom:4px}
.tn .then{color:var(--fg-2)}.tn .then .k{color:var(--fg-3)}
.tn .now .k{color:var(--accent)}
.steps-4{grid-template-columns:repeat(4,1fr)}
.steps-4 .step p{font-size:14.5px}
@media(max-width:960px){.quotes,.shifts,.steps-4{grid-template-columns:1fr}}
/* ---- built for enterprise scale (home) ---- */
.scale-grid{display:grid;grid-template-columns:380px 1fr;gap:72px;margin-top:52px;align-items:start}
.acct--stack{display:grid;gap:12px;padding:38px 18px 18px;background:linear-gradient(180deg,var(--accent-soft),transparent 60%)}
.acct--stack .node span{line-height:1.6}
.stack-arrow{text-align:center;color:var(--accent);font-size:17px;line-height:1;margin:10px 0}
.scale-stack .node-wh{background:var(--bg-1)}
.whys{margin:0;padding:0;list-style:none;counter-reset:why}
.whys li{display:grid;grid-template-columns:44px 1fr;gap:0 0px;padding:24px 0;border-top:1px solid var(--line)}
.whys li::before{counter-increment:why;content:counter(why);font-family:var(--font-mono);font-size:14px;color:var(--accent);padding-top:3px}
.whys li:first-child{padding-top:0;border-top:0}
.whys h3{grid-column:2;margin-bottom:8px}
.whys p{grid-column:2;margin:0;font-size:15.5px;color:var(--fg-1)}
.whys li::before{grid-row:span 2}
@media(max-width:960px){.scale-grid{grid-template-columns:1fr;gap:48px}}

@media(max-width:640px){
.nav-in{gap:16px}
.nav-links a:not(.btn){display:none}
.menu-btn{display:inline-flex}
.nav.open .nav-links a:not(.btn){display:block;font-size:15px;padding:4px 0}
.nav.open .nav-links{position:absolute;top:60px;left:0;right:0;flex-direction:column;align-items:stretch;gap:6px;background:var(--bg-1);border-bottom:1px solid var(--line);padding:16px 32px 20px}
.nav.open .nav-links a[aria-current="page"]{border-bottom:0;color:var(--accent)}
.nav.open .nav-links .btn{align-self:flex-start;margin-top:8px}
}