@import url('https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500&family=DM+Serif+Display:ital@0;1&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --g50:#E1F5EE;--g100:#9FE1CB;--g400:#1D9E75;--g600:#0F6E56;--g800:#085041;--g900:#04342C;
  --text:#1a1a18;--text2:#5F5E5A;--text3:#888780;
  --border:rgba(0,0,0,0.1);--border2:rgba(0,0,0,0.18);
  --bg:#fff;--bg2:#F7F6F3;
  --r-md:8px;--r-lg:12px;--r-xl:16px;
}
html{scroll-behavior:smooth}
body{font-family:'DM Sans',sans-serif;font-size:16px;line-height:1.7;color:var(--text);background:var(--bg)}
a{color:var(--g600);text-decoration:none}
a:hover{text-decoration:underline}

/* ── HOTLINE ──────────────────────────────────────────────────────────────── */
.hotline{background:var(--g800);color:#fff;padding:9px 2rem;text-align:center;font-size:13px;display:flex;align-items:center;justify-content:center;gap:10px}
.hotline a{color:var(--g100);font-weight:500}

/* ── NAV ──────────────────────────────────────────────────────────────────── */
.nav{position:sticky;top:0;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-bottom:.5px solid var(--border);z-index:100;padding:0 2rem;display:flex;align-items:center;justify-content:space-between;height:56px}
.nav-logo{display:flex;align-items:center;gap:9px;text-decoration:none}
.nav-logo-box{width:30px;height:30px;background:var(--g600);border-radius:7px;display:flex;align-items:center;justify-content:center}
.nav-logo-box svg{width:15px;height:15px;fill:white}
.nav-logo-name{font-size:15px;font-weight:500;color:var(--text)}
.nav-logo-name span{color:var(--g600)}
.nav-links{display:flex;align-items:center;gap:22px;list-style:none}
.nav-links a{font-size:13px;color:var(--text2);text-decoration:none;transition:color .2s}
.nav-links a:hover,.nav-links a.active{color:var(--text)}
.nav-cta{background:var(--g600)!important;color:#fff!important;padding:7px 15px;border-radius:var(--r-md);font-size:13px!important}
.nav-cta:hover{background:var(--g800)!important;text-decoration:none!important}

/* ── FOOTER ───────────────────────────────────────────────────────────────── */
footer{border-top:.5px solid var(--border);padding:2rem;background:var(--bg2)}
.footer-in{max-width:960px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
.footer-left{font-size:12px;color:var(--text3)}
.footer-links{display:flex;gap:18px;flex-wrap:wrap}
.footer-links a{font-size:12px;color:var(--text2)}
.footer-links a:hover{color:var(--text);text-decoration:none}

/* ── LAYOUT ───────────────────────────────────────────────────────────────── */
.wrap{max-width:960px;margin:0 auto;padding:0 2rem}
.wrap-sm{max-width:680px;margin:0 auto;padding:0 2rem}
.section{padding:4rem 0}
.label{font-size:11px;text-transform:uppercase;letter-spacing:1.2px;color:var(--g400);font-weight:500;margin-bottom:6px}
.title{font-family:'DM Serif Display',serif;font-size:30px;line-height:1.25;color:var(--text);margin-bottom:10px}
.sub{font-size:15px;color:var(--text2);line-height:1.7;margin-bottom:1.5rem}
.badge{display:inline-flex;align-items:center;gap:5px;background:var(--g50);color:var(--g600);font-size:12px;font-weight:500;padding:4px 12px;border-radius:20px;margin-bottom:1rem}
hr{border:none;border-top:.5px solid var(--border);margin:2rem 0}

/* ── BUTTONS ──────────────────────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;gap:8px;padding:11px 22px;border-radius:var(--r-md);font-size:14px;font-weight:500;cursor:pointer;border:none;font-family:'DM Sans',sans-serif;transition:all .2s;text-decoration:none}
.btn-green{background:var(--g600);color:#fff}
.btn-green:hover{background:var(--g800);color:#fff;text-decoration:none}
.btn-ghost{background:transparent;color:var(--text2);border:.5px solid var(--border2)}
.btn-ghost:hover{background:var(--bg2);color:var(--text);text-decoration:none}
.btn-full{width:100%;justify-content:center}
.btn:disabled{opacity:.6;cursor:not-allowed}

/* ── ICON BOX ─────────────────────────────────────────────────────────────── */
.icon-box{width:42px;height:42px;background:var(--g50);border-radius:9px;display:flex;align-items:center;justify-content:center;margin-bottom:12px;flex-shrink:0}
.icon-box svg{width:20px;height:20px;color:var(--g600);fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ── FORMS ────────────────────────────────────────────────────────────────── */
.form-group{margin-bottom:14px}
.form-group label{display:block;font-size:12px;font-weight:500;color:var(--text2);margin-bottom:5px;text-transform:uppercase;letter-spacing:.5px}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:9px 12px;border:.5px solid var(--border2);border-radius:var(--r-md);font-size:14px;font-family:'DM Sans',sans-serif;color:var(--text);background:var(--bg2);transition:border-color .2s}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--g400);background:#fff}
.form-group textarea{resize:vertical;min-height:100px;line-height:1.6}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.privacy-box{display:flex;gap:10px;background:var(--g50);border-radius:var(--r-md);padding:12px 14px;margin-bottom:14px}
.privacy-box p{font-size:12px;color:var(--g800);line-height:1.6}
.check-row{display:flex;gap:9px;align-items:flex-start;margin-bottom:14px}
.check-row input{margin-top:3px;flex-shrink:0;accent-color:var(--g600)}
.check-row label{font-size:13px;color:var(--text2);line-height:1.5}
.upload-zone{border:1.5px dashed var(--border2);border-radius:var(--r-md);padding:2rem 1rem;text-align:center;cursor:pointer;margin-bottom:14px;transition:all .2s}
.upload-zone:hover{border-color:var(--g400);background:var(--g50)}
.upload-zone p{font-size:13px;color:var(--text3);margin-top:6px}
.upload-zone strong{color:var(--g600)}

/* ── PAGE HERO ────────────────────────────────────────────────────────────── */
.page-hero{background:var(--bg2);border-bottom:.5px solid var(--border);padding:2.5rem 0 2rem}
.page-hero .title{font-size:26px}

/* ── INDEX : HERO ─────────────────────────────────────────────────────────── */
.hero{text-align:center;padding:4rem 2rem 3rem;border-bottom:.5px solid var(--border)}
.hero .title{font-size:36px;max-width:640px;margin:0 auto 12px}
.hero .sub{max-width:520px;margin:0 auto 1.75rem}
.hero-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.reassurance{display:flex;justify-content:center;gap:24px;margin-top:1.5rem;flex-wrap:wrap}
.reassurance-item{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text3)}
.reassurance-item svg{color:var(--g400);width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}

/* ── INDEX : ÉTAPES ───────────────────────────────────────────────────────── */
.steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-top:2rem}
.step-card{background:#fff;border:.5px solid var(--border);border-radius:var(--r-lg);padding:1.25rem}
.step-num{font-size:11px;font-weight:500;color:var(--g400);margin-bottom:10px;text-transform:uppercase;letter-spacing:.5px}
.step-card h3{font-size:14px;font-weight:500;color:var(--text);margin-bottom:6px}
.step-card p{font-size:13px;color:var(--text2);line-height:1.6}

/* ── INDEX : STATS ────────────────────────────────────────────────────────── */
.stats-band{background:var(--g800);color:#fff;padding:2.5rem 0}
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;text-align:center}
.stat-num{font-family:'DM Serif Display',serif;font-size:36px;color:var(--g100);margin-bottom:4px}
.stat-label{font-size:13px;color:rgba(255,255,255,.7)}

/* ── INDEX : FORMULAIRE ───────────────────────────────────────────────────── */
.form-section{background:var(--bg2);border-top:.5px solid var(--border);border-bottom:.5px solid var(--border);padding:4rem 0}
.form-wrap{max-width:600px;margin:0 auto;padding:0 2rem}
.form-card{background:#fff;border:.5px solid var(--border);border-radius:var(--r-xl);padding:2rem}

/* ── INDEX : RESSOURCES ───────────────────────────────────────────────────── */
.resources-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-top:2rem}
.res-card{border:.5px solid var(--border);border-radius:var(--r-lg);padding:1.25rem}
.res-card h3{font-size:14px;font-weight:500;color:var(--text);margin-bottom:6px}
.res-card p{font-size:13px;color:var(--text2);line-height:1.6}

/* ── A-PROPOS ─────────────────────────────────────────────────────────────── */
.mission-block{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;margin-top:2rem}
.mission-placeholder{width:100%;border-radius:var(--r-xl);background:var(--bg2);height:280px;border:.5px solid var(--border);display:flex;align-items:center;justify-content:center}
.mission-placeholder svg{width:48px;height:48px;color:var(--g400)}
.values-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:1.5rem}
.value-card{border:.5px solid var(--border);border-radius:var(--r-lg);padding:1.5rem}
.value-card h3{font-size:15px;font-weight:500;margin-bottom:6px;color:var(--text)}
.value-card p{font-size:13px;color:var(--text2);line-height:1.7}
.team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-top:1.5rem}
.team-card{border:.5px solid var(--border);border-radius:var(--r-lg);padding:1.25rem;text-align:center}
.avatar{width:60px;height:60px;border-radius:50%;background:var(--g50);margin:0 auto 10px;display:flex;align-items:center;justify-content:center;font-family:'DM Serif Display',serif;font-size:20px;color:var(--g600)}
.team-card h3{font-size:14px;font-weight:500;color:var(--text);margin-bottom:3px}
.team-card p{font-size:12px;color:var(--text3)}
.timeline{margin-top:1.5rem}
.tl-item{display:grid;grid-template-columns:80px 1fr;gap:1.5rem;padding:1.25rem 0;border-bottom:.5px solid var(--border)}
.tl-item:last-child{border-bottom:none}
.tl-year{font-family:'DM Serif Display',serif;font-size:22px;color:var(--g600);font-weight:400}
.tl-content h4{font-size:14px;font-weight:500;margin-bottom:4px;color:var(--text)}
.tl-content p{font-size:13px;color:var(--text2);line-height:1.6}

/* ── COMMENT CA MARCHE ────────────────────────────────────────────────────── */
.process-steps{display:flex;flex-direction:column;gap:0;margin-top:2rem}
.process-step{display:grid;grid-template-columns:60px 1fr;gap:1.5rem;padding:2rem 0;border-bottom:.5px solid var(--border)}
.process-step:last-child{border-bottom:none}
.step-num-big{width:48px;height:48px;background:var(--g600);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:'DM Serif Display',serif;font-size:20px;flex-shrink:0;margin-top:4px}
.step-content h3{font-size:18px;font-weight:500;margin-bottom:8px;color:var(--text)}
.step-content p{font-size:14px;color:var(--text2);line-height:1.7;margin-bottom:10px}
.step-detail{background:var(--bg2);border-radius:var(--r-md);padding:12px 16px;font-size:13px;color:var(--text2);line-height:1.6}
.step-detail strong{color:var(--text);font-weight:500}
.tech-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-top:1.5rem}
.tech-card{border:.5px solid var(--border);border-radius:var(--r-lg);padding:1.25rem}
.tech-card h4{font-size:13px;font-weight:500;margin-bottom:6px;color:var(--text)}
.tech-card p{font-size:12px;color:var(--text2);line-height:1.6}
.faq{margin-top:2rem}
.faq-item{border-bottom:.5px solid var(--border);padding:1.25rem 0}
.faq-item h3{font-size:15px;font-weight:500;color:var(--text);margin-bottom:8px}
.faq-item p{font-size:14px;color:var(--text2);line-height:1.7}

/* ── PARTENAIRES ──────────────────────────────────────────────────────────── */
.partner-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin-top:1.5rem}
.partner-card{border:.5px solid var(--border);border-radius:var(--r-lg);padding:1.25rem;text-align:center;transition:border-color .2s}
.partner-card:hover{border-color:var(--g400)}
.partner-logo{width:44px;height:44px;border-radius:10px;margin:0 auto 10px;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:600;color:#fff}
.partner-card h3{font-size:13px;font-weight:500;color:var(--text);margin-bottom:3px}
.partner-card p{font-size:11px;color:var(--text3)}
.partner-status{display:inline-block;font-size:10px;font-weight:500;padding:2px 7px;border-radius:10px;margin-top:6px}
.status-active{background:var(--g50);color:var(--g600)}
.status-soon{background:#FAEEDA;color:#854F0B}
.become-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:start;margin-top:2rem}
.benefit-list{list-style:none;margin-top:1rem}
.benefit-list li{display:flex;gap:10px;padding:.75rem 0;border-bottom:.5px solid var(--border);font-size:14px;color:var(--text2);line-height:1.6}
.benefit-list li:last-child{border-bottom:none}
.benefit-list li svg{color:var(--g600);flex-shrink:0;margin-top:3px;width:16px;height:16px}
.contact-form-box{background:var(--bg2);border:.5px solid var(--border);border-radius:var(--r-xl);padding:1.5rem}

/* ── RESSOURCES ───────────────────────────────────────────────────────────── */
.res-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-top:1.5rem}
.res-tag{display:inline-block;font-size:11px;font-weight:500;padding:2px 9px;border-radius:20px;margin-bottom:10px}
.tag-green{background:var(--g50);color:var(--g600)}
.tag-blue{background:#E6F1FB;color:#185FA5}
.tag-orange{background:#FAEEDA;color:#854F0B}
.contact-num{font-family:'DM Serif Display',serif;font-size:28px;color:var(--g600);margin-bottom:4px}
.urgent-box{background:var(--g800);color:#fff;border-radius:var(--r-xl);padding:2rem;margin-bottom:2rem}
.urgent-box h3{font-size:18px;font-weight:500;margin-bottom:8px;color:var(--g100)}
.urgent-box p{font-size:14px;color:rgba(255,255,255,.8);line-height:1.7;margin-bottom:1rem}
.urgent-num{font-family:'DM Serif Display',serif;font-size:42px;color:#fff;margin-bottom:4px}
.law-block{background:var(--bg2);border-left:3px solid var(--g400);padding:1.25rem 1.5rem;border-radius:0 var(--r-md) var(--r-md) 0;margin-bottom:14px}
.law-block h4{font-size:14px;font-weight:500;color:var(--text);margin-bottom:6px}
.law-block p{font-size:13px;color:var(--text2);line-height:1.7}
.steps-list{list-style:none;counter-reset:steps}
.steps-list li{counter-increment:steps;display:flex;gap:14px;padding:1rem 0;border-bottom:.5px solid var(--border)}
.steps-list li:last-child{border-bottom:none}
.steps-list li::before{content:counter(steps);width:28px;height:28px;background:var(--g600);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:500;flex-shrink:0;margin-top:2px}
.steps-list li p{font-size:14px;color:var(--text2);line-height:1.6}
.steps-list li strong{color:var(--text);display:block;font-size:14px;font-weight:500;margin-bottom:3px}

/* ── CONTACT ──────────────────────────────────────────────────────────────── */
.contact-layout{display:grid;grid-template-columns:1fr 1.6fr;gap:3rem;margin-top:2rem}
.contact-info h3{font-size:15px;font-weight:500;margin-bottom:6px;color:var(--text)}
.contact-info p{font-size:13px;color:var(--text2);line-height:1.7;margin-bottom:1.5rem}
.contact-item{display:flex;gap:12px;padding:1rem 0;border-bottom:.5px solid var(--border);align-items:flex-start}
.contact-item:last-child{border-bottom:none}
.contact-item svg{color:var(--g600);flex-shrink:0;margin-top:3px;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.contact-item div h4{font-size:13px;font-weight:500;color:var(--text);margin-bottom:2px}
.contact-item div p{font-size:13px;color:var(--text2);margin:0}
.form-box{background:var(--bg2);border:.5px solid var(--border);border-radius:var(--r-xl);padding:2rem}
.form-box h2{font-size:18px;font-weight:500;margin-bottom:6px}
.form-box p{font-size:13px;color:var(--text2);margin-bottom:1.5rem}
.urgence-box{background:var(--g800);border-radius:var(--r-xl);padding:1.5rem;margin-bottom:2rem}
.urgence-box h3{font-size:15px;font-weight:500;color:var(--g100);margin-bottom:8px}
.urgence-box p{font-size:13px;color:rgba(255,255,255,.8);line-height:1.6;margin-bottom:1rem}
.urgence-box .num{font-family:'DM Serif Display',serif;font-size:32px;color:#fff}

/* ── LEGAL (CGU / CONFIDENTIALITÉ) ───────────────────────────────────────── */
.legal-body h2{font-size:18px;font-weight:500;margin:2rem 0 10px;color:var(--text);padding-top:1rem;border-top:.5px solid var(--border)}
.legal-body h2:first-child{border-top:none;margin-top:0}
.legal-body h3{font-size:15px;font-weight:500;margin:1.25rem 0 6px;color:var(--text)}
.legal-body p{font-size:14px;color:var(--text2);line-height:1.8;margin-bottom:1rem}
.legal-body ul{margin:0 0 1rem 1.5rem}
.legal-body ul li{font-size:14px;color:var(--text2);line-height:1.8}
.legal-body strong{color:var(--text);font-weight:500}
.legal-body a{color:var(--g600)}
.update-badge{display:inline-flex;align-items:center;gap:6px;background:var(--g50);color:var(--g600);font-size:12px;padding:4px 12px;border-radius:20px;margin-bottom:1.5rem}
.warn-box{background:#FAEEDA;border-radius:var(--r-md);padding:1rem 1.25rem;margin-bottom:1rem;border-left:3px solid #854F0B}
.warn-box p{color:#633806;margin:0;font-size:13px}
.toc{background:var(--bg2);border:.5px solid var(--border);border-radius:var(--r-lg);padding:1.25rem 1.5rem;margin-bottom:2rem}
.toc h3{font-size:13px;font-weight:500;color:var(--text);margin-bottom:10px}
.toc ol{margin-left:1.25rem}
.toc ol li{font-size:13px;color:var(--text2);line-height:2}
.toc ol li a{color:var(--g600)}


/* ── MODE TOGGLE (signalement / prévention) ───────────────────────────────── */
.mode-toggle{display:flex;gap:8px;margin-bottom:14px;background:var(--bg2);border:.5px solid var(--border);border-radius:var(--r-md);padding:4px}
.mode-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;padding:9px 12px;border:none;border-radius:6px;font-family:'DM Sans',sans-serif;font-size:13px;font-weight:500;cursor:pointer;color:var(--text2);background:transparent;transition:all .2s}
.mode-btn:hover{color:var(--text);background:rgba(0,0,0,.04)}
.mode-btn.active{background:#fff;color:var(--g600);box-shadow:0 1px 4px rgba(0,0,0,.08);border:.5px solid var(--border)}
.privacy-box-prevention{background:#EFF6FF;border-left:3px solid #3B82F6;border-radius:0 var(--r-md) var(--r-md) 0}
.privacy-box-prevention p{color:#1E3A5F}
.privacy-box-prevention svg{stroke:#3B82F6 !important}
.prev-hint{background:var(--bg2);border:.5px solid var(--border);border-radius:var(--r-md);padding:10px 12px;margin-bottom:12px;font-size:13px;color:var(--text2);line-height:1.6}
.prev-hint strong{color:var(--text);display:block;margin-bottom:2px;font-weight:500}


/* ── RADIO GROUP (type de contenu) ───────────────────────────────────────── */
.radio-group{display:flex;gap:8px;margin-bottom:12px}
.radio-opt{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;padding:9px 12px;border:.5px solid var(--border2);border-radius:var(--r-md);font-size:13px;cursor:pointer;color:var(--text2);background:var(--bg2);transition:all .2s}
.radio-opt input{display:none}
.radio-opt.sel{background:#FAEEDA;color:#854F0B;border-color:#854F0B}

/* ── IA BOX ───────────────────────────────────────────────────────────────── */
.ia-box{background:#FAEEDA;border:.5px solid #854F0B;border-radius:var(--r-md);padding:10px 12px;margin-bottom:12px;font-size:12px;color:#633806;line-height:1.6}
.ia-box strong{display:block;margin-bottom:2px;font-weight:500}

/* ── UPLOAD TABS ──────────────────────────────────────────────────────────── */
.upload-tabs{display:flex;gap:6px;margin-bottom:10px}
.utab{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:8px;border:.5px solid var(--border2);border-radius:var(--r-md);font-size:12px;font-weight:500;cursor:pointer;color:var(--text2);background:var(--bg2);transition:all .2s}
.utab.active{background:var(--g50);color:var(--g600);border-color:var(--g400)}

/* ── BANNIÈRE FORMULAIRE ──────────────────────────────────────────────────── */
.form-banner{font-size:13px;text-align:center;margin-top:12px;padding:10px 14px;border-radius:var(--r-md);line-height:1.5;display:none}
.form-banner.success{display:block;background:var(--g50);color:var(--g800)}
.form-banner.error{display:block;background:#fee2e2;color:#991b1b}

/* ── RESPONSIVE ───────────────────────────────────────────────────────────── */
@media(max-width:640px){
  .nav-links{display:none}
  .form-row{grid-template-columns:1fr}
  .title{font-size:22px}
  .mission-block{grid-template-columns:1fr}
  .become-grid{grid-template-columns:1fr}
  .contact-layout{grid-template-columns:1fr}
}