/* ============================================================
   Gabarit Page légale — /mentions-legales/, /confidentialite/
   Repris de maquettes/maquette-mentions-legales-byu-france.html et
   maquette-confidentialite-byu-france.html (CSS identiques pour ces parties).
   ============================================================ */
body{line-height:1.65}
.lien-simple{padding-bottom:1px}

/* Tête */
.tete-page{background:var(--nuit);color:var(--papier);padding:clamp(34px,5vw,58px) 0}
.fil{font-size:.85rem;color:#9FB4E8;margin-bottom:18px}
.fil a{text-decoration:none}
.fil a:hover{color:#fff}
.fil span{margin:0 8px;opacity:.5}
.tete-page h1{font-weight:900;font-stretch:118%;line-height:.98;letter-spacing:-.03em;
  font-size:clamp(2rem,4.6vw,3.1rem)}
.tete-page p{margin-top:14px;color:#9FB4E8;font-size:.95rem}

/* Corps */
.legal{padding:clamp(44px,6vw,76px) 0}
.legal .wrap{display:grid;grid-template-columns:220px 1fr;gap:clamp(28px,5vw,64px);align-items:start}
.sommaire{position:sticky;top:96px;font-size:.9rem}
.sommaire b{display:block;font-size:.74rem;letter-spacing:.08em;color:var(--gris);margin-bottom:12px}
.sommaire a{display:block;text-decoration:none;padding:6px 0;border-bottom:1px solid var(--trait);
  font-weight:600}
.sommaire a:hover{color:var(--bleu)}
article h2{font-size:clamp(1.25rem,2.4vw,1.6rem);font-weight:800;font-stretch:110%;
  margin:0 0 14px;padding-bottom:10px;border-bottom:2px solid var(--encre)}
article section{margin-bottom:42px;scroll-margin-top:96px}
article p + p{margin-top:12px}
article ul{margin:12px 0 0 20px}
article li{margin-bottom:6px}
.fiche-id{background:#fff;border:1px solid var(--trait);padding:0}
.fiche-id .ligne{display:grid;grid-template-columns:230px 1fr;gap:16px;padding:12px 20px;
  border-bottom:1px solid var(--trait);font-size:.95rem}
.fiche-id .ligne:last-child{border-bottom:none}
.fiche-id b{font-weight:700}
.attente{color:var(--rouge-sombre);font-weight:600}
.note{font-size:.9rem;color:var(--gris);margin-top:14px}
/* Ajout thème : styles portés en ligne dans la maquette (bouton en fin de section),
   et écart entre deux blocs consécutifs d'une même section. */
.bouton-section{margin-top:18px}
article section > * + .fiche-id,article section > .fiche-id + *{margin-top:14px}

@media (max-width:900px){
  .legal .wrap{grid-template-columns:1fr}
  .sommaire{position:static}
  .fiche-id .ligne{grid-template-columns:1fr;gap:2px}
}