/* ==========================================================
   SIMULATEUR v4 — Glass 3D premium
   ========================================================== */

/* ==========================================================
   HERO-SIM (accueil avec simulateur intégré)
   Les 2 colonnes sont alignées en hauteur (stretch).
   Le simulateur est compacté pour rester dans la zone visible.
   ========================================================== */
.hero-sim{
  padding:clamp(40px, 6vw, 80px) 20px;
  position:relative;
  overflow:hidden;
}
.hero-sim::before{
  content:"";position:absolute;top:-200px;right:-200px;
  width:500px;height:500px;
  background:radial-gradient(circle, rgba(214,106,63,.18), transparent 70%);
  border-radius:50%;pointer-events:none;filter:blur(20px);
}
.hero-sim::after{
  content:"";position:absolute;bottom:-150px;left:-150px;
  width:400px;height:400px;
  background:radial-gradient(circle, rgba(156,175,110,.15), transparent 70%);
  border-radius:50%;pointer-events:none;filter:blur(20px);
}
.hero-sim-inner{
  max-width:1320px;margin:auto;position:relative;z-index:1;
  display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px, 5vw, 60px);
  align-items:start;
}
.hero-sim-text{display:flex;flex-direction:column}
.hero-sim .sim-embed-wrap{display:flex;flex-direction:column;width:100%;min-width:0}
.hero-sim .sim-embed-wrap > *{width:100%;min-width:0}
.hero-sim-text .pill{
  display:inline-flex;align-items:center;gap:6px;
  background:rgba(255,255,255,.75);backdrop-filter:blur(14px);
  border:1px solid rgba(214,106,63,.2);color:var(--terracotta);
  padding:8px 18px;border-radius:999px;font-size:13px;font-weight:700;
  margin-bottom:22px;box-shadow:0 4px 20px rgba(184,52,28,.08);
}
.hero-sim-text h1{
  font-size:clamp(34px, 6vw, 60px);
  color:var(--vermillon);margin-bottom:16px;line-height:1.05;
  letter-spacing:-1.5px;
}
.hero-sim-text h1 em{font-style:italic;color:var(--terracotta);font-weight:500}
.hero-sim-text h1 .big{
  display:inline-block;
  background:linear-gradient(135deg, var(--terracotta), var(--vermillon));
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  font-weight:800;
  filter:drop-shadow(0 4px 12px rgba(184,52,28,.25));
}
.hero-sim-text p.lead{
  font-size:clamp(16px, 2vw, 19px);
  color:var(--earth);margin-bottom:28px;max-width:540px;line-height:1.55;
}
.hero-sim-benefits{
  display:grid;grid-template-columns:1fr 1fr;gap:12px 24px;
  margin-bottom:30px;
}
.hero-sim-benefits .b{
  display:flex;align-items:center;gap:10px;
  color:var(--earth);font-size:14.5px;font-weight:600;
}
.hero-sim-benefits .check{
  width:24px;height:24px;flex-shrink:0;
  background:linear-gradient(135deg, var(--leaf), var(--forest));
  color:#fff;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;
  box-shadow:0 3px 10px rgba(92,122,78,.35);
}

/* Badge Effy 5/5 */
.effy-badge{
  display:inline-flex;align-items:center;gap:14px;
  background:linear-gradient(135deg, #fff 0%, #FFF7E8 100%);
  border:2px solid #F59E0B;
  padding:14px 22px;border-radius:16px;
  text-decoration:none;color:var(--earth);
  margin-top:22px;
  box-shadow:0 8px 24px rgba(245,158,11,.2), 0 2px 4px rgba(0,0,0,.05);
  transition:all .25s cubic-bezier(.4,0,.2,1);
  max-width:380px;
}
.effy-badge:hover{
  transform:translateY(-3px);
  box-shadow:0 14px 34px rgba(245,158,11,.3), 0 4px 8px rgba(0,0,0,.08);
  border-color:#D97706;
}
.effy-stars{
  color:#F59E0B;font-size:20px;letter-spacing:2px;
  text-shadow:0 1px 2px rgba(245,158,11,.3);flex-shrink:0;
}
.effy-text{display:flex;flex-direction:column;line-height:1.2;flex:1}
.effy-text strong{
  font-family:'Fraunces',serif;font-size:20px;color:var(--vermillon);font-weight:700;
}
.effy-text span{font-size:13px;color:var(--slate);margin-top:3px}
.effy-text span b{color:#D97706;font-weight:700}
.effy-arrow{color:var(--terracotta);font-size:20px;font-weight:700;flex-shrink:0;transition:transform .2s}
.effy-badge:hover .effy-arrow{transform:translateX(4px)}

@media(max-width:980px){
  .hero-sim-inner{grid-template-columns:1fr;gap:36px}
  .hero-sim-text{text-align:center}
  .hero-sim-text p.lead{margin-left:auto;margin-right:auto}
  .hero-sim-benefits{max-width:480px;margin-left:auto;margin-right:auto}
  .effy-badge{margin-left:auto;margin-right:auto}
}
@media(max-width:600px){
  .hero-sim-benefits{grid-template-columns:1fr;gap:10px}
  .hero-sim-text h1{font-size:34px;letter-spacing:-.8px}
}

/* ==========================================================
   Page simulateur standalone
   ========================================================== */
.sim-page{
  padding:clamp(30px, 5vw, 60px) 16px clamp(60px, 10vw, 100px);
  min-height:calc(100vh - 80px);
}
.sim-page-inner{max-width:1000px;margin:auto}
.sim-page-head{text-align:center;margin-bottom:40px;padding:0 8px}
.sim-page-head .pill{
  display:inline-flex;align-items:center;gap:6px;
  background:rgba(255,255,255,.8);backdrop-filter:blur(14px);
  border:1px solid rgba(214,106,63,.2);color:var(--terracotta);
  padding:8px 16px;border-radius:999px;font-size:13px;font-weight:700;
  margin-bottom:20px;
}
.sim-page-head h1{
  font-size:clamp(32px, 5vw, 52px);
  color:var(--vermillon);margin-bottom:14px;letter-spacing:-1px;
}
.sim-page-head h1 em{font-style:italic;color:var(--terracotta);font-weight:500}
.sim-page-head p{font-size:clamp(15px, 2vw, 18px);color:var(--slate);max-width:560px;margin:auto;line-height:1.6}

/* ==========================================================
   Container principal glass (page standalone simulateur.php)
   ========================================================== */
.sim-wrap{
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(24px) saturate(1.3);
  -webkit-backdrop-filter:blur(24px) saturate(1.3);
  border-radius:28px;
  padding:clamp(24px, 4vw, 48px);
  box-shadow:
    0 40px 80px -20px rgba(184,52,28,.2),
    0 12px 30px -10px rgba(0,0,0,.1),
    inset 0 1px 0 rgba(255,255,255,.8);
  border:1px solid rgba(255,255,255,.75);
  max-width:880px;margin:auto;position:relative;overflow:hidden;
}

/* ==========================================================
   MODE EMBED — compacté pour le hero (même hauteur que le text)
   ========================================================== */
.hero-sim .sim-wrap{
  padding:24px;
  border-radius:24px;
  max-width:none;width:100%;
  display:flex;flex-direction:column;
  /* Hauteur auto mais contenu compacté */
  background:rgba(255,255,255,.88);
  box-shadow:
    0 30px 60px -18px rgba(184,52,28,.22),
    0 10px 24px -8px rgba(0,0,0,.1),
    inset 0 1px 0 rgba(255,255,255,.8);
}
.hero-sim .sim-progress{margin-bottom:20px}
.hero-sim .sim-progress-bar{height:6px}
.hero-sim .psi span{width:28px;height:28px;font-size:12px}
.hero-sim .psi small{font-size:9px;letter-spacing:.8px}
.hero-sim .step-head{margin-bottom:18px}
.hero-sim .step-head h2{font-size:clamp(20px, 2.4vw, 26px);margin-bottom:6px}
.hero-sim .step-head p{font-size:13px}
.hero-sim .step-eyebrow{font-size:10px;padding:3px 10px;margin-bottom:10px}
.hero-sim .choice-grid{gap:8px;margin-bottom:14px}
.hero-sim .choice-card{padding:12px 10px;gap:6px;min-height:auto}
.hero-sim .choice-icon{font-size:22px}
.hero-sim .choice-label{font-size:12px}
.hero-sim .choice-label small{font-size:10px}
.hero-sim .choice-grid.compact .choice-card{padding:10px 8px}
.hero-sim .choice-grid.compact .choice-icon{font-size:18px}
.hero-sim .choice-grid.compact .choice-label{font-size:11px}
.hero-sim .sub-question,
.hero-sim .question-block{margin-top:16px}
.hero-sim .sub-question h3,
.hero-sim .question-block h3{font-size:14px;margin-bottom:8px}
.hero-sim .form-group{margin-bottom:12px}
.hero-sim .form-group label{font-size:13px;margin-bottom:4px}
.hero-sim .form-group input,
.hero-sim .form-group select,
.hero-sim .form-group textarea{padding:10px 12px;font-size:14px;border-radius:12px}
.hero-sim .form-group small{font-size:11px}
.hero-sim .form-row{gap:10px}
.hero-sim .number-picker{padding:4px 16px 4px 4px;gap:10px}
.hero-sim .number-picker input{width:54px;font-size:18px;padding:6px}
.hero-sim .number-picker span{font-size:12px}
.hero-sim .lead-gate{padding:14px;gap:10px;margin-bottom:16px}
.hero-sim .lead-gate-ico{font-size:24px}
.hero-sim .lead-gate strong{font-size:13px}
.hero-sim .lead-gate p{font-size:11.5px}
.hero-sim .checkbox{font-size:12px;padding:6px;margin-bottom:6px}
.hero-sim .checkbox input{width:16px;height:16px}
.hero-sim .step-nav{margin-top:20px;padding-top:16px}
.hero-sim .step-nav .btn{padding:12px 20px;font-size:14px}
.hero-sim .btn-reveal{font-size:14px}
.hero-sim .sim-errors{padding:12px 14px;font-size:13px;border-radius:12px}

/* Mode embed : résultat compact */
.hero-sim .result-confetti{font-size:42px}
.hero-sim .result-hello{font-size:22px}
.hero-sim .result-label{font-size:14px;margin-bottom:10px}
.hero-sim .result-counter{font-size:clamp(44px, 8vw, 72px);letter-spacing:-2px}
.hero-sim .cat-badge{font-size:11px;padding:4px 12px;margin:10px 0}
.hero-sim .result-breakdown{margin:18px 0;gap:8px}
.hero-sim .break-card{padding:14px 16px;min-width:100px}
.hero-sim .break-label{font-size:10px}
.hero-sim .break-val{font-size:20px}
.hero-sim .break-plus{font-size:22px}
.hero-sim .result-next{padding:20px 18px;margin-top:18px}
.hero-sim .result-next h3{font-size:18px}
.hero-sim .result-next p{font-size:13px;margin-bottom:14px}
.hero-sim .result-ctas .btn{padding:12px 20px;font-size:13px}
.hero-sim .result-fineprint{font-size:11px;margin-top:14px}
.hero-sim .result-note{padding:10px 14px;font-size:12px}
.sim-wrap::before{
  content:"";position:absolute;top:-140px;right:-140px;
  width:320px;height:320px;
  background:radial-gradient(circle, var(--peach), transparent 70%);
  border-radius:50%;z-index:0;pointer-events:none;
}
.sim-wrap::after{
  content:"";position:absolute;bottom:-100px;left:-100px;
  width:240px;height:240px;
  background:radial-gradient(circle, rgba(156,175,110,.5), transparent 70%);
  border-radius:50%;z-index:0;pointer-events:none;
}
.sim-wrap > *{position:relative;z-index:1}

/* Progress bar */
.sim-progress{margin-bottom:36px}
.sim-progress-bar{
  height:8px;background:rgba(200,180,160,.25);
  border-radius:999px;overflow:hidden;position:relative;margin-bottom:20px;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.06);
}
.sim-progress-bar::after{
  content:"";position:absolute;left:0;top:0;height:100%;
  background:linear-gradient(90deg, #7FB069, #5C7A4E);
  border-radius:999px;width:25%;
  transition:width .6s cubic-bezier(.4,0,.2,1);
  box-shadow:0 0 12px rgba(127,176,105,.5);
}
.sim-progress-bar[data-step="2"]::after{width:50%}
.sim-progress-bar[data-step="3"]::after{width:75%}
.sim-progress-bar[data-step="4"]::after{width:100%}
.sim-progress-steps{display:flex;justify-content:space-between;gap:4px}
.psi{display:flex;flex-direction:column;align-items:center;gap:6px;opacity:.4;transition:all .4s;flex:1;text-align:center}
.psi.active{opacity:1;transform:translateY(-2px)}
.psi.done{opacity:.85}
.psi span{
  width:36px;height:36px;
  background:rgba(200,180,160,.3);color:var(--slate);
  border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:14px;transition:all .4s;
  font-family:'Fraunces',serif;
}
.psi.active span{
  background:linear-gradient(135deg, #7FB069, #5C7A4E);
  color:#fff;
  box-shadow:0 0 0 5px rgba(127,176,105,.2), 0 8px 20px -4px rgba(127,176,105,.5);
  transform:scale(1.12);
}
.psi.done span{background:var(--leaf);color:#fff;box-shadow:0 4px 12px rgba(156,175,110,.4)}
.psi.done span::before{content:"✓";font-family:inherit}
.psi.done span > *{display:none}
.psi small{font-size:11px;color:var(--slate);text-transform:uppercase;letter-spacing:1.2px;font-weight:700}

/* Step panels animations */
.sim-step-panel{display:none;animation:slideIn .5s cubic-bezier(.4,0,.2,1)}
.sim-step-panel.active{display:block}
.sim-step-panel.out{animation:slideOut .35s cubic-bezier(.4,0,.2,1) forwards}
@keyframes slideIn{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:translateX(0)}}
@keyframes slideOut{from{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-30px)}}

.step-head{text-align:center;margin-bottom:30px}
.step-eyebrow{
  display:inline-block;background:rgba(214,106,63,.1);color:var(--terracotta);
  padding:5px 14px;border-radius:999px;font-size:12px;font-weight:700;
  letter-spacing:2px;text-transform:uppercase;margin-bottom:14px;
}
.step-head h2{font-size:clamp(24px, 4vw, 34px);color:var(--vermillon);margin-bottom:10px;line-height:1.2;letter-spacing:-.5px}
.step-head h2 em{font-style:italic;color:var(--terracotta);font-weight:500}
.step-head p{color:var(--slate);font-size:15px;max-width:500px;margin:auto;line-height:1.5}

/* Choice cards */
.choice-grid{
  display:grid;grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));
  gap:10px;margin-bottom:20px;
}
.choice-grid.compact{grid-template-columns:repeat(auto-fit, minmax(130px, 1fr))}
.choice-card{
  position:relative;
  background:rgba(255,255,255,.7);
  backdrop-filter:blur(10px);
  border:2px solid rgba(200,180,160,.3);
  border-radius:16px;padding:18px 14px;
  cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);
  display:flex;flex-direction:column;align-items:center;gap:8px;
  text-align:center;overflow:hidden;
  box-shadow:0 2px 6px rgba(74,56,40,.04);
}
.choice-card::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(135deg, rgba(214,106,63,.06), rgba(184,52,28,.06));
  opacity:0;transition:opacity .25s;
}
.choice-card:hover{
  border-color:var(--camel);transform:translateY(-3px);
  box-shadow:0 10px 25px -8px rgba(184,52,28,.18);
}
.choice-card:hover::before{opacity:1}
.choice-card input{position:absolute;opacity:0;pointer-events:none}
.choice-card.selected{
  border-color:var(--terracotta);
  background:linear-gradient(135deg, #fff, var(--peach));
  box-shadow:0 10px 28px -8px rgba(214,106,63,.35), inset 0 0 0 1px rgba(214,106,63,.2);
  transform:translateY(-2px);
}
.choice-card.selected::after{
  content:"✓";position:absolute;top:8px;right:8px;
  width:22px;height:22px;
  background:var(--terracotta);color:#fff;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:700;
  box-shadow:0 4px 10px rgba(214,106,63,.5);
}
.choice-icon{
  font-size:32px;line-height:1;
  filter:drop-shadow(0 4px 8px rgba(0,0,0,.1));
  position:relative;z-index:1;
}
.choice-label{font-weight:600;color:var(--earth);font-size:14px;line-height:1.3;position:relative;z-index:1}
.choice-label small{display:block;font-size:11px;color:var(--slate);margin-top:3px;font-weight:500}
.choice-grid.compact .choice-card{padding:14px 12px;gap:6px}
.choice-grid.compact .choice-icon{font-size:24px}
.choice-grid.compact .choice-label{font-size:13px}

.sub-question,.question-block{margin-top:20px}
.sub-question h3,.question-block h3{
  font-family:'Nunito',sans-serif;font-size:14px;color:var(--earth);
  font-weight:700;margin-bottom:8px;
  display:flex;align-items:center;gap:6px;
  letter-spacing:0;
}

/* Number picker */
.number-picker{
  display:inline-flex;align-items:center;gap:14px;
  background:#fff;padding:8px 22px 8px 8px;
  border-radius:999px;border:2px solid rgba(200,180,160,.35);
  transition:all .2s;
  box-shadow:inset 0 1px 3px rgba(0,0,0,.04);
}
.number-picker:focus-within{
  border-color:var(--terracotta);
  box-shadow:0 0 0 4px rgba(214,106,63,.12), inset 0 1px 3px rgba(0,0,0,.04);
}
.number-picker input{
  width:70px;padding:10px;border:none;font-size:22px;font-weight:700;
  color:var(--vermillon);background:transparent;text-align:center;
  font-family:'Fraunces',serif;
}
.number-picker input:focus{outline:none}
.number-picker span{color:var(--slate);font-size:14px;font-weight:600}

/* Lead gate final */
.lead-gate{
  background:linear-gradient(135deg, #E8F5EF, rgba(255,255,255,.9));
  border:2px dashed #7FB069;
  padding:22px;border-radius:18px;margin-bottom:26px;
  display:flex;gap:14px;align-items:flex-start;
  box-shadow:0 6px 18px rgba(127,176,105,.15);
}
.lead-gate-ico{font-size:32px;line-height:1;flex-shrink:0}
.lead-gate strong{display:block;color:#4A6B3D;margin-bottom:4px;font-size:15px;font-weight:700}
.lead-gate p{color:var(--earth);font-size:13px;line-height:1.5;margin:0}

/* Step navigation */
.step-nav{
  display:flex;justify-content:space-between;gap:12px;
  margin-top:32px;padding-top:24px;
  border-top:1px solid rgba(200,180,160,.3);
}
.step-nav > *{flex:1}
.step-nav > *:only-child{margin-left:auto;flex:0 1 auto}
.btn-reveal{
  animation:pulseBtn 2s ease-in-out infinite;
}
@keyframes pulseBtn{
  0%,100%{box-shadow:0 4px 0 var(--vermillon-dark), 0 10px 25px -6px rgba(214,106,63,.45)}
  50%{box-shadow:0 4px 0 var(--vermillon-dark), 0 16px 36px -6px rgba(214,106,63,.65)}
}

.sim-errors{
  background:linear-gradient(135deg, #FEE2E2, #FECACA);
  border:2px solid #F87171;border-radius:14px;
  padding:16px 20px;margin-bottom:24px;
  color:#B91C1C;font-size:14px;font-weight:600;
}
.sim-errors ul{margin:6px 0 0;padding-left:24px;font-weight:500}

.honeypot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ==========================================================
   RÉSULTAT après soumission
   ========================================================== */
.sim-result{text-align:center;animation:fadeInUp .8s cubic-bezier(.4,0,.2,1)}
@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}

.result-confetti{font-size:56px;animation:bounceIn 1s cubic-bezier(.68,-.55,.27,1.55);margin-bottom:8px}
@keyframes bounceIn{
  0%{opacity:0;transform:scale(0) rotate(-180deg)}
  70%{transform:scale(1.2) rotate(10deg)}
  100%{opacity:1;transform:scale(1) rotate(0)}
}
.result-hello{font-family:'Fraunces',serif;font-size:26px;color:var(--terracotta);font-weight:600;margin-bottom:4px}
.result-label{color:var(--slate);font-size:16px;margin-bottom:16px}
.result-counter{
  font-family:'Fraunces',serif;
  font-size:clamp(56px, 13vw, 108px);
  font-weight:700;
  background:linear-gradient(135deg, var(--terracotta), var(--vermillon));
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  line-height:1;margin-bottom:8px;letter-spacing:-3px;
  filter:drop-shadow(0 10px 28px rgba(184,52,28,.25));
}
.result-counter .euro{font-size:.5em;color:var(--vermillon);-webkit-text-fill-color:var(--vermillon);margin-left:6px}

.cat-badge{
  display:inline-block;padding:6px 16px;border-radius:999px;
  font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:2px;
  margin:16px 0;
}
.cat-bleu{background:#DBEAFE;color:#1E40AF}
.cat-jaune{background:#FEF3C7;color:#B45309}
.cat-violet{background:#EDE9FE;color:#6B21A8}
.cat-rose{background:#FCE7F3;color:#BE185D}

.result-breakdown{
  display:flex;align-items:center;justify-content:center;gap:10px;
  margin:30px 0;flex-wrap:wrap;
}
.break-card{
  background:#fff;border:1px solid rgba(200,180,160,.3);
  border-radius:18px;padding:20px 22px;
  min-width:130px;flex:1;max-width:180px;
  box-shadow:0 6px 18px rgba(184,52,28,.08);
  transition:transform .2s;
}
.break-card:hover{transform:translateY(-3px)}
.break-label{font-size:11px;color:var(--slate);text-transform:uppercase;letter-spacing:1.2px;font-weight:700;margin-bottom:6px}
.break-val{font-family:'Fraunces',serif;font-size:24px;color:var(--vermillon);font-weight:700}
.break-plus{font-family:'Fraunces',serif;font-size:30px;color:var(--terracotta);font-weight:300;flex-shrink:0}

.result-note{
  background:rgba(254,243,199,.7);
  border-left:3px solid #F59E0B;
  padding:12px 18px;border-radius:12px;
  color:#78350F;font-size:13px;text-align:left;
  margin:20px 0;
}

.result-next{
  background:linear-gradient(135deg, var(--peach), rgba(255,255,255,.8));
  border-radius:20px;padding:32px 24px;margin-top:28px;
  box-shadow:0 8px 24px rgba(214,106,63,.1);
}
.result-next h3{font-family:'Fraunces',serif;font-size:24px;color:var(--vermillon);margin-bottom:6px;font-weight:600}
.result-next p{color:var(--slate);margin-bottom:22px;font-size:14px}
.result-ctas{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.result-ctas .btn{flex:1;min-width:200px;max-width:300px}

.result-fineprint{color:var(--slate);font-size:12px;margin-top:22px;max-width:500px;margin-left:auto;margin-right:auto;line-height:1.5}

/* ==========================================================
   RESPONSIVE
   ========================================================== */
@media(max-width:768px){
  .sim-wrap{padding:22px 18px;border-radius:22px}
  .sim-wrap::before{width:180px;height:180px}
  .sim-wrap::after{width:140px;height:140px}
  .psi small{display:none}
  .psi.active small{display:block;font-size:10px}
  .psi span{width:32px;height:32px;font-size:13px}
  .choice-grid,.choice-grid.compact{grid-template-columns:repeat(2,1fr);gap:8px}
  .choice-card{padding:14px 10px}
  .choice-icon{font-size:26px}
  .choice-label{font-size:12px}
  .form-row{grid-template-columns:1fr;gap:10px}
  .number-picker{padding:6px 18px 6px 6px}
  .number-picker input{width:60px;font-size:20px;padding:8px}
  .lead-gate{padding:16px;gap:10px}
  .lead-gate-ico{font-size:26px}
  .step-nav{flex-direction:column-reverse;gap:10px}
  .step-nav > *{width:100%;flex:none}
  .result-breakdown{flex-direction:column;gap:12px}
  .result-breakdown > *{width:100%;max-width:none}
  .break-plus{transform:rotate(90deg)}
  .result-ctas{flex-direction:column}
  .result-ctas .btn{min-width:0;max-width:none;width:100%}
}
@media(max-width:400px){
  .choice-grid,.choice-grid.compact{grid-template-columns:1fr}
}

@media(min-width:769px){
  .choice-card{min-height:110px}
  .choice-grid.compact .choice-card{min-height:80px}
  .choice-card:hover .choice-icon{transform:scale(1.1) translateY(-2px);transition:transform .3s}
  .step-nav > *{flex:0 0 auto}
  .step-nav .sim-prev{margin-right:auto}
  .step-nav .sim-next,.step-nav .btn-reveal{margin-left:auto;min-width:220px}
}

/* ==========================================================
   HERO-SIM : Responsive (empilement mobile)
   ========================================================== */
@media(max-width:980px){
  .hero-sim-inner{grid-template-columns:1fr;gap:36px;align-items:stretch}
  .hero-sim-text{text-align:center;align-items:center}
  .hero-sim-text p.lead{margin-left:auto;margin-right:auto}
  .hero-sim-benefits{max-width:480px}
  .effy-badge{margin-left:auto;margin-right:auto}
  .hero-sim .sim-wrap{padding:28px}
  /* On relâche les tailles en mobile pour plus de confort */
  .hero-sim .step-head h2{font-size:22px}
  .hero-sim .choice-icon{font-size:26px}
  .hero-sim .choice-label{font-size:13px}
  .hero-sim .form-group input,
  .hero-sim .form-group select,
  .hero-sim .form-group textarea{padding:12px 14px;font-size:15px}
}
@media(max-width:600px){
  .hero-sim{padding:28px 14px}
  .hero-sim-benefits{grid-template-columns:1fr;gap:10px}
  .hero-sim-text h1{font-size:32px;letter-spacing:-.6px}
  .hero-sim .sim-wrap{padding:20px 16px;border-radius:20px}
}

/* ==========================================================
   Micro-interactions : brillance au hover sur les cards
   ========================================================== */
.choice-card,.service-card,.proof-card{position:relative}
.choice-card::after,.service-card::after{pointer-events:none}

/* Sheen effect subtil sur boutons primaires */
.btn-primary{position:relative;overflow:hidden}
.btn-primary::after{
  content:"";position:absolute;top:0;left:-100%;
  width:60%;height:100%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.25), transparent);
  transform:skewX(-20deg);transition:left .6s cubic-bezier(.4,0,.2,1);
}
.btn-primary:hover::after{left:120%}

/* ==========================================================
   SPLASH SCREEN — écran d'intro avant le simulateur
   ========================================================== */
.sim-splash{
  text-align:center;
  padding:clamp(20px, 4vw, 40px) clamp(16px, 3vw, 28px);
  animation:splashIn .6s cubic-bezier(.34,1.56,.64,1);
  position:relative;
}
.sim-splash.splash-out{animation:splashOut .4s cubic-bezier(.4,0,.2,1) forwards}
@keyframes splashIn{
  from{opacity:0;transform:scale(.9) translateY(20px)}
  to{opacity:1;transform:scale(1) translateY(0)}
}
@keyframes splashOut{
  from{opacity:1;transform:scale(1)}
  to{opacity:0;transform:scale(.92);filter:blur(4px)}
}

.splash-icons{
  display:flex;justify-content:center;gap:24px;
  margin-bottom:20px;height:80px;align-items:center;
}
.splash-icon{
  font-size:48px;line-height:1;
  filter:drop-shadow(0 6px 14px rgba(74,56,40,.18));
  animation:floatBob 3s ease-in-out infinite;
}
.splash-icon-1{animation-delay:0s}
.splash-icon-2{animation-delay:.3s;font-size:56px}
.splash-icon-3{animation-delay:.6s}
@keyframes floatBob{
  0%,100%{transform:translateY(0) rotate(-3deg)}
  50%{transform:translateY(-10px) rotate(3deg)}
}

.splash-pill{
  display:inline-flex;align-items:center;gap:6px;
  background:linear-gradient(135deg, #E8F5EF, #DFEBD6);
  border:1px solid rgba(127,176,105,.4);
  color:var(--forest);
  padding:7px 16px;border-radius:999px;
  font-size:13px;font-weight:700;
  margin-bottom:18px;
  box-shadow:0 4px 14px rgba(127,176,105,.2);
  animation:pillPulse 2.2s ease-in-out infinite;
}
@keyframes pillPulse{
  0%,100%{box-shadow:0 4px 14px rgba(127,176,105,.2)}
  50%{box-shadow:0 6px 20px rgba(127,176,105,.4)}
}

.sim-splash h2{
  font-family:'Fraunces',serif;
  font-size:clamp(24px, 3.5vw, 34px);
  color:var(--vermillon);
  margin-bottom:12px;line-height:1.15;letter-spacing:-.5px;
}
.sim-splash h2 em{font-style:italic;color:var(--terracotta);font-weight:500}
.sim-splash p{
  color:var(--slate);font-size:15px;line-height:1.55;
  max-width:460px;margin:0 auto 26px;
}
.sim-splash p strong{
  color:var(--vermillon);font-weight:800;
  background:linear-gradient(135deg, var(--terracotta), var(--vermillon));
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
}

.btn-splash-start{
  font-size:17px !important;padding:18px 40px !important;
  display:inline-flex !important;align-items:center;gap:10px;
  position:relative;
  animation:btnBreathe 2.4s ease-in-out infinite;
}
@keyframes btnBreathe{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.04)}
}
.btn-splash-start:hover{animation:none}
.splash-arrow{
  display:inline-block;transition:transform .3s var(--ease);
  font-size:20px;
}
.btn-splash-start:hover .splash-arrow{transform:translateX(6px)}

.splash-trust{
  display:flex;justify-content:center;gap:22px;flex-wrap:wrap;
  margin-top:22px;font-size:12.5px;color:var(--slate);font-weight:600;
}
.splash-trust span{display:inline-flex;align-items:center;gap:4px}

.sim-fade-in{animation:fadeInForm .5s ease both}
@keyframes fadeInForm{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}

/* Mode embed : splash compacté */
.hero-sim .sim-splash{padding:14px 8px}
.hero-sim .splash-icons{height:64px;gap:18px;margin-bottom:14px}
.hero-sim .splash-icon{font-size:38px}
.hero-sim .splash-icon-2{font-size:44px}
.hero-sim .splash-pill{font-size:11px;padding:5px 12px;margin-bottom:12px}
.hero-sim .sim-splash h2{font-size:22px;margin-bottom:8px}
.hero-sim .sim-splash p{font-size:13px;margin-bottom:18px}
.hero-sim .btn-splash-start{font-size:15px !important;padding:14px 28px !important}
.hero-sim .splash-trust{gap:14px;margin-top:16px;font-size:11.5px}

/* Responsive mobile splash */
@media(max-width:560px){
  .splash-icons{gap:16px;height:64px}
  .splash-icon{font-size:36px}
  .splash-icon-2{font-size:42px}
  .sim-splash h2{font-size:22px}
  .sim-splash p{font-size:14px}
  .btn-splash-start{font-size:15px !important;padding:15px 28px !important}
  .splash-trust{gap:14px;font-size:11.5px}
}