/* ============================================================
   Dabit — legal & support pages
   Built on the same tokens as styles.css (Inter, blue palette,
   dark gradient header, white cards, dark footer) so these
   pages feel native to the landing site. Load AFTER styles.css.
   ============================================================ */

.legal-hero {
  position: relative;
  background:
    radial-gradient(1100px 500px at 80% -20%, rgba(32, 138, 239, 0.5), transparent 60%),
    radial-gradient(800px 440px at 5% 130%, rgba(70, 196, 99, 0.22), transparent 55%),
    linear-gradient(165deg, #0a1633 0%, #0d2150 45%, #123a86 100%);
  color: #fff;
  margin-top: -72px;
  padding: 132px 0 64px;
  overflow: hidden;
}
.legal-hero__inner { position: relative; z-index: 2; }
.legal-hero h1 {
  font-size: clamp(34px, 6vw, 54px);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.05;
  margin-bottom: 12px;
}
.legal-hero__sub { color: rgba(255,255,255,0.72); font-size: 16px; font-weight: 500; }

.legal-body { padding: 56px 0 80px; }

.legal__card {
  max-width: 800px;
  margin: 0 auto;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: clamp(28px, 5vw, 56px);
}

.legal__card > p, .legal__card > ul { color: var(--ink-2); font-size: 16.5px; }
.legal__card > p { margin-bottom: 18px; }

.legal__card h2 {
  font-size: 23px; font-weight: 800; letter-spacing: -0.02em;
  color: var(--ink); margin: 38px 0 12px;
}
.legal__card h2:first-of-type { margin-top: 0; }

.legal__card h3 { font-size: 17px; font-weight: 700; color: var(--ink); margin: 24px 0 6px; }

.legal__card ul { padding-left: 22px; margin-bottom: 18px; }
.legal__card li { margin-bottom: 8px; color: var(--ink-2); }
.legal__card li strong, .legal__card p strong { color: var(--ink); font-weight: 700; }

.legal__card a { color: var(--blue); font-weight: 600; }
.legal__card a:hover { color: var(--blue-d); text-decoration: underline; }

.legal__updated {
  display: inline-block; font-size: 14px; font-weight: 600; color: var(--ink-2);
  background: rgba(32,138,239,0.08); border: 1px solid rgba(32,138,239,0.18);
  padding: 6px 12px; border-radius: 999px; margin-bottom: 26px;
}

.legal__contact {
  margin: 26px 0 4px; padding: 22px 24px;
  background: var(--bg); border: 1px solid var(--line); border-radius: 16px;
}
.legal__contact p { margin: 0 0 6px; color: var(--ink-2); }
.legal__contact p:last-child { margin: 0; }
.legal__contact a { font-size: 17px; }

.nav:not(.is-scrolled) .nav__links a { color: rgba(255,255,255,0.85); }
.footer__links a:hover { color: #fff; }

@media (max-width: 980px) { .legal-hero { padding-top: 116px; } }