/* privacy.css — the only Privacy-specific styles. Composes on ../styles.css:
   every colour, face and space below is an existing RIVET token, nothing new
   is introduced. One page of prose, so the rules are deliberately few. */

.legal { padding-block: var(--section-space-small, 4rem); }

/* Centred reading column, matching the insights ARTICLE template
   (.insights-article__container: max-width 46rem, margin-inline auto).
   The page previously used .measure, which caps the LINE LENGTH but leaves the
   column hugging the left edge inside the 1728px .inner - fine for the homepage's
   full-bleed layout, wrong for long-form prose on a wide monitor. */
.legal__container { max-width: 46rem; margin-inline: auto; }

.legal__head { margin-bottom: var(--space-4); }

.legal__title {
  font-family: var(--font-01);
  font-size: var(--fs-h2);
  line-height: 1.05;
  color: var(--text-heading);
  margin: 0.25em 0 0;
}

.legal__meta {
  font-family: var(--font-03);
  font-size: var(--fs-text-xs);
  color: var(--text);
  opacity: 0.72;
  margin-top: var(--space-2);
}

/* Prose. .measure (62ch) comes from styles.css — a reading cap, not a column. */
.legal__body > * + * { margin-top: var(--space-3); }

.legal__body h2 {
  font-family: var(--font-01);
  font-size: var(--fs-h5);
  line-height: 1.15;
  color: var(--text-heading);
  /* The section break is the main navigational cue on a page of ten short sections,
     so it gets real air. --space-8 against the --space-3 between paragraphs inside a
     section makes the grouping unambiguous. */
  margin-top: var(--space-8);
}

.legal__body h2:first-of-type { margin-top: var(--space-5); }

/* Reading size and leading follow .insights-prose (--fs-text-l / 1.7) so long-form
   pages on this site are set the same way. Headings stay at --fs-h5 rather than the
   article template's --fs-h3: a policy has ten short sections where an article has
   three long ones, and 48px every few paragraphs shouts. */
.legal__body p,
.legal__body li {
  font-family: var(--font-01);
  font-size: var(--fs-text-l);
  line-height: 1.7;
  color: var(--text);
}

/* styles.css:23 resets `ul { list-style: none; padding: 0 }` site-wide, so a prose
   list here has to ask for its markers back explicitly - without this the items
   render as indented paragraphs and stop reading as a list. */
.legal__body ul { list-style: disc; padding-left: 1.35em; margin-top: var(--space-2); }
.legal__body li + li { margin-top: 0.5em; }

/* Links here SWAP the site's two link tokens: --link-hover (#99411c) at rest,
   --link (#ff6c2f) on hover. No new colour enters the design system.
   Why: --link on --background measures 1.92:1, which QA-REPORT Finding B logged
   and the owner deferred - correctly - for DECORATIVE accents (stat values, role
   labels). A link in legal prose is not decorative: it has to be read and clicked,
   so it takes the token that passes (#99411c = 4.56:1, AA). Underlined as well, so
   the link is not identified by colour alone. Scoped to .legal__body - the rest of
   the site is untouched. To revert, swap the two values back. */
.legal__body a {
  color: var(--link-hover);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
.legal__body a:hover,
.legal__body a:focus-visible { color: var(--link); }

.legal__body strong { font-weight: 600; color: var(--text-heading); }

/* The "what we collect" table reads better as definition pairs than a grid at
   narrow widths, so it is a list rather than a <table>. */
/* Scoped with .legal__body so it OUT-RANKS `.legal__body ul` above (0,1,1 beats
   0,1,0) - without the extra class these labelled blocks inherit list-style: disc
   and render with bullets they are not a list. */
.legal__body .legal__pairs { list-style: none; padding-left: 0; }
.legal__body .legal__pairs li {
  border-top: 1px solid var(--border);
  padding-top: var(--space-2);
  margin-top: var(--space-2);
}
.legal__body .legal__pairs .k {
  display: block;
  font-family: var(--font-03);
  font-size: var(--fs-text-xxs);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text);
  opacity: 0.7;
  margin-bottom: 0.35em;
}

.legal__back { margin-top: var(--space-5); }


/* Contact form. Deliberately NOT given .contact__form: that class exists for the
   homepage's DARK contact section and forces the submit label to
   --btn-secondary-text (#edf0f5), which on this light page is near-invisible.
   Plain .form inherits --text-heading, which is correct here. */
.legal__form { margin-top: var(--space-4); }
.legal__form .form__status:empty { display: none; }
.legal__entity { margin-top: var(--space-4); }

/* An inline control inside prose. It is a <button> because it DOES something rather
   than going somewhere; dressed as a link so the sentence reads as a sentence. */
.legal__inline-btn {
  background: none; border: 0; padding: 0; font: inherit;
  color: var(--link-hover);
  text-decoration: underline; text-underline-offset: 0.2em;
  cursor: pointer;
}
.legal__inline-btn:hover, .legal__inline-btn:focus-visible { color: var(--link); }