/* =====================================================================
   PAGE MENTIONS LEGALES — mentions-legales.html
   ---------------------------------------------------------------------
     .legal-body     : la colonne de texte long
     .legal-updated  : la date de derniere mise a jour, en bas

   Page de texte dense : on s'ecarte volontairement du collage du reste
   du site (rotations, aplats, ombres dures). Ici c'est la lisibilite qui
   prime — mesure limitee a ~72 caracteres, interlignage confortable, et
   du texte courant sur fond noir plein, jamais sur une trame.
   ===================================================================== */

.legal-body{
  max-width:72ch;
  margin-top:36px;
  color:var(--text-secondary);
  font-size:17px;
  line-height:1.75;
}

/* Intertitres : la barre rouge en biais du site, mais discrete */
.legal-body h2{
  font-size:27px;
  margin:44px 0 16px;
  padding-left:18px;
  position:relative;
  letter-spacing:.03em;
}
.legal-body h2::before{
  content:"";
  position:absolute;left:0;top:.12em;bottom:.12em;
  width:7px;
  background:var(--red);
  clip-path:var(--cut-slant);
}
.legal-body h2:first-child{margin-top:0;}

.legal-body p{margin-bottom:18px;}
.legal-body strong{color:var(--text-primary);}

/* Liens soulignes : dans un bloc de texte long, la couleur seule ne
   suffit pas a signaler un lien (critere WCAG 1.4.1) */
.legal-body a{
  color:var(--text-primary);
  text-decoration:underline;
  text-decoration-color:var(--red);
  text-decoration-thickness:2px;
  text-underline-offset:3px;
  transition:color .13s var(--ease-snap), background .13s var(--ease-snap);
}
.legal-body a:hover{
  background:var(--red);
  color:var(--text-primary);
}

.legal-updated{
  margin-top:44px;
  padding-top:20px;
  border-top:3px solid rgba(247,244,236,.22);
  color:var(--text-faint);
  font-size:14px;
  font-style:italic;
}

/* ---------- Responsive ---------- */
@media (max-width: 860px){
  .legal-body{font-size:16px;}
  .legal-body h2{font-size:23px;margin-top:36px;}
}