/* ============ MEMENTO VIV'EXPRESS : pages légales ============
   Chargée UNIQUEMENT par /mentions-legales/, /confidentialite/ et
   /conditions-utilisation/ (19/10/2026), juste APRÈS brand-2027.css : elle
   s'appuie sur ses variables (charte « Memento 2027 ») et sur .article-body de
   css/pages.css. Toutes les règles sont préfixées par main.legal : rien ne fuit
   sur l'en-tête, le pied de page, le bandeau de cookies ni sur les autres pages. */

/* ---------- hero : titre long sur mobile, date de mise à jour ---------- */
main.legal .page-hero { padding-bottom:48px; }
main.legal .page-hero h1 { overflow-wrap:break-word; }
main.legal .legal-maj {
  display:inline-block; margin-top:18px; padding:6px 12px;
  background:#fff; border:1px solid var(--ligne); border-radius:999px;
  font-size:.86rem; font-weight:600; color:var(--encre);
}

/* ---------- corps ---------- */
main.legal .legal-corps { padding:16px 0 96px; }
main.legal .article-body { max-width:760px; padding-top:24px; color:var(--noir); }
main.legal [id] { scroll-margin-top:96px; }

/* Titres de section : filet fin et trait jaune, à la place du tiret ajouté par pages.css */
main.legal .article-body h2 {
  position:relative; margin-top:2.4em; padding-top:1em;
  border-top:1px solid var(--ligne);
  font-size:clamp(1.25rem,2.6vw,1.6rem); line-height:1.15;
}
main.legal .article-body h2::before { content:none; }
main.legal .article-body > h2:first-child { margin-top:0; }
main.legal .article-body h2::after {
  content:""; position:absolute; top:-2px; left:0; width:48px; height:4px;
  border-radius:2px; background:var(--jaune);
}
main.legal .article-body h3 {
  margin-top:1.9em; font-size:1.06rem; line-height:1.25; letter-spacing:.02em;
}
main.legal .article-body h3+* { margin-top:.7em; }

/* Gras sans surligneur : un texte légal se lit, il ne se scanne pas en jaune */
main.legal .article-body strong { background:none; padding:0; font-weight:700; }

/* Liens soulignés (et coupables : une URL ou une adresse longue ne déborde jamais) */
main.legal .article-body a {
  border-bottom:0; font-weight:600; overflow-wrap:anywhere;
  text-decoration:underline; text-decoration-color:var(--orange);
  text-decoration-thickness:2px; text-underline-offset:.2em;
  transition:text-decoration-color .2s;
}
main.legal .article-body a:hover { text-decoration-color:var(--noir); }

main.legal .article-body ul { padding-left:1.2em; }
main.legal .article-body code {
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.86em;
  background:var(--creme); border-radius:5px; padding:.08em .38em; overflow-wrap:anywhere;
}
main.legal .article-body sup { font-size:.7em; line-height:0; }

/* ---------- encart « En bref » ---------- */
main.legal .legal-bref {
  background:var(--creme); background-image:var(--texture-cross); background-size:24px 24px;
  border-radius:16px; padding:22px 26px;
}
main.legal .article-body .legal-bref-titre {
  margin:0 0 8px; padding:0; border:0; font-size:1.05rem; letter-spacing:.04em;
}
main.legal .article-body .legal-bref-titre::after { content:none; }
main.legal .legal-bref ul { margin:0; }

/* ---------- sommaire ---------- */
main.legal .legal-sommaire {
  border:1px solid var(--ligne); border-radius:16px; padding:18px 24px; background:#fff;
}
main.legal .legal-sommaire-titre {
  font-family:var(--display); font-weight:800; text-transform:uppercase;
  font-size:.78rem; letter-spacing:.12em; color:var(--terra); margin-bottom:6px;
}
main.legal .legal-sommaire ol { margin:0; padding-left:1.4em; columns:2; column-gap:32px; }
main.legal .legal-sommaire li { margin-top:.35em; break-inside:avoid; }
main.legal .legal-sommaire a { font-weight:500; }

/* ---------- fiches (dl) : une ligne par rubrique ---------- */
main.legal .legal-fiche {
  display:grid; grid-template-columns:minmax(0,11.5rem) minmax(0,1fr);
  border:1px solid var(--ligne); border-radius:14px; overflow:hidden; background:#fff;
}
main.legal .legal-fiche dt,
main.legal .legal-fiche dd { padding:12px 16px; border-top:1px solid var(--ligne); min-width:0; }
main.legal .legal-fiche dt:first-of-type,
main.legal .legal-fiche dt:first-of-type+dd { border-top:0; }
main.legal .legal-fiche dt {
  background:var(--creme); font-family:var(--display); font-weight:800;
  text-transform:uppercase; font-size:.76rem; letter-spacing:.06em; line-height:1.35;
  padding-top:15px;
}
main.legal .legal-fiche dd { overflow-wrap:break-word; }

/* ---------- action : rouvrir le bandeau de cookies ---------- */
main.legal .legal-action { margin-top:1.4em; }
main.legal .btn[data-cookies-reglages] {
  background:var(--noir); color:var(--creme); white-space:normal; text-align:center;
}

/* ---------- tableau des cookies ---------- */
main.legal .legal-table-wrap { max-width:100%; overflow-x:auto; }
main.legal .legal-table { width:100%; border-collapse:collapse; font-size:.92rem; line-height:1.5; }
main.legal .legal-table caption {
  text-align:left; caption-side:top; padding-bottom:8px;
  font-size:.86rem; font-weight:600; color:var(--gris);
}
main.legal .legal-table th,
main.legal .legal-table td {
  text-align:left; vertical-align:top; padding:11px 12px;
  border-bottom:1px solid var(--ligne); overflow-wrap:break-word;
}
main.legal .legal-table thead th {
  background:var(--creme); font-family:var(--display); font-weight:800;
  text-transform:uppercase; font-size:.74rem; letter-spacing:.06em;
}
main.legal .legal-table tbody th { font-weight:600; min-width:9rem; }
main.legal .legal-type { display:block; margin-top:4px; font-size:.8rem; font-weight:500; color:var(--gris); }

/* Mobile : chaque cookie devient une carte (les rôles ARIA posés dans le HTML
   gardent la sémantique de tableau malgré le display:block). */
@media (max-width:760px) {
  main.legal .page-hero h1 { font-size:clamp(28px,8.4vw,37px); }
  main.legal .page-hero { padding-bottom:36px; }
  main.legal .legal-corps { padding-bottom:72px; }
  main.legal .legal-bref { padding:18px 18px; }
  main.legal .legal-sommaire { padding:16px 18px; }
  main.legal .legal-sommaire ol { columns:1; }

  main.legal .legal-fiche { grid-template-columns:minmax(0,1fr); }
  main.legal .legal-fiche dt { padding:10px 14px 8px; }
  main.legal .legal-fiche dd { border-top:0; padding:10px 14px 14px; }
  main.legal .legal-fiche dt:first-of-type+dd { border-top:0; }

  main.legal .legal-table-wrap { overflow-x:visible; }
  main.legal .legal-table thead {
    position:absolute; width:1px; height:1px; overflow:hidden;
    clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap;
  }
  main.legal .legal-table,
  main.legal .legal-table tbody,
  main.legal .legal-table tr,
  main.legal .legal-table th,
  main.legal .legal-table td { display:block; width:100%; }
  main.legal .legal-table caption { display:block; }
  main.legal .legal-table tr {
    margin-top:12px; border:1px solid var(--ligne); border-radius:12px;
    background:#fff; overflow:hidden;
  }
  main.legal .legal-table tbody th {
    min-width:0; background:var(--creme); border-bottom:1px solid var(--ligne); padding:10px 14px;
  }
  main.legal .legal-table td {
    display:grid; grid-template-columns:minmax(0,6.5rem) minmax(0,1fr); gap:10px;
    padding:8px 14px; border-bottom:0;
  }
  main.legal .legal-table td::before {
    content:attr(data-label); font-weight:700; font-size:.8rem; color:var(--gris); line-height:1.6;
  }
  main.legal .legal-table td:last-child { padding-bottom:12px; }
}

@media print {
  main.legal .legal-action { display:none; }
  main.legal .legal-bref,main.legal .legal-sommaire { background:none; }
}