/* ---- the two legal documents: /privacy and /terms ----
   Loaded AFTER styles.css, which supplies every token. Nothing here invents a
   colour or a raw px font-size (the type-scale comment in styles.css forbids
   the latter). It lives in its own file rather than inside styles.css because
   that file is organised as the homepage's own scroll narrative, band by band,
   and a legal document has no honest place in that sequence — and because
   ~40 lines of it would otherwise ship to every homepage visitor.

   These pages load NO JavaScript. .grain, the sticky nav, the tear's static
   torn edge, the skip link and every focus ring are pure CSS and survive that;
   .gs-reveal, .dive and the injected .head-rule do not, so they are absent
   from the markup. */

.legal { padding-block: var(--s-section); }

/* One tier below the homepage's poster headlines: this is the GLOBAL h2's own
   clamp (styles.css, the type-scale block), not a new one. A legal page is a
   section heading, not a poster. */
.legal h1 {
  font-size: clamp(32px, 3.6vw, 50px); line-height: 1.04;
  color: var(--blue); text-transform: uppercase; margin: 0;
}
/* Anton, uppercase, navy against 17px Aileron body ink: the hierarchy is
   carried by face + case + colour, so the size step can stay small. */
.legal h2 { font-size: var(--fs-lg); margin: var(--s-head) 0 var(--s-el); }
.legal h3 { font-size: var(--fs-md); margin: var(--s-block) 0 12px; }

/* the intro block: title, date, standfirst. Without these two the date line
   butts straight into the lede and reads as its first line. */
.legal h1 + .micro { margin-top: 16px; }
.legal .lede { margin: var(--s-el) 0 0; }

/* a full section's air between the intro block and the document proper */
.legal-body { max-width: var(--measure-wide); margin-top: var(--s-section); }
.legal-body > h2:first-child { margin-top: 0; }
.legal-body p,
.legal-body li {
  font-size: var(--fs-base); line-height: 1.7; color: var(--ink);
  margin: 0 0 var(--s-el);
}
.legal-body ul, .legal-body ol { padding-left: 22px; margin: 0 0 var(--s-el); }
.legal-body li { margin-bottom: 8px; }
.legal-body li:last-child { margin-bottom: 0; }
/* rust is the one warm accent and it is for MARKS. A bullet is a mark. */
.legal-body li::marker { color: var(--rust); }

/* The closing sign-off. .micro alone cannot quiet it: .legal-body p sets --ink
   at higher specificity, so the line rendered identical to body copy. Both
   values are the same 17px, so the difference has to come from colour.
   --ink-soft is 6.39 on sand. */
.legal-body p.legal-end { margin-top: var(--s-section); color: var(--ink-soft); }