:root{--bg:#0c0f14;--panel:#141a23;--ink:#e7edf5;--muted:#8a97a8;
--accent:#4cc2ff;--line:#222c39;--held:#3a4250}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--ink);
font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.62;
-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
text-rendering:optimizeLegibility;font-feature-settings:"kern","liga","calt";
letter-spacing:.002em}
::selection{background:rgba(76,194,255,.28);color:#fff}
a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:3px}
.nav{display:flex;gap:1.5rem;align-items:center;padding:.9rem 1.2rem;flex-wrap:wrap;
border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30;background:rgba(12,15,20,.92);
backdrop-filter:blur(6px)}
.brand{font-family:Rajdhani,Inter,sans-serif;font-weight:700;font-size:1.3rem;
letter-spacing:.06em;text-transform:uppercase}
.nav nav{display:flex;gap:1.1rem;font-size:.92rem}
.nav nav a[aria-current]{color:var(--ink);font-weight:600}
/* mobile hamburger: pure-CSS checkbox toggle, no JS. Hidden on desktop. */
.nav-toggle{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;margin:0}
.nav-burger{display:none;flex-direction:column;justify-content:center;gap:5px;margin-left:auto;
width:40px;height:34px;padding:8px 9px;border:1px solid var(--line);border-radius:9px;
background:var(--panel);cursor:pointer}
.nav-burger span{display:block;height:2px;width:100%;background:var(--ink);border-radius:2px;
transition:transform .2s,opacity .2s}
.fresh-badge{margin-left:auto;font-size:.74rem;letter-spacing:.04em;color:var(--muted);
border:1px solid var(--line);border-radius:999px;padding:.15rem .6rem;white-space:nowrap}
@media(max-width:720px){
  .nav-burger{display:flex}
  .nav nav{display:none;order:4;flex-basis:100%;flex-direction:column;gap:0;margin-top:.55rem}
  .nav-toggle:checked~nav{display:flex}
  .nav nav a{padding:.6rem .3rem;border-top:1px solid var(--line)}
  .nav-toggle:checked~.nav-burger{background:#1d2735}
  .nav-toggle:checked~.nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-toggle:checked~.nav-burger span:nth-child(2){opacity:0}
  .nav-toggle:checked~.nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .fresh-badge{order:5;margin-left:0;margin-top:.5rem;flex-basis:100%}
}
.hero-fresh{margin:.1rem 0 .4rem}
.hero-fresh .fresh-badge{margin-left:0;color:var(--accent);border-color:var(--accent)}
.card-fresh{display:block;font-size:.72rem;color:var(--muted);margin-top:.45rem}
.content,.foot{max-width:820px;margin:0 auto;padding:1.4rem 1.2rem}
section,[id]{scroll-margin-top:4.8rem}
.kind{display:inline-block;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;
color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:.15rem .6rem;
margin-bottom:1rem}
.kind-brief{color:var(--accent);border-color:var(--accent)}
h1,h2,h3{font-family:Rajdhani,Inter,sans-serif;letter-spacing:.01em;line-height:1.2;
font-weight:700}
h1{font-size:2.1rem;margin:.2rem 0}h2{margin-top:2rem;border-bottom:1px solid var(--line);
padding-bottom:.3rem}
.hero h1{font-size:clamp(2.2rem,6.5vw,3.1rem);letter-spacing:.02em;
background:linear-gradient(92deg,#eaf3fb,#a9d8ff 60%,#6cc6ff);
-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero p{color:var(--muted);max-width:64ch;font-size:1.02rem}
/* landing centerpiece: the live mini knowledge-graph (canvas drawn from graph.json) */
.hero-graph{position:relative;display:block;height:clamp(210px,32vw,300px);margin:1.1rem 0 .3rem;
border:1px solid var(--line);border-radius:14px;overflow:hidden;
background:radial-gradient(120% 140% at 50% -20%,rgba(76,194,255,.10),transparent 60%),
linear-gradient(160deg,#101722,#0b0f16)}
.hero-graph:hover{border-color:var(--accent);text-decoration:none}
.hero-graph canvas{position:absolute;inset:0;width:100%;height:100%;display:block;
opacity:0;transition:opacity .45s ease}
.hero-graph.is-live canvas{opacity:1}
.hero-graph-cta{position:absolute;left:0;right:0;bottom:0;display:flex;flex-wrap:wrap;gap:.4rem .8rem;
align-items:center;justify-content:space-between;padding:.55rem .9rem;
background:linear-gradient(transparent,rgba(8,12,18,.85))}
.hero-graph-badge{color:var(--muted);font-size:.74rem;letter-spacing:.03em}
.hero-graph-go{color:var(--accent);font-weight:600;font-size:.9rem}
.hero-graph:hover .hero-graph-go{text-decoration:underline}
@media(prefers-reduced-motion:reduce){.hero-graph canvas{transition:none}}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:.9rem}
.card{display:block;background:var(--panel);border:1px solid var(--line);border-radius:12px;
padding:1rem 1.1rem;transition:border-color .15s,transform .15s}
.card:hover{border-color:var(--accent);transform:translateY(-2px);text-decoration:none}
.card-kind{font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.card h3{margin:.4rem 0 0}
/* build-time sparklines (synthesis/sparkline.py) — colour via currentColor */
.spark{display:block;overflow:visible}
.spark-line{stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round;
vector-effect:non-scaling-stroke}
.spark-area{fill:currentColor;opacity:.13}
.spark-dot{fill:currentColor}
.card-spark{display:flex;align-items:center;gap:.55rem;margin-top:.7rem;color:var(--accent)}
.card-spark .spark{flex:1;min-width:0}
.card-spark-cap{font-size:.68rem;color:var(--muted);white-space:nowrap}
.card-spark-cap strong{color:var(--ink)}
/* landing autonomy counters — the proof strip on the front door (links to autonomy.html) */
.hero-counters{display:flex;flex-wrap:wrap;gap:.6rem;margin:1rem 0 .3rem}
.hero-counters .hc{display:flex;flex-direction:column;gap:.1rem;min-width:120px;
background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:.6rem .9rem;
transition:border-color .15s,transform .15s}
.hero-counters:hover{text-decoration:none}
.hero-counters:hover .hc{border-color:var(--accent)}
.hero-counters .hc b{font-family:Rajdhani,Inter,sans-serif;font-size:1.5rem;line-height:1.1;
color:var(--ink)}
.hero-counters .hc i{font-style:normal;font-size:.72rem;color:var(--muted);letter-spacing:.03em}
/* brief key-figures band + section chips — a brief opens as a dashboard, then the prose */
.stats-band{display:flex;flex-wrap:wrap;gap:.6rem;margin:.2rem 0 1.1rem}
.stats-band .stat{display:flex;flex-direction:column;gap:.15rem;min-width:130px;flex:0 1 auto;
background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:.6rem .85rem}
.stats-band .stat b{font-family:Rajdhani,Inter,sans-serif;font-size:1.35rem;line-height:1.1}
.stats-band .stat span{font-size:.7rem;color:var(--muted);letter-spacing:.02em}
.stats-band .stat-sparkline{color:var(--accent);min-width:190px}
.stats-band .stat-sparkline b{color:var(--ink)}
.stats-band .stat-sparkline .spark{margin-top:.35rem}
.toc-chips{display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 1.2rem}
.toc-chip{font-size:.74rem;color:var(--muted);border:1px solid var(--line);border-radius:999px;
padding:.18rem .65rem;transition:color .12s,border-color .12s}
.toc-chip:hover{color:var(--accent);border-color:var(--accent);text-decoration:none}
.pulse{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin:.9rem 0 .2rem;
padding:.55rem .8rem;background:var(--panel);border:1px solid var(--line);border-radius:10px}
.pulse-kind{font-size:.66rem;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);
font-weight:700}
.pulse-spark{color:var(--accent);line-height:0}
.pulse-cap{font-size:.8rem;color:var(--muted)}.pulse-cap strong{color:var(--ink)}
.demo-cta{display:block;background:linear-gradient(135deg,#15212e,#101722);
border:1px solid var(--accent);border-radius:14px;padding:1.3rem 1.4rem;margin:1.4rem 0 .5rem;
transition:transform .15s,box-shadow .15s}
.demo-cta:hover{transform:translateY(-2px);text-decoration:none;
box-shadow:0 6px 26px rgba(76,194,255,.18)}
.demo-cta h2{margin:.2rem 0;border:0;padding:0;color:var(--accent)}
.demo-cta p{color:var(--ink);margin:.3rem 0 0;max-width:70ch}
.demo-kind{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.qa{background:var(--panel);border:1px solid var(--line);border-radius:12px;
padding:1.1rem 1.3rem;margin:1.1rem 0}
.qa-head{display:flex;gap:.7rem;align-items:baseline}
.qa-id{font-family:JetBrains Mono,monospace;color:var(--accent);font-weight:700}
.qa h2{margin:.1rem 0;border:0;padding:0;font-size:1.25rem}
.chips{display:flex;flex-wrap:wrap;gap:.4rem;margin:.6rem 0}
.chip{font-size:.72rem;letter-spacing:.04em;color:var(--accent);border:1px solid var(--accent);
border-radius:999px;padding:.12rem .6rem}
.persona{color:var(--muted);font-size:.9rem;margin:.2rem 0 .6rem}
.claims{padding-left:1.1rem;margin:.2rem 0}.claims li{margin:.45rem 0}
.claims li p{margin:0}
.howmade{margin-top:2rem}
.src-list{columns:2;gap:1.4rem;list-style:none;padding-left:0}
@media(max-width:560px){.src-list{columns:1}}
table{border-collapse:collapse;width:100%;margin:1rem 0;font-size:.92rem;display:block;
overflow-x:auto}
th,td{border:1px solid var(--line);padding:.45rem .6rem;text-align:left;vertical-align:top}
th{background:var(--panel)}
blockquote{border-left:3px solid var(--accent);margin:1rem 0;padding:.2rem 1rem;
color:var(--muted);background:var(--panel);border-radius:0 8px 8px 0}
code{background:var(--panel);padding:.1rem .35rem;border-radius:5px;
font-family:JetBrains Mono,ui-monospace,monospace;font-size:.88em}
.foot{color:var(--muted);font-size:.8rem;border-top:1px solid var(--line);margin-top:2rem}
.benchmark-cta{background:linear-gradient(135deg,#1d1726,#14101c);border-color:#a98bff}
.benchmark-cta h2{color:#c9b3ff}
.benchmark-cta:hover{box-shadow:0 6px 26px rgba(169,139,255,.18)}
.graph-cta{background:linear-gradient(135deg,#26200f,#161209);border-color:#e0b34c}
.graph-cta h2{color:#ffd166}
.graph-cta:hover{box-shadow:0 6px 26px rgba(224,179,76,.18)}
.bench{background:var(--panel);border:1px solid var(--line);border-radius:12px;
padding:1.1rem 1.3rem;margin:1.4rem 0}
.bench h2{margin:.1rem 0 .4rem;border:0;padding:0;font-size:1.3rem}
.bench-q{color:var(--muted);font-size:.95rem;margin:.2rem 0 .9rem}
.cols{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin:.5rem 0 1rem}
@media(max-width:680px){.cols{grid-template-columns:1fr}}
.col{border:1px solid var(--line);border-radius:10px;padding:.7rem .85rem;background:#0f141b}
.col-az{border-color:var(--accent)}
.col-fc{border-color:#caa86a}.col-int{border-color:#a98bff}
.col-kind{font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);
margin-bottom:.5rem;font-weight:600}
.col-az .col-kind{color:var(--accent)}.col-fc .col-kind{color:#caa86a}
.col-int .col-kind{color:#a98bff}
.col p{margin:.4rem 0;font-size:.9rem}
.col .claims{padding-left:1rem;margin:.2rem 0}.col .claims li{margin:.4rem 0;font-size:.9rem}
.col .attr{color:var(--muted);font-size:.74rem;font-style:italic;margin-top:.6rem}
.col .proj{font-family:JetBrains Mono,monospace;font-size:.8rem;color:var(--ink)}
.col .lens{font-size:.84rem;color:var(--muted)}
.col .absent{color:var(--muted);font-style:italic}
table.score{font-size:.84rem}
table.score td.dim{font-weight:600;color:var(--ink)}
table.score td.cell-az{color:#dff3ff}
table.score tr.win td.cell-az{background:rgba(76,194,255,.08)}
table.score tr.concede td.cell-az{color:var(--muted)}
.verdict{border-left:3px solid var(--accent);background:#0f141b;border-radius:0 8px 8px 0;
padding:.5rem .9rem;margin-top:.4rem}.verdict p{margin:.3rem 0;font-size:.92rem}
.whatif{margin-top:1rem;border:1px dashed var(--line);border-radius:10px;
padding:.85rem 1rem;background:#0f141b;transition:border-color .15s}
.whatif.is-cf{border-color:#caa86a;border-style:solid}
.whatif-head{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;
justify-content:space-between;margin-bottom:.6rem}
.whatif-kind{font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;
color:var(--muted);font-weight:600}
.whatif-toggle{display:inline-flex;border:1px solid var(--line);border-radius:999px;
overflow:hidden}
.wf-btn{appearance:none;background:transparent;border:0;color:var(--muted);
font:inherit;font-size:.8rem;padding:.28rem .8rem;cursor:pointer;transition:all .12s}
.wf-btn:hover{color:var(--ink)}
.wf-btn.is-on{background:var(--accent);color:#08121b;font-weight:600}
.whatif.is-cf .wf-btn.is-on{background:#caa86a;color:#1a1407}
.whatif-input,.whatif-branch{margin:.35rem 0;font-size:.88rem;color:var(--ink)}
.whatif-src{margin:.2rem 0;font-size:.82rem;color:var(--muted)}
.whatif-src p{margin:0;display:inline}
.whatif code{background:#1a2230;padding:.08rem .35rem;border-radius:5px;
font-family:JetBrains Mono,ui-monospace,monospace;font-size:.84em}
.whatif-verdict{margin:.5rem 0;border-left:3px solid var(--accent);background:var(--panel);
border-radius:0 8px 8px 0;padding:.4rem .85rem}
.whatif.is-cf .whatif-verdict{border-left-color:#caa86a}
.whatif-verdict p{margin:.2rem 0;font-size:.92rem}
.whatif-note{margin:.5rem 0 0;font-size:.78rem;color:var(--muted);font-style:italic}
