:root { --bg:#fff; --fg:#1d2433; --muted:#5b6475; --line:#dde1ea; --card:#f4f6fb; --accent:#3f51b5; --on-accent:#fff; --hero:#eef0fb; }
@media (prefers-color-scheme: dark) { :root { --bg:#12151c; --fg:#e8ebf2; --muted:#a3acbd; --line:#2b3242; --card:#1a1f2a; --accent:#8c9eff; --on-accent:#10131a; --hero:#171b2a; } }
* { box-sizing: border-box; }
body { margin:0; font:17px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; background:var(--bg); color:var(--fg); }
.wrap { max-width:46rem; margin:0 auto; padding:0 16px; }
.hero { background:var(--hero); border-bottom:1px solid var(--line); padding:2.5rem 0 2rem; }
.eyebrow { margin:0; color:var(--accent); font-weight:600; font-size:.9rem; }
h1 { font-size:clamp(1.7rem,6vw,2.4rem); line-height:1.2; margin:.3rem 0 .6rem; }
h2 { font-size:1.35rem; margin:2.2rem 0 .6rem; }
.lead { font-size:1.1rem; color:var(--muted); margin:0 0 1.2rem; }
.cta { display:flex; flex-wrap:wrap; gap:.7rem; margin:1rem 0 .5rem; }
.btn { display:inline-block; padding:.75rem 1.2rem; border:2px solid var(--accent); border-radius:.6rem; color:var(--accent); font-weight:600; text-decoration:none; text-align:center; }
.btn.primary { background:var(--accent); color:var(--on-accent); }
.btn:hover, .btn:focus-visible { filter:brightness(1.1); outline:3px solid var(--line); }
.note { color:var(--muted); font-size:.92rem; margin:.3rem 0 0; }
.chips { list-style:none; padding:0; display:flex; flex-wrap:wrap; gap:.4rem; }
.chips li { background:var(--card); border:1px solid var(--line); border-radius:2rem; padding:.15rem .8rem; font-size:.92rem; }
.roadmap, .steps { padding-left:1.3rem; }
.roadmap li, .steps li { margin:.35rem 0; }
details { background:var(--card); border:1px solid var(--line); border-radius:.5rem; padding:.6rem 1rem; margin:.5rem 0; }
summary { cursor:pointer; font-weight:600; }
footer { color:var(--muted); font-size:.88rem; padding-top:1.5rem; padding-bottom:2rem; border-top:1px solid var(--line); margin-top:2.5rem; }
a { color:var(--accent); }