/* ============================================================
   legal.css — pages de texte long (politique de confidentialité).
   Une seule colonne de lecture, posée sur une plaque claire :
   c'est la seule surface du site où l'on lit longtemps, et le
   fond sombre du panneau ne convient pas à cet usage.
   Le chrome (barre d'alimentation, pied, barre d'action) vient
   de base.css et schematic.css n'est pas chargé ici — cette
   page n'a ni schéma, ni tableau de circuits, ni formulaire.
   ============================================================ */

.legal-wrap {
  max-width: var(--max-read);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.legal-hero {
  background: var(--panel);
  padding: clamp(2.6rem, 6vw, 4.2rem) 0 clamp(2rem, 4vw, 3rem);
  border-bottom: 2px solid var(--live);
}
.legal-hero h1 { font-size: clamp(2.1rem, 5.5vw, 3.4rem); }
.legal-updated {
  font-family: var(--face-mark);
  font-size: .72rem; letter-spacing: .1em; text-transform: uppercase;
  color: var(--on-panel-soft);
  margin-top: .9rem;
}

.legal-article {
  background: var(--plate);
  color: var(--ink);
  padding: clamp(2.4rem, 5vw, 3.6rem) 0 clamp(3.5rem, 7vw, 5rem);
}
.legal-article h2 {
  font-size: 1.22rem;
  text-transform: none;
  letter-spacing: -.012em;
  line-height: 1.25;
  margin: 2.4rem 0 .8rem;
  color: var(--forest);
}
.legal-article h2:first-of-type { margin-top: 0; }
.legal-article p { max-width: none; color: var(--ink); }
.legal-article ul { padding-left: 1.25rem; margin: 0 0 1rem; }
.legal-article li { margin-bottom: .5rem; }
.legal-article a { color: var(--forest); text-underline-offset: 3px; }
.legal-article a:focus-visible { outline: 3px solid var(--forest); outline-offset: 2px; }
.legal-article strong { font-weight: 700; }
.legal-article em { font-style: italic; }