/* MailRich, pages légales, style partagé : identité 2054 (lumineux) */
:root{
  --bg:#f4f4f1;--bg-2:#eceae4;--paper:#fbfbf9;
  --ink:#0a0b0d;--ink-2:#33363d;--muted:#71747c;
  --line:rgba(10,11,13,.10);--line-2:rgba(10,11,13,.16);
  --accent:#1b3cff;--accent-ink:#0e1f8c;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink-2);font-family:"Hanken Grotesk",-apple-system,BlinkMacSystemFont,sans-serif;font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased}
::selection{background:var(--ink);color:var(--bg)}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.bar{position:sticky;top:0;z-index:10;background:rgba(244,244,241,.78);backdrop-filter:blur(16px) saturate(1.4);border-bottom:1px solid var(--line)}
.bar-in{max-width:820px;margin:0 auto;padding:16px 28px;display:flex;align-items:center;justify-content:space-between}
.logo{display:flex;align-items:center;gap:10px;font-family:"Bricolage Grotesque",sans-serif;font-weight:600;font-size:20px;letter-spacing:-.02em;color:var(--ink)}
.logo:hover{text-decoration:none}
.logo .mark{width:28px;height:28px;flex:none}
.logo .mark svg{width:28px;height:28px}
.logo b{font-weight:800}
.back{font-size:14px;color:var(--muted)}
.back:hover{color:var(--ink);text-decoration:none}
.wrap{max-width:820px;margin:0 auto;padding:66px 28px 90px}
.kick{font-family:"JetBrains Mono",monospace;font-size:12px;letter-spacing:.16em;color:var(--accent);text-transform:uppercase;display:block;margin-bottom:16px}
h1{font-family:"Bricolage Grotesque",Georgia,serif;font-weight:600;font-size:clamp(32px,5vw,52px);line-height:1.04;letter-spacing:-.03em;color:var(--ink);margin-bottom:14px}
.meta{color:var(--muted);font-size:14px;margin-bottom:34px}
.draft{border:1px solid var(--line-2);background:var(--paper);border-radius:14px;padding:16px 20px;font-size:14px;color:var(--ink-2);margin-bottom:42px;position:relative;padding-left:22px}
.draft::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;border-radius:3px 0 0 3px;background:var(--accent)}
.draft b{color:var(--ink)}
h2{font-family:"Bricolage Grotesque",sans-serif;font-weight:600;font-size:24px;color:var(--ink);margin:46px 0 14px;letter-spacing:-.02em;padding-top:8px}
h3{font-size:17px;font-weight:600;color:var(--ink);margin:26px 0 8px}
p{color:var(--ink-2);margin-bottom:14px}
strong{color:var(--ink);font-weight:600}
ul,ol{color:var(--ink-2);margin:0 0 16px 22px}
li{margin-bottom:8px}
.todo{color:var(--accent-ink);font-family:"JetBrains Mono",monospace;font-size:.92em;background:rgba(27,60,255,.08);padding:1px 7px;border-radius:5px}
.foot{max-width:820px;margin:0 auto;padding:30px 28px 50px;border-top:1px solid var(--line);color:var(--muted);font-size:13px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}
.foot a{color:var(--ink-2)}
.foot a:hover{color:var(--ink)}
table{width:100%;border-collapse:collapse;margin:16px 0;font-size:14.5px}
th,td{text-align:left;padding:11px 12px;border:1px solid var(--line);vertical-align:top}
th{background:var(--bg-2);color:var(--ink);font-weight:600}
td{color:var(--ink-2)}
@media(max-width:540px){.wrap{padding:46px 20px 70px}.bar-in{padding:14px 20px}}