/* ──────────────────────────────────────────────────────────
   PAGES LÉGALES + COOKIE BANNER
   ────────────────────────────────────────────────────────── */
.page-legal{background:var(--paper);min-height:calc(100vh - 200px);padding-bottom:96px}

/* Head */
.legal-head{
  max-width:1100px;margin:40px auto 0;padding:32px 36px 36px;
  border-bottom:1px solid var(--rule);
}
.legal-eyebrow{
  font:700 11px/1 var(--sans);letter-spacing:.28em;text-transform:uppercase;
  color:var(--accent-deep);margin-bottom:14px;
}
.legal-head h1{
  font-family:var(--display);font-size:clamp(36px,5.2vw,72px);
  line-height:.9;letter-spacing:-.015em;margin:0 0 14px;text-wrap:balance;
  color:var(--ink);
}
.legal-updated{font-size:13px;color:rgba(13,20,24,.55);margin:0}

/* Two-column layout */
.legal-layout{
  max-width:1100px;margin:48px auto 0;padding:0 36px;
  display:grid;grid-template-columns:260px 1fr;gap:48px;
  align-items:flex-start;
}
@media (max-width:900px){.legal-layout{grid-template-columns:1fr;gap:32px}}

/* TOC */
.legal-toc{
  position:sticky;top:96px;
  background:var(--paper-2);border:1px solid var(--rule);
  border-radius:16px;padding:22px 22px 18px;
  font-size:13.5px;
}
@media (max-width:900px){.legal-toc{position:relative;top:0}}
.legal-toc-head{
  font:700 10.5px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;
  color:rgba(13,20,24,.55);margin-bottom:14px;
}
.legal-toc ol{
  list-style:none;padding:0;margin:0 0 22px;
  display:flex;flex-direction:column;gap:8px;
  counter-reset:toc;
}
.legal-toc li{
  counter-increment:toc;
  display:flex;align-items:flex-start;gap:8px;line-height:1.45;
}
.legal-toc li::before{
  content:counter(toc, decimal-leading-zero);
  font:600 10.5px/1.5 ui-monospace,Menlo,monospace;
  color:rgba(13,20,24,.4);flex-shrink:0;letter-spacing:.04em;
}
.legal-toc a{
  color:var(--ink);text-decoration:none;
  border-bottom:1px solid transparent;
  transition:border-color .15s ease, color .15s ease;
}
.legal-toc a:hover{color:var(--accent-deep);border-color:var(--accent)}

.legal-related{
  padding-top:18px;border-top:1px solid var(--rule);
  display:flex;flex-direction:column;gap:6px;
}
.legal-related .r-h{
  font:700 10.5px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;
  color:rgba(13,20,24,.55);margin-bottom:8px;
}
.legal-related a{
  font-size:13px;color:rgba(13,20,24,.7);
  border-bottom:1px solid transparent;
  transition:color .15s ease, border-color .15s ease;
}
.legal-related a:hover{color:var(--ink);border-color:var(--rule)}

/* Body */
.legal-body{
  font-size:15.5px;line-height:1.75;color:rgba(13,20,24,.82);
  scroll-behavior:smooth;
}
.legal-body section{margin-bottom:48px;scroll-margin-top:96px}
.legal-body h2{
  font-family:var(--display);font-size:clamp(22px,2.4vw,30px);
  line-height:1.1;letter-spacing:-.005em;
  color:var(--ink);margin:0 0 16px;padding-top:8px;
  border-top:1px solid var(--rule);padding-top:24px;
}
.legal-body section:first-child h2{border-top:none;padding-top:0}
.legal-body p{margin:0 0 14px;text-wrap:pretty}
.legal-body strong{color:var(--ink);font-weight:600}
.legal-body em{font-style:italic;font-family:var(--serif);font-weight:500;color:var(--ink)}
.legal-body a{color:var(--accent-deep);border-bottom:1px solid currentColor;font-weight:500}
.legal-body a:hover{color:var(--ink)}

/* Foot */
.legal-foot{
  max-width:1100px;margin:64px auto 0;padding:36px 36px 0;
  border-top:1px solid var(--rule);
  font-size:13.5px;color:rgba(13,20,24,.6);text-align:center;
}
.legal-foot a{color:var(--ink);border-bottom:1px solid currentColor;font-weight:500}

/* ── COOKIE BANNER ──────────────────────────────────────── */
.cookie-banner{
  position:fixed;left:18px;right:18px;bottom:18px;
  z-index:997;
  background:#fff;border:1px solid var(--rule);
  border-radius:18px;
  box-shadow:0 18px 50px rgba(13,20,24,.18);
  padding:22px 24px;
  display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center;
  max-width:880px;margin:0 auto;
  transform:translateY(120%);opacity:0;
  transition:transform .4s cubic-bezier(.2,.7,.2,1), opacity .3s ease;
}
.cookie-banner.is-open{transform:translateY(0);opacity:1}
@media (max-width:760px){
  .cookie-banner{grid-template-columns:1fr;gap:14px;padding:20px 22px}
}

.cookie-banner .cb-text{
  font-size:13.5px;line-height:1.55;color:rgba(13,20,24,.78);
}
.cookie-banner .cb-text strong{color:var(--ink);font-weight:600}
.cookie-banner .cb-text a{color:var(--accent-deep);border-bottom:1px solid currentColor}

.cookie-banner .cb-actions{
  display:flex;gap:8px;align-items:center;
}
@media (max-width:760px){.cookie-banner .cb-actions{flex-wrap:wrap}}

.cookie-banner button{
  font:600 12.5px/1 var(--sans);
  padding:11px 16px;border-radius:999px;
  border:1px solid var(--rule);background:#fff;color:var(--ink);
  cursor:pointer;letter-spacing:.01em;white-space:nowrap;
  transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.cookie-banner button:hover{background:var(--paper-2)}
.cookie-banner button.cb-accept{
  background:var(--ink);color:#fff;border-color:var(--ink);
}
.cookie-banner button.cb-accept:hover{background:#000}

/* ──────────────────────────────────────────────────────────
   MOBILE — 768px (pages légales + cookies)
   ────────────────────────────────────────────────────────── */
@media (max-width:768px){
  .legal-head{margin-top:24px;padding:24px 16px 28px}
  .legal-eyebrow{font-size:10px;letter-spacing:.22em;margin-bottom:12px}
  .legal-head h1{font-size:clamp(30px,9vw,52px);margin-bottom:12px}
  .legal-updated{font-size:12px}

  .legal-layout{margin-top:32px;padding:0 16px;grid-template-columns:1fr;gap:24px}
  .legal-toc{position:relative;top:0;padding:18px 18px 14px;font-size:12.5px}
  .legal-toc ol{gap:6px;margin-bottom:18px}
  .legal-toc-head{font-size:10px;margin-bottom:12px}
  .legal-related a{font-size:12px}

  .legal-body{font-size:14.5px;line-height:1.7}
  .legal-body section{margin-bottom:36px}
  .legal-body h2{font-size:clamp(20px,5.5vw,26px);margin-bottom:14px;padding-top:20px}

  .legal-foot{margin-top:48px;padding:28px 16px 0;font-size:12.5px}

  /* COOKIE BANNER */
  .cookie-banner{
    left:12px;right:12px;bottom:12px;
    padding:18px 18px;border-radius:14px;gap:12px;
    grid-template-columns:1fr;
  }
  .cookie-banner .cb-text{font-size:12.5px;line-height:1.5}
  .cookie-banner .cb-actions{flex-wrap:wrap;gap:6px}
  .cookie-banner button{padding:10px 14px;font-size:12px;flex:1 1 auto}
}