:root { color-scheme: light dark; --bg:#ffffff; --fg:#1d2433; --muted:#5b6475; --line:#d9dde5; --accent:#1f5fbf; }
@media (prefers-color-scheme: dark) { :root { --bg:#12161f; --fg:#e6e9f0; --muted:#98a1b3; --line:#2a3141; --accent:#7fb0ff; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:16px/1.65 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
header, main, footer { max-width:46rem; margin:0 auto; padding:0 1.25rem; }
header { padding-top:1.5rem; padding-bottom:1rem; border-bottom:1px solid var(--line); }
header .brand { font-weight:700; font-size:1.15rem; }
header .brand small { display:block; font-weight:400; color:var(--muted); font-size:.85rem; }
nav { margin-top:.75rem; display:flex; flex-wrap:wrap; gap:.25rem 1.1rem; font-size:.95rem; }
a { color:var(--accent); }
main { padding-top:1.75rem; padding-bottom:2rem; }
h1 { font-size:1.75rem; line-height:1.25; margin:.2rem 0 .4rem; }
h2 { font-size:1.2rem; margin:2rem 0 .4rem; }
p, li { margin:.5rem 0; }
.meta { color:var(--muted); font-size:.9rem; }
.note { border:1px solid var(--line); border-radius:8px; padding:.75rem 1rem; margin:1.25rem 0; }
footer { border-top:1px solid var(--line); padding-top:1rem; padding-bottom:2rem; color:var(--muted); font-size:.85rem; }

/* Landing page (index/launch). Additive: other pages keep the narrow layout above. */
body.landing header, body.landing main, body.landing footer { max-width:none; padding:0; margin:0; border:0; }
.landing .wrap { max-width:62rem; margin:0 auto; padding:0 1.25rem; }
.landing .top { border-bottom:1px solid var(--line); }
.landing .bar { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-top:1rem; padding-bottom:1rem; }
.landing .logo { display:flex; align-items:center; gap:.6rem; font-weight:700; font-size:1.15rem; color:var(--fg); text-decoration:none; }
.landing .mark { display:inline-grid; place-items:center; width:2rem; height:2rem; border-radius:.5rem; background:#fc432b; color:#fff; font-size:.8rem; font-weight:800; }
.landing nav { margin:0; }
.hero { background:linear-gradient(135deg, #1b2236 0%, #2c1d3d 100%); color:#fff; padding:4rem 0 3.5rem; }
.hero .eyebrow { text-transform:uppercase; letter-spacing:.08em; font-size:.8rem; font-weight:700; color:#ffb4a8; margin:0 0 .75rem; }
.hero h1 { font-size:clamp(1.9rem, 4.5vw, 3rem); line-height:1.15; max-width:46rem; margin:0 0 1rem; }
.hero .lead { font-size:1.15rem; max-width:44rem; color:#dfe3ee; margin:0 0 1.5rem; }
.hero .fine { color:#c4cad9; font-size:.9rem; max-width:44rem; margin-top:1.5rem; }
.actions { display:flex; flex-wrap:wrap; gap:.75rem; }
.btn { display:inline-block; padding:.7rem 1.25rem; border-radius:.6rem; background:#fc432b; color:#fff; text-decoration:none; font-weight:700; }
.btn.ghost { background:transparent; border:2px solid rgba(255,255,255,.5); }
.landing main { padding:2.5rem 0 1.5rem; }
.landing main h2 { font-size:1.4rem; margin:2.5rem 0 1rem; }
.cards { display:grid; grid-template-columns:repeat(auto-fit, minmax(15rem, 1fr)); gap:1rem; }
.cards.two { grid-template-columns:repeat(auto-fit, minmax(20rem, 1fr)); }
.card { border:1px solid var(--line); border-radius:.9rem; padding:1.25rem; color:var(--fg); text-decoration:none; }
.card h3 { margin:0 0 .4rem; font-size:1.05rem; }
.card p { margin:0; color:var(--muted); font-size:.95rem; }
.card.link span { display:inline-block; margin-top:.75rem; color:var(--accent); font-weight:600; }
.card.link:hover { border-color:var(--accent); }
.steps { padding-left:1.25rem; }
.steps li { margin:.6rem 0; }
.landing .fine { color:var(--muted); font-size:.9rem; }
.landing footer { border-top:1px solid var(--line); padding-top:1.25rem; padding-bottom:2rem; color:var(--muted); font-size:.85rem; }
.landing .hero .fine { color:#c4cad9; }
.landing.inner main { max-width:46rem; margin:0 auto; padding:2rem 1.25rem; }
.landing.inner main h1 { font-size:1.9rem; }