@font-face{font-family:Quicksand;font-weight:300 700;font-display:swap;src:url(quicksand.ttf) format("truetype")}
@font-face{font-family:Figtree;font-weight:400;font-display:swap;src:url(figtree-400.ttf) format("truetype")}
@font-face{font-family:Figtree;font-weight:600;font-display:swap;src:url(figtree-600.ttf) format("truetype")}
:root{--nuit:#01080e;--nuit2:#02121a;--vert:#3ef0a2;--bouton:#2de89a;--surbouton:#01140f;--texte:#fff;--doux:#cfe3dd;--ligne:rgba(207,227,221,.18);--champ:rgba(255,255,255,.06)}
*{box-sizing:border-box}
html{background:var(--nuit)}
body{margin:0;min-height:100vh;font-family:Figtree,system-ui,sans-serif;font-size:17px;line-height:1.55;color:var(--texte);
background:radial-gradient(ellipse 90% 60% at 85% 100%,#06302a 0%,var(--nuit2) 55%,var(--nuit) 100%) no-repeat;background-color:var(--nuit)}
a{color:var(--vert)}
.page{max-width:720px;margin:0 auto;padding:24px 20px 40px}
.logo{display:block;width:min(320px,80vw);height:auto;margin:8px auto 0;
-webkit-mask-image:linear-gradient(to right,transparent,#000 9%,#000 91%,transparent),linear-gradient(to bottom,transparent,#000 12%,#000 95%,transparent);-webkit-mask-composite:source-in;
mask-image:linear-gradient(to right,transparent,#000 9%,#000 91%,transparent),linear-gradient(to bottom,transparent,#000 12%,#000 95%,transparent);mask-composite:intersect}
.sur{text-align:center;line-height:1.35;margin-top:24px;font-weight:700;font-size:clamp(17px,4.6vw,22px);letter-spacing:.14em;text-transform:uppercase;color:var(--vert)}
h1{text-align:center;font-family:Quicksand,sans-serif;font-weight:700;font-size:clamp(40px,9vw,68px);line-height:1.02;margin:10px 0 0}
h1 em{font-style:normal;color:var(--vert)}
.intro{text-align:center;font-size:19px;color:var(--doux);margin:18px auto 0;max-width:600px}
.etapes{list-style:none;padding:0;margin:26px 0 0;display:grid;gap:10px;justify-items:center}
.etapes li{font-family:Quicksand,sans-serif;font-weight:700;font-size:21px;display:flex;align-items:center;justify-content:center;gap:14px}
.etapes li span{display:none;flex:none;width:12px;height:12px;border-radius:50%;background:var(--bouton);box-shadow:0 0 12px var(--bouton)}
.carte{margin-top:34px;padding:24px 22px;border:1px solid var(--ligne);border-radius:20px;background:rgba(1,8,14,.55)}
.carte h2{font-family:Quicksand,sans-serif;font-size:26px;line-height:1.15;margin:0}
.carte p{margin:8px 0 0;color:var(--doux)}
form{margin-top:18px;display:grid;gap:14px}
label{display:block;font-weight:600;font-size:15px;margin-bottom:6px}
input[type=text],input[type=email],select{width:100%;font:inherit;color:var(--texte);background:var(--champ);border:1px solid var(--ligne);border-radius:12px;padding:12px 14px}
input:focus,select:focus{outline:2px solid var(--vert);outline-offset:1px}
.accord{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--doux);font-weight:400}
.accord input{margin-top:4px;width:18px;height:18px;accent-color:var(--bouton);flex:none}
button{justify-self:start;font:inherit;font-family:Quicksand,sans-serif;font-weight:700;font-size:19px;color:var(--surbouton);background:var(--bouton);border:0;border-radius:99px;padding:14px 30px;cursor:pointer}
button:disabled{opacity:.55;cursor:default}
.message{font-weight:600;color:var(--vert);margin:0}
.message.erreur{color:#ffb4a8}
.dates{margin-top:30px;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.dates div{border-left:3px solid var(--vert);padding:2px 0 2px 12px}
.dates b{display:block;font-family:Quicksand,sans-serif;font-size:19px}
.dates small{color:var(--doux);font-size:14px}
.suivre{margin-top:30px;color:var(--doux)}
footer{margin-top:40px;padding-top:16px;border-top:1px solid var(--ligne);font-size:14px;color:var(--doux);display:flex;flex-wrap:wrap;gap:8px 18px}
footer a{color:var(--doux)}
.legal h1{font-size:clamp(32px,7vw,44px)}
.legal h2{font-family:Quicksand,sans-serif;font-size:22px;margin:28px 0 6px}
.legal p,.legal li{color:var(--doux)}
.retour{display:inline-block;margin-top:18px}
