:root{color-scheme:dark;--ink:#fff3e8;--soft:#cfc0c9;--bg:#120e18;--panel:#211927;--line:#473645;--peach:#ffab90;--mint:#a5edce;font-family:system-ui,-apple-system,sans-serif}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);line-height:1.55}
a{color:var(--peach);text-underline-offset:.24em}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--mint);outline-offset:4px}
.shell{width:min(100% - 2.2rem,72rem);margin-inline:auto}
.skip{position:absolute;top:.5rem;left:.5rem;transform:translateY(-180%);background:var(--bg);padding:.6rem;z-index:2}.skip:focus{transform:none}
header,footer{border-bottom:1px solid var(--line)}
nav,.foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:1rem 0}
nav a,.foot a{color:var(--ink)}
.brand{display:inline-flex;align-items:center;gap:.6rem;font-size:1.2rem;font-weight:850;text-decoration:none;letter-spacing:-.04em}
.brand img{border-radius:10px}
.nav-links{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;font-size:.93rem}
.hero{background:radial-gradient(ellipse at 80% 25%,#392037 0%,transparent 66%)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:2.6rem;align-items:center;padding-block:clamp(3rem,9vw,7rem)}
.kicker,.index{font-size:.76rem;font-weight:820;letter-spacing:.15em;text-transform:uppercase;color:var(--peach)}
h1,h2,h3,p{margin-top:0}h1,h2,h3{line-height:1.08;text-wrap:balance}
h1{font-size:clamp(2.85rem,8.5vw,6.25rem);letter-spacing:-.08em;margin-bottom:1.15rem}
h1 span{color:var(--peach)}
h2{font-size:clamp(1.75rem,4vw,3rem);letter-spacing:-.055em;margin-bottom:1rem}
h3{font-size:1.28rem;letter-spacing:-.025em;margin-bottom:.55rem}
.lede{font-size:clamp(1.05rem,2vw,1.26rem);color:var(--soft);max-width:36ch}
.actions{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:1.55rem}
.button{display:inline-flex;min-height:48px;align-items:center;justify-content:center;gap:.5rem;border:1px solid transparent;border-radius:.8rem;background:var(--peach);color:#24111d;padding:.7rem 1.1rem;text-decoration:none;font:inherit;font-weight:780;cursor:pointer}
.button.secondary{background:transparent;color:var(--ink);border-color:var(--line)}
.button:hover{filter:brightness(1.1)}.button:disabled{opacity:.65;cursor:wait}
.note,.muted{color:var(--soft)}.note{font-size:.9rem;margin:.85rem 0 0}
.card{background:#1c1422;border:1px solid #654454;border-radius:1.55rem;padding:.9rem;box-shadow:0 25px 70px #08050a80;margin:0;max-width:34rem}
.card-top{display:flex;justify-content:space-between;align-items:center;padding:.1rem .25rem .75rem;gap:.5rem}
.card-top span:last-child{color:var(--mint);font-size:.8rem}
.card img{display:block;width:100%;height:auto;aspect-ratio:1.12;object-fit:cover;object-position:50% 88%;border-radius:.95rem}
.card figcaption{padding:.85rem .15rem .15rem}.card figcaption p{margin:0}
.choices{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin-top:.8rem}
.choices button{min-height:47px;border:1px solid var(--line);background:#302336;color:var(--ink);border-radius:.62rem;font:inherit;font-weight:700;cursor:pointer}
.choices button:last-child{background:var(--peach);color:#24111d}
.answer{margin-top:.75rem;background:#2c2630;padding:.75rem;border-radius:.65rem;color:var(--ink)}
.answer:empty{display:none}
.section{padding-block:clamp(2.7rem,6vw,5rem);border-top:1px solid var(--line)}
.tiles{display:grid;gap:1rem;margin-top:1.5rem}
.tile{background:var(--panel);border:1px solid var(--line);border-radius:1.1rem;padding:1.25rem}.tile p:last-child{margin-bottom:0}
.band{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;padding:1.65rem;border:1px solid var(--line);border-radius:1.15rem;background:linear-gradient(105deg,#382436,#221927)}
.band h2,.band p{margin-bottom:.35rem}
footer{border-top:1px solid var(--line);border-bottom:0}.foot{font-size:.9rem;color:var(--soft)}
.doc{width:min(100% - 2.2rem,48rem);margin:auto;padding-block:clamp(2.8rem,7vw,5rem)}
.doc h1{font-size:clamp(2.4rem,8vw,4.5rem)}.doc h2{font-size:1.52rem;margin-top:2rem}.doc p,.doc li{overflow-wrap:anywhere}
.doc section{scroll-margin:1rem}.doc li+li{margin-top:.4rem}
form{display:grid;gap:1rem;margin:1.4rem 0}.field{display:grid;gap:.35rem}
input,select,textarea{font:inherit;color:var(--ink);background:var(--panel);border:1px solid #735a70;border-radius:.58rem;padding:.65rem .8rem;width:100%;min-height:46px}
textarea{resize:vertical}.trap{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
#etat{margin:0;color:var(--mint)}.doc address{font-style:normal}
@media(min-width:49rem){.hero-grid{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr)}.tiles{grid-template-columns:repeat(3,1fr)}.card{justify-self:end;width:100%}}
@media(max-width:48.99rem){.hero-grid{gap:1.65rem;padding-top:2.35rem}.hero .actions .secondary{border-color:transparent;padding-inline:.5rem;text-decoration:underline}.hero .actions{gap:.3rem .5rem}}