/* ============================================================================
   Legal pages — mentions légales, CGV, confidentialité
   Plain prose on the site's own tokens; no layout tricks, just readable text.
   ========================================================================= */

.legal {
  max-width: 68ch;
  padding-block: var(--sp-7);
}

.legal__back {
  display: inline-block;
  margin-bottom: var(--sp-5);
  font-size: var(--step--1);
  color: var(--ink-3);
}

.legal__back:hover {
  color: var(--accent-text);
}

.legal h1 {
  font-size: var(--step-4);
}

.legal__updated {
  margin-top: var(--sp-2);
  font-size: var(--step--1);
  color: var(--ink-3);
}

.legal__notice {
  margin-top: var(--sp-5);
  padding: var(--sp-4);
  border: 1px solid var(--accent-line);
  border-radius: var(--r-md);
  background: var(--accent-soft);
  color: var(--accent-text);
  font-size: var(--step--1);
  line-height: 1.6;
}

.legal section {
  margin-top: var(--sp-7);
}

.legal h2 {
  font-size: var(--step-2);
}

.legal h3 {
  margin-top: var(--sp-5);
  font-size: var(--step-0);
}

.legal p {
  margin-top: var(--sp-3);
  color: var(--ink-2);
}

.legal ul,
.legal ol {
  margin-top: var(--sp-3);
  padding-left: 1.3em;
  color: var(--ink-2);
}

.legal li + li {
  margin-top: var(--sp-2);
}

.legal a {
  color: var(--accent-text);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.legal strong {
  color: var(--ink);
}

.legal mark {
  padding: 0.1em 0.4em;
  border-radius: var(--r-sm);
  background: color-mix(in srgb, #f59e0b 22%, transparent);
  color: var(--ink);
  font-weight: 600;
  font-style: normal;
}

.legal__toc {
  margin-top: var(--sp-5);
  padding: var(--sp-4);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: var(--surface);
}

.legal__toc p {
  margin-top: 0;
  font-size: var(--step--2);
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-3);
}

.legal__toc ol {
  margin-top: var(--sp-2);
  font-size: var(--step--1);
}