:root {
  color-scheme: light dark;
  --bg: #171918;
  --panel: #202321;
  --text: #f4f2ed;
  --muted: #aaa9a2;
  --gold: #e8ae32;
  --line: rgba(255,255,255,.12);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); min-height: 100vh; display: flex; flex-direction: column; }
a { color: inherit; text-decoration-color: rgba(232,174,50,.55); text-underline-offset: 4px; }
a:hover { color: var(--gold); }
.topbar { min-height: 76px; padding: 0 clamp(22px, 6vw, 88px); display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.brand { display: inline-flex; align-items: center; gap: 11px; font-size: 18px; font-weight: 650; text-decoration: none; letter-spacing: -.03em; }
.mark { width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center; color: #171918; background: var(--gold); font-size: 16px; font-weight: 800; letter-spacing: -.12em; padding-right: 2px; }
nav, footer div { display: flex; gap: 26px; }
nav a, footer a { color: var(--muted); font-size: 14px; text-decoration: none; }
.hero { width: min(880px, 100%); margin: auto; padding: 105px 28px 120px; }
.eyebrow { color: var(--gold); text-transform: uppercase; font-size: 12px; font-weight: 650; letter-spacing: .14em; }
h1 { margin: 16px 0 20px; font-size: clamp(48px, 8vw, 88px); line-height: .98; letter-spacing: -.065em; font-weight: 650; }
.intro, .lead { max-width: 610px; color: var(--muted); font-size: 19px; line-height: 1.65; }
.actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.button { min-height: 46px; padding: 0 19px; display: inline-flex; align-items: center; justify-content: center; border-radius: 13px; font-size: 14px; font-weight: 600; text-decoration: none; transition: transform .15s ease, background .15s ease, border-color .15s ease; }
.button:hover { transform: translateY(-1px); }
.primary { background: var(--gold); color: #171918; }
.primary:hover { background: #f1c45d; color: #171918; }
.secondary { border: 1px solid var(--line); background: var(--panel); }
.note { margin-top: 65px; padding-top: 18px; border-top: 1px solid var(--line); color: var(--muted); font-size: 13px; }
.dot { width: 7px; height: 7px; display: inline-block; margin: 0 8px 1px 0; border-radius: 50%; background: var(--gold); }
.document { width: min(760px, 100%); margin: 0 auto; padding: 76px 28px 100px; flex: 1; }
.document h1 { font-size: clamp(42px, 7vw, 64px); margin-bottom: 22px; }
.document .lead { font-size: 18px; margin-bottom: 46px; }
section { margin: 34px 0; }
h2 { font-size: 18px; letter-spacing: -.02em; margin-bottom: 10px; }
section p, .contact { color: var(--muted); font-size: 15px; line-height: 1.75; }
.contact { margin-top: 42px; }
.support .button { margin: 8px 0 0; }
.email { color: var(--muted); font-size: 14px; }
footer { min-height: 72px; padding: 18px clamp(22px, 6vw, 88px); border-top: 1px solid var(--line); color: var(--muted); font-size: 13px; display: flex; align-items: center; justify-content: space-between; }
@media (max-width: 560px) { .topbar { min-height: 66px; } nav, footer div { gap: 16px; } .hero { padding-top: 74px; } footer { align-items: flex-start; gap: 16px; flex-direction: column; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: .01ms !important; scroll-behavior: auto !important; } }
