/* ============================================================
   PIEL · TINTA — pages légales (direction Boudoir)
   ============================================================ */
:root{
  --ink:#0b0608; --ink-2:#150a0d; --ink-3:#1e0f12;
  --paper:#efe6e2; --paper-soft:#c8bbb4; --paper-dim:#8c7d77;
  --line:rgba(239,230,226,.12); --line-soft:rgba(239,230,226,.07);
  --accent:#c01828; --accent-deep:#6c0d15;
  --accent-glow:color-mix(in oklab, var(--accent) 38%, transparent);
  --ff-soft:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --ff-body:"Hanken Grotesk",system-ui,sans-serif;
  --ff-mono:"Space Mono",ui-monospace,monospace;
  --maxw:1240px; --pad:clamp(20px,5vw,64px);
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--ink);color:var(--paper);font-family:var(--ff-body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
a{color:inherit;text-decoration:none}
::selection{background:var(--accent);color:#fff}

/* grain + vignette */
.grain,.vignette{position:fixed;pointer-events:none}
.grain{inset:-120%;z-index:60;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.vignette{inset:0;z-index:55;background:radial-gradient(110% 80% at 50% 30%,transparent 35%,rgba(0,0,0,.62) 100%)}

/* header */
.hdr{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;
  padding:16px var(--pad);border-bottom:1px solid var(--line);
  background:color-mix(in oklab,var(--ink) 84%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.logo{font-family:var(--ff-soft);font-weight:600;font-size:23px;letter-spacing:.1em;text-transform:uppercase;display:flex;align-items:center}
.logo .mid{color:var(--accent);margin:0 .14em;font-weight:700}
.nav{display:flex;align-items:center;gap:30px}
.nav a{font-family:var(--ff-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--paper-soft);transition:color .25s}
.nav a:hover{color:var(--paper)}
.badge18{font-family:var(--ff-mono);font-size:11px;letter-spacing:.1em;border:1px solid var(--accent);color:var(--accent);padding:6px 9px;border-radius:2px}
@media(max-width:760px){.nav{display:none}}

/* legal article */
.legal{position:relative;z-index:2;max-width:840px;margin-inline:auto;padding:72px var(--pad) 40px}
.legal .back{font-family:var(--ff-mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);display:inline-block;margin-bottom:36px}
.legal h1{font-family:var(--ff-soft);font-weight:600;font-size:clamp(38px,7vw,64px);line-height:1.02;letter-spacing:0;margin-bottom:12px;text-wrap:balance}
.legal .updated{font-family:var(--ff-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--paper-dim);margin-bottom:44px}
.legal h2{font-family:var(--ff-soft);font-weight:600;font-size:28px;color:var(--paper);margin:40px 0 14px}
.legal p,.legal li{color:var(--paper-soft);font-size:16px;margin-bottom:14px}
.legal ul{padding-left:22px;margin-bottom:14px}
.legal li{margin-bottom:8px}
.legal a{color:var(--accent);border-bottom:1px solid var(--accent-glow);text-underline-offset:3px}
.legal strong{color:var(--paper);font-weight:600}
.legal .box{border:1px solid var(--line);border-top:2px solid var(--accent);background:linear-gradient(180deg,var(--ink-3),var(--ink-2));padding:24px 26px;margin:26px 0;box-shadow:0 30px 90px -50px #000}
.legal .muted{color:var(--paper-dim);font-size:14px}

/* footer */
.ftr{background:var(--ink-2);border-top:1px solid var(--accent);margin-top:48px;padding:44px var(--pad);position:relative;z-index:2}
.ftr .wrap{max-width:var(--maxw);margin-inline:auto;display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;align-items:center}
.ftr .badge18{font-size:11px}
.ftr small{font-family:var(--ff-mono);font-size:11px;letter-spacing:.08em;color:var(--paper-dim)}
.ftr small a{color:var(--paper-soft)}
.ftr small a:hover{color:var(--accent)}