/* Pages légales : texte long, lisible, 70 caractères par ligne. */
.legal{max-width:72ch;margin:clamp(48px,6vw,80px) 0 0;display:grid;gap:14px;font-size:16.5px;line-height:1.7}
.legal h2{margin:28px 0 0;font-size:clamp(20px,2.2vw,24px);letter-spacing:-.02em}
.legal h3{margin:12px 0 0;font-size:17px}
.legal p,.legal ul{margin:0}
.legal ul{padding-left:22px;display:grid;gap:6px}
.legal .encadre{padding:16px 18px;border-radius:16px;background:var(--surface);border:1px solid var(--trait)}
.legal a{color:var(--accent-texte)}

/* Tableaux et sommaire (refonte v1, 18.10.2026) : lisibles au téléphone, défilement horizontal seulement dans le tableau. */
.legal ol{padding-left:22px;display:grid;gap:6px;margin:0}
.legal .tableau{overflow-x:auto;border:1px solid var(--trait);border-radius:16px;background:var(--surface)}
.legal table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.5;min-width:520px}
.legal th,.legal td{padding:12px 14px;text-align:left;vertical-align:top;border-bottom:1px solid var(--trait)}
.legal tr:last-child>*{border-bottom:0}
.legal thead th{font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--doux)}
.legal tbody th[scope=row],.legal tr>th[scope=row]{width:38%;font-weight:700}
.legal code{font-size:.92em}
.legal .sommaire{display:flex;flex-wrap:wrap;gap:8px}
.legal .sommaire a{padding:6px 12px;border-radius:999px;border:1px solid var(--trait);font-size:14px;text-decoration:none;color:var(--texte);transition:border-color .2s}
.legal .sommaire a:hover{border-color:var(--accent)}
.legal h2{scroll-margin-top:96px}
/* Téléphone : chaque ligne devient une fiche (libellé de colonne au-dessus de chaque valeur), sans défilement horizontal. */
@media (max-width:640px){
  .legal table{min-width:0}
  .legal .tableau{overflow:visible}
  .legal thead{display:none}
  .legal table,.legal tbody,.legal tr,.legal td,.legal th[scope=row]{display:block;width:auto}
  .legal tbody tr,.legal table>tr{padding:12px 14px;border-bottom:1px solid var(--trait)}
  .legal td,.legal th{padding:2px 0;border:0}
  .legal td[data-label]::before{content:attr(data-label);display:block;font-size:11.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--doux);margin-top:8px}
  .legal tr>td[data-label]:first-child{font-weight:700}
  .legal tr>td[data-label]:first-child::before{margin-top:0}
  .legal tbody tr:last-child,.legal table>tr:last-child{border-bottom:0}
  .legal tbody th[scope=row],.legal tr>th[scope=row]{width:auto}
}
