:root { color-scheme: dark; --bg:#070b1d; --panel:#11182d; --text:#f8f9ff; --muted:#b3b9cb; --cyan:#5ce6f4; --violet:#a787ff; --yellow:#ffda38; }
* { box-sizing:border-box; }
body { margin:0; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:var(--text); background:radial-gradient(circle at 80% 15%,#181a52 0,transparent 34rem),var(--bg); line-height:1.6; }
a { color:var(--cyan); }
.site-header { max-width:1120px; margin:auto; padding:20px 24px; display:flex; justify-content:space-between; align-items:center; gap:24px; }
.brand { display:flex; align-items:center; gap:12px; color:var(--text); text-decoration:none; font-weight:900; letter-spacing:.16em; }
.brand img { border-radius:12px; }
nav { display:flex; gap:20px; } nav a { color:var(--muted); text-decoration:none; font-weight:700; } nav a:hover { color:var(--cyan); }
main { max-width:1120px; margin:auto; padding:36px 24px 80px; }
.hero { min-height:72vh; display:grid; grid-template-columns:1.25fr .75fr; align-items:center; gap:56px; }
.hero h1 { font-size:clamp(3.4rem,8vw,7.4rem); line-height:.92; letter-spacing:-.06em; margin:.16em 0; }
.eyebrow { color:var(--cyan); font-weight:900; letter-spacing:.18em; }
.lede { max-width:650px; color:var(--muted); font-size:clamp(1.2rem,2.5vw,1.7rem); }
.pill-row { display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; } .pill-row span { border:1px solid #303957; background:#11182dcc; padding:8px 13px; border-radius:999px; font-weight:700; }
.phone { width:min(100%,360px); justify-self:center; border-radius:38px; box-shadow:0 30px 90px #000b,0 0 55px #5ce6f433; }
.feature-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin:70px 0; }
.feature-grid article,.cta,.document { border:1px solid #29324c; border-radius:24px; background:#11182de8; padding:28px; }
.feature-grid h2,.cta h2 { margin-top:0; } .feature-grid p,.cta p,.document p,.document li { color:var(--muted); }
.cta { text-align:center; padding:52px 28px; }
.document { max-width:820px; margin:auto; } .document h1 { font-size:clamp(2.5rem,6vw,4.5rem); line-height:1; } .document h2 { margin-top:2.2em; color:var(--cyan); } .document h3 { margin-top:1.8em; } code { color:var(--yellow); }
footer { text-align:center; color:var(--muted); padding:28px 24px 48px; }
@media (max-width:760px) { .site-header { align-items:flex-start; } nav { gap:12px; font-size:.92rem; } .hero { grid-template-columns:1fr; text-align:center; padding-top:35px; } .lede { margin-inline:auto; } .pill-row { justify-content:center; } .phone { width:min(74vw,340px); } .feature-grid { grid-template-columns:1fr; } }