/* =====================================================================
   Aubin Gilles Digital — Styles partagés des pages légales
   (mentions légales, confidentialité, cookies, CGU)
   Réutilise la charte du site (variables :root de styles.css).
   ===================================================================== */
.legal { padding-top: 6rem; }
.legal__hero {
  position: relative; max-width: var(--maxw); margin: 0 auto;
  padding: clamp(3rem, 8vh, 6rem) var(--gut) clamp(1.5rem, 4vh, 2.5rem);
}
.legal__glow {
  position: absolute; left: 8%; top: -4%; width: 60vmin; height: 60vmin; z-index: -1;
  background: radial-gradient(circle, rgba(150,112,255,.20), transparent 65%); filter: blur(55px);
}
.legal__back {
  display: inline-flex; align-items: center; gap: .5rem; color: var(--ink-dim);
  font-size: .9rem; margin-bottom: 2.2rem; transition: color .3s, gap .3s var(--ease);
}
.legal__back:hover { color: var(--ink); gap: .8rem; }
.legal__tag {
  display: inline-block; font-size: .75rem; letter-spacing: .22em; text-transform: uppercase;
  color: var(--violet); margin-bottom: 1.1rem;
}
.legal__title {
  font-family: "Sora", sans-serif; font-weight: 300; letter-spacing: -.02em;
  font-size: clamp(2.4rem, 7.5vw, 5.4rem); line-height: 1.0;
  background: linear-gradient(120deg, #ffffff, #c9d2f0 45%, #9a6bff);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
}
.legal__lead { margin-top: 1.2rem; max-width: 64ch; font-size: clamp(1rem, 2vw, 1.12rem); color: var(--ink-dim); }
.legal__updated { margin-top: 1rem; font-size: .85rem; color: var(--ink-faint); }

.legal__body { max-width: 880px; margin: 0 auto; padding: clamp(1.5rem, 4vh, 2.5rem) var(--gut) clamp(3rem, 8vh, 5rem); }
.legal__section { padding: 1.8rem 0; border-top: 1px solid var(--glass-border); }
.legal__section:first-of-type { border-top: 0; }
.legal__section h2 {
  font-family: "Sora", sans-serif; font-weight: 600; letter-spacing: -.01em;
  font-size: clamp(1.25rem, 3vw, 1.7rem); margin-bottom: 1.1rem; line-height: 1.2;
}
.legal__section h2 .legal__num { color: var(--violet); font-weight: 400; margin-right: .55rem; }
.legal__section h3 {
  font-family: "Sora", sans-serif; font-weight: 600; font-size: 1.02rem;
  margin: 1.4rem 0 .5rem;
}
.legal__section p, .legal__section li { color: var(--ink-dim); font-size: 1.02rem; line-height: 1.65; max-width: 72ch; }
.legal__section p + p { margin-top: .9rem; }
.legal__section ul { margin: .7rem 0 .2rem; padding-left: 1.2rem; }
.legal__section li { margin-bottom: .4rem; }
.legal__section a { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.legal__section a:hover { color: var(--violet); }
.legal__section strong { color: var(--silver); font-weight: 600; }

/* Fiche d'identité (clé / valeur) */
.legal__dl { margin: .4rem 0 0; display: grid; grid-template-columns: 240px 1fr; gap: .2rem 1.4rem; }
.legal__dl dt { color: var(--silver); font-weight: 500; padding: .55rem 0; border-bottom: 1px solid var(--glass-border); }
.legal__dl dd { color: var(--ink-dim); padding: .55rem 0; margin: 0; border-bottom: 1px solid var(--glass-border); }
@media (max-width: 620px) {
  .legal__dl { grid-template-columns: 1fr; gap: 0; }
  .legal__dl dt { border-bottom: 0; padding-bottom: 0; }
  .legal__dl dd { padding-top: .2rem; margin-bottom: .4rem; }
}

/* Tableau des cookies (généré dynamiquement) */
.legal__table-wrap { overflow-x: auto; margin: 1rem 0 .4rem; border: 1px solid var(--glass-border); border-radius: 14px; }
.legal__table { width: 100%; border-collapse: collapse; font-size: .92rem; min-width: 640px; }
.legal__table th, .legal__table td { text-align: left; padding: .8rem 1rem; border-bottom: 1px solid var(--glass-border); vertical-align: top; }
.legal__table th { color: var(--silver); font-family: "Sora", sans-serif; font-weight: 600; font-size: .82rem; letter-spacing: .03em; background: rgba(255,255,255,.03); }
.legal__table td { color: var(--ink-dim); }
.legal__table tr:last-child td { border-bottom: 0; }
.legal__table code { font-family: "Space Grotesk", monospace; color: var(--ink); background: rgba(255,255,255,.05); padding: .1em .4em; border-radius: 5px; }
.legal__cat-title { font-family: "Sora", sans-serif; font-weight: 600; font-size: 1.05rem; margin: 1.6rem 0 .3rem; color: var(--ink); }
.legal__cat-empty { font-style: italic; color: var(--ink-faint); }

/* Informations à compléter — affichées en ROUGE */
.todo {
  color: #ff5d6c; font-weight: 600;
  background: rgba(255, 93, 108, .12);
  border: 1px solid rgba(255, 93, 108, .35);
  padding: .08em .45em; border-radius: 5px; white-space: normal;
}
.legal__notice {
  display: flex; gap: .8rem; align-items: flex-start;
  margin-top: 1.8rem; padding: 1rem 1.2rem;
  background: rgba(255, 93, 108, .08); border: 1px solid rgba(255, 93, 108, .3);
  border-radius: 12px; color: var(--ink-dim); font-size: .92rem; max-width: 72ch;
}
.legal__notice strong { color: #ff5d6c; }

/* Bouton "Gérer mes cookies" inline */
.legal__inline-btn {
  display: inline; background: none; border: 0; padding: 0; cursor: pointer;
  color: var(--ink); text-decoration: underline; text-underline-offset: 3px; font: inherit;
}
.legal__inline-btn:hover { color: var(--violet); }