:root{
    --ogapur-blue:#3B7BA8;
    --ogapur-dark:#2C5F82;
    --ogapur-light:#fbfdff;
    --green-cta:#2EAD4B;
    --green-hover:#259A3E;
    --green-light:#E6F7EB;
    --red-accent:#E74C3C;
    --orange-accent:#F39C12;
    --yellow-accent:#F1C40F;
    --bg-main:#fdfdfe;
    --white:#FFFFFF;
    --text-dark:#1A2B3C;
    --text-mid:#4A5568;
    --text-light:#718096;
    --border:#E2E8F0;
    --shadow-sm:0 1px 3px rgba(0,0,0,.08);
    --shadow-md:0 4px 16px rgba(0,0,0,.10);
    --shadow-lg:0 10px 40px rgba(0,0,0,.12);
    --radius:12px;
    --radius-sm:8px;
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Poppins',sans-serif;background:var(--bg-main);color:var(--text-dark);overflow-x:hidden}
.is-hidden {display: none !important;}
/* TOPBAR */
.topbar{background:var(--white);border-bottom:2px solid #a4bfd5;padding:0 20px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100;box-shadow:var(--shadow-sm)}
.topbar-logo{height:100px}
.topbar-steps{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-light)}
.topbar-step{display:flex;align-items:center;gap:6px;padding:6px 14px;border-radius:20px;font-weight:500;transition:.3s}
.topbar-step.active{background:var(--ogapur-blue);color:var(--white)}
.topbar-step.done{background:var(--green-light);color:var(--green-cta)}
.topbar-step-dot{width:8px;height:8px;border-radius:50%;background:var(--border)}
.topbar-step.active .topbar-step-dot{background:var(--white)}
.topbar-step.done .topbar-step-dot{background:var(--green-cta)}
.topbar-divider{width:20px;height:2px;background:var(--border);border-radius:1px}

/* LAYOUT */
.main-container{display:flex;max-width:1200px;margin:0 auto;padding:24px 16px;gap:24px;min-height:calc(100vh - 72px)}
.left-panel{flex:1;min-width:0}
.right-panel{width:340px;flex-shrink:0;position:sticky;top:96px;align-self:flex-start}

.card{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow-md);padding:28px;margin-bottom:20px;border:1px solid var(--border)}

/* HERO */
.hero-top{display: flex;justify-content: center;margin-bottom: 16px;}
.hero-badge{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(135deg,var(--ogapur-blue),var(--ogapur-dark));color:var(--white);padding:6px 16px;border-radius:4px;font-size:12px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;}
.hero-title{font-family:Roboto,sans-serif;font-size:28px;font-weight:700;line-height:1.2;margin-bottom:5px;text-align: center;}
.hero-title span{color:var(--ogapur-blue)}
.hero-subtitle{font-size:15px;color:var(--text-mid);margin-bottom:16px;text-align: center;}
.hero-flags{display:flex;gap:4px;margin-bottom:4px}
.hero-flags span{display:inline-block;width:28px;height:4px;border-radius:2px}
.hero-flags span:nth-child(1){background:#002395}
.hero-flags span:nth-child(2){background:#FFF;border:1px solid #eee}
.hero-flags span:nth-child(3){background:#ED2939}
.factory-badge{display:inline-flex;align-items:center;gap:6px;background:var(--ogapur-light);color:var(--ogapur-blue);padding:8px 16px;border-radius:var(--radius-sm);font-size:13px;font-weight:600;margin-top:12px}

/* PROGRESS */
.progress-container{margin-bottom:20px;}
.progress-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;font-size:13px;color:var(--text-mid)}
.progress-bar{height:6px;background:var(--border);border-radius:3px;overflow:hidden}
.progress-fill{height:100%;background:linear-gradient(90deg,var(--ogapur-blue),var(--green-cta));border-radius:3px;transition:width .6s cubic-bezier(.4,0,.2,1)}

/* BACK BUTTON */
.back-btn{display:inline-flex;align-items:center;gap:6px;background:none;border:1px solid var(--border);padding:8px 16px;border-radius:var(--radius-sm);font-family:'Poppins',sans-serif;font-size:13px;color:var(--text-mid);cursor:pointer;transition:.2s;margin-bottom:16px}
.back-btn:hover{border-color:var(--ogapur-blue);color:var(--ogapur-blue);background:var(--ogapur-light)}

/* STEP ANIMATIONS */
.step{display:none;animation:fadeIn .4s ease}
.step.active{display:block}
@keyframes fadeIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.step-question{font-family:Roboto,sans-serif;font-size:20px;font-weight:700;margin-bottom:20px;color:var(--text-dark);text-align:center}
.step-sub{font-size:13px;color:var(--text-light);text-align:center;margin-top:-12px;margin-bottom:20px}

#digitalFlow .step-question{max-width: 400px; margin: 0 auto 8px;}
#digitalFlow .form-question{font-size: 24px; font-weight: 600; margin: 5px auto; text-align: center; }
#digitalFlow .form-sub{margin-bottom:35px; text-align: center; }

/* OPTIONS */
.options-grid{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.option-btn{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 24px;border:2px solid var(--border);border-radius:var(--radius);background:var(--white);cursor:pointer;transition:.2s;font-family:'Poppins',sans-serif;font-size:18px;font-weight:500;color:var(--text-dark);min-width:120px;text-align:center}
.option-btn:hover{border-color:var(--ogapur-blue);background:var(--ogapur-light);transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.option-btn.selected{border-color:var(--ogapur-blue);background:var(--ogapur-light);color:var(--ogapur-blue);font-weight:600}
.option-icon{font-size:28px}
.options-list{display:flex;flex-direction:column;gap:12px; max-width: 400px; margin: 0 auto;}
.option-row{display:flex;align-items:center;justify-content:space-between;padding:16px; border:2px solid var(--border);border-radius:var(--radius);cursor:pointer;transition:.25s;background:var(--white)}
.option-row:hover{border-color:var(--ogapur-blue);transform:translateY(-2px);box-shadow:var(--shadow-md)}
.option-row.selected{border-color:var(--ogapur-blue);background:var(--ogapur-light)}
.option-row-label{font-family:Roboto,sans-serif;font-size: 19px;font-weight:700;color:var(--text-dark)}
.option-row-icon{color:var(--ogapur-blue);}
.option-row-icon img{height:28px;width:28px;object-fit:contain}
.option-row-icon i{font-size:28px}

/* TASTE */
.taste-grid{display:flex;gap:12px;flex-direction: column; max-width: 400px; margin: 0 auto;}
.taste-btn{display:flex;flex-direction:column;gap:8px;padding:18px 16px;border:2px solid var(--border);border-radius:var(--radius);background:var(--white);cursor:pointer;transition:.25s;font-size:18px;font-weight:500;min-width:110px}
.taste-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.taste-btn.t-good:hover,.taste-btn.t-good.selected{border-color:var(--green-cta);background:var(--green-light)}
.taste-btn.t-ok:hover,.taste-btn.t-ok.selected{border-color:#66BB6A;background:#E8F5E9}
.taste-btn.t-mid:hover,.taste-btn.t-mid.selected{border-color:var(--orange-accent);background:#FFF7E6}
.taste-btn.t-mediocre:hover,.taste-btn.t-mediocre.selected{border-color:#E67E22;background:#FFF0E0}
.taste-btn.t-bad:hover,.taste-btn.t-bad.selected{border-color:var(--red-accent);background:#FEE}
.taste-drop{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px}

/* CHECKBOX & RADIO */
.checkbox-list{display:flex;flex-direction:column;gap:10px;max-width:400px;margin:0 auto}
.checkbox-item{display:flex;align-items:center;gap:12px;padding:12px 16px;border:2px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;transition:.2s;font-size:18px}
.checkbox-item:hover{border-color:var(--ogapur-blue);background:var(--ogapur-light)}
.checkbox-item.checked{border-color:var(--ogapur-blue);background:var(--ogapur-light)}
.checkbox-box{width:22px;height:22px;border:2px solid var(--border);border-radius:4px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:.2s}
.checkbox-item.checked .checkbox-box{background:var(--ogapur-blue);border-color:var(--ogapur-blue)}
.checkbox-item.checked .checkbox-box::after{content:'✓';color:#fff;font-size:14px;font-weight:700}
.radio-group{display:flex;flex-direction: column;gap:12px; max-width: 400px; margin: 0 auto;}
.radio-btn{padding:12px 28px;border:2px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;font-size:18px;font-weight:500;transition:.2s;background:var(--white)}
.radio-btn:hover{border-color:var(--ogapur-blue)}
.radio-btn.selected{border-color:var(--ogapur-blue);background:var(--ogapur-blue);color:var(--white)}
.input-field{width:100%;max-width:400px;padding:14px 18px;border:2px solid var(--border);border-radius:var(--radius-sm);font-family:'Poppins',sans-serif;font-size:15px;margin:0 auto;display:block;transition:.2s;outline:none}
.input-field:focus{border-color:var(--ogapur-blue)}
.input-error{max-width:400px; }
.cta-btn{display:inline-flex;align-items:center;gap:8px;background:var(--green-cta);color:var(--white);border:none;padding:14px 36px;border-radius:var(--radius-sm);font-family:Roboto,sans-serif;font-size:15px;font-weight:700;cursor:pointer;transition:.2s;margin-top:20px}
.cta-btn:hover{background:var(--green-hover);transform:translateY(-1px);box-shadow:0 4px 12px rgba(46,173,75,.3)}
.cta-btn:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
.cta-center{display:flex;justify-content:center}

/* RIGHT PANEL */
.product-card{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow-lg);overflow:hidden;border:1px solid var(--border)}
.product-header{background:linear-gradient(135deg,var(--ogapur-blue),var(--ogapur-dark));color:var(--white);padding:16px 20px;display:flex;align-items:center;gap:12px}
.product-header-logo{height:60px;border-radius:50%}
.product-header-text h3{font-family:Roboto,sans-serif;font-size:15px;font-weight:700}
.product-header-text p{font-size:11px;opacity:.85}
.product-body{padding:20px}
.product-name{font-family:Roboto,sans-serif;font-size:22px;font-weight:800}
.product-type{font-size:13px;color:var(--text-light);margin-bottom:16px}
.product-image-wrap{position:relative;text-align:center;margin:16px 0;padding:16px;background:linear-gradient(135deg,#f8fbfe,#edf5fc);border-radius:var(--radius-sm)}
.product-image-wrap img{height:180px;object-fit:contain;filter:drop-shadow(0 8px 20px rgba(59,123,168,.15))}
.product-badges{display:flex;gap:6px;justify-content:center;margin-top:12px}
.product-badge{padding:4px 10px;border-radius:4px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px}
.badge-eco{background:#E6F7EB;color:#2EAD4B}
.badge-compact{background:#E8F4FC;color:var(--ogapur-blue)}
.timer-section{color:#d33a36;text-align:center;padding:8px;border-radius:var(--radius-sm);margin:12px 0}
.timer-label{font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-bottom:4px; color: #000;}
.timer-digits{font-family:Roboto,sans-serif;font-size:22px;font-weight:500;letter-spacing:2px}
.timer-digits span{display:inline-block;background:#e8e8e8;padding:2px 4px;margin:0;}
.timer-digits span:first-child{border-radius: 5px 0 0 5px;}
.timer-digits span:last-child{border-radius: 0 5px 5px 0;}
.features-title{font-family:Roboto,sans-serif;font-size:13px;font-weight:700;margin-bottom:10px}
.feature-item{display:flex;align-items:center;gap:8px;padding:6px 0;font-size:13px;color:var(--text-mid)}
.feature-check{width:20px;height:20px;border-radius:50%;background:var(--green-light);color:var(--green-cta);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0}
.stock-badge{display:flex;align-items:center;gap:6px;margin-top:14px;padding:8px 12px;background:var(--green-light);border-radius:var(--radius-sm);font-size:12px;font-weight:600;color:var(--green-cta)}
.stock-dot{width:8px;height:8px;border-radius:50%;background:var(--green-cta);animation:pulse 1.5s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}

/* BILAN */
.bilan-card{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow-md);border:1px solid var(--border);padding:20px;margin-top:16px}
.bilan-title{font-family:Roboto,sans-serif;font-size:14px;font-weight:700;margin-bottom:16px;display:flex;align-items:center;gap:8px}
.bilan-gauge{margin-bottom:16px}
.bilan-gauge-label{display:flex;justify-content:space-between;font-size:12px;color:var(--text-mid);margin-bottom:6px}
.bilan-gauge-bar{height:10px;background:var(--border);border-radius:5px;overflow:hidden}
.bilan-gauge-fill{height:100%;border-radius:5px;transition:width .8s cubic-bezier(.4,0,.2,1)}
.gauge-hardness .bilan-gauge-fill{background:linear-gradient(90deg,var(--yellow-accent),var(--orange-accent),var(--red-accent))}
.gauge-need .bilan-gauge-fill{background:linear-gradient(90deg,#a8e6cf,var(--green-cta))}
.gauge-savings .bilan-gauge-fill{background:linear-gradient(90deg,var(--ogapur-blue),#4FC3F7)}
.bilan-savings-value{font-family:Roboto,sans-serif;font-size:24px;font-weight:800;color:var(--green-cta);text-align:center;margin-top:8px}
.bilan-savings-label{text-align:center;font-size:11px;color:var(--text-light)}
.bilan-summary{margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}
.bilan-summary-item{display:flex;align-items:center;gap:8px;padding:5px 0;font-size:12px;color:var(--text-mid)}

/* ANALYSIS OVERLAY */
.analysis-overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.7);z-index:1000;justify-content:center;align-items:center}
.analysis-overlay.show{display:flex}
.analysis-box{background:var(--white);border-radius:16px;padding:40px;max-width:480px;width:90%;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.analysis-spinner{width:60px;height:60px;border:4px solid var(--border);border-top-color:var(--ogapur-blue);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 20px}
@keyframes spin{to{transform:rotate(360deg)}}
.analysis-title{font-family:Roboto,sans-serif;font-size:18px;font-weight:700;margin-bottom:20px}
.analysis-steps{text-align:left}
.analysis-step{display:flex;align-items:center;gap:10px;padding:8px 0;font-size:13px;color:var(--text-light);opacity:.4;transition:.3s}
.analysis-step.active{color:var(--ogapur-blue);opacity:1;font-weight:500}
.analysis-step.done{color:var(--green-cta);opacity:1}
.analysis-step-icon{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;background:var(--border);flex-shrink:0}
.analysis-step.active .analysis-step-icon{background:var(--ogapur-light);color:var(--ogapur-blue);animation:spin 2s linear infinite}
.analysis-step.done .analysis-step-icon{background:var(--green-light);color:var(--green-cta)}
.analysis-progress{margin-top:20px;height:4px;background:var(--border);border-radius:2px;overflow:hidden}
.analysis-progress-fill{height:100%;background:linear-gradient(90deg,var(--ogapur-blue),var(--green-cta));border-radius:2px;transition:width 1s ease;width:0%}

/* COUPON POPUP */
.coupon-overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.65);z-index:1001;justify-content:center;align-items:center}
.coupon-overlay.show{display:flex}
.coupon-popup{background:var(--white);border-radius:18px;max-width:480px;width:92%;text-align:center;box-shadow:0 24px 80px rgba(0,0,0,.3);animation:popIn .5s cubic-bezier(.2,1,.3,1);position:relative;overflow:visible;}
.coupon-wrap{overflow:hidden;border-radius: 18px;padding:15px;}
@keyframes popIn{from{opacity:0;transform:scale(.8) translateY(30px)}to{opacity:1;transform:scale(1) translateY(0)}}
.coupon-top{background:#3376a8;border-radius:18px 18px 0 0;padding:18px 24px 36px;position:relative}
.coupon-top-logo{display:block;margin:0 auto 14px;height:100px;border-radius:50%;border:3px solid rgba(255,255,255,.25)}
.coupon-top-amount{font-family:Roboto,sans-serif;font-size:52px;font-weight:600;color:#fff;line-height:1.05;letter-spacing:-1px}
.coupon-top-sub{font-family:Roboto,sans-serif;font-size:14px;font-weight:700;color:#cbe4f5;letter-spacing:2.5px;text-transform:uppercase;margin-top:8px}
.coupon-cut{position:relative;height:0;margin:0 20px}
.coupon-cut-line{border:none;border-top:2.5px dashed #9bb5c7;margin:0;position:relative;top:1px}
.coupon-cut::before,.coupon-cut::after{content:'';position:absolute;width:46px;height:46px;background:var(--white);border-radius:50%;top:-23px;z-index:2;}
.coupon-cut::before{left:-43px; border-right: 1px solid #dbdee1;}
.coupon-cut::after{right:-43px; border-left: 1px solid #dbdee1;}
.coupon-cut-scissors{position:absolute;left:-1px;top:-17px;font-size:25px;color:#a1c2d9;z-index:3;transform:rotate(-0deg)}
.coupon-badge{position:absolute;left:50%;top:-14px;transform:translateX(-50%);background:linear-gradient(135deg,#e8a520,#d4911a);color:#fff;font-family:Roboto,sans-serif;font-size:13px;font-weight:800;padding:7px 22px;border-radius:35px;letter-spacing:1px;display:flex;align-items:center;gap:6px;z-index:4;box-shadow:0 -1px 0 2px rgba(255 255 255);white-space:nowrap}
.coupon-badge i{font-size:12px}
.coupon-bottom{padding:32px 24px 0;background:var(--white);border-radius:0 0 18px 18px;border: 1px solid #dbdee1;box-shadow: 0px 5px 15px -9px rgb(0 0 0 / 35%);}
.coupon-features{display:flex;justify-content:space-around;margin-bottom:24px;gap:8px}
.coupon-feature{display:flex;flex-direction:column;align-items:center;gap:4px;flex:1}
.coupon-feature-icon{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:20px;margin-bottom:2px}
.coupon-feature-icon.water{background:#e3f2fd;color:#1976d2}
.coupon-feature-icon.calc{background:#e8f5e9;color:#2e7d32}
.coupon-feature-icon.home{background:#fff3e0;color:#e8a520}
.coupon-feature-title{font-family:Roboto,sans-serif;font-size:13px;font-weight:700;color:var(--text-dark)}
.coupon-feature-desc{font-size:11px;color:var(--text-light);line-height:1.3}
.coupon-cta{font-family:Roboto,sans-serif;font-size:18px;font-weight:800;padding:16px 100px;border-radius:50px;background:linear-gradient(135deg,#34a853,#2d9249);color:#fff;border:none;cursor:pointer;box-shadow:0 6px 20px rgba(52,168,83,.35);transition:transform .2s,box-shadow .2s;display:inline-block;margin-bottom:10px}
.coupon-cta:hover{transform:translateY(-2px);box-shadow:0 8px 28px rgba(52,168,83,.45)}
.coupon-engagement{font-size:12px;color:#889ca9;font-weight:500;margin-bottom:18px}
.coupon-dismiss{display:inline-block;font-size:13px;color:#a0b7c4;border:1.5px solid #a0b7c4;border-radius:30px;padding:8px 28px;cursor:pointer;transition:border-color .2s;background:none;margin-bottom:16px}
.coupon-dismiss:hover{border-color:#aaa}
.coupon-disclaimer{font-size:11px;color:#c6d3db;font-style:italic;padding:2px 10px 18px;margin-top:0}

/* PRICE FICHE */
.price-reveal{display:none}
.price-reveal.active{display:block}
.price-fiche{position:relative;background:var(--white);border:2px solid var(--border);border-radius:var(--radius);padding:24px;margin:20px auto;max-width:420px;min-height:320px;overflow:hidden}
.price-fiche-header{display:flex;align-items:center;gap:12px;padding-bottom:14px;border-bottom:2px solid var(--border);margin-bottom:14px}
.price-fiche-logo{height:40px}
.price-fiche-title{font-family:Roboto,sans-serif;font-weight:700;font-size:14px}
.price-fiche-row{display:flex;justify-content:space-between;padding:8px 0;font-size:13px;color:var(--text-mid)}
.price-fiche-blur{position:absolute;bottom:0;left:0;right:0;height:60%;background:linear-gradient(to bottom,rgba(255,255,255,0) 0%,rgba(255,255,255,0.4) 15%,rgba(255,255,255,0.85) 40%,rgba(255,255,255,1) 65%);border-radius:0 0 var(--radius) var(--radius);display:flex;align-items:flex-end;justify-content:center;padding-bottom:24px}
.price-fiche-ready{display:flex;flex-direction:column;align-items:center;gap:6px}
.price-fiche-ready-icon{width:44px;height:44px;border-radius:50%;background:#1b5e20;display:flex;align-items:center;justify-content:center;font-size:22px;color:#fff}
.price-fiche-ready-text{font-family:Roboto,sans-serif;font-size:14px;font-weight:700;color:#1b5e20}
/* FICHE HERO — bloc économie mis en avant */
.fiche-hero{background:linear-gradient(135deg,var(--green-light),#ffffff);border:1px solid #bfe6c8;border-radius:var(--radius-sm);padding:14px 16px;margin:0 0 14px;text-align:center}
.fiche-hero-label{font-size:12px;font-weight:600;color:var(--text-mid);text-transform:uppercase;letter-spacing:.4px}
.fiche-hero-value{font-family:Roboto,sans-serif;font-size:30px;font-weight:800;line-height:1.1;color:var(--green-cta);margin:4px 0 2px}
.fiche-hero-note{font-size:11px;color:var(--text-light)}

/* RECEIVE */
.receive-title{font-family:Roboto,sans-serif;font-size:22px;font-weight:800;text-align:center;margin:24px 0 8px}
.receive-sub{text-align:center;font-size:13px;color:var(--text-mid);margin-bottom:24px}
.receive-options{display:flex;gap:16px;flex-direction: column;align-items: center;margin-bottom:20px}
.receive-option{display:flex;align-items: center;justify-content:space-between;width:400px;padding:10px 16px;border:2px solid var(--border);border-radius:var(--radius);text-align:center;cursor:pointer;transition:.25s}
.receive-option:hover{border-color:var(--ogapur-blue);transform:translateY(-2px);box-shadow:var(--shadow-md)}
.receive-option.selected{border-color:var(--ogapur-blue);background:var(--ogapur-light)}
.receive-option-icon{font-size:36px;}
.receive-option-text{font-family:Roboto,sans-serif;font-size: 1.2em;font-weight:700}

/* ERROR MODAL */
.error-modal{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.6);z-index:1000;justify-content:center;align-items:center}
.error-modal.show{display:flex}
.error-box{background:var(--white);border-radius:var(--radius);padding:32px;max-width:400px;width:90%;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.error-icon{font-size:48px;margin-bottom:12px}
.error-title{font-family:Roboto,sans-serif;font-size:17px;font-weight:700;color:var(--red-accent);margin-bottom:10px}
.error-text{font-size:14px;color:var(--text-mid);margin-bottom:20px;line-height:1.6}

/* LOADING MINI SPINNER */
.mini-loader{display:none;text-align:center;padding:20px}
.mini-loader.show{display:block}
.mini-loader .analysis-spinner{width:40px;height:40px;margin:0 auto 10px}
.mini-loader p{font-size:13px;color:var(--text-mid)}

/* CONTACT */
.contact-step{display:none;animation:fadeIn .4s ease}
.contact-step.active{display:block}

/* =====================================================================
   DIGITAL FLOW — "Devis personnalisé" (même style desktop/tablette/mobile)
   Tous les champs visibles d'un coup, un seul bouton CONTINUER.
   ===================================================================== */
#digitalFlow .contact-step{display:block;animation:none}
#digitalFlow .contact-step + .contact-step{margin-top:2px}

.df-eyebrow{font-family:Roboto,sans-serif;font-size:12px;font-weight:700;letter-spacing:.09em;
            color:#3376a8;text-transform:uppercase;margin-bottom:6px}
.df-title{font-family:Roboto,sans-serif;font-size:17px;font-weight:800;color:#0B1E3A;
          line-height:1.2;margin:0 0 8px;text-align:left}
.df-sub{font-size:13.5px;color:#5A6B85;line-height:1.65;margin:0 0 18px;text-align:left}

/* récapitulatif */
.df-recap{background:#F7F9FC;border:1px solid #E5EAF2;border-radius:14px;padding:16px 18px;margin-bottom:4px}
.df-recap-title{font-family:Roboto,sans-serif;font-size:11px;font-weight:700;letter-spacing:.09em;
                color:#8A97AD;text-transform:uppercase;margin-bottom:10px}
.df-recap-row{display:flex;gap:8px;align-items:baseline;font-size:13px;padding:4px 0}
.df-recap-row .k{color:#5A6B85;flex:none}
.df-recap-row .v{color:#0B1E3A;font-weight:700}

.df-divider{border:none;border-top:1px dashed #D8E0EC;margin:20px 0 18px}
.df-contact-title{font-family:Roboto,sans-serif;font-size:15px;font-weight:800;color:#0B1E3A;
                  text-align:center;margin-bottom:18px}

/* champs */
.df-label{display:block;font-family:Roboto,sans-serif;font-size:11px;font-weight:700;
          letter-spacing:.09em;color:#7C8AA5;text-transform:uppercase;margin:0 0 7px;text-align:left}
.df-label span{color:#E74C3C}
.df-input-wrap{position:relative;margin-bottom:16px}
.df-input-wrap i{position:absolute;left:14px;top:24px;transform:translateY(-50%);
                 color:#9AA7BC;font-size:15px;pointer-events:none}
#digitalFlow .df-input-wrap .input-field{width:100%;max-width:none;padding:13px 14px 13px 42px;
    border:1.5px solid #DFE6F0;border-radius:12px;font-family:'Poppins',sans-serif;font-size:14px;
    color:#0B1E3A;background:#fff;box-shadow:none}
#digitalFlow .df-input-wrap .input-field::placeholder{color:#9AA7BC}
#digitalFlow .df-input-wrap .input-field:focus{outline:none;border-color:#2563EB;
    box-shadow:0 0 0 3px rgba(37,99,235,.12)}

/* bouton CONTINUER pleine largeur */
.df-continue{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;
    padding:15px 16px;border:none;border-radius:12px;background:#EDF1F7;color:#0B1E3A;
    font-family:Roboto,sans-serif;font-size:14px;font-weight:800;letter-spacing:.09em;
    text-transform:uppercase;cursor:pointer;transition:background .2s ease,transform .15s ease;margin-top:4px}
.df-continue i{font-size:14px}
.df-continue:hover{background:#E0E8F2;transform:translateY(-1px)}
.df-continue:active{transform:none}

/* SUCCESS */
.success-card{text-align:center}
.success-card .expert-callout{background:linear-gradient(135deg,var(--ogapur-light),#dbeeff);border:2px solid var(--ogapur-blue);border-radius:var(--radius);padding:20px;margin-top:20px;text-align:center}
.success-card .expert-callout h4{font-family:Roboto,sans-serif;font-size:16px;font-weight:700;color:var(--ogapur-blue);margin-bottom:6px}
.success-card .expert-callout p{font-size:13px;color:var(--text-mid);line-height:1.6}

/* ADDRESS ROW */
.address-row{display:flex;gap:12px;max-width:500px;margin:0 auto}
.address-field-wrap{flex:1;min-width:0}
.city-field-wrap{flex:0 0 180px}
.address-label{display:block;font-size:12px;font-weight:600;color:var(--text-mid);margin-bottom:6px}

/* CITY DROPDOWN */
.city-dropdown{display:none;position:absolute;top:100%;left:0;right:0;background:var(--white);border:2px solid var(--ogapur-blue);border-top:none;border-radius:0 0 var(--radius-sm) var(--radius-sm);max-height:200px;overflow-y:auto;z-index:10;box-shadow:var(--shadow-md)}
.city-dropdown.open{display:block}
.city-option{padding:10px 16px;cursor:pointer;font-size:14px;transition:.15s;display:flex;align-items:center;gap:8px}
.city-option:hover{background:var(--ogapur-light);color:var(--ogapur-blue)}
.city-option span{font-size:12px;color:var(--text-light)}
.social-proof{display:flex;align-items:center;gap:10px;max-width:400px;margin:16px auto 0;padding:12px 16px;background:#f0f7ff;border:1px solid #bee3f8;border-radius:var(--radius-sm);animation:fadeIn .4s ease}
.social-proof-icon{font-size:20px;flex-shrink:0}
.social-proof-text{font-size:13px;color:var(--text-mid);line-height:1.4}
.social-proof-text strong{color:var(--ogapur-blue)}

.sub-question{display:none;animation:fadeIn .3s ease;margin-top:20px}
.sub-question.show{display:block}

/* TRUST */
.trust-bar{display:flex;gap:20px;justify-content:center;padding:16px;flex-wrap:wrap}
.trust-item{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-light);font-weight:500}

.number-counter {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0;
    background: var(--ogapur-blue, #2b6cb0);
    border-radius: 50px;
    padding: 1px;
    max-width: 170px;
    margin: 20px auto;
}
.number-counter-btn {
    width: 50px;
    height: 52px;
    border: none;
    background: transparent;
    color: #fff;
    font-size: 35px;
    line-height: 35px;
    font-weight: 700;
    cursor: pointer;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.2s;
}
.number-counter-btn:disabled {
    opacity: 0.3;
    cursor: default;
}
.number-counter-btn:hover:not(:disabled) {
    /*background: rgba(255,255,255,0.15);*/
}
.number-counter-input {
    max-width: 70px;
    height: 52px;
    border: none;
    background: #fff;
    color: var(--text-dark);
    font-size: 22px;
    font-weight: 700;
    text-align: center;
    border-radius: 1px;
    -moz-appearance: textfield;
    outline: none;
}
.number-counter-input::-webkit-inner-spin-button,
.number-counter-input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/*ARC SVG STYLES*/
.discount-section {
    display: flex;
    justify-content: center;
    margin: 15px 0 8px;
}
.discount-gauge {
    position: relative;
    width: 150px;
    height: 100px;
    flex-shrink: 0;
}
.discount-svg {
    width: 100%;
    height: 100%;
}
.discount-arc-bg {
    fill: none;
    stroke: #e8e8e8;
    stroke-width: 10;
    stroke-linecap: round;
}
.discount-arc-fill {
    fill: none;
    stroke: url(#priceGrad);
    stroke-width: 10;
    stroke-linecap: round;
    stroke-dasharray: 157;
    stroke-dashoffset: 0;
}
.discount-center {
    position: absolute;
    bottom: 8px;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    white-space: nowrap;
}
.discount-value {
    font-family: Roboto, sans-serif;
    font-size: 22px;
    font-weight: 800;
    color: #1a1a1a;
    line-height: 1;
    white-space: nowrap;
    transition: color 0.4s ease;
    font-variant-numeric: tabular-nums;
}
.discount-value.price-high { color: #E53E3E; }
.discount-value.price-mid  { color: #F39C12; }
.discount-value.price-low  { color: #2EAD4B; }
.discount-label {
    font-size: 10px;
    color: var(--text-light);
    font-weight: 600;
    white-space: nowrap;
    margin-top: 1px;
}

/* PRICE GAUGE — comparaison OGAPUR vs concurrence */
.price-gauge {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 4px;
    width: 100%;
}
.price-gauge-tip {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    flex-shrink: 0;
    width: 64px;
    padding-bottom: 10px;
}
.price-gauge-tip i {
    font-size: 22px;
    line-height: 1;
}
.price-tip-name {
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .4px;
    color: var(--text-light);
}
.price-tip-val {
    font-family: Roboto, sans-serif;
    font-size: 14px;
    font-weight: 800;
    line-height: 1;
}
.price-gauge-tip--ours i { color: var(--ogapur-blue); }
.price-gauge-tip--ours .price-tip-val { color: var(--green-cta); }
.price-gauge-tip--comp i { color: #9aa5b1; }
.price-gauge-tip--comp .price-tip-val { color: #E53E3E; }
.price-gauge-tip--comp .price-tip-val::before { content: '~'; }
.price-flip { animation: priceFlip .5s ease; }
@keyframes priceFlip {
    0%   { opacity: 0; transform: translateY(-6px); }
    100% { opacity: 1; transform: translateY(0); }
}
.price-gauge-caption {
    text-align: center;
    font-size: 11px;
    color: var(--text-mid);
    margin: 2px 0 6px;
}

.mobile-topbar {
    display: none;
    background: linear-gradient(135deg, #fafbfc 0%, #ffffff 100%);
    width: 100%;
}
.mobile-topbar-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px 6px;
}
.mobile-product-img {
    width: 50px;
    height: 50px;
    flex-shrink: 0;
    background: linear-gradient(135deg, #f8fbfe, #edf5fc);
    border-radius: 10px;
    padding: 4px;
    object-fit: contain;
    box-shadow: 0 2px 6px rgba(59, 123, 168, 0.1);
}
.mobile-product-info {
    flex: 1;
    min-width: 0;
}
.mobile-product-name {
    font-family: Roboto, sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: var(--text-dark);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mobile-product-sub {
    font-size: 10px;
    font-weight: 500;
    color: var(--text-light);
    line-height: 1.3;
    margin-top: 1px;
}
.mobile-product-sub strong {
    color: var(--text-dark);
    font-weight: 800;
}
.mobile-bottom-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 12px 10px;
}
.mobile-discount-bar-wrap {
    flex: 1;
    min-width: 0;
}
.mobile-discount-top {
    display: flex;
    align-items: baseline;
    gap: 2px;
    margin-bottom: 4px;
}
.mobile-product-remise {
    font-size: 9px;
    color: var(--text-light);
    font-style: italic;
    margin-left: 2px;
}
.mobile-gauge-bar {
    height: 5px;
    background: #e9ecef;
    border-radius: 3px;
    overflow: hidden;
}
.mobile-gauge-fill {
    height: 100%;
    background: linear-gradient(90deg, #38a169, #dd6b20, #e53e3e);
    border-radius: 3px;
    transition: width 0.6s ease;
    width: 3%;
}
.mobile-timer-pill {
    flex-shrink: 0;
    width: 88px;
    background: var(--red-accent);
    color: #fff;
    padding: 6px 8px;
    border-radius: 8px;
    text-align: center;
    box-shadow: 0 2px 6px rgba(231, 76, 60, 0.25);
}
.mobile-timer-lbl {
    font-size: 7px;
    font-weight: 700;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    opacity: 0.95;
    line-height: 1;
}
.mobile-timer-digits {
    font-family: Roboto, sans-serif;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 1px;
    margin-top: 2px;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
}
.mobile-product-discount {
    font-family: Roboto, sans-serif;
    font-size: 17px;
    font-weight: 900;
    color: #e53e3e;
    line-height: 1;
}
.mobile-toggle-slot {
    position: relative;
    width: 88px;
    height: 42px;
    flex-shrink: 0;
}
.mobile-toggle-slot .mobile-timer-pill,
.mobile-toggle-slot .mobile-toggle-img {
    position: absolute;
    top: 3px;
    left: 0;
    width: 88px;
    /*height: 42px;*/
    transition: opacity 0.5s ease, transform 0.5s ease;
}
.mobile-toggle-img {
    object-fit: contain;
    border-radius: 8px;
    opacity: 0;
    transform: scale(0.8);
    display: none;
}

.ban__promo{ display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:5px 10px;

     width:auto; pointer-events:none;
    background:#e40014; color:#fff; font-weight:700; font-size:12.5px; line-height:1.25; text-align:center;
    padding:7px 12px; border-radius:8px; box-shadow:0 6px 16px rgba(228,0,20,.3);
    transition:opacity .2s ease; }
.ban__promo-tag{ background:#fff; color:#e40014; font-weight:800; font-size:10.5px; letter-spacing:.03em;
    padding:3px 9px; border-radius:6px; white-space:nowrap; }
.ban__promo-txt b{ font-weight:800; }
.ban__promo del{ opacity:.75; font-weight:600; }
.ban__promo.is-stuck{ position:fixed; top:29px; z-index:1002; max-width:calc(100% - 70px); }

#RDV_WRAP {

}

@media(max-width:860px){
    .main-container{flex-direction:column}
    .right-panel{width:100%;position:relative;top:0;order:-1}
    .topbar{flex-direction:column; padding: 0 10px;}
    .topbar-steps{display:none}
    .topbar-logo{display: none;}
    .hero-title{font-size:22px}
    .hero-top{display:none}
    .receive-options{flex-direction:column;align-items:center}
    .receive-option{max-width:280px;width:100%}
    .taste-grid{gap:8px}
    .taste-btn{min-width:90px;padding:14px 10px;font-size:20px}
    .order-1 .option-row{padding:13px 5px 13px 10px;}
    .right-panel { display: none !important; }
    .simulator-topbar .topbar-logo { display: none !important; }
    .cta-btn {padding: 16px; width: 100%; max-width: 500px; justify-content: center;}
    .mobile-topbar { display: block; }
}
@media(max-width:500px){
    .address-row{flex-direction:column}
    .city-field-wrap{flex:1}
    .card{padding: 15px;}
    .price-fiche {padding: 10px;}
    .option-row-label {font-size: 16px;}
}
@media(max-width:425px){
    .hero-title {
        font-size: 16px;
    }
    .hero-subtitle {
        font-size: 13px;
        margin-bottom: 0;
        text-align: justify;
    }
    .card {
        margin-bottom: 12px;
    }
    .progress-container {
        margin-bottom: 12px;
    }
}
@media (min-width: 861px) {
    .mobile-topbar { display: none !important; }
}

.hidden {display:none}

/* =====================================================================
   RDV — prise de rendez-vous (styles repris de rdv-list.css, scopés page)
   ===================================================================== */
.overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.2);justify-content:center;align-items:center;z-index:9999}
.overlay.active{display:flex}
.spinner-dual-ring{display:inline-block;width:65px;height:65px;margin:20px}
.spinner-dual-ring:after{content:" ";display:block;width:60px;height:60px;border-radius:50%;border:4px solid;border-color:#de4a37 transparent #3375a7 transparent;animation:dual-ring 1.2s linear infinite}
@keyframes dual-ring{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}

/* bandeau "demande reçue" au-dessus de la liste */
.rdv-thanks{display:flex;align-items:flex-start;gap:12px;background:var(--green-light);border:1px solid var(--green-cta);border-radius:var(--radius);padding:14px 16px;margin-bottom:6px}
.rdv-thanks i{color:var(--green-cta);font-size:26px;flex:none;margin-top:2px}
.rdv-thanks strong{display:block;font-family:Roboto,sans-serif;font-size:15px;color:var(--text-dark)}
.rdv-thanks span{font-size:13px;color:var(--text-mid);line-height:1.5}

.rdv-container{max-width:680px;margin:0 auto;padding:1rem 0}
.rdv-container-head{max-width:680px;margin:0 auto;padding:1rem 0 .5rem}
.rdv-container-head .rdv-container-subtitle{text-align:center;font-size:13px;color:var(--text-mid)}
.rdv-container-title{text-align:center;font-family:Roboto,sans-serif;font-size:1.35rem;font-weight:600;color:#1e293b;margin-bottom:4px}

.date-section{background:#fff;border-radius:12px;margin-bottom:1rem;box-shadow:0 1px 3px rgba(0,0,0,.1);overflow:hidden;transition:all .3s ease;border:1px solid #c9d9e8;animation:slideIn .3s ease-out}
.date-section.expanded{box-shadow:0 1px 6px rgba(0,0,0,.15)}
.date-header{padding:.8rem .8rem .5rem;cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:background .2s;border-bottom:1px solid #c9d9e8}
.date-header:hover{background:#f8fafc}
.date-header-wrap{display:flex;flex-direction:column;gap:10px}
.date-title{font-size:1rem;font-weight:600;color:#1e293b}
.worker-contact-info{font-size:14px;font-weight:600}
.worker-contact-info > a{font-size:14px;font-weight:600;color:#1f84cf}
.chevron{width:20px;height:20px;transition:transform .3s;color:#64748b}
.date-section.expanded .chevron{transform:rotate(180deg)}
.slots-container{max-height:0;overflow:hidden;transition:max-height .4s ease-out;padding:0 1.5rem}
.date-section.expanded .slots-container{max-height:600px;padding:.95rem 1.5rem}
.slots-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.75rem;margin-bottom:1rem}
.time-slot{background:#e0f2fe;border:2px solid transparent;padding:.875rem;border-radius:8px;text-align:center;cursor:pointer;font-weight:500;font-size:.95rem;color:#0369a1;transition:all .2s;position:relative;font-family:'Poppins',sans-serif}
.time-slot:hover{background:#bae6fd;border-color:#9dbfe3;transform:translateY(-2px);box-shadow:0 4px 8px rgba(14,165,233,.2)}
.time-slot.selected{background:#4777a9;color:#fff;border-color:#4969a2}
@keyframes slideIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}

.doctor-profile-compact{display:flex;align-items:center;gap:.875rem;transition:all .2s}
/* pas de données intervenant sur cette page → masquer l'avatar vide */
.doctor-profile-compact .avatar-container:has(img[src$="/workers/"]){display:none}
.doctor-profile-compact .avatar-container{position:relative;flex-shrink:0}
.doctor-profile-compact .doctor-avatar-compact{width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid #e2e8f0}
.doctor-profile-compact .video-badge{position:absolute;bottom:0;right:0;background:#0596de;width:12px;height:12px;border-radius:50%;border:2px solid #fff;box-shadow:0 2px 4px rgba(0,0,0,.15)}
.doctor-profile-compact .doctor-info-compact{flex:1;min-width:0}
.doctor-profile-compact .doctor-name-compact{color:#0596de;font-size:1rem;font-weight:600;margin:0;text-decoration:none;display:block;line-height:normal}
.doctor-profile-compact .doctor-specialty-compact{color:#64748b;font-size:.875rem;line-height:normal;margin:.125rem 0 0}

@media (max-width:640px){.slots-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:450px){.slots-grid{grid-template-columns:repeat(1,1fr)}}

/* ==========================================================================
   REPRISE ADOUCISSEUR — header estimation, questions, résultat, formulaire
   ========================================================================== */
.main-container.solo-panel { max-width: 860px; }

/* — Badge BONUS SPÉCIAL (topbar mobile) — */
.bonus-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #fdeedf;
    color: #fd7509;
    font-family: "Nunito", "Poppins", sans-serif;
    font-weight: 800;
    font-size: 12px;
    letter-spacing: .4px;
    padding: 9px 15px;
    border-radius: 12px;
    white-space: nowrap;
}
.bonus-chip svg { width: 17px; height: 17px; }
.mobile-topbar-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; }

/* — En-tête « Calcul de votre estimation » — */
.estim-head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 8px 0 16px;
}
.estim-head-ic {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: #e4f4e6;
    color: #18a53c;
}
.estim-head-ic svg { width: 20px; height: 20px; }
.estim-head-tx {
    font-family: "Nunito", "Poppins", sans-serif;
    font-weight: 800;
    font-size: clamp(21px, 3.6vw, 27px);
    color: #12213e;
    letter-spacing: -.2px;
}

/* — Barre de progression + statut — */
.progress-container { margin-bottom: 18px; }
.progress-bar {
    position: relative;
    height: 8px;
    border-radius: 999px;
    background: #e7e7e7;
    overflow: hidden;
}
.progress-fill {
    height: 100%;
    border-radius: 999px;
    background: #0a952f;
    transition: width .45s cubic-bezier(.4, 0, .2, 1);
}
.estim-status {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 11px;
    color: #4a5568;
    font-family: "Nunito", "Poppins", sans-serif;
    font-weight: 600;
    font-size: 14.5px;
}
.estim-status-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: #18a53c; }
.estim-status svg { flex: none; width: 20px; height: 20px; }
.estim-status.done { color: #12213e; font-weight: 800; font-size: 15px; }

/* Résultat : la barre est masquée sur cet écran, le statut devient le badge BONUS SPÉCIAL */
.progress-container.result-mode .progress-bar { display: none; }
.progress-container.result-mode .estim-status { margin-top: 0; justify-content: flex-end; }
@media (max-width: 860px) {
    /* le badge du haut de header est déjà visible : pas de doublon au résultat */
    .topbar .progress-container.result-mode { display: none !important; }

    /* écran résultat mobile : le badge header s'efface, le titre
       « Bonne nouvelle ! » y est déplacé à sa place (via JS) */
    .topbar.result-mode .bonus-chip { display: none; }

    .mobile-topbar-row .rpn-title {
        margin: 0;
        font-size: 21px;
        gap: 7px;
        line-height: 1;
    }

    .mobile-topbar-row .rpn-title .rpn-emoji { font-size: 20px; }

    .mobile-topbar-row .rpn-title .rpn-spark { width: 15px; height: 15px; }
}

/* — Progression dans le header — */
.topbar .progress-container {
    margin: 0 0 0 auto;          /* desktop : alignée à droite */
    width: 400px;
    max-width: 44vw;
    padding: 6px 0;
}
@media (max-width: 860px) {
    .topbar .progress-container {
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 2px 0 10px;      /* mobile/tablette : sous logo + badge */
    }
    .topbar .estim-status { margin-top: 8px; }
}

/* — Grille des marques — */
.brand-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}
.brand-card {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 104px;
    padding: 5px;
    background: #fff;
    border: 1.5px solid #e6ebf1;
    border-radius: 10px;
    cursor: pointer;
    transition: border-color .15s ease, box-shadow .15s ease, transform .1s ease;
}
.brand-card:hover { border-color: #b9c6d6; box-shadow: 0 4px 14px rgba(18, 33, 62, .07); }
.brand-card.selected { border-color: #0a952f; box-shadow: 0 0 0 3px rgba(10, 149, 47, .12); }
.brand-card img { max-width: 82%; max-height: 90px; object-fit: contain; }
.brand-card-tx {
    font-family: "Nunito", "Poppins", sans-serif;
    font-weight: 800;
    font-size: 19px;
    letter-spacing: .5px;
    color: #2f7bd9;
    text-transform: uppercase;
}

/* — Sous-titre de l'overlay d'analyse — */
.analysis-sub {
    margin: 6px auto 14px;
    max-width: 420px;
    text-align: center;
    color: var(--text-mid, #4A5568);
    font-size: 13.5px;
    line-height: 1.5;
}

/* ==========================================================================
   RÉSULTAT — BONNE NOUVELLE + FORMULAIRE INTÉGRÉ (vue unique)
   ========================================================================== */
#priceCard { width: 100%; }

#priceCard .rpn,
#priceCard .rpn * {
    font-family: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    box-sizing: border-box;
}
#priceCard .rpn {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 620px;
    margin: 0 auto;
    padding: 4px 0 26px;
}

/* — Badge bonus — */
.rpn-badge {
    align-self: center;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 18px;
    padding: 13px 26px;
    background: #fdf0e0;
    border-radius: 14px;
    color: #f0800f;
    font-size: 16px;
    font-weight: 800;
    letter-spacing: .02em;
    text-transform: uppercase;
    line-height: 1;
}
.rpn-badge svg { width: 22px; height: 22px; flex: none; }

/* — Titre — */
.rpn-title {
    margin: 0 0 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    text-align: center;
    color: #182a4e;
    font-size: 42px;
    font-weight: 600;
    line-height: 1.1;
}
.rpn-title b { color: #18a04b; font-weight: 600; }
.rpn-emoji { font-size: 38px; line-height: 1; }
.rpn-spark { width: 24px; height: 24px; color: #18a04b; transform: scaleX(-1); flex: none; }

/* — Carte valeur estimée — */
.rpn-value-card {
    display: flex;
    align-items: flex-start;
    gap: 22px;
    background: #f7f9fa;
    border: 1px solid #eef1f4;
    border-radius: 16px;
    padding: 20px 24px;
}
.rpn-product {
    width: 150px;
    height: auto;
    flex: none;
}
.rpn-value-tx { flex: 1; min-width: 0; }
.rpn-value-label {
    margin: 0;
    color: #182a4e;
    font-size: 19px;
    font-weight: 800;
}
.rpn-price {
    margin: 8px 0 0;
    display: flex;
    align-items: center;
    gap: 18px;
    color: #17a044;
    font-size: 58px;
    font-weight: 900;
    line-height: 1;
}
.rpn-price svg { width: 52px; height: 52px; flex: none; }
.rpn-price img {
    width: 50px;
    height: 50px;
    object-fit: contain;
    mix-blend-mode: multiply; /* fond blanc éventuel fondu dans la carte */
    flex: none;
}
.rpn-value-sep { height: 1px; background: #e3e8ec; margin: 14px 0 12px; }
.rpn-info {
    margin: 0;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    color: #182a4e;
    font-size: 15.5px;
    font-weight: 600;
    line-height: 1.45;
}
.rpn-info-ic {
    flex: none;
    width: 25px;
    height: 25px;
    margin-top: 1px;
    color: #f0800f;
}
.rpn-info b { color: #f0800f; font-weight: 800; }

/* — Carte compte à rebours — */
.rpn-timer-card {
    margin-top: 14px;
    background: #fdf7f1;
    border: 1px solid #fdf0e2;
    border-radius: 16px;
    padding: 18px 20px;
}
.rpn-timer-row {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}
.rpn-clock { width: 40px; height: 40px; color: #f0800f; flex: none; }
.rpn-timer-label {
    margin: 0;
    color: #182a4e;
    font-size: 17px;
    font-weight: 700;
}
.rpn-timer-label b { color: #f0800f; font-weight: 800; }
.rpn-count {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}
.rpn-count-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    background: #fff;
    border: 1px solid #f4e5cf;
    border-radius: 12px;
    padding: 10px 10px 8px;
    min-width: 64px;
}
.rpn-count-box b {
    color: #182a4e;
    font-size: 25px;
    font-weight: 900;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
.rpn-count-box i {
    font-style: normal;
    color: #6d7987;
    font-size: 11.5px;
    font-weight: 600;
}
.rpn-count-sep {
    color: #182a4e;
    font-size: 24px;
    font-weight: 900;
    margin-top: -16px;
}

/* encart « jusqu'à 1 000 € » */
.rpn-extra {
    margin-top: 14px;
    display: flex;
    align-items: center;
    gap: 14px;
    background: #f8f9f7;
    border: 1px solid #e1e6df;
    border-radius: 12px;
    padding: 14px 18px;
}
.rpn-extra svg { width: 38px; height: 38px; color: #18a04b; flex: none; }
.rpn-extra p {
    margin: 0;
    color: #182a4e;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.4;
}
.rpn-extra b { color: #18a04b; font-weight: 800; }

/* — Accroche formulaire — */
.rpn-lead {
    margin: 22px auto 16px;
    max-width: 500px;
    text-align: center;
    color: #182a4e;
    font-size: 19px;
    font-weight: 700;
    line-height: 1.45;
}
.rpn-lead b { color: #18a04b; font-weight: 800; }

/* — Formulaire intégré — */
.rpn-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.rpn-field {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    flex-wrap: wrap;
    background: #fff;
    border: 1.5px solid #e6eaee;
    border-radius: 12px;
    padding: 12px;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.rpn-field:focus-within {
    border-color: #0c922f;
    box-shadow: 0 0 0 4px rgba(12, 146, 47, .08);
}
.rpn-field > svg { width: 22px; height: 22px; color: #182a4e; flex: none; }
.rpn-input {
    flex: 1;
    min-width: 0;
    border: none;
    outline: none;
    background: transparent;
    color: #182a4e;
    font-size: 16px;
    font-weight: 600;
    padding: 0;
}
.rpn-input::placeholder { color: #8a95a3; font-weight: 600; opacity: 1; }
.rpn-adr { flex: 1; min-width: 0; }
.rpn-adr .rpn-input { width: 100%; }
.rpn-adr-hint {
    display: block;
    margin-top: 3px;
    color: #9aa4b1;
    font-size: 13px;
    font-weight: 500;
}
/* erreurs injectées par showFieldError (div.input-error après l'input) */
.rpn-field .input-error { flex: 1 1 100%; padding-left: 36px; }
.rpn-field:has(.input-error) { border-color: #E74C3C; }

/* — CTA envoi direct — */
.rpn-cta {
    position: relative;
    margin-top: 14px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 19px 52px;
    background: #0e8132;
    border: none;
    border-radius: 14px;
    color: #fff;
    font-size: 16.5px;
    font-weight: 800;
    letter-spacing: .03em;
    text-transform: uppercase;
    line-height: 1.2;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(14, 129, 50, .28);
    transition: transform .15s ease, filter .15s ease;
}
.rpn-cta:hover { transform: translateY(-1px); filter: brightness(1.06); }
.rpn-cta svg { width: 22px; height: 22px; flex: none; }
.rpn-cta .rpn-cta-arrow {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    width: 18px;
    height: 18px;
}

/* — Confidentialité — */
.rpn-secure {
    margin: 14px 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: #182a4e;
    font-size: 14.5px;
    font-weight: 700;
}
.rpn-secure svg { width: 25px; height: 25px; color: #18a04b; flex: none; }

/* — Responsive — */
@media (max-width: 640px) {
    .rpn-badge { font-size: 14px; padding: 11px 18px; gap: 10px; }
    .rpn-title { font-size: 33px; gap: 10px; }
    .rpn-emoji { font-size: 30px; }
    .rpn-spark { width: 20px; height: 20px; }
    .rpn-value-card { gap: 16px; padding: 18px 16px; }
    .rpn-product { width: 96px; }
    .rpn-value-label { font-size: 16.5px; }
    .rpn-price { font-size: 46px; gap: 12px; }
    .rpn-price svg { width: 40px; height: 40px; }
    .rpn-price img { width: 44px; height: 44px; }
    .rpn-info { font-size: 14.5px; }
    /* compte à rebours sur UNE ligne comme la maquette :
       icône + libellé à gauche, compteur à droite */
    .rpn-timer-card { padding: 16px 14px; }
    .rpn-timer-row { gap: 10px; flex-wrap: nowrap; }
    .rpn-clock { width: 32px; height: 32px; }
    .rpn-timer-label { flex: 1; min-width: 0; font-size: 14px; }
    .rpn-count { margin: 0; gap: 4px; }
    .rpn-count-box { min-width: 47px; padding: 8px 5px 6px; gap: 3px; border-radius: 10px; }
    .rpn-count-box b { font-size: 19px; }
    .rpn-count-box i { font-size: 9.5px; }
    .rpn-count-sep { font-size: 17px; margin-top: -12px; }
    .rpn-extra p { font-size: 14px; }
    .rpn-lead { font-size: 14px; max-width: 300px; margin: 15px auto;}
    .rpn-cta { font-size: 14.5px; padding: 17px 46px; gap: 10px; }
}
@media (max-width: 420px) {
    .rpn-title { font-size: 29px; }
    .rpn-price { font-size: 40px; }
    .rpn-count-box { min-width: 44px; padding: 7px 4px 5px; }
    .rpn-count-box b { font-size: 17px; }
    .rpn-count-box i { font-size: 9px; }
    .rpn-cta { font-size: 13px; letter-spacing: .02em; padding: 16px 26px; gap: 8px; }
    .rpn-cta svg { width: 22px; height: 22px; }
    .rpn-cta .rpn-cta-arrow { right: 10px; width: 16px; height: 16px; }
}

/* ==========================================================================
   FORMULAIRE — identique à devis-reprise
   ========================================================================== */
.reprise-form,
.reprise-form * {
    font-family: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}
.reprise-form {
    background: #fff;
    border: 1px solid #eef0f4;
    border-radius: 24px;
    box-shadow: 0 12px 36px rgba(18, 33, 62, .09);
    padding: 30px 28px 26px;
    max-width: 560px;
    margin: 8px auto 34px;
}
.rpf-head { text-align: center; margin-bottom: 22px; }
.rpf-title {
    margin: 0;
    color: #12213e;
    font-weight: 800;
    font-size: 24px;
    line-height: 1.25;
}
.rpf-sub {
    margin: 6px 0 0;
    color: #5b6472;
    font-weight: 600;
    font-size: 15px;
    line-height: 1.45;
}
.reprise-form .response-input {
    display: block;
    width: 100%;
    background: #fff;
    border: 2px solid #e6e9f0;
    border-radius: 12px;
    padding: 14px 16px;
    margin-bottom: 14px;
    color: #12213e;
    font-weight: 600;
    font-size: 16px;
    outline: 0;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.reprise-form .response-input:hover { border-color: #cfd6e2; }
.reprise-form .response-input:focus { border-color: #0c922f; box-shadow: 0 0 0 4px rgba(12, 146, 47, .10); }
.reprise-form ::placeholder { color: #9aa5b8; opacity: 1; }
.rpf-newsletter { display: flex; align-items: center; gap: 9px; margin: 4px 0 10px; }
.rpf-newsletter input[type="checkbox"] { accent-color: #0b842a; width: 17px; height: 17px; }
.rpf-newsletter label { color: #22304e; font-weight: 700; font-size: 14.5px; cursor: pointer; }
.rpf-rgpd { color: #8a94a6; font-weight: 600; font-size: 12.5px; line-height: 1.5; margin: 0 0 16px; }
.rpf-btn {
    display: block;
    width: 100%;
    background: #0b842a;
    border: 0;
    border-radius: 14px;
    padding: 18px 24px;
    color: #fff;
    font-weight: 800;
    font-size: 17px;
    letter-spacing: .5px;
    text-transform: uppercase;
    cursor: pointer;
    transition: background .2s ease, transform .15s ease;
}
.rpf-btn:hover { background: #0a7526; }
.rpf-btn:active { transform: scale(.99); }
@media (max-width: 575px) {
    .reprise-form { padding: 22px 16px 20px; border-radius: 20px; }
    .rpf-title { font-size: 21px; }
    .estim-head {margin: 0 0 15px;}
    .main-container {padding: 15px;}
}
@media (max-width: 500px) {
    .estim-status {font-size: 14px;}
    .step-question {font-size: 19px;}
    .rpb-cta {font-size: 17px; padding: 20px 30px;}
}
@media (max-width: 470px) {
    .rpb-cta {font-size: 16px; padding: 20px 30px 20px 15px;}
    .rpb-cta .rpb-cta-arrow {right: 15px;}
    .rpn-value-label {font-size: 14px;}
    .rpn-price {font-size: 35px; font-weight: 700; margin: 4px 0 0;}
    .rpn-price .remise-value {font-size: 40px;}
    .rpn-price img {
        width: 35px;
        height: 35px;
    }
    .rpn-value-sep {
        margin: 10px 0 10px;
    }
    .rpn-info {
        font-size: 13px;
        align-items: center;
    }
    .rpn-timer-card {margin-top: 5px; padding: 10px}
    .rpn-timer-row {gap: 5px;}
    .rpn-timer-label {font-size: 13px;}
    .rpn-count-box {padding: 4px; gap: 1px;}
    .rpn-count-box b {font-size: 16px;}
    .rpn-cta {padding: 17px 35px 17px 20px;}
}
@media (max-width: 440px) {
    .step-question {font-size: 18px;}
    .rpb-cta {font-size: 15px;}
    .rpn-info {font-size: 13px;}
    .rpn-value-card {padding: 10px 15px 10px 0; gap: 0;}
    .rpn-lead {margin: 10px auto;}
    .rpn-form {gap: 10px;}
}
@media (max-width: 410px) {
    .rpb-cta {font-size: 14px;}
    .rpn-timer-label {font-size: 12px;}
}
@media (max-width: 400px) {
    .option-row-label {font-size: 14px;}
    .rpb-cta {font-size: 13px;}
    .rpn-count-box {padding: 4px 2px;}
    .rpn-count-box b {font-size: 14px;}
    .rpn-timer-label {font-size: 11px;}
    .rpn-info {font-size: 12px; gap: 10px;}
}
@media (max-width: 380px) {
    .estim-status {font-size: 14px;}
    .rpb-eligible-pill {padding: 13px 15px;}
    .rpb-cta {font-size: 12px;}
    .rpn-extra {padding: 10px;}
    .rpn-info {font-size: 11px; gap: 5px;}

}