:root{
  --ardoise:#15191E;
  --ardoise-soft:#1F2730;
  --sable:#F4EFE6;
  --bleu:#7BB7C7;
  --display:'Barlow Condensed',sans-serif;
  --body:'Barlow',sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-font-smoothing:antialiased;scroll-behavior:smooth}
body{
  font-family:var(--body);background:var(--ardoise);
  color:rgba(244,239,230,.85);line-height:1.7;font-size:16px;font-weight:400;
}
a{color:var(--bleu);text-decoration:none}
a:hover{text-decoration:underline}

/* ── En-tête ── */
.legal-top{
  position:sticky;top:0;z-index:10;
  display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;
  padding:22px 6vw;border-bottom:1px solid rgba(244,239,230,.08);
  background:rgba(21,25,30,.92);backdrop-filter:blur(6px);
}
.legal-top .marque{
  font-family:var(--display);font-weight:600;font-size:1.35rem;
  text-transform:uppercase;letter-spacing:.2em;color:var(--sable);
  display:inline-flex;align-items:center;gap:.4em;
}
.legal-top .marque:hover{text-decoration:none}
.legal-top .presence{width:8px;height:8px;border-radius:50%;background:var(--bleu);flex-shrink:0}
.legal-nav{display:flex;gap:22px;flex-wrap:wrap;
  font-family:var(--display);font-size:.82rem;text-transform:uppercase;letter-spacing:.09em}
.legal-nav a{color:rgba(244,239,230,.6)}
.legal-nav a:hover{color:var(--bleu);text-decoration:none}
.legal-nav a.actif{color:var(--sable)}

/* ── Contenu ── */
.legal-main{max-width:760px;margin:0 auto;padding:56px 6vw 88px}
.legal-main h1{
  font-family:var(--display);font-weight:700;letter-spacing:-.01em;line-height:1.05;
  font-size:clamp(2rem,5vw,3rem);color:var(--sable);margin-bottom:6px;
}
.legal-main .maj{
  font-size:.82rem;color:rgba(244,239,230,.5);margin-bottom:34px;
}
.legal-main h2{
  font-family:var(--display);font-weight:600;font-size:1.5rem;color:var(--sable);
  margin:40px 0 14px;letter-spacing:.005em;
}
.legal-main h3{
  font-family:var(--display);font-weight:600;font-size:1.15rem;color:var(--sable);
  margin:26px 0 10px;
}
.legal-main p{margin-bottom:16px}
.legal-main ul{margin:0 0 18px;padding-left:22px}
.legal-main li{margin-bottom:8px}
.legal-main strong{color:var(--sable);font-weight:600}
.legal-main em{color:rgba(244,239,230,.55);font-style:italic}
.legal-main a{border-bottom:1px solid rgba(123,183,199,.4)}
.legal-main a:hover{text-decoration:none;border-bottom-color:var(--bleu)}
.legal-main hr{border:none;border-top:1px solid rgba(244,239,230,.12);margin:38px 0}
.legal-main .note{
  margin-top:38px;padding:18px 22px;border-left:3px solid rgba(123,183,199,.5);
  background:var(--ardoise-soft);border-radius:0 8px 8px 0;
  font-size:.92rem;color:rgba(244,239,230,.7);
}

/* ── Tableau ── */
.legal-main table{width:100%;border-collapse:collapse;margin:0 0 20px}
.legal-main th,.legal-main td{text-align:left;padding:11px 14px;border-bottom:1px solid rgba(244,239,230,.12)}
.legal-main th{
  font-family:var(--display);font-weight:600;color:var(--sable);
  text-transform:uppercase;font-size:.76rem;letter-spacing:.06em;
}

/* ── Pied ── */
.legal-foot{
  border-top:1px solid rgba(244,239,230,.08);
  padding:26px 6vw;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  font-size:.82rem;color:rgba(244,239,230,.5);
}
.legal-foot a{color:rgba(244,239,230,.7);border-bottom:1px solid rgba(244,239,230,.25)}
.legal-foot a:hover{color:var(--bleu);text-decoration:none;border-bottom-color:var(--bleu)}

@media (max-width:640px){
  .legal-top{flex-direction:column;align-items:flex-start;gap:14px}
  .legal-nav{gap:16px}
}