/* ============================================================
   Privacy, terms, support and delete-account pages (T09).
   A long-form text column on a white card. Tokens, type, nav and
   footer come from css/site.css, which loads first.
   ============================================================ */

.legal{
  max-width: 820px;
  padding-block: clamp(28px, 5vw, 56px) clamp(56px, 7vw, 92px);
}

.legal-doc{
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: var(--r-card);
  box-shadow: var(--lift);
  padding: clamp(24px, 5vw, 56px);
  overflow-wrap: break-word;
}

.legal-doc h1{ font-size: clamp(34px, 4.6vw, 52px); margin-bottom: 18px; }
.legal-doc h2{
  font-size: clamp(21px, 2.3vw, 25px);
  line-height: 1.2;
  margin: 38px 0 12px;
}

.legal-doc p,
.legal-doc ul{ margin: 0 0 16px; font-size: 17px; line-height: 1.7; max-width: 68ch; }
.legal-doc ul{ padding-left: 1.3em; }
.legal-doc li + li{ margin-top: 8px; }
.legal-doc li::marker{ color: var(--sea); }
.legal-doc > :last-child{ margin-bottom: 0; }

.legal-doc a{
  color: var(--sea-deep);
  font-weight: 700;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.legal-doc a:hover{ color: var(--sea); }

.legal-date{ color: var(--ink-2); }
.legal-doc .legal-date{ font-size: 15px; }
.legal-doc .legal-email{ font-size: 20px; }

@media (max-width: 560px){
  .legal-doc p,
  .legal-doc ul{ font-size: 16px; }
  .legal-doc h2{ margin-top: 32px; }
  .legal-doc .legal-email{ font-size: 17px; }   /* keeps the address on one line at 375px */
}