/* ==========================================================================
   Pages légales (fond blanc)
   ========================================================================== */
html { background: #fff; }
body.page-legal { background: #fff; color: var(--ink-text); font-family: 'Instrument Sans', system-ui, sans-serif; }

.legal-header {
  position: sticky; top: 0; z-index: 5;
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  padding: 22px var(--gutter);
  background: rgba(255, 255, 255, .92); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(16, 16, 18, .08);
}
.legal-header .brand { color: var(--ink-text); }
.legal-header .brand__dot { color: var(--yellow-deep); }
.legal-back {
  display: inline-flex; align-items: center; gap: 8px; padding: 11px 20px; border-radius: 999px;
  border: 1px solid rgba(16, 16, 18, .14); color: var(--ink-text);
  font: 600 13px/1 var(--f-body); text-decoration: none; transition: border-color .25s, background .25s;
}
.legal-back:hover { border-color: var(--yellow-deep); background: rgba(255, 238, 51, .12); color: var(--ink-text); }

.legal { max-width: 760px; margin: 0 auto; padding: clamp(56px, 8vw, 110px) clamp(20px, 4vw, 32px) clamp(80px, 10vw, 130px); }
.legal__title { margin: 16px 0 0; font-family: var(--f-display); font-variation-settings: 'wdth' 98, 'wght' 700; font-size: clamp(34px, 5vw, 56px); line-height: 1; letter-spacing: -.035em; }
.legal__date { margin: 18px 0 0; font: 400 13px/1.6 var(--f-body); color: rgba(16, 16, 18, .55); }
.legal__body { display: flex; flex-direction: column; gap: 40px; margin-top: clamp(40px, 5vw, 60px); font: 400 16px/1.75 var(--f-body); color: rgba(16, 16, 18, .82); }
.legal__body section { display: flex; flex-direction: column; gap: 12px; }
.legal__body section > p { margin: 0; }
.legal__body h2 { margin: 0; font-family: var(--f-display); font-variation-settings: 'wdth' 100, 'wght' 650; font-size: 22px; line-height: 1.2; letter-spacing: -.01em; color: var(--ink-text); }
.legal__body a { color: var(--ink-text); text-decoration: underline; text-decoration-color: var(--yellow-deep); text-underline-offset: 3px; }
.legal__body a:hover { color: var(--yellow-ink); }
.legal__body strong { color: inherit; }
.legal__link {
  display: inline; padding: 0; border: 0; background: none; cursor: pointer;
  font: inherit; color: var(--ink-text); text-decoration: underline; text-decoration-color: var(--yellow-deep); text-underline-offset: 3px;
}
.legal__link:hover { color: var(--yellow-ink); }
