:root {
  color: #172033;
  background: #f7f9fc;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
}

* { box-sizing: border-box; }

body { margin: 0; min-width: 320px; }

a { color: inherit; }

.page { min-height: 100vh; overflow: hidden; }

.header, .legal-hero, .legal-content-wrap, .footer {
  padding-left: max(24px, calc((100% - 900px) / 2));
  padding-right: max(24px, calc((100% - 900px) / 2));
}

.header {
  align-items: center;
  background: #0d1319;
  border-bottom: 1px solid rgba(255, 255, 255, .085);
  display: flex;
  justify-content: space-between;
  min-height: 76px;
}

.brand { align-items: center; color: #edf1f3; display: inline-flex; font-size: 15px; font-weight: 720; gap: 11px; letter-spacing: -.01em; text-decoration: none; }
.brand img { filter: invert(1); height: 36px; object-fit: contain; width: 36px; }
.nav a { color: #9ca9b3; font-size: 14px; font-weight: 650; padding: 12px 0; text-decoration: none; transition: color 160ms ease; }
.nav a:hover { color: #fff; }

.legal-hero {
  background: radial-gradient(circle at 86% 12%, rgba(96, 100, 220, .2), transparent 36%), linear-gradient(145deg, #f9fbff 0%, #f2f4fa 100%);
  padding-bottom: 54px;
  padding-top: 68px;
  text-align: center;
}

.eyebrow { color: #5962c9; font-size: .75rem; font-weight: 800; letter-spacing: .11em; margin: 0 0 14px; text-transform: uppercase; }
h1, h2, p { margin-top: 0; }
h1 { font-size: clamp(2.35rem, 5vw, 4.4rem); letter-spacing: -.062em; line-height: .98; margin-bottom: 18px; }
.legal-hero > p:last-child { color: #526078; font-size: 1.03rem; line-height: 1.6; margin: 0 auto; max-width: 600px; }

.legal-content-wrap { background: #fff; padding-bottom: 88px; padding-top: 56px; }
.legal-document { background: #f6f8fc; border: 1px solid #e5eaf2; border-radius: 20px; margin: 0 auto; max-width: 800px; padding: clamp(26px, 5vw, 48px); }
.back-link { color: #4450b7; display: inline-flex; font-size: .92rem; font-weight: 760; margin-bottom: 30px; text-decoration: none; }
.back-link:hover { color: #27338e; }
.legal-copy { color: #526078; font-size: 1rem; line-height: 1.72; }
.legal-copy p { margin-bottom: 20px; }
.legal-copy h2 { color: #172033; font-size: 1.22rem; letter-spacing: -.025em; line-height: 1.2; margin: 33px 0 11px; }
.legal-copy ul { margin: 0 0 20px; padding-left: 22px; }
.legal-copy a { color: #4450b7; font-weight: 700; }

.footer { align-items: center; background: #101827; color: #fff; display: flex; gap: 24px; justify-content: space-between; min-height: 124px; }
.footer-links { display: flex; flex-wrap: wrap; gap: 20px; }
.footer a { color: #bec7d7; font-size: .9rem; text-decoration: none; }
.footer .brand { color: #fff; }
.footer a:hover { color: #fff; }
.footer p { color: #8c99b0; font-size: .82rem; margin: 0; white-space: nowrap; }

@media (max-width: 620px) {
  .header { min-height: 68px; }
  .legal-hero { padding-bottom: 43px; padding-top: 52px; }
  .legal-content-wrap { padding-bottom: 64px; padding-top: 42px; }
  .footer { align-items: flex-start; flex-direction: column; justify-content: center; padding-bottom: 30px; padding-top: 30px; }
  .footer-links { gap: 15px; }
}

@media (max-width: 420px) {
  .header, .legal-hero, .legal-content-wrap, .footer { padding-left: 18px; padding-right: 18px; }
}
