/* Polices hébergées sur nafii.org (aucun appel à un service tiers) */
/* Inter : police libre (SIL OFL), hébergée sur le site */
@font-face{font-family:"Inter";src:url("/fonts/inter.woff2") format("woff2");font-weight:400 800;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";src:url("/fonts/inter-latin-ext.woff2") format("woff2");font-weight:400 800;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* Arabe : chargée seulement quand la page contient des lettres arabes */
@font-face{font-family:"Noto Sans Arabic";src:url("/fonts/noto-sans-arabic.woff2") format("woff2");font-weight:400 800;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}

:root{
  --ink:#0B1F17; --text:#3F4A45; --muted:#5D6A64; --line:#D5DED9;
  --green:#047857; --green-deep:#064E3B; --mint:#D1FAE5; --mint-strong:#A7F3D0; --leaf:#34D399;
  --ground:#F7FAF8; --soft:#F3F7F5; --white:#FFFFFF; --error:#B42318;
  --display:"Inter","Noto Sans Arabic",ui-sans-serif,system-ui,sans-serif;
  --body:"Inter","Noto Sans Arabic",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font-family:var(--body);color:var(--ink);background:var(--white);-webkit-font-smoothing:antialiased}
a{color:var(--green)}a:hover{color:var(--green-deep)}
:focus-visible{outline:3px solid var(--leaf);outline-offset:2px}
.wrap{max-width:1180px;margin:0 auto;padding-left:max(24px,env(safe-area-inset-left));padding-right:max(24px,env(safe-area-inset-right))}
.eyebrow{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--green)}
h1,h2,h3{text-wrap:balance}
h2.big{margin:0;font-family:var(--display);font-weight:800;font-size:clamp(30px,4vw,42px);line-height:1.08;letter-spacing:-.02em}
.check{width:20px;height:20px;flex:none}

/* En-tête */
.top{background:var(--ground)}
.top .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding-top:18px;padding-bottom:18px}
.brand{display:flex;align-items:center;gap:10px;color:var(--green-deep);text-decoration:none}
.brand span{font-family:var(--display);font-weight:800;font-size:24px;letter-spacing:-.02em}
.nav{display:flex;flex-wrap:wrap;align-items:center;gap:22px;font-size:15px;font-weight:500}
.nav a{color:var(--text);text-decoration:none}.nav a:hover{color:var(--green-deep)}
.nav .cta{background:var(--green);color:var(--white);font-weight:700;padding:11px 18px;border-radius:999px}
.nav .cta:hover{background:var(--green-deep);color:var(--white)}
@media (max-width:640px){.nav .link{display:none}}

/* Accroche */
.hero{background:var(--ground)}
.hero .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:48px;padding-top:40px;padding-bottom:96px}
.hero-text{flex:1 1 460px;min-width:0;display:flex;flex-direction:column;gap:22px}
.tagline{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:600;color:var(--green-deep)}
.hero h1{margin:0;font-family:var(--display);font-weight:700;font-size:clamp(40px,5.6vw,62px);line-height:1.06;letter-spacing:-.03em}
.hero h1 mark{background:var(--mint-strong);color:inherit;padding:0 8px;border-radius:6px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.hero p{margin:0;font-size:18px;line-height:1.6;color:var(--text);max-width:33em}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;margin-top:4px}
.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--green);color:var(--white);text-decoration:none;font-weight:700;font-size:16px;padding:16px 26px;border-radius:16px;border:0;cursor:pointer;font-family:inherit}
.btn:hover{background:var(--green-deep);color:var(--white)}
.link-icon{display:flex;align-items:center;gap:8px;color:var(--ink);text-decoration:none;font-weight:600;font-size:16px}
.perks{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px 24px;font-size:15.5px;color:var(--text)}
.perks li{display:flex;align-items:center;gap:10px}

/* Cartes d'événement en cascade */
.stack-col{flex:1 1 440px;min-width:0;max-width:520px;margin:0 auto}
.stack{position:relative;height:460px}
.blob{position:absolute;left:12%;right:0;top:0;bottom:0;border-radius:220px 220px 32px 32px;background:#E6F4EE}
.waves{position:absolute;left:12%;top:0;width:88%;height:100%;opacity:.5}
.ev{position:absolute;width:340px;max-width:86%;background:var(--white);border-radius:22px;padding:14px;display:flex;gap:14px;box-shadow:0 1px 2px rgba(6,78,59,.08),0 18px 40px rgba(6,78,59,.16)}
.ev .img{width:96px;flex:none;border-radius:14px}
.ev .body{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.ev .org{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:#52525B}
.ev .dot{width:20px;height:20px;border-radius:50%;background:var(--green);display:grid;place-items:center;flex:none}
.ev .title{font-weight:700;font-size:16px;line-height:1.25}
.ev .fact{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--text)}
.ev .foot{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:12.5px;color:#52525B;margin-top:2px}
.ev .foot b{color:var(--green)}
.ev.back1{left:0;top:18px;opacity:.75}
.ev.back2{right:0;bottom:18px;opacity:.75}
.ev.front{left:12%;top:50%;transform:translateY(-50%);box-shadow:0 2px 4px rgba(6,78,59,.1),0 30px 60px rgba(6,78,59,.28)}
@media (max-width:520px){.stack{height:400px}.ev.front{left:6%}}

/* Concept */
.concept{padding-top:88px;padding-bottom:40px;display:flex;flex-direction:column;gap:36px}
.concept .head{display:flex;flex-direction:column;gap:10px;max-width:46em}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.steps li{background:var(--soft);border-radius:22px;padding:26px;display:flex;flex-direction:column;gap:10px}
.steps .n{font-family:var(--display);font-weight:800;font-size:34px;color:var(--green)}
.steps h3{margin:0;font-size:20px}
.steps p{margin:0;font-size:16px;line-height:1.55;color:var(--text)}

/* Pour qui */
.who{padding-top:40px;padding-bottom:88px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));gap:24px}
.who > div{border-radius:26px;padding:32px;display:flex;flex-direction:column;gap:16px}
.who h2{margin:0;font-family:var(--display);font-weight:800;font-size:30px;line-height:1.1}
.who ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px;font-size:16px;line-height:1.5}
.who li{display:flex;gap:10px}
.who .note{margin:4px 0 0;font-size:14px;line-height:1.5}
.orgs{border:1.5px solid var(--line);color:var(--ink)}
.orgs ul{color:var(--text)}.orgs .tick{color:var(--green);font-weight:800}.orgs .note{color:var(--muted)}
.vols{background:var(--green-deep);color:var(--white)}
.vols .eyebrow{color:#6EE7B7}.vols ul{color:var(--mint)}.vols .tick{color:var(--leaf);font-weight:800}.vols .note{color:var(--mint-strong)}

/* Accès */
.access{background:var(--soft)}
.access .wrap{display:flex;flex-wrap:wrap;gap:48px;align-items:flex-start;padding-top:88px;padding-bottom:88px}
.access-text{flex:1 1 340px;min-width:0;display:flex;flex-direction:column;gap:16px}
.access-text p{margin:0;font-size:17px;line-height:1.6;color:var(--text)}
.how-label{margin-top:12px;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.how{display:flex;flex-direction:column;gap:12px}
.how-card{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;background:var(--white);border:1px solid var(--line);border-radius:18px}
.how-ic{flex:none;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--mint);color:var(--green-deep)}
.how-card div{display:flex;flex-direction:column;gap:3px;min-width:0}
.how-card strong{font-size:16px;color:var(--ink)}
.how-card span{font-size:15px;line-height:1.5;color:var(--text)}
.trust{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:10px;font-size:15px;color:var(--text)}
.trust li{display:flex;align-items:center;gap:10px}
.trust .check{width:20px;height:20px;flex:none}
/* Le texte reste visible pendant qu'on remplit le formulaire */
@media (min-width:900px){.access-text{position:sticky;top:96px}}
[lang="ar"] .how-label{letter-spacing:0;text-transform:none}
.card{flex:1 1 420px;min-width:0;background:var(--white);border-radius:26px;padding:30px;box-shadow:0 1px 2px rgba(6,78,59,.08),0 12px 32px rgba(6,78,59,.08)}
@media (max-width:520px){.card{padding:22px}}
form{display:flex;flex-direction:column;gap:20px;margin:0}
fieldset{border:0;margin:0;padding:0;min-width:0}
legend{padding:0;margin-bottom:10px;font-size:14px;font-weight:700}
.seg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;background:var(--soft);padding:5px;border-radius:999px}
.seg button{min-height:46px;border:0;border-radius:999px;background:transparent;color:var(--text);font:inherit;font-weight:600;font-size:15px;cursor:pointer;padding:4px 8px}
.seg button[aria-pressed="true"]{background:var(--green);color:var(--white);font-weight:700}
.field{display:flex;flex-direction:column;gap:7px;font-size:14px;font-weight:600}
.field input,.field select{height:50px;padding:0 14px;border:1.5px solid var(--line);border-radius:14px;font:inherit;font-weight:400;font-size:16px;color:var(--ink);background:var(--white);width:100%}
.field input:focus,.field select:focus{border-color:var(--green);outline:none;box-shadow:0 0 0 3px var(--mint)}
.field input[aria-invalid="true"]{border-color:var(--error)}
.row2{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px}
.phones{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.phones button{display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:14px 16px;border-radius:16px;border:1.5px solid var(--line);background:var(--white);color:var(--ink);font:inherit;text-align:start;cursor:pointer}
.phones button[aria-pressed="true"]{border:2px solid var(--green);background:var(--mint);color:var(--green-deep)}
.phones b{font-size:16px}.phones small{font-size:13px;opacity:.8}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.5;color:var(--text)}
.consent input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--green);flex:none}
.submit{height:54px;font-size:17px;border-radius:999px;width:100%}
.submit[disabled]{opacity:.6;cursor:progress}
.error{margin:0;font-size:14px;line-height:1.5;color:var(--error)}
.hp{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.thanks{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;padding:40px 8px}
.thanks .ok{width:64px;height:64px;border-radius:50%;background:var(--mint);display:grid;place-items:center}
.thanks h3{margin:0;font-family:var(--display);font-weight:800;font-size:28px}
.thanks p{margin:0;font-size:16px;line-height:1.55;color:var(--text);max-width:26em}
.thanks button{margin-top:6px;background:transparent;border:0;color:var(--green);font:inherit;font-weight:700;cursor:pointer;padding:12px}
[hidden]{display:none!important}

/* Questions */
.faq{max-width:820px;margin:0 auto;padding:88px 24px;display:flex;flex-direction:column;gap:22px}
.faq .q{padding:20px 0;border-top:1px solid var(--line)}
.faq .q:last-child{border-bottom:1px solid var(--line)}
.faq h3{margin:0 0 6px;font-size:18px}
.faq p{margin:0;font-size:16px;line-height:1.55;color:var(--text)}

/* Pied de page */
.bottom{background:var(--green-deep);color:var(--mint)}
.bottom .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding-top:36px;padding-bottom:36px;font-size:14px}
.bottom a{color:var(--mint)}
.bottom nav{display:flex;flex-wrap:wrap;gap:20px}
.bottom span{display:flex;align-items:center;gap:10px}

/* Anciennement en style intégré (interdit par la CSP) */
.sprites{position:absolute;width:0;height:0}
.logo-green{color:#047857}
.logo-white{color:#FFFFFF}
.logo-mint{color:#D1FAE5}
.img-violet{background:linear-gradient(160deg,#C7D2FE,#8B9CF4)}
.img-sable{background:linear-gradient(160deg,#FDE7C8,#F2B880)}
.img-vert{background:linear-gradient(160deg,#A7F3D0,#34D399 55%,#047857)}
.faq h2.big{font-size:36px}
/* Titre de confirmation : reçoit le focus pour les lecteurs d’écran, sans cadre visible */
.thanks h3:focus{outline:none}

/* Sélecteur de langue : contrôle segmenté, la langue active en blanc */
.langs{display:inline-flex;align-items:center;gap:2px;padding:3px;border-radius:999px;background:#E3ECE7;border:1px solid var(--line)}
.nav .langs a,.langs a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:32px;padding:0 12px;border-radius:999px;font-size:13px;font-weight:700;letter-spacing:.02em;color:var(--muted);text-decoration:none;line-height:1}
.nav .langs a:hover{color:var(--green-deep);background:rgba(255,255,255,.55)}
.nav .langs a[aria-current="page"]{background:var(--white);color:var(--green-deep);box-shadow:0 1px 2px rgba(6,78,59,.14),0 0 0 1px rgba(6,78,59,.06)}
.langs a[lang="ar"]{font-family:"Noto Sans Arabic",var(--body);font-size:14px;font-weight:600}

/* Arabe : lecture de droite à gauche, sans resserrer les lettres */
[lang="ar"] h1,[lang="ar"] h2,[lang="ar"] .brand span{letter-spacing:0}
[lang="ar"] .hero h1{line-height:1.3}
[lang="ar"] h2.big{line-height:1.3}
[lang="ar"] .eyebrow{letter-spacing:0;text-transform:none}
[dir="rtl"] .blob{left:0;right:12%}
[dir="rtl"] .waves{left:0;transform:scaleX(-1)}
[dir="rtl"] .ev.back1{left:auto;right:0}
[dir="rtl"] .ev.back2{right:auto;left:0}
[dir="rtl"] .ev.front{left:auto;right:12%}
@media (max-width:520px){[dir="rtl"] .ev.front{right:6%}}
/* Les chiffres, adresses et numéros restent de gauche à droite */
[dir="rtl"] input[type="email"],[dir="rtl"] input[type="tel"]{direction:ltr;text-align:right}

/* Page de suppression de compte */
.del{background:var(--ground)}
.del-main{display:flex;flex-wrap:wrap;gap:48px;align-items:flex-start;padding-top:32px;padding-bottom:88px}
.del-text{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;gap:18px}
.del-text h1{margin:0;font-family:var(--display);font-weight:800;font-size:clamp(32px,4.4vw,44px);line-height:1.08;letter-spacing:-.02em}
.del-text > p{margin:0;font-size:17px;line-height:1.6;color:var(--text);max-width:34em}
.del-box{background:var(--white);border:1px solid var(--line);border-radius:18px;padding:18px 20px;display:flex;flex-direction:column;gap:10px}
.del-box h2{margin:0;font-size:16px}
.del-box ul{margin:0;padding-inline-start:20px;display:flex;flex-direction:column;gap:6px;font-size:15px;line-height:1.5;color:var(--text)}
.del-path{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:15px;font-weight:600}
.del-path span:not([aria-hidden]){background:var(--soft);border:1px solid var(--line);border-radius:8px;padding:3px 9px;font-size:14px}
.del-small{margin:0;font-size:13.5px;line-height:1.5;color:var(--muted)}
.del-mail{font-weight:600;color:var(--green-deep);user-select:all}
.del-card{flex:1 1 380px;max-width:460px}
.del-card form{gap:16px}
.del-step{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.del-title{margin:0;font-family:var(--display);font-weight:800;font-size:24px;line-height:1.15}
.del-title:focus{outline:none}
.del-card form > p{margin:0;font-size:15px;line-height:1.55;color:var(--text)}
.del-who{display:flex;align-items:center;gap:12px;background:var(--soft);border-radius:16px;padding:14px}
.del-avatar{width:44px;height:44px;border-radius:50%;background:#3F7D6B;color:#fff;display:grid;place-items:center;font-weight:700;flex:none}
.del-who b{display:block;font-size:15px}
.del-email{display:block;font-size:13.5px;color:var(--muted);word-break:break-all}
.del-card form > p.del-warn{background:#FDECEA;color:#7A1A12;border-radius:14px;padding:12px 14px;font-size:14px}
.del-danger{background:var(--error)}
.del-danger:hover{background:#912018}
.del-cancel{background:transparent;border:0;color:var(--green);font:inherit;font-weight:700;font-size:16px;cursor:pointer;padding:12px;min-height:44px}
.del-home{color:var(--green);font-weight:700;text-decoration:none;padding:12px}
[lang="ar"] .del-text h1,[lang="ar"] .del-title{letter-spacing:0;line-height:1.3}
[lang="ar"] .del-step{letter-spacing:0;text-transform:none}

/* Liste des pays : même allure que les champs, flèche dessinée */
.phone-row{display:flex;gap:8px}
.phone-row select{flex:none;width:118px}
.phone-row input{flex:1;min-width:0}
.field select{appearance:none;-webkit-appearance:none;padding-inline-end:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235D6A64' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-size:18px;background-position:right 14px center;cursor:pointer}
[dir="rtl"] .field select{background-position:left 14px center}