/* Pages de texte (confidentialité, suppression du compte) : même DA que le site, toujours en clair. */
:root{
  color-scheme:light;
  --navy:#1D3A5F; --sky:#CFE0EE; --terra-ink:#B4532A; --soft:#F7F4EE; --muted:#425A78; --rule:#1D3A5F26;
  --f-display:'Fraunces', Georgia, 'Times New Roman', serif;
  --f-body:'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --f-mono:'IBM Plex Mono', ui-monospace, Consolas, monospace;
}
*{box-sizing:border-box}
body{margin:0; background:#FFFFFF; color:var(--navy); font-family:var(--f-body); font-size:17px; line-height:1.65}
a{color:var(--terra-ink)}
a:focus-visible{outline:3px solid #E07A4F; outline-offset:3px; border-radius:4px}
.wrap{max-width:760px; margin:0 auto; padding-left:max(16px, env(safe-area-inset-left, 0px)); padding-right:max(16px, env(safe-area-inset-right, 0px))}

header{border-bottom:1px solid var(--rule)}
header .wrap{display:flex; align-items:center; justify-content:space-between; gap:16px; height:68px}
.brand{text-decoration:none; color:var(--navy); font:650 22px/1 var(--f-display); font-variation-settings:'SOFT' 100,'opsz' 144}
.brand small{display:block; font:500 10px/1 var(--f-mono); letter-spacing:.16em; text-transform:uppercase; color:var(--terra-ink); margin-top:5px}
.back{font-size:15px; color:var(--muted); text-decoration:none}
.back:hover{color:var(--navy)}

main{padding-top:48px; padding-bottom:72px}
.label{margin:0 0 12px; font:600 12px var(--f-mono); letter-spacing:.14em; text-transform:uppercase; color:var(--terra-ink)}
h1,h2{font-family:var(--f-display); font-variation-settings:'SOFT' 100,'opsz' 144; letter-spacing:-.02em; text-wrap:balance}
h1{margin:0; font-size:clamp(34px, 7vw, 52px); font-weight:650; line-height:1.02}
h2{margin:40px 0 10px; font-size:24px; font-weight:600; line-height:1.15}
p{margin:0 0 12px}
ul{margin:0 0 12px; padding-left:20px; display:flex; flex-direction:column; gap:8px}
.maj{margin-top:12px; font:13px var(--f-mono); color:var(--muted)}

.steps{display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); gap:16px; margin-top:32px}
.steps section{background:var(--soft); border:1.5px solid var(--rule); border-radius:20px; padding:22px 24px}
.steps h2{margin-top:0}
.more{margin-top:40px}

footer{background:var(--navy); color:#C9D7E6}
footer .wrap{display:flex; flex-wrap:wrap; gap:12px 24px; padding-top:28px; padding-bottom:28px; font:12px var(--f-mono); letter-spacing:.08em}
footer .links{margin-left:auto; display:flex; flex-wrap:wrap; gap:12px 20px}
footer a{color:#FFFFFF}