:root {
  color-scheme: dark;
  --bg: #090d18;
  --panel: #121827;
  --ink: #f7f8fb;
  --muted: #a7afc1;
  --border: #283044;
  --coral: #ff4d6d;
  --coral-soft: #ff7891;
}

* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.65; }
a { color: var(--coral-soft); }
header, main, footer { width: min(880px, calc(100% - 36px)); margin: 0 auto; }
header { display: flex; align-items: center; gap: 14px; padding: 28px 0 18px; border-bottom: 1px solid var(--border); }
.mark { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--coral); color: white; font-size: 27px; font-weight: 900; transform: rotate(-8deg); }
.mark span { transform: rotate(8deg); }
h1 { margin: 0; font-size: clamp(2rem, 7vw, 3.6rem); line-height: 1.05; }
h2 { margin-top: 2.1rem; font-size: 1.35rem; }
h3, p, ul { margin-top: 0.75rem; }
.tagline, .muted { color: var(--muted); }
.hero { padding: 72px 0 46px; }
.hero p { max-width: 680px; font-size: 1.15rem; color: var(--muted); }
.actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.button { display: inline-block; padding: 11px 17px; border-radius: 12px; border: 1px solid var(--coral); background: var(--coral); color: white; font-weight: 800; text-decoration: none; }
.button.secondary { background: var(--panel); border-color: var(--border); }
.card { margin: 26px 0; padding: 20px; border: 1px solid var(--border); border-radius: 18px; background: var(--panel); }
.policy { padding: 40px 0; }
footer { padding: 30px 0 46px; border-top: 1px solid var(--border); color: var(--muted); font-size: 0.9rem; }
nav { margin-left: auto; display: flex; gap: 16px; }
@media (max-width: 560px) { nav { display: none; } .hero { padding-top: 48px; } }