/* Noval — les pages légales (mentions légales, politique de confidentialité). Même système que le site
   (styles.css : espacements, typographie, couleurs) ; ici, une mise en page sobre : une seule colonne de
   lecture (~65 caractères par ligne), le texte courant du site (17 px, --ink-2 : 5,6:1 sur la crème, AA),
   des intertitres à la taille du texte, en gras, séparés par un simple espacement. */

/* la page est claire du haut jusqu'au pied : le fond crème évite tout liseré sombre entre deux sections */
body { background: var(--paper); }

.legal { padding-top: calc(80px + var(--s7)); }
.legal .wrap > * { max-width: 31.5em; }   /* la largeur de lecture, en em du texte courant */

/* le titre : Fraunces, comme les titres du site, en plus petit */
.legal__t { font: 520 clamp(1.75rem, 1.4rem + 1vw, 2.25rem)/var(--lh-tight) var(--solid); font-variation-settings: "opsz" 48, "SOFT" 50, "WONK" 0; letter-spacing: -.018em; color: var(--ink); text-wrap: balance; }
.legal__date { margin-top: var(--s3); }

.legal__body, .legal__date { font-size: var(--fs-body); line-height: var(--lh-text); color: var(--ink-2); }
.legal__body { margin-top: var(--s7); }
.legal__sec + .legal__sec { margin-top: var(--s7); }
.legal__sec h2, .legal__txt h3 { font: 600 var(--fs-body)/var(--lh-snug) var(--sans); color: var(--ink); }
.legal__txt { margin-top: var(--s2); }
.legal__txt h3 { margin-top: var(--s5); }
.legal__txt h3:first-child { margin-top: var(--s5); }   /* sous un intitulé de section, le premier sous-titre se détache */
.legal__txt p { text-wrap: pretty; }
.legal__txt * + p { margin-top: var(--s3); }
.legal__txt h3 + p { margin-top: var(--s1); }
.legal__txt a { color: var(--wine); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; text-decoration-color: rgba(120, 40, 73, .35); overflow-wrap: anywhere; transition: text-decoration-color var(--t-fast); }
.legal__txt a:hover { text-decoration-color: var(--wine); }

.ftr__nav a[aria-current="page"] { color: var(--cream); }

/* ---------- Mobile ---------- */
@media (max-width: 640px) {
  .legal { padding-top: calc(64px + var(--s6)); }
  .legal__body { margin-top: var(--s6); }
  .legal__sec + .legal__sec { margin-top: var(--s6); }
}

/* la page 404 : deux boutons sous la phrase */
.nf__act { display: flex; flex-wrap: wrap; gap: var(--s3); margin-top: var(--s6); }
@media (max-width: 640px) { .nf__act .btn { width: 100%; } }