:root {
  color-scheme: dark;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #07111f;
  color: #e5eefc;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(circle at 12% 8%, rgba(37, 99, 235, .30), transparent 34%),
    radial-gradient(circle at 88% 25%, rgba(6, 182, 212, .18), transparent 30%),
    linear-gradient(145deg, #020617, #0f172a 55%, #132c4d);
  line-height: 1.65;
}

main { width: min(860px, calc(100% - 32px)); margin: 0 auto; padding: 56px 0 72px; }

.eyebrow { color: #7dd3fc; font-size: .8rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
h1 { margin: 8px 0 14px; font-size: clamp(2rem, 6vw, 3.25rem); line-height: 1.05; }
h2 { margin: 34px 0 8px; color: #bfdbfe; font-size: 1.25rem; }
p, li { color: #cbd5e1; }
.lead { max-width: 700px; font-size: 1.08rem; }
.card { margin-top: 28px; padding: clamp(22px, 5vw, 38px); border: 1px solid rgba(191, 219, 254, .16); border-radius: 24px; background: rgba(15, 23, 42, .76); box-shadow: 0 24px 70px rgba(0, 0, 0, .28); }
.actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 24px 0 6px; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 11px 18px; border-radius: 12px; background: #2563eb; color: white; font-weight: 750; text-decoration: none; }
.button.secondary { background: rgba(125, 211, 252, .10); border: 1px solid rgba(125, 211, 252, .28); color: #bae6fd; }
.notice { margin-top: 22px; padding: 16px 18px; border-left: 3px solid #38bdf8; border-radius: 8px; background: rgba(14, 165, 233, .08); }
a { color: #7dd3fc; }
nav { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 24px; }
nav a { color: #bae6fd; text-decoration: none; font-weight: 650; }
footer { margin-top: 42px; color: #64748b; font-size: .88rem; }
ul { padding-left: 22px; }

@media (max-width: 520px) {
  main { padding-top: 32px; }
  .button { width: 100%; }
}
