:root {
  color-scheme: dark;
  --bg: #070a12;
  --surface: #101827;
  --ink: #eef3fa;
  --muted: #bac6d7;
  --mint: #7cf3c3;
  --line: #2c3b50;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: radial-gradient(ellipse at top right, #142c39, transparent 60%), var(--bg);
  font: 1rem/1.6 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
a { color: var(--mint); text-underline-offset: .2em; overflow-wrap: anywhere; }
a:hover { text-decoration-thickness: .15em; }
a:focus-visible { outline: 3px solid var(--mint); outline-offset: 5px; border-radius: 3px; }
.wrap { width: min(100% - 40px, 1080px); margin-inline: auto; }
.skip-link { position: absolute; top: -100px; left: 20px; z-index: 5; background: var(--bg); padding: 12px; }
.skip-link:focus { top: 12px; }
.notice { margin: 0; padding: 10px 20px; border-bottom: 1px solid var(--line); background: #172534; color: #d7e8f2; text-align: center; font-size: .875rem; }
.site-header { border-bottom: 1px solid var(--line); }
.header-inner { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px; padding-block: 22px; }
.brand { display: flex; align-items: center; gap: 12px; color: var(--ink); text-decoration: none; }
.brand svg { width: 46px; height: 46px; flex: none; }
.brand strong { display: block; font-size: 1.05rem; }
.brand small { display: block; color: var(--muted); font-size: .8rem; }
nav { display: flex; flex-wrap: wrap; gap: 14px 24px; }
nav a { color: var(--ink); }
nav [aria-current="page"] { color: var(--mint); text-decoration-thickness: .15em; }
.hero { padding: 74px 0 62px; max-width: 860px; }
.hero--short { padding-bottom: 36px; }
.eyebrow { margin: 0 0 16px; color: var(--mint); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; font-size: .78rem; }
h1 { margin: 0 0 24px; font-size: clamp(2.25rem, 6vw, 4rem); letter-spacing: -.04em; line-height: 1.08; }
h2 { margin: 0 0 18px; font-size: clamp(1.5rem, 3vw, 2rem); letter-spacing: -.02em; line-height: 1.25; }
h3 { margin: 0 0 8px; font-size: 1.15rem; line-height: 1.4; }
p { margin: 0 0 18px; max-width: 78ch; }
.lead { color: var(--muted); font-size: 1.15rem; max-width: 65ch; }
.facts { display: flex; flex-wrap: wrap; gap: 10px 26px; margin: 28px 0; color: var(--muted); }
.actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 26px; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 11px 18px; border: 1px solid var(--mint); border-radius: 12px; background: var(--mint); color: #102536; font-weight: 750; text-decoration: none; }
.button--secondary { color: var(--mint); background: transparent; }
.section { padding: 48px 0; border-top: 1px solid var(--line); }
.steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 28px; }
.card { padding: 26px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); min-width: 0; }
.card p:last-child { margin-bottom: 0; }
.step-number { display: block; margin-bottom: 12px; color: var(--mint); font-weight: 750; font-size: .85rem; }
.muted, .card p { color: var(--muted); }
.prose { max-width: 78ch; }
.support-address { font-size: clamp(1.1rem, 3vw, 1.6rem); font-weight: 700; }
ul { margin: 10px 0 24px; padding-left: 22px; }
li { margin: 8px 0; }
.status-note { padding: 18px 22px; border-left: 3px solid var(--mint); background: var(--surface); color: var(--muted); }
.legal { max-width: 940px; }
.legal .section { max-width: 78ch; }
.contents { padding: 22px 0 34px; gap: 12px 22px; }
.contents a { font-size: .9rem; }
.review-note { padding: 18px 22px; border: 1px dashed #ae995b; border-radius: 12px; background: #242217; color: #e8ddb9; }
.review-note p:last-child { margin-bottom: 0; }
footer { padding: 30px 0 42px; border-top: 1px solid var(--line); color: var(--muted); font-size: .9rem; }
.footer-inner { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px 28px; }
footer p { margin: 0; }
@media (max-width: 620px) {
  .wrap { width: calc(100% - 32px); }
  .header-inner { align-items: flex-start; }
  .hero { padding-top: 44px; padding-bottom: 40px; }
  .steps { grid-template-columns: 1fr; gap: 16px; }
  .section { padding: 34px 0; }
  .card { padding: 22px; }
  .actions .button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
