:root { --ink:#11151b; --ink-raised:#19202a; --paper:#f4f0e8; --paper-raised:#fffcf7; --text:#161a20; --muted:#56606c; --light:#d6d1c7; --line-dark:rgba(255,252,247,.24); --line-light:#c9c2b6; --rust:#9b3f27; --rust-dark:#7e2e1b; --gold:#e8c86d; --cyan:#bde2e1; --sans:"DM Sans",Arial,sans-serif; --serif:"Instrument Serif",Georgia,serif; --mono:"DM Mono",ui-monospace,monospace; --gutter:clamp(1.15rem,3.3vw,3.4rem); --wrap:72rem; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
html[data-restoring-scroll] { scroll-behavior:auto; }
body { margin:0; background:var(--paper); color:var(--text); font-family:var(--sans); -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
a:focus-visible { outline:3px solid var(--gold); outline-offset:4px; }
.skip { position:fixed; z-index:100; top:.75rem; left:var(--gutter); padding:.75rem 1rem; background:var(--gold); color:var(--ink); font-weight:700; transform:translateY(-180%); transition:transform .18s ease; }
.skip:focus { transform:translateY(0); }
.site-header { background:var(--ink); color:var(--paper); }
.header-row, .case-footer { width:min(calc(100% - (var(--gutter) * 2)),var(--wrap)); margin:0 auto; }
.header-row { min-height:5.1rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.brand { display:inline-flex; align-items:center; gap:.75rem; min-height:44px; font-size:.9rem; font-weight:700; letter-spacing:-.035em; }
.brand-mark { display:grid; place-items:center; width:2rem; height:2rem; border:1px solid rgba(255,252,247,.65); border-radius:50%; font:500 .62rem var(--mono); letter-spacing:-.09em; }
.site-nav { display:flex; align-items:center; flex-wrap:wrap; justify-content:flex-end; gap:1.2rem; color:rgba(255,252,247,.76); font-size:.78rem; font-weight:600; }
.site-nav a { min-height:44px; display:inline-flex; align-items:center; }
.site-nav a:hover { color:var(--gold); }
.case-hero { position:relative; padding:clamp(4rem,9vw,7rem) 0 clamp(3rem,7vw,5.5rem); overflow:hidden; background:var(--ink); color:var(--paper); }
.case-hero::after { content:""; position:absolute; width:min(58vw,46rem); aspect-ratio:1; top:-54%; right:-17%; border:1px solid rgba(232,200,109,.34); border-radius:50%; box-shadow:0 0 0 clamp(2.5rem,6vw,5.5rem) rgba(198,93,62,.09); }
.case-shell { position:relative; z-index:1; width:min(calc(100% - (var(--gutter) * 2)),var(--wrap)); margin:0 auto; }
.label { margin:0; color:var(--gold); font:500 .69rem/1.35 var(--mono); letter-spacing:.1em; text-transform:uppercase; }
.label::before { content:""; display:inline-block; width:1.9rem; height:1px; margin:0 .7rem .22rem 0; background:currentColor; vertical-align:middle; }
h1 { max-width:15ch; margin:1.6rem 0 0; font:400 clamp(3.2rem,6.4vw,6.2rem)/.9 var(--serif); letter-spacing:-.065em; text-wrap:balance; }
.hero-lede { max-width:43rem; margin:1.75rem 0 0; color:rgba(255,252,247,.8); font-size:clamp(1.04rem,1.55vw,1.27rem); line-height:1.62; text-wrap:pretty; }
.case-main { padding:clamp(3rem,7vw,6.5rem) 0; }
.case-layout { display:grid; grid-template-columns:minmax(9rem,.38fr) minmax(0,1.62fr); gap:clamp(2rem,7vw,7rem); }
.case-side { position:sticky; top:2rem; align-self:start; color:var(--rust); font:500 .69rem/1.58 var(--mono); letter-spacing:.09em; text-transform:uppercase; }
.case-side-label { display:block; margin-bottom:.7rem; color:var(--text); }
.case-content { max-width:48rem; }
.case-section { padding:0 0 2.1rem; margin:0 0 2.1rem; border-bottom:1px solid var(--line-light); }
.case-section h2 { margin:0 0 .8rem; color:var(--rust); font:500 .74rem/1.35 var(--mono); letter-spacing:.1em; text-transform:uppercase; }
.case-section p { margin:0; color:var(--muted); font-size:1.02rem; line-height:1.72; text-wrap:pretty; }
.case-section p + p { margin-top:1rem; }
.case-facts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.8rem; margin:0; padding:0; list-style:none; }
.case-facts li { min-height:7.1rem; padding:1rem; border:1px solid var(--line-light); background:var(--paper-raised); display:flex; flex-direction:column; justify-content:space-between; gap:.55rem; transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease; }
.case-facts strong { color:var(--rust); font:400 clamp(1.65rem,3vw,2.3rem)/1 var(--serif); letter-spacing:-.045em; transition:color .18s ease; }
.case-facts span { color:var(--muted); font-size:.79rem; line-height:1.4; transition:color .18s ease; }
@media (hover:hover) { .case-facts li:hover { background:var(--ink); border-color:var(--ink); color:var(--paper); transform:translateY(-2px); } .case-facts li:hover strong { color:var(--gold); } .case-facts li:hover span { color:var(--light); } }
.case-facts--rail { gap:0; border-top:1px solid var(--line-light); }
.case-facts--rail li { position:relative; min-height:8rem; padding:1.1rem 1rem 1.1rem 2.05rem; border:0; border-bottom:1px solid var(--line-light); background:transparent; }
.case-facts--rail li::before { content:counter(fact, decimal-leading-zero); position:absolute; top:1.15rem; left:0; color:var(--rust); font:500 .63rem var(--mono); letter-spacing:.08em; }
.case-facts--rail { counter-reset:fact; }
.case-facts--rail li { counter-increment:fact; }
@media (hover:hover) { .case-facts--rail li:hover { background:transparent; border-color:var(--rust); transform:translateX(.25rem); } .case-facts--rail li:hover strong { color:var(--rust); } .case-facts--rail li:hover span { color:var(--text); } }
.capability-grid, .knowledge-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem; margin-top:1.25rem; }
.capability-grid article, .knowledge-grid article { padding:1rem; border:1px solid var(--line-light); background:var(--paper-raised); transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease; }
.capability-grid h3, .knowledge-grid h3 { margin:0; color:var(--rust); font:.75rem var(--mono); letter-spacing:.06em; text-transform:uppercase; transition:color .18s ease; }
.capability-grid p, .knowledge-grid p { margin:.65rem 0 0; color:var(--muted); font-size:.88rem; line-height:1.5; transition:color .18s ease; }
@media (hover:hover) { .capability-grid article:hover, .knowledge-grid article:hover { background:var(--ink); border-color:var(--ink); transform:translateY(-2px); } .capability-grid article:hover h3, .knowledge-grid article:hover h3 { color:var(--gold); } .capability-grid article:hover p, .knowledge-grid article:hover p { color:var(--light); } }
.card-index { display:block; margin-bottom:1.15rem; color:var(--gold); font:500 .67rem var(--mono); letter-spacing:.1em; }
.system-map-section { padding-bottom:2.5rem; }
.system-map-intro { max-width:43rem; }
.node-network { position:relative; min-height:31rem; margin-top:1.3rem; overflow:hidden; isolation:isolate; background:radial-gradient(circle at 50% 50%,rgba(232,200,109,.13),transparent 14rem),radial-gradient(circle at 12% 20%,rgba(189,226,225,.09),transparent 14rem),radial-gradient(circle at 88% 77%,rgba(155,63,39,.12),transparent 15rem),var(--ink); }
.node-network::before { content:""; position:absolute; inset:1rem; border:1px solid rgba(255,252,247,.15); pointer-events:none; }
.node-lines { position:absolute; inset:0; width:100%; height:100%; overflow:visible; z-index:-1; }
.node-lines path { fill:none; stroke:rgba(232,200,109,.64); stroke-width:1.4; vector-effect:non-scaling-stroke; }
.network-node { position:absolute; z-index:1; display:flex; align-items:center; gap:.75rem; width:clamp(9rem,27%,13.5rem); color:var(--paper); }
.network-node > div { position:relative; z-index:1; text-shadow:0 0 .38rem var(--ink),0 0 .8rem var(--ink),0 0 1.25rem var(--ink); }
.network-node strong { display:block; color:var(--paper); font:400 clamp(1.18rem,2.25vw,1.72rem)/1 var(--serif); letter-spacing:-.035em; }
.network-node small { display:block; margin-top:.42rem; color:var(--light); font-size:.7rem; line-height:1.42; }
.node-dot { position:relative; z-index:2; flex:0 0 auto; display:grid; place-items:center; width:3.35rem; height:3.35rem; border:1px solid var(--gold); border-radius:50%; background:var(--ink); color:var(--gold); font:500 .67rem var(--mono); letter-spacing:.06em; box-shadow:0 0 0 .4rem rgba(17,21,27,.92); }
.node-input { top:12%; left:6%; }
.node-knowledge { bottom:17%; left:6%; }
.node-core { top:40%; left:50%; width:15rem; flex-direction:column; gap:.72rem; text-align:center; transform:translate(-50%,-50%); }
.node-core .node-dot { width:6.3rem; height:6.3rem; border-color:var(--cyan); color:var(--cyan); font-size:1.8rem; box-shadow:0 0 0 .55rem rgba(17,21,27,.76),0 0 2.2rem rgba(189,226,225,.18); }
.node-core small { max-width:13rem; }
.node-agents { top:12%; right:6%; }
.node-systems { right:6%; bottom:17%; }
.case-back { display:inline-flex; align-items:center; min-height:46px; padding:.72rem 1rem; border:1px solid var(--text); font-size:.82rem; font-weight:700; transition:background .18s ease,color .18s ease,transform .18s ease; }
.case-back:hover { background:var(--ink); color:var(--paper); transform:translateY(-2px); }
.case-footer { padding:1.5rem 0 2rem; color:var(--muted); font:.68rem var(--mono); border-top:1px solid var(--line-light); }
@media (hover:none) { .case-facts li:active, .capability-grid article:active, .knowledge-grid article:active { transform:scale(.985); } }
@media (max-width:920px) { .case-facts { grid-template-columns:repeat(2,minmax(0,1fr)); } .node-network { min-height:33rem; } .node-input,.node-knowledge { left:4%; } .node-agents,.node-systems { right:4%; } }
@media (max-width:700px) { .header-row { padding:.45rem 0; align-items:flex-start; flex-direction:column; } .brand { gap:0; } .brand-name { display:none; } .site-nav { justify-content:flex-start; gap:1rem; } .case-layout { grid-template-columns:1fr; gap:1.1rem; } .case-side { position:static; } .case-facts, .capability-grid, .knowledge-grid { grid-template-columns:1fr; } .node-network { display:flex; flex-direction:column; gap:1.1rem; min-height:0; padding:1.25rem 1.25rem 1.15rem; background:linear-gradient(180deg,rgba(189,226,225,.08),transparent 30%),var(--ink); } .node-network::before { inset:.6rem; } .node-lines { display:none; } .network-node { position:relative; inset:auto; left:auto; right:auto; bottom:auto; width:100%; min-height:3.8rem; transform:none; } .network-node:not(:last-child)::after { content:""; position:absolute; left:1.66rem; top:3.4rem; bottom:-1.16rem; width:1px; background:linear-gradient(var(--gold),rgba(232,200,109,.15)); } .node-core { flex-direction:row; text-align:left; } .node-core .node-dot { width:3.8rem; height:3.8rem; font-size:1.15rem; box-shadow:0 0 0 .4rem rgba(17,21,27,.72),0 0 1.5rem rgba(189,226,225,.16); } .node-core small { max-width:none; } h1 { max-width:14ch; font-size:clamp(3.1rem,14.2vw,4.7rem); } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition-duration:.01ms !important; animation-duration:.01ms !important; } }