@charset "UTF-8";
/**
 * Long-form legal prose — privacy.php only.
 *
 * Loaded via $extraCss in includes/head.php, AFTER styles.css — these rules
 * consume its custom properties (--fs-h2, --ink-3, --rule-strong, …) and will
 * not resolve on their own.
 *
 * See README: legal.css.
 */

/* Scoped to this page. The site's shared stylesheet is built for marketing
   sections — big type, wide grids — and has no long-form prose treatment.
   Rather than add one globally for a single document, the measure, heading
   rhythm and table styling live here.
   What does NOT live here is the section rhythm. .legal is only ever set
   alongside .section, which supplies --section-padding. This selector used to
   declare `padding: 96px 0 64px`; the file loads after styles.css at equal
   specificity, so those fixed values silently outranked the token and the page
   sat 16px high and 32px shallow of every other section on the site, without
   scaling with the viewport. Do not reintroduce a padding declaration on it. */
.legal__inner { max-width: 74ch; }
/* The closing <p>'s 16px is spacing between paragraphs; there is nothing after
   the last one, and as the last thing in the section it was adding to the gap
   below. (0,2,0) clears `.legal p`. */
.legal__inner > :last-child { margin-bottom: 0; }
.legal__title { font-size: var(--fs-h2); line-height: 1.04; margin: 12px 0 20px; }
.legal__meta { font-size: var(--fs-micro); color: var(--ink-4); margin-bottom: 40px; }
.legal h2 {
  font-size: var(--fs-h3);
  line-height: 1.2;
  margin: 48px 0 14px;
  padding-top: 24px;
  border-top: 1px solid var(--rule-strong);
}
.legal h3 { font-size: var(--fs-h4); margin: 28px 0 10px; }
.legal p, .legal li { font-size: var(--fs-body); line-height: 1.55; color: var(--ink-3); }
.legal p { margin: 0 0 16px; }
.legal ul { margin: 0 0 16px; padding-left: 22px; }
.legal li { margin-bottom: 8px; }
/* Underline is not decoration here: colour alone separates a link from body copy
   at 1.15:1 against the 3:1 SC 1.4.1 wants. This is the longest prose on the site,
   so it is also where a colour-only cue is hardest to spot. Matches the site
   treatment set at styles.css (the `a` reset carries the full note). */
.legal a { color: var(--primary); text-decoration: underline; text-underline-offset: 3px; }
.legal a:hover { color: var(--primary-2); }
.legal strong { color: var(--ink-2); }
/* Paths and addresses quoted in the text. Sized down a step so a long path
   inside a sentence does not disturb the line rhythm, and allowed to break
   so one can never widen the measure on a phone. */
.legal code {
  font-size: 0.9em;
  background: var(--bg);
  padding: 1px 5px;
  border-radius: var(--radius-xs); /* was a raw 3px — the only off-scale radius on the site */
  overflow-wrap: anywhere;
}

/* Tables carry the field-by-field disclosure, which is the part of a notice
   people actually scan. They scroll inside their own box so a narrow
   viewport never scrolls the page sideways. */
.legal__tablewrap { overflow-x: auto; margin: 0 0 20px; }
.legal table { border-collapse: collapse; width: 100%; min-width: 30rem; }
.legal th, .legal td {
  text-align: left;
  vertical-align: top;
  padding: 10px 14px 10px 0;
  border-bottom: 1px solid var(--rule-strong);
  font-size: var(--fs-micro);
  line-height: 1.4;
  color: var(--ink-3);
}
.legal th { color: var(--ink-2); white-space: nowrap; }

/* The single most useful thing on the page for most readers. */
/* Rule width matches .spec-note (styles.css) — it was 3px, the odd one out.
   The padding deliberately does NOT match: .spec-note is a bare left-ruled note
   with no fill, so its 16px inset sits against the page. This one carries a --bg
   fill, which needs box padding on all four sides. Same device, different shape,
   so only the shared decision — the rule — was aligned. */
.legal__summary {
  background: var(--bg);
  border-left: 2px solid var(--primary);
  padding: 20px 24px;
  margin: 0 0 8px;
}
.legal__summary p:last-child { margin-bottom: 0; }

/* The 720px override that used to sit here (`padding: 64px 0 48px`) is gone
   with the base padding: --section-padding already floors at 64px from 914px
   down, so every viewport below tablet gets the site's mobile rhythm. */
