/* --------------------------------------------------------------- juridique
 * Les pages légales du site. Elles reprennent les jetons de la page d'accueil,
 * en plus sobre : on ne lit pas des mentions légales, on y cherche un
 * renseignement précis. D'où les titres nombreux, les paragraphes courts, et
 * une largeur de ligne qui laisse l'œil retrouver sa place.
 */
:root {
  --paper:#fafafc; --sheet:#fff; --ink:#14161f; --ink-soft:#4b5163; --ink-faint:#858b9c;
  --rule:#e6e7ef; --accent:#5b5bd6; --accent-deep:#3b3b9e; --wash:#f0f0fb;
  --warn:#b26a00; --warn-wash:#fdf6ea;
  --sans:'IBM Plex Sans',-apple-system,'Segoe UI',sans-serif;
  --serif:'Newsreader',Georgia,serif;
  --mono:'IBM Plex Mono',Consolas,monospace;
  color-scheme: light;
}
* { box-sizing:border-box }
body { margin:0; background:var(--paper); color:var(--ink);
       font-family:var(--sans); font-size:16px; line-height:1.65 }
.wrap { max-width:720px; margin-inline:auto; padding:56px 20px 96px }

.brand { display:inline-flex; align-items:center; gap:10px; text-decoration:none;
         color:var(--ink); font-weight:600; font-size:15px; margin-bottom:44px }
.brand__mark { width:26px; height:26px; border-radius:7px; background:var(--accent);
               color:#fff; display:grid; place-items:center; font-size:14px }

h1 { font-family:var(--serif); font-size:clamp(30px,4.6vw,40px); font-weight:500;
     letter-spacing:-.02em; line-height:1.15; margin:0; text-wrap:balance }
.maj { margin-top:10px; font-size:14px; color:var(--ink-faint) }

h2 { font-family:var(--sans); font-size:17px; font-weight:600; margin:44px 0 0;
     padding-top:22px; border-top:1px solid var(--rule); letter-spacing:-.005em }
h3 { font-family:var(--sans); font-size:15px; font-weight:600; margin:24px 0 0 }
p  { margin:10px 0 0; color:var(--ink-soft) }
p.fort { color:var(--ink) }
ul { margin:10px 0 0; padding-left:20px; color:var(--ink-soft) }
li { margin-top:6px }
b, strong { color:var(--ink) }
a { color:var(--accent-deep) }

dl { margin:14px 0 0; display:grid; grid-template-columns:max-content 1fr;
     gap:8px 22px; font-size:15px }
dt { color:var(--ink-faint) }
dd { margin:0; color:var(--ink) }

.ablanc { background:var(--warn-wash); color:var(--warn); border-radius:5px;
          padding:1px 7px; font-size:14px; font-weight:500 }

.avis { background:var(--warn-wash); border:1px solid rgba(178,106,0,.2);
        border-radius:12px; padding:18px 20px; margin-top:30px }
.avis p { color:var(--warn); margin-top:6px }
.avis p:first-child { margin-top:0; font-weight:600 }

.pied { margin-top:52px; padding-top:22px; border-top:1px solid var(--rule);
        font-size:14px; color:var(--ink-faint) }

@media (max-width:560px) {
  dl { grid-template-columns:1fr; gap:2px }
  dt { margin-top:10px }
}