:root {
  --bg: #0b1020; --panel: #121a33; --ink: #e8ecf8; --muted: #a3acc7; --accent: #22c55e; --line: #24305a; --gold: #f5b942;
}
@media (prefers-color-scheme: light) {
  :root { --bg: #f6f7fb; --panel: #ffffff; --ink: #121626; --muted: #4b5470; --accent: #15803d; --line: #dfe3ef; --gold: #b7791f; }
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  background: var(--bg); color: var(--ink);
  font: 16px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, sans-serif;
}
.hero {
  max-width: 880px; margin: 0 auto; padding: 72px 16px 40px; text-align: center;
  background: radial-gradient(60% 80% at 50% 0%, rgba(34,197,94,.16), transparent 70%);
}
.mark { display: block; margin: 0 auto 16px; }
.eyebrow { color: var(--gold); letter-spacing: .14em; text-transform: uppercase; font-size: 13px; margin: 0; }
h1 { font-size: clamp(40px, 9vw, 72px); line-height: 1.05; margin: 8px 0 16px; letter-spacing: -.02em; }
.lede { color: var(--muted); font-size: 19px; max-width: 640px; margin: 0 auto 24px; }
.badge {
  display: inline-block; margin: 0; padding: 8px 14px; border-radius: 999px; font-size: 14px;
  border: 1px solid var(--accent); color: var(--accent); background: rgba(34,197,94,.08);
}
main { max-width: 880px; margin: 0 auto; padding: 0 16px 48px; }
.steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin: 24px 0 40px; }
.steps article { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 20px; }
.steps h2 { font-size: 18px; margin: 8px 0 6px; }
.steps p { color: var(--muted); margin: 0; font-size: 15px; }
.n {
  display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%;
  background: var(--accent); color: #04130a; font-weight: 700; font-size: 14px;
}
.facts { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 20px 24px; }
.facts h2 { font-size: 18px; margin: 0 0 12px; }
dl { display: grid; grid-template-columns: max-content 1fr; gap: 8px 20px; margin: 0; }
dt { color: var(--muted); }
dd { margin: 0; overflow-wrap: anywhere; }
footer { text-align: center; color: var(--muted); font-size: 14px; padding: 24px 16px 48px; border-top: 1px solid var(--line); }
