/* ==========================================================================
   BLOC — Texte légal (`texte_legal`) — Mentions légales, CGV, Confidentialité.

   ⚠️ AUCUNE SOURCE DANS LA MAQUETTE (ses liens légaux sont des href="#") : ce fichier est
   ÉCRIT, pas extrait. Il ne fait qu'assembler les jetons de la charte (common.css) —
   --creme, --noir, --jaune-d, --serif, --sans, --fs-* — pour qu'une page juridique se lise
   comme le reste du site. Fiche Notion sprint 2026-10-07 n° 4.

   Deux colonnes sur écran large : le sommaire, collant sous l'en-tête, puis le texte en
   colonne de lecture (~70 caractères). Une seule colonne sous 1024 px, le sommaire replié en
   tête (js/blocs/texte-legal.js).
   ========================================================================== */

.texte-legal{ background:var(--creme); padding:clamp(48px,7vw,96px) 0 clamp(64px,8vw,120px); }

.texte-legal__grid{
  display:grid; grid-template-columns:minmax(220px,300px) minmax(0,1fr);
  gap:clamp(32px,5vw,88px); align-items:start;
}
.texte-legal__grid--seul{ grid-template-columns:minmax(0,1fr); }

/* ---- Sommaire ---- */
.texte-legal__nav{ position:sticky; top:calc(var(--header-h) + 24px); }
.texte-legal__toc-titre{ display:none; }   /* écran large : toujours ouvert, pas de bascule */
.texte-legal__toc-label{
  font-size:var(--fs-label); font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  color:var(--noir-50); margin:0 0 14px;
}
.texte-legal__toc-liste{
  list-style:none; margin:0; padding:0 0 0 16px; border-left:1px solid rgba(14,14,14,.15);
  max-height:calc(100vh - var(--header-h) - 120px); overflow-y:auto;
  scrollbar-width:thin; scrollbar-color:var(--jaune) transparent;
}
.texte-legal__toc-liste li + li{ margin-top:8px; }
.texte-legal__toc-liste a{
  font-size:var(--fs-small); line-height:1.4; color:var(--noir); text-decoration:none;
  transition:color .2s var(--ease);
}
.texte-legal__toc-liste a:hover{ color:var(--jaune-d); }

/* ---- Texte ---- */
.texte-legal__corps{ max-width:72ch; font-size:var(--fs-body); line-height:1.7; color:var(--noir); }
.texte-legal__maj{ font-size:var(--fs-small); color:var(--noir-50); margin:0 0 32px; }
.texte-legal__corps h2{
  font-family:var(--serif); font-weight:400; font-size:clamp(28px,3vw,40px); line-height:1.1;
  margin:56px 0 18px; scroll-margin-top:calc(var(--header-h) + 24px);
}
.texte-legal__corps h2:first-child,
.texte-legal__maj + h2{ margin-top:0; }
.texte-legal__corps h3{
  font-size:var(--fs-h3); font-weight:600; line-height:1.35;
  margin:32px 0 10px; scroll-margin-top:calc(var(--header-h) + 24px);
}
.texte-legal__corps p{ margin:0 0 16px; }
.texte-legal__corps ul,
.texte-legal__corps ol{ margin:0 0 16px; padding-left:1.4em; }
.texte-legal__corps li + li{ margin-top:6px; }
.texte-legal__corps a{
  color:var(--noir); text-decoration:underline; text-decoration-color:var(--jaune);
  text-underline-offset:3px; overflow-wrap:anywhere;
}
.texte-legal__corps a:hover{ color:var(--jaune-d); }
.texte-legal__corps .is-centre{ text-align:center; }   /* repris de l'alignement de l'ancien site */

/* ---- Téléphone et tablette : une colonne, sommaire repliable en tête ---- */
@media (max-width:1024px){
  .texte-legal__grid{ grid-template-columns:minmax(0,1fr); gap:28px; }
  .texte-legal__nav{ position:static; }
  .texte-legal__toc{ background:var(--creme-2); border-radius:12px; padding:14px 18px; }
  .texte-legal__toc-titre{
    display:flex; align-items:center; justify-content:space-between; cursor:pointer; list-style:none;
    font-size:var(--fs-label); font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  }
  .texte-legal__toc-titre::-webkit-details-marker{ display:none; }
  .texte-legal__toc-titre::after{ content:"+"; font-size:20px; line-height:1; letter-spacing:0; }
  .texte-legal__toc[open] .texte-legal__toc-titre::after{ content:"−"; }
  .texte-legal__toc-label{ display:none; }
  .texte-legal__toc-liste{ max-height:none; margin-top:14px; }
  .texte-legal__corps{ font-size:16px; }
  .texte-legal__corps h2{ margin-top:40px; }
}