/* ENDURIA — Pages légales (mentions-legales, politique-confidentialite, cgv).
   Layout article centré, largeur de lecture confortable, typo Geist.
   Dark + light via tokens standards. */

.legal-page {
  /* Padding-top augmenté (Théo — titre trop collé à la nav auparavant). */
  padding-top: clamp(9rem, 16vh, 13rem);
  padding-bottom: clamp(4rem, 8vh, 6rem);
  min-height: 60vh;
  position: relative;
}
.legal-page__inner {
  max-width: 800px;
  margin: 0 auto;
  padding-inline: clamp(1.5rem, 4vw, 3rem);
}

.legal-page__title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(2rem, 4vw, 3rem);
  letter-spacing: -0.03em;
  line-height: 1.1;
  color: var(--paper);
  margin: 0 0 0.6rem;
}
.legal-page__meta {
  font-family: var(--font-mono);
  font-size: 0.85rem;
  color: var(--text-tertiary);
  margin: 0 0 3rem;
}

.legal-page h2 {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(1.25rem, 2vw, 1.55rem);
  color: var(--paper);
  letter-spacing: -0.01em;
  line-height: 1.25;
  margin: 2.6rem 0 1rem;
}
.legal-page p {
  font-family: var(--font-body);
  font-size: 1.02rem;
  line-height: 1.7;
  color: var(--text-secondary);
  margin: 0 0 1.2rem;
}
.legal-page ul {
  padding-left: 1.3rem;
  margin: 0 0 1.2rem;
  list-style: disc;
}
.legal-page li {
  font-family: var(--font-body);
  font-size: 1.02rem;
  line-height: 1.7;
  color: var(--text-secondary);
  margin-bottom: 0.45rem;
}
.legal-page li::marker {
  color: var(--text-tertiary);
}
.legal-page strong {
  color: var(--paper);
  font-weight: 600;
}
.legal-page em {
  color: var(--text-tertiary);
  font-style: italic;
}
/* :not(.btn) — exclut le bouton "Retour à l'accueil" qui hérite du CTA
   (sinon cette règle écrasait ses styles couleur/décoration via spécificité). */
.legal-page a:not(.btn) {
  color: var(--accent-2);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.2s ease;
}
.legal-page a:not(.btn):hover {
  color: var(--accent);
}
[data-theme="light"] .legal-page a:not(.btn) {
  color: var(--accent);
}
[data-theme="light"] .legal-page a:not(.btn):hover {
  color: #5c3ba1;
}

/* Bouton "Retour à l'accueil" — hérite de .btn.btn-primary avec overrides
   minimalistes (couleurs, chevron flipped, animation inversée).
   DARK  : fond blanc, texte + chevron en var(--accent) (violet DA #7c4fc9).
   LIGHT : fond transparent + contour noir, texte + chevron en #1b1b1b (noir).
   Chip TRANSPARENTE dans les 2 modes (seul le chevron est visible, hérite
   la couleur du texte via currentColor). */
.legal-page__back {
  margin-top: 3rem;
  /* Padding INVERSÉ vs .btn-primary : compact à GAUCHE (chip), normal à droite. */
  padding: 0.55em 0.95em 0.55em 0.55em;
  background: #ffffff;
  color: var(--accent);
  border-color: rgba(255, 255, 255, 0.5);
  box-shadow: none;
  text-shadow: none;
}
.legal-page__back:hover {
  background: rgba(255, 255, 255, 0.88);
  color: var(--accent);
  box-shadow: none;
}
/* Chip transparente → seul le chevron est visible, prend la couleur du bouton. */
.legal-page__back .btn-chip {
  background: transparent;
  color: inherit;
  margin-left: 0;
  margin-right: 0;
}
/* Chevron retourné → pointe vers la gauche. */
.legal-page__back .btn-chip svg {
  transform: scaleX(-1);
}
/* Animation chevron INVERSÉE (miroir du CTA) : au repos, 1ère copie visible ;
   au hover, track glisse vers la GAUCHE → chevron sort à gauche, nouveau arrive
   de la droite. Sens visuel cohérent avec "retour". */
.legal-page__back .btn-chip__inner {
  transform: translateX(0);
}
.legal-page__back:hover .btn-chip__inner {
  transform: translateX(-50%);
}

/* LIGHT — fond transparent + contour + texte/chevron noir. */
[data-theme="light"] .legal-page__back {
  background: transparent;
  color: #1b1b1b;
  border-color: #1b1b1b;
  box-shadow: none;
}
[data-theme="light"] .legal-page__back:hover {
  background: rgba(0, 0, 0, 0.04);
  color: #1b1b1b;
  box-shadow: none;
}

@media (max-width: 640px) {
  .legal-page__title { font-size: clamp(1.65rem, 6vw, 2.2rem); }
  .legal-page h2 { font-size: 1.15rem; margin: 2rem 0 0.8rem; }
  .legal-page p, .legal-page li { font-size: 0.98rem; }
}