/* UNIK — pages légales
   S'ajoute à css/style.css : ne redéfinit aucun token, ne touche à rien d'autre. */

.legal { background: var(--paper); color: var(--ink); padding: 90px var(--g) 130px; }
.legal .in { max-width: 820px; margin: 0 auto; }

.legal .maj { display: inline-block; margin: 0 0 54px; padding: 7px 12px;
  border: 1px solid rgba(17, 16, 22, .18); font-family: "JetBrains Mono", monospace;
  font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: #77736c; }

.legal section { padding-top: 46px; border-top: 1px solid rgba(17, 16, 22, .15); margin-top: 46px; }
.legal section:first-of-type { border-top: 0; margin-top: 0; padding-top: 0; }

.legal h2 { display: flex; gap: 18px; align-items: baseline; margin: 0 0 22px;
  font-family: "Instrument Serif", serif; font-weight: 400;
  font-size: clamp(27px, 3vw, 38px); line-height: 1.08; letter-spacing: -.015em; }
.legal h2 .n { flex: none; font-family: "JetBrains Mono", monospace; font-size: 12px;
  letter-spacing: .1em; color: var(--verm); }

.legal h3 { margin: 32px 0 12px; font-size: 17px; font-weight: 600; letter-spacing: -.005em; }
.legal p { margin: 0 0 18px; font-size: 16.5px; line-height: 1.75; color: #3d3a37; }
.legal p:last-child { margin-bottom: 0; }
.legal a { color: var(--verm); font-weight: 500; text-decoration: none;
  border-bottom: 1px solid rgba(255, 75, 31, .35); }
.legal a:hover { border-bottom-color: var(--verm); }
.legal strong { font-weight: 600; color: var(--ink); }

.legal ul { margin: 0 0 18px; padding: 0; list-style: none; }
.legal li { position: relative; padding-left: 20px; margin-bottom: 11px;
  font-size: 16.5px; line-height: 1.7; color: #3d3a37; }
.legal li::before { content: ""; position: absolute; left: 0; top: .66em;
  width: 6px; height: 1px; background: var(--verm); }

/* fiche d'identité : libellé / valeur */
.idcard { margin: 0 0 18px; border-top: 1px solid rgba(17, 16, 22, .15); }
.idcard > div { display: grid; grid-template-columns: 210px 1fr; gap: 10px 28px;
  padding: 17px 0; border-bottom: 1px solid rgba(17, 16, 22, .15); }
.idcard dt { margin: 0; font-family: "JetBrains Mono", monospace; font-size: 11px;
  letter-spacing: .13em; text-transform: uppercase; color: #77736c; padding-top: 4px; }
.idcard dd { margin: 0; font-size: 16.5px; line-height: 1.65; color: var(--ink); }
@media (max-width: 620px) { .idcard > div { grid-template-columns: 1fr; gap: 6px; } }

/* encadré : ce qu'il faut retenir */
.keep { margin: 0 0 22px; padding: 24px 26px; background: var(--ink); color: var(--paper); }
.keep p { margin: 10px 0 0; font-size: 16px; line-height: 1.68; color: #c9c5bd; }
.keep p:first-of-type { margin-top: 0; }
.keep strong { color: var(--paper); }
.keep .mono { color: var(--verm); }
.keep a { color: var(--paper); border-bottom-color: rgba(242, 238, 230, .4); }

/* petit sommaire en tête */
.toc { display: flex; flex-wrap: wrap; gap: 10px 14px; margin: 0 0 54px; }
.toc a { font-family: "JetBrains Mono", monospace; font-size: 11px; letter-spacing: .12em;
  text-transform: uppercase; color: #77736c; border: 1px solid rgba(17, 16, 22, .18);
  border-bottom-color: rgba(17, 16, 22, .18); padding: 8px 12px; font-weight: 400; }
.toc a:hover { color: var(--ink); border-color: var(--ink); }

/* pied de page des pages légales : passer de l'une à l'autre */
.legal-nav { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px;
  background: rgba(17, 16, 22, .15); border: 1px solid rgba(17, 16, 22, .15); margin-top: 64px; }
.legal-nav a { display: block; background: var(--paper); padding: 24px 22px 26px;
  border-bottom: 0; color: var(--ink); }
.legal-nav a:hover { background: var(--paper-2); }
.legal-nav a[aria-current] { background: var(--paper-2); }
.legal-nav .mono { color: #77736c; }
.legal-nav b { display: block; margin-top: 9px; font-size: 17px; font-weight: 600; }
@media (max-width: 720px) { .legal-nav { grid-template-columns: 1fr; } }