/* ==========================================================================
   Lomli — feuille des textes légaux

   Partagée par mentions-legales.html, confidentialite.html et la feuille
   modale de index.html. Une seule copie : le même texte doit se lire à
   l'identique dans sa page et dans la pop-up.

   Toutes les valeurs viennent de design/tokens.css.
   ========================================================================== */

.legal{
  max-width: var(--max-texte);
  margin: 0 auto;
  color: var(--lect-texte);
}
.legal h1{
  margin: 0 0 var(--e-2);
  color: var(--creme);
}
.legal .maj{
  margin: 0 0 var(--e-7);
  font-size: var(--t-petit);
  line-height: var(--lh-petit);
  color: var(--lect-texte-doux);
}
.legal h2{
  margin: var(--e-7) 0 var(--e-3);
  font-size: var(--t-h3);
  font-weight: var(--w-h3);
  line-height: var(--lh-h3);
  color: var(--creme);
}
.legal h2:first-of-type{ margin-top: var(--e-6); }
.legal p{
  margin: 0 0 var(--e-4);
  font-size: var(--t-corps);
  line-height: var(--lh-corps);
  max-width: none;
}
.legal ul{
  margin: 0 0 var(--e-4);
  padding-left: var(--e-5);
  font-size: var(--t-corps);
  line-height: var(--lh-corps);
}
.legal li{ margin-bottom: var(--e-2); }
.legal a{ color: var(--lavande-pale); }
.legal dl{ margin: 0 0 var(--e-4); font-size: var(--t-corps); line-height: var(--lh-corps); }
.legal dt{ color: var(--lect-texte-doux); }
.legal dd{ margin: 0 0 var(--e-3); }

/* Un repère à compléter. Volontairement voyant : il ne doit pas survivre à la
   mise en ligne. `design/verifier-legal.py` les compte. */
.legal .a-completer{
  display: inline-block;
  background: var(--attention);
  color: var(--etoile);
  border-radius: var(--r-s);
  padding: 0 var(--e-2);
  font-size: var(--t-petit);
}