*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#f0eeeb;--card:#fff;--ink:#23211f;--muted:#66605c;--line:#ddd5cd;
  --dark:#182126;--brand:#18b45b;--brand2:#42df74;--brandSoft:#e8f6ee;
  --gold:#c8960e;--gold2:#f0c040;--blue:#4aa7dc;--red:#e05b4a;--amber:#d4a017;
  --shadow:0 14px 36px rgba(0,0,0,.08);--shadowDark:0 24px 60px rgba(0,0,0,.28);
  --rxl:28px;--rlg:20px;--rmd:14px;
}
html,body{scroll-behavior:smooth}
body{font-family:Segoe UI,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;background:var(--bg);color:var(--ink);min-height:100vh}
button,input,textarea,select{font-family:inherit}

.wrap{max-width:1180px;margin:0 auto;padding:20px 14px 52px}

/* ── HERO ─────────────────────────────────────────────────── */
.hero{position:relative;overflow:hidden;border-radius:var(--rxl);background:linear-gradient(140deg,#131e22 0%,#1d2e34 55%,#0e1a1e 100%);padding:52px 28px 44px;text-align:center;margin-bottom:20px}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 15% 25%,rgba(24,180,91,.12) 0 80px,transparent 81px),radial-gradient(ellipse at 85% 15%,rgba(24,180,91,.08) 0 70px,transparent 71px)}
.hero-in{position:relative;z-index:2}
.hero-mascot{width:72px;height:72px;margin:0 auto 16px;filter:drop-shadow(0 8px 18px rgba(24,180,91,.35))}
.hero-badge{display:inline-flex;align-items:center;gap:8px;padding:7px 16px;border-radius:999px;background:rgba(24,180,91,.16);border:1px solid rgba(24,180,91,.28);color:#7ff5aa;font-size:12px;font-weight:700;letter-spacing:.06em;margin-bottom:18px}
.hero h1{color:#fff;font-size:clamp(22px,4vw,48px);line-height:1.05;letter-spacing:-.04em;font-weight:900;margin-bottom:12px}
.hero h1 em{font-style:normal;color:var(--brand2)}
.hero-sub{color:rgba(255,255,255,.68);font-size:15px;line-height:1.65;max-width:720px;margin:0 auto 24px}
.hero-regs{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;margin-bottom:24px}
.hero-regs span{padding:4px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.13);color:rgba(255,255,255,.62);font-size:11px;font-weight:600}
.hero-note{margin-top:12px;font-size:12px;color:rgba(255,255,255,.38);line-height:1.5}

/* ── BUTTONS ──────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 26px;border:none;border-radius:16px;cursor:pointer;font-size:15px;font-weight:800;transition:.16s ease;text-decoration:none}
.btn:hover{transform:translateY(-1px)}
.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.btn-brand{background:linear-gradient(175deg,var(--brand2),var(--brand));color:#fff;box-shadow:0 12px 26px rgba(24,180,91,.24)}
.btn-ghost{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.14)}
.btn-dark{background:var(--dark);color:#fff}
.btn-gold{background:linear-gradient(160deg,var(--gold2),var(--gold));color:#1a1000}
.btn-soft{background:#e8f6ee;color:#1a6e3a;border:1px solid #bfe6c9}
.btn-sm{min-height:44px;padding:0 20px;font-size:14px}
@keyframes pulse-green{0%,100%{box-shadow:0 12px 26px rgba(24,180,91,.24)}50%{box-shadow:0 12px 30px rgba(24,180,91,.55)}}
.btn-brand.pulse{animation:pulse-green .7s ease 2}

/* ── INFO GRID ────────────────────────────────────────────── */
.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:20px}
.info-card{background:var(--card);border-radius:20px;border:1px solid var(--line);padding:20px 16px;text-align:center;box-shadow:var(--shadow)}
.info-icon{width:48px;height:48px;border-radius:14px;background:#e8f6ee;display:flex;align-items:center;justify-content:center;margin:0 auto 12px;font-size:22px}
.info-card h3{font-size:14px;font-weight:800;color:#1a6e3a;margin-bottom:6px}
.info-card p{font-size:12px;line-height:1.6;color:var(--muted)}

/* ── LOCAL BAND ───────────────────────────────────────────── */
.local-band{background:#e8f6ee;border:1px solid #b8dfc5;border-radius:18px;padding:16px 20px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:20px}
.local-band p{font-size:13px;line-height:1.6;color:#246b3a;flex:1}
.local-band strong{color:var(--brand)}

/* ── FAQ ──────────────────────────────────────────────────── */
.faq-section{background:var(--card);border-radius:24px;border:1px solid var(--line);padding:28px 24px;margin-top:20px;box-shadow:var(--shadow)}
.faq-section h2{font-size:22px;font-weight:900;color:var(--ink);margin-bottom:18px;letter-spacing:-.03em}
.faq-item{border-bottom:1px solid var(--line)}
.faq-item:last-child{border:none}
.faq-btn{width:100%;display:flex;justify-content:space-between;align-items:center;padding:15px 0;background:transparent;border:none;cursor:pointer;text-align:left;gap:14px}
.faq-q{font-size:14px;font-weight:700;color:var(--ink)}
.faq-icon{width:28px;height:28px;border-radius:8px;background:#e8f6ee;color:var(--brand);display:grid;place-items:center;font-size:18px;font-weight:900;flex:0 0 28px;transition:.2s}
.faq-answer{display:none;padding:0 0 15px;font-size:13px;line-height:1.7;color:var(--muted)}
.faq-item.open .faq-answer{display:block}
.faq-item.open .faq-icon{background:var(--brand);color:#fff}

/* ── MODAL ────────────────────────────────────────────────── */
.modal{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:14px;background:rgba(0,0,0,.62);backdrop-filter:blur(5px)}
.modal.open{display:flex}
.mbox{width:min(1120px,100%);max-height:93vh;overflow:hidden;border-radius:26px;background:linear-gradient(155deg,#1c2a30 0%,#131e22 100%);box-shadow:var(--shadowDark);color:#fff;display:flex;flex-direction:column}
.whead{padding:20px 24px 14px;border-bottom:1px solid rgba(255,255,255,.07);flex-shrink:0}
.whead-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.wtitle{font-size:clamp(18px,2.5vw,32px);line-height:1;font-weight:900;letter-spacing:-.04em}
.wtitle em{font-style:normal;color:var(--brand2)}
.wsub{font-size:12px;color:rgba(255,255,255,.45);margin-top:5px}
.xbtn{width:48px;height:48px;display:grid;place-items:center;border-radius:13px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);color:#fff;cursor:pointer;font-size:26px;line-height:1;flex-shrink:0}
.prog-row{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.prog-bg{flex:1;height:4px;background:rgba(255,255,255,.1);border-radius:999px;overflow:hidden}
.prog-fill{height:100%;background:linear-gradient(90deg,var(--brand2),var(--brand));border-radius:999px;transition:width .3s ease}
.prog-txt{font-size:11px;color:rgba(255,255,255,.38);white-space:nowrap}
.step-title-row{display:flex;align-items:center;gap:10px}
.step-num{width:28px;height:28px;border-radius:50%;background:var(--brand);display:grid;place-items:center;font-size:12px;font-weight:800;flex:0 0 28px}
.step-name{font-size:15px;font-weight:800;color:#fff}
.wbody{padding:18px 24px;overflow-y:auto;flex:1}
.step-panel{display:none}
.step-panel.active{display:block}
.two-col{display:grid;grid-template-columns:1.2fr .8fr;gap:22px}
.qgroup{margin-bottom:18px}
.qgroup h4{font-size:15px;font-weight:800;color:#fff;margin-bottom:9px;display:flex;align-items:center;gap:8px}
.q-opt{font-size:11px;color:rgba(255,255,255,.38);font-weight:400}

/* ── CHIPS ────────────────────────────────────────────────── */
.chips{display:flex;flex-wrap:wrap;gap:7px}
.chip{border:none;border-radius:11px;background:rgba(255,255,255,.09);color:rgba(255,255,255,.82);padding:10px 15px;font-size:13px;font-weight:700;cursor:pointer;transition:.14s;text-align:left}
.chip:hover{background:rgba(255,255,255,.16)}
.chip.on{background:var(--brand);color:#fff}

/* ── INPUTS IN WIZARD ─────────────────────────────────────── */
.ifield{margin-bottom:12px}
.ifield label{display:block;font-size:12px;font-weight:700;color:rgba(255,255,255,.65);margin-bottom:5px}
.ifield input,.ifield select{width:100%;border-radius:11px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.07);color:#fff;padding:10px 13px;font-size:14px;outline:none;transition:.15s;appearance:none}
.ifield input:focus,.ifield select:focus{border-color:var(--brand2);background:rgba(255,255,255,.11)}
.ifield input::placeholder{color:rgba(255,255,255,.32)}
.ifield-note{font-size:11px;color:rgba(255,255,255,.35);margin-top:4px}
.ifield select option{background:#1c2a30;color:#fff}
.field-err{font-size:11px;color:#ff8a7a;margin-top:5px;display:none}
.field-err.show{display:block}

/* ── HELPER BUBBLE ────────────────────────────────────────── */
.hlp{display:flex;flex-direction:column;justify-content:flex-start;padding-top:4px}
.hlp-mascot{width:64px;height:64px;margin:0 0 10px auto}
.bubble{background:#fff;color:#1a1614;border-radius:16px;padding:12px 15px;box-shadow:0 10px 24px rgba(0,0,0,.18)}
.bubble strong{display:block;font-size:13px;font-weight:800;margin-bottom:4px;color:#1a6e3a}
.bubble span{display:block;font-size:12px;line-height:1.55;color:#66605c}
.bubble-tip{display:inline-flex;padding:3px 9px;border-radius:999px;background:#e8f6ee;color:#1a6e3a;font-size:11px;font-weight:700;margin-top:7px}

/* ── WIZARD FOOTER ────────────────────────────────────────── */
.wfoot{padding:12px 24px;border-top:1px solid rgba(255,255,255,.07);display:flex;align-items:center;justify-content:space-between;gap:12px;flex-shrink:0}
.wfoot .right{display:flex;gap:10px}

/* ── SITE CARDS (inside wizard) ───────────────────────────── */
.site-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:14px 16px;margin-bottom:14px}
.site-header{display:flex;align-items:center;gap:10px;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.07)}
.site-name-input{flex:1;background:transparent;border:none;color:#fff;font-size:15px;font-weight:800;outline:none}
.site-name-input::placeholder{color:rgba(255,255,255,.3)}
.btn-remove-site{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:9px;color:rgba(255,255,255,.4);cursor:pointer;padding:6px 10px;font-size:13px;transition:.14s}
.btn-remove-site:hover{background:rgba(224,91,74,.2);border-color:rgba(224,91,74,.3);color:#ff8a7a}
.site-fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:10px}
.site-fields .ifield{margin-bottom:0}
.field-full{grid-column:1/-1}

/* ── SITE RESULT ──────────────────────────────────────────── */
.site-result-band{margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.07)}
.result-pills{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:8px}
.rpill{font-size:11px;font-weight:700;padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.08);color:rgba(255,255,255,.75)}
.rpill-ok{background:rgba(24,180,91,.2);color:#7ff5aa}
.rpill-warn{background:rgba(212,160,23,.2);color:#f0c040}
.rpill-crit{background:rgba(224,91,74,.2);color:#ff8a7a}
.prog-site{height:5px;background:rgba(255,255,255,.1);border-radius:3px;overflow:hidden;margin-bottom:3px}
.prog-site-fill{height:100%;background:linear-gradient(90deg,var(--brand2),var(--brand));border-radius:3px;transition:width .4s}
.prog-site-label{font-size:10px;color:rgba(255,255,255,.35);text-align:right}
.measures-mini{margin-top:8px;display:flex;flex-direction:column;gap:3px}
.measure-mini-row{display:flex;align-items:center;gap:8px;font-size:11px;color:rgba(255,255,255,.65);padding:4px 8px;border-radius:7px;background:rgba(255,255,255,.04)}
.measure-mini-name{flex:1;font-weight:600}
.measure-mini-phase{padding:1px 6px;border-radius:999px;font-size:10px;font-weight:700}
.ph-2030{background:rgba(24,180,91,.2);color:#7ff5aa}
.ph-2040{background:rgba(212,160,23,.2);color:#f0c040}
.ph-2050{background:rgba(255,255,255,.1);color:rgba(255,255,255,.5)}
.measure-mini-num{color:rgba(255,255,255,.4);font-size:10px}

/* ── SCORES ROW ───────────────────────────────────────────── */
.scores-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}
.score-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:14px;text-align:center}
.score-card-label{font-size:11px;color:rgba(255,255,255,.45);text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px;font-weight:700}
.score-ring{width:68px;height:68px;margin:0 auto 8px;position:relative}
.score-ring svg{transform:rotate(-90deg)}
.score-ring-val{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:900}
.score-ring-bg{fill:none;stroke:rgba(255,255,255,.1);stroke-width:6}
.score-ring-fill{fill:none;stroke-width:6;stroke-linecap:round;transition:stroke-dashoffset .8s ease}
.score-tag{display:inline-flex;padding:3px 10px;border-radius:999px;font-size:11px;font-weight:800}
.tag-green{background:rgba(24,180,91,.2);color:#7ff5aa}
.tag-amber{background:rgba(212,160,23,.2);color:#f0c040}
.tag-red{background:rgba(224,91,74,.2);color:#ff8a7a}
.tag-gray{background:rgba(255,255,255,.1);color:rgba(255,255,255,.5)}

/* ── SECTION BOX ──────────────────────────────────────────── */
.section-box{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:14px 16px;margin-bottom:14px}
.section-box h4{font-size:13px;font-weight:800;color:#fff;margin-bottom:10px}
.detail-row{display:flex;justify-content:space-between;align-items:flex-start;padding:5px 0;border-bottom:1px solid rgba(255,255,255,.05);font-size:12px}
.detail-row:last-child{border:none}
.detail-key{color:rgba(255,255,255,.45)}
.detail-val{font-weight:700;color:rgba(255,255,255,.82);text-align:right}

/* ── TOP ACTIONS ──────────────────────────────────────────── */
.top-action-item{display:flex;align-items:flex-start;gap:12px;padding:10px;border-radius:12px;margin-bottom:8px}
.top-action-item:nth-child(1){background:rgba(24,180,91,.1);border:1px solid rgba(24,180,91,.2)}
.top-action-item:nth-child(2){background:rgba(255,255,255,.05)}
.top-action-item:nth-child(3){background:rgba(255,255,255,.03)}
.rank-circle{width:28px;height:28px;border-radius:50%;background:var(--brand);color:#fff;font-size:12px;font-weight:900;display:grid;place-items:center;flex-shrink:0}
.top-action-item:nth-child(2) .rank-circle{background:rgba(255,255,255,.2)}
.top-action-item:nth-child(3) .rank-circle{background:rgba(255,255,255,.1)}
.top-action-info strong{display:block;font-size:13px;color:#fff;font-weight:800}
.top-action-info span{font-size:11px;color:rgba(255,255,255,.45)}

/* ── TIMELINE ─────────────────────────────────────────────── */
.timeline-phases{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:6px}
.timeline-phase{border-radius:12px;overflow:hidden}
.ph-head{padding:6px 12px;font-size:12px;font-weight:800;color:#fff}
.ph-head-2030{background:var(--brand)}
.ph-head-2040{background:var(--amber)}
.ph-head-2050{background:rgba(255,255,255,.2)}
.ph-body{padding:8px 12px;background:rgba(255,255,255,.04);font-size:11px;color:rgba(255,255,255,.65)}
.ph-body span{display:block;margin-bottom:2px}

/* ── GATE ─────────────────────────────────────────────────── */
.gate-box{background:rgba(240,192,64,.07);border:1px solid rgba(240,192,64,.22);border-radius:20px;padding:22px;margin-bottom:14px;text-align:center}
.gate-title{font-size:17px;font-weight:900;color:#fff;letter-spacing:-.02em;margin-bottom:6px}
.gate-sub{font-size:13px;color:rgba(255,255,255,.6);line-height:1.6;max-width:640px;margin:0 auto 16px}
.gate-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px;text-align:left;max-width:560px;margin-left:auto;margin-right:auto}
.gate-form-grid .ifield{margin-bottom:0}
.rgpd-row{display:flex;align-items:flex-start;gap:9px;margin-bottom:14px;max-width:560px;margin-left:auto;margin-right:auto;text-align:left}
.rgpd-row input[type=checkbox]{width:15px;height:15px;margin-top:2px;accent-color:var(--brand2);flex:0 0 15px;cursor:pointer}
.rgpd-row label{font-size:11px;color:rgba(255,255,255,.45);line-height:1.55;cursor:pointer}
.gate-note{font-size:11px;color:rgba(255,255,255,.28);margin-top:10px}

/* ── TOAST ────────────────────────────────────────────────── */
.toast{position:fixed;bottom:24px;right:24px;padding:11px 18px;border-radius:14px;font-size:13px;font-weight:700;opacity:0;transform:translateY(8px);transition:all .25s ease;pointer-events:none;z-index:99999}
.toast.show{opacity:1;transform:translateY(0)}
.toast-ok{background:var(--brand);color:#fff}
.toast-warn{background:var(--amber);color:#fff}
.toast-err{background:var(--red);color:#fff}

/* ── RESPONSIVE ───────────────────────────────────────────── */
@media(max-width:980px){
  .info-grid,.scores-row,.gate-form-grid,.timeline-phases{grid-template-columns:1fr}
  .two-col{grid-template-columns:1fr}
}
@media(max-width:640px){
  .wrap{padding:12px 10px 32px}
  .hero{border-radius:20px;padding:36px 14px 30px}
  .mbox{border-radius:20px}
  .whead,.wbody{padding:14px 16px}
  .wfoot{padding:10px 16px;flex-direction:column}
  .wfoot .right{width:100%}
  .wfoot .right .btn,.wfoot>.btn{width:100%}
  .site-fields{grid-template-columns:1fr}
}

/* ── Catalogue éditeur ───────────────────────────────────────── */
.catalog-item{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:12px 14px;margin-bottom:10px;transition:.15s}
.catalog-item:hover{border-color:rgba(255,255,255,.14)}
.catalog-toggle{display:flex;align-items:center;gap:10px;cursor:pointer;user-select:none}
.catalog-toggle input[type=checkbox]{width:16px;height:16px;accent-color:var(--brand2);cursor:pointer;flex-shrink:0}
.catalog-name{font-size:13px;font-weight:700;color:#fff;flex:1;transition:.15s}
.catalog-name.dimmed{color:rgba(255,255,255,.3)}
.catalog-priority{font-size:10px;font-weight:700;padding:2px 8px;border-radius:999px}
.priority-quick-win{background:rgba(24,180,91,.2);color:#7ff5aa}
.priority-medium{background:rgba(74,167,220,.2);color:#7dd4f8}
.priority-heavy{background:rgba(138,105,212,.2);color:#c4b0f5}
.catalog-item-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.07)}
.catalog-item-fields.hidden{display:none}
.catalog-dep{grid-column:1/-1;font-size:10px;color:rgba(255,255,255,.3);font-style:italic}