/* =========================================================
   PROLIFIQUE RECORDS — pages légales (mentions, CGV, confidentialité)
   ========================================================= */
.legal { padding: 128px var(--gutter) 96px; }
.legal__head { display: grid; gap: 16px; margin-bottom: 56px; }
.legal__title {
  font-size: clamp(40px, 6.4vw, 104px); line-height: .92; font-weight: 800; font-style: italic;
  letter-spacing: -.03em; text-transform: uppercase; max-width: 14ch;
}
.legal__date { color: var(--dim); }
.legal__nav { display: flex; flex-wrap: wrap; gap: 8px 24px; }
.legal__nav a { text-decoration: underline; text-underline-offset: 4px; text-decoration-color: transparent; transition: text-decoration-color .2s; }
.legal__nav a:hover, .legal__nav a[aria-current] { text-decoration-color: currentColor; }

.legal__body { max-width: 760px; display: grid; gap: 40px; }
.legal__body h2 { font-size: 15px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 12px; }
.legal__body p, .legal__body li { font-size: 17px; line-height: 1.6; color: #3a3a3a; }
.legal__body p + p { margin-top: 12px; }
.legal__body ul { display: grid; gap: 10px; padding-left: 1.2em; }
.legal__body a { color: var(--white); text-decoration: underline; text-underline-offset: 3px; }
.legal__body strong { color: var(--white); }
.legal__body .todo { background: #ffe14d; color: #0e0e0e; padding: 0 .25em; font-weight: 600; }

@media (max-width: 720px) {
  .legal { padding-top: 104px; }
  .legal__head { margin-bottom: 36px; }
  .legal__body { gap: 32px; }
  .legal__body p, .legal__body li { font-size: 16px; }
}