/* ============================================================
   Gossipy — legal pages (Privacy Policy, Terms of Use)
   Generated pages link this; body in Instrument Sans, headings
   bold sans for readability, SummerCrush only for the brand + H1.
   ============================================================ */

@font-face {
  font-family: "Summer Crush";
  src: url("./fonts/SummerCrush.otf") format("opentype");
  font-weight: 400 900;
  font-display: swap;
}

:root {
  --ink: #1b1a18;
  --muted: #6b6660;
  --line: #ece8e1;
  --bg: #fff;
  --card: #f8f5ef;   /* warm tint so cards/callouts read on the white page */
  --accent: #d6286a;
  --sans: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --display: "Summer Crush", "Instrument Sans", system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--sans);
  color: var(--ink);
  background: var(--bg);
  line-height: 1.66;
  letter-spacing: -0.005em;
  -webkit-font-smoothing: antialiased;
}

/* The top tab bar is the site's own .nav (reused from styles.css). It is
   position:fixed, so the document leaves top room to clear it. */

/* ---- document ---- */
.legal { max-width: 760px; margin: 0 auto; padding: 108px 22px 96px; }

.legal h1 {
  font-family: var(--display); font-weight: 400;
  font-size: clamp(34px, 6vw, 52px); line-height: 1.05;
  margin: 6px 0 18px;
}
.legal h2 {
  font-size: clamp(22px, 3.4vw, 26px); font-weight: 700; line-height: 1.25;
  letter-spacing: -0.015em;
  margin: 50px 0 14px; padding-top: 24px; border-top: 1px solid var(--line);
  scroll-margin-top: 76px;
}
.legal h3 { font-size: 18px; font-weight: 700; margin: 30px 0 8px; scroll-margin-top: 76px; }
.legal h4 { font-size: 15.5px; font-weight: 700; margin: 22px 0 6px; }

.legal p { margin: 0 0 14px; }
.legal a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; overflow-wrap: anywhere; }
.legal a:hover { text-decoration: none; }
.legal strong { font-weight: 700; }
.legal em { font-style: italic; }

.legal ul, .legal ol { margin: 0 0 16px; padding-left: 24px; }
.legal li { margin: 6px 0; }
.legal li::marker { color: var(--muted); }

/* table of contents (the first ordered list, right after the dates) */
.legal > ol:first-of-type { columns: 2; column-gap: 40px; font-size: 15px; }
@media (max-width: 560px) { .legal > ol:first-of-type { columns: 1; } }

.legal blockquote {
  margin: 18px 0; padding: 12px 18px;
  border-left: 3px solid var(--accent); background: var(--card);
  border-radius: 0 12px 12px 0; color: var(--muted);
}

.legal code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .88em; background: #f1ece4; padding: 1px 6px; border-radius: 6px;
}

.legal hr { border: 0; border-top: 1px solid var(--line); margin: 28px 0; }

/* at-a-glance summary blurbs (whole-italic paragraphs) */
.callout {
  background: var(--card); border: 1px solid var(--line); border-left: 3px solid var(--accent);
  border-radius: 12px; padding: 12px 16px; margin: 0 0 18px;
  color: var(--muted); font-size: 15px;
}
.callout em { font-style: italic; }

/* tables */
.table-wrap { overflow-x: auto; margin: 0 0 18px; -webkit-overflow-scrolling: touch; }
.legal table { border-collapse: collapse; width: 100%; font-size: 14.5px; min-width: 460px; }
.legal th, .legal td { border: 1px solid var(--line); padding: 9px 12px; text-align: left; vertical-align: top; }
.legal thead th { background: #f3eee6; font-weight: 700; }
.legal tbody tr:nth-child(even) { background: rgba(0,0,0,.022); }

.legal__foot {
  margin-top: 52px; padding-top: 22px; border-top: 1px solid var(--line);
  font-size: 14px; color: var(--muted);
}

/* support page — make the contact email the focus */
.support__mail { font-size: clamp(20px, 3vw, 26px); font-weight: 700; margin: 6px 0 8px; }