/* StelarWork — styles partagés des pages légales (mentions légales, confidentialité) */
:root{
  --bg:#ECEFF3;
  --bg-2:#F6F8FA;
  --ink:#0C1B2A;
  --ink-2:#51606E;
  --ink-3:#8A97A3;
  --line:rgba(12,27,42,0.12);
  --accent:#4B45B8;
  --serif:'Bricolage Grotesque', ui-sans-serif, system-ui, sans-serif;
  --sans:'Hanken Grotesk', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --mono:'JetBrains Mono', ui-monospace, 'SFMono-Regular', monospace;
}
*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--sans); font-size:17px; line-height:1.62;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
::selection{ background:var(--accent); color:#fff; }
a{ color:var(--accent); }
img,svg{ display:block; max-width:100%; }

.shell{ width:100%; max-width:760px; margin:0 auto; padding:0 30px; }

.legal-header{ border-bottom:1px solid var(--line); }
.legal-header .shell{ display:flex; align-items:center; justify-content:space-between; height:74px; }
.brand{ display:flex; align-items:center; gap:11px; text-decoration:none; color:var(--ink);
  font-family:var(--serif); font-weight:600; font-size:1.18rem; letter-spacing:-0.01em; }
.brand svg{ width:27px; height:27px; flex:0 0 auto; }
.back{ text-decoration:none; color:var(--ink-2); font-weight:500; font-size:0.95rem;
  display:inline-flex; align-items:center; gap:8px; }
.back:hover{ color:var(--ink); }

main{ padding:56px 0 80px; }
.eyebrow{ font-family:var(--mono); font-size:0.71rem; font-weight:500;
  letter-spacing:0.2em; text-transform:uppercase; color:var(--accent); }
h1{ font-family:var(--serif); font-weight:600; letter-spacing:-0.02em;
  font-size:clamp(2rem,5vw,2.9rem); line-height:1.08; margin:14px 0 0; }
.updated{ margin-top:14px; color:var(--ink-3); font-size:0.9rem; font-family:var(--mono); }
h2{ font-family:var(--serif); font-weight:600; letter-spacing:-0.01em;
  font-size:1.3rem; margin:44px 0 0; padding-top:28px; border-top:1px solid var(--line); }
h3{ font-family:var(--serif); font-weight:600; font-size:1.05rem; margin:24px 0 0; }
p,li{ color:var(--ink-2); }
p{ margin:12px 0 0; }
ul{ margin:12px 0 0; padding-left:1.2em; }
li{ margin:6px 0; }
b,strong{ color:var(--ink); font-weight:600; }
a:hover{ text-decoration:underline; }

.todo{ background:rgba(75,69,184,0.07); border:1px solid rgba(75,69,184,0.25);
  color:var(--accent); font-family:var(--mono); font-size:0.82em; font-weight:500;
  padding:1px 7px; border-radius:5px; white-space:nowrap; }

.callout{ margin-top:28px; background:var(--bg-2); border:1px solid var(--line);
  border-left:3px solid var(--accent); border-radius:12px; padding:20px 24px; }
.callout p{ margin:0; color:var(--ink); }

.legal-footer{ border-top:1px solid var(--line); padding:32px 0; color:var(--ink-3); font-size:0.86rem; }
.legal-footer .shell{ display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap; }
.legal-footer a{ color:var(--ink-3); text-decoration:none; }
.legal-footer a:hover{ color:var(--ink); }

:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; border-radius:4px; }
