
:root{color-scheme:dark;--bg:#08111f;--panel:#101c2d;--panel2:#142338;--text:#f3f7fb;--muted:#a9b7c8;--mint:#62e6c6;--line:#263a52;--blue:#8fc4ff}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(circle at top right,#14243a 0,#08111f 38%);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.65}
a{color:var(--blue)}
.shell{max-width:1120px;margin:0 auto;padding:28px 24px 72px}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:12px 0 28px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text);font-weight:800}
.brand img{width:42px;height:42px}.topbar nav{display:flex;gap:18px;flex-wrap:wrap}.topbar nav a{text-decoration:none;color:var(--muted)}
.breadcrumb{font-size:.92rem;color:var(--muted);margin:26px 0}.breadcrumb a{color:var(--muted)}
.hero{padding:34px 0 22px}.eyebrow{color:var(--mint);font-size:.82rem;font-weight:800;letter-spacing:.12em}.hero h1{font-size:clamp(2.3rem,5vw,4.7rem);line-height:1.02;margin:.25em 0}.hero p{font-size:1.18rem;max-width:820px;color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin:28px 0}
.card,.section{background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:18px;padding:22px}.card h2,.card h3,.section h2{margin-top:0}.card p,.section p,.section li{color:#c4cfdb}
.section{margin:18px 0}.section h2{font-size:1.55rem}
.pills{display:flex;gap:10px;flex-wrap:wrap}.pill{border:1px solid #34506d;background:#0d1928;border-radius:999px;padding:7px 11px;color:#cce4ff;font-size:.9rem}
.callout{border-left:4px solid var(--mint);background:#0d1a29;padding:16px 18px;border-radius:10px;margin:22px 0;color:#d8e3ee}
.cta{margin-top:32px;padding:26px;border:1px solid var(--line);border-radius:18px;background:#0e1b2b}.cta a.button{display:inline-block;margin-top:10px;background:var(--mint);color:#062018;padding:11px 16px;border-radius:10px;text-decoration:none;font-weight:800}
footer{margin-top:46px;padding-top:22px;border-top:1px solid var(--line);color:var(--muted);font-size:.92rem}
@media(max-width:720px){.topbar{align-items:flex-start;flex-direction:column}.hero h1{font-size:2.6rem}}
