/* ==========================================================================
   KELTO, consolidation 2.0 (test à part, nov. 2026)
   Chargée APRÈS kelto.css : on garde ses jetons, ses boutons et tout le
   questionnaire (moteur kelto-quiz.js), et on redessine le reste de la page.

   Mécaniques reprises des pages qui convertissent (Gestion Dettes, MPM 2.0) :
   chiffre de friction dans le titre, questionnaire en 9 clics avec arrêt
   locataire, bande de confiance, avant / après, quatre étapes, bande 19,99 %,
   pourquoi, situations, FAQ, CTA final, barre collante.
   Look volontairement différent des trois autres pages : héros bleu nuit en
   deux panneaux, carte du questionnaire qui déborde, filets cyan, chiffres
   énormes, aucune photo de couverture.
   ========================================================================== */

.k2{--glow:radial-gradient(60% 70% at 85% 20%,rgba(31,173,219,.28),transparent 60%)}
.k2 h2{font-size:clamp(26px,4.2vw,38px);font-weight:800}
.k2 .eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--brand)}
.k2 .eyebrow::before{content:"";width:22px;height:3px;border-radius:2px;background:var(--cyan)}
.k2 .lead{font-size:17px;color:var(--body);max-width:60ch}
.k2 section{padding:56px 0}
@media(min-width:900px){.k2 section{padding:80px 0}}

/* ---------- Barre du haut ---------- */
.k2 .top{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--border)}
.k2 .top .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;height:62px}
.k2 .top img{height:34px;width:auto}
.k2 .top .tel{display:none;color:var(--ink);text-decoration:none;font-weight:600;font-size:14.5px}
.k2 .top .btn{padding:11px 18px;font-size:14px}
@media(min-width:700px){.k2 .top .tel{display:inline-flex;align-items:center;gap:7px}.k2 .top img{height:38px}}

/* ---------- Héros bleu nuit en deux panneaux ---------- */
.k2 .hero{background:var(--navy);color:#fff;padding:34px 0 0;position:relative;overflow:hidden}
.k2 .hero::before{content:"";position:absolute;inset:0;background:var(--glow);pointer-events:none}
.k2 .hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:120px;background:var(--surface);display:none}
.k2 .k2-grid{display:grid;gap:22px;position:relative}
.k2 .hero .pill{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:7px 13px;font-size:13px;font-weight:600;color:#dbe7f3}
.k2 .hero .pill i{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 4px rgba(31,173,219,.25)}
.k2 .hero h1{color:#fff;font-size:clamp(31px,6.2vw,54px);font-weight:800;line-height:1.06;letter-spacing:-.03em;margin-top:16px}
.k2 .hero h1 em{font-style:normal;color:var(--cyan);white-space:nowrap}
.k2 .hero .lead{color:#c9d8e8;margin-top:14px;font-size:16.5px}
.k2 .hero .checks{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:10px}
.k2 .hero .checks li{display:flex;gap:11px;align-items:flex-start;font-size:15px;color:#e6eef7}
.k2 .hero .checks svg{flex:none;width:22px;height:22px;color:var(--cyan);background:rgba(31,173,219,.14);border-radius:50%;padding:4px}
.k2 .hero .stars{display:flex;align-items:center;gap:10px;margin-top:22px;font-size:13.5px;color:#bcd3ea}
.k2 .hero .stars b{color:#fff;font-size:15px}
.k2 .hero .stars svg{width:16px;height:16px;fill:#f5b800}
.k2 .hero-quiz{margin:0 -4px 0}
.k2 .quiz{border:0;box-shadow:0 30px 60px -20px rgba(0,0,0,.5)}
.k2 .quiz-head{background:var(--brand);margin:-22px -20px 0;padding:13px 20px}
@media(min-width:600px){.k2 .quiz-head{margin:-28px -28px 0;padding:15px 28px}}
.k2 .quiz-bar{background:#dbe7f3}
.k2 .hero .foot-band{margin-top:28px;background:var(--surface);color:var(--body);padding:0}
@media(max-width:999px){
  .k2 .k2-grid > *{order:3}
  .k2 .k2-grid .hero-copy{order:1}
  .k2 .k2-grid .hero-quiz{order:2}
  .k2 .hero .checks,.k2 .hero .stars{display:none}
  .k2 .hero .copy-after{order:3;color:#c9d8e8}
  .k2 .hero .copy-after .checks,.k2 .hero .copy-after .stars{display:grid}
  .k2 .hero .copy-after .stars{display:flex}
  .k2 .hero{padding-bottom:30px}
}
@media(min-width:1000px){
  .k2 .hero{padding:56px 0 72px}
  .k2 .k2-grid{grid-template-columns:1.05fr .95fr;gap:64px;align-items:center}
  .k2 .copy-after{display:none}
  .k2 .hero-quiz{position:relative}
}

/* ---------- Bande de confiance ---------- */
.k2 .trust{background:#fff;border-bottom:1px solid var(--border);padding:22px 0}
.k2 .trust .wrap{display:grid;grid-template-columns:1fr 1fr;gap:18px 12px}
@media(min-width:800px){.k2 .trust .wrap{grid-template-columns:repeat(4,1fr)}}
.k2 .trust div{display:flex;gap:12px;align-items:center}
.k2 .trust b{display:block;font-size:22px;color:var(--ink);letter-spacing:-.03em;line-height:1.05;font-variant-numeric:tabular-nums}
.k2 .trust span{font-size:13px;color:var(--muted);line-height:1.3}
.k2 .trust svg{flex:none;width:38px;height:38px;color:var(--brand);background:var(--brand-50);border-radius:10px;padding:8px}

/* ---------- Avant / après ---------- */
.k2 .ba{background:var(--surface)}
.k2 .ba-grid{display:grid;gap:18px;margin-top:30px}
@media(min-width:860px){.k2 .ba-grid{grid-template-columns:1fr auto 1fr;align-items:stretch}}
.k2 .ba-card{background:#fff;border:1px solid var(--border);border-radius:16px;padding:22px;box-shadow:var(--shadow)}
.k2 .ba-card h3{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);display:flex;justify-content:space-between;align-items:center}
.k2 .ba-card h3 small{font-weight:600;letter-spacing:0;text-transform:none;font-size:12px;background:var(--surface);border-radius:999px;padding:3px 9px}
.k2 .ba-card ul{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:8px}
.k2 .ba-card li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 12px;border:1px solid var(--border);border-radius:10px;font-size:14.5px;color:var(--ink)}
.k2 .ba-card li span{display:flex;align-items:center;gap:9px}
.k2 .ba-card li svg{width:18px;height:18px;color:var(--muted)}
.k2 .ba-card li b{font-variant-numeric:tabular-nums;color:#b54708}
.k2 .ba-card .tot{display:flex;justify-content:space-between;margin-top:12px;padding-top:12px;border-top:1px dashed var(--border);font-size:14px;color:var(--muted)}
.k2 .ba-card .tot b{color:var(--ink);font-size:18px}
.k2 .ba-arrow{display:grid;place-items:center;color:var(--cyan)}
.k2 .ba-arrow svg{width:44px;height:44px;transform:rotate(90deg)}
@media(min-width:860px){.k2 .ba-arrow svg{transform:none}}
.k2 .ba-card.after{background:var(--brand);border-color:var(--brand);color:#fff;position:relative;overflow:hidden}
.k2 .ba-card.after::before{content:"";position:absolute;inset:0;background:var(--glow)}
.k2 .ba-card.after h3{color:#bcd3ea}
.k2 .ba-card.after h3 small{background:rgba(255,255,255,.12);color:#fff}
.k2 .ba-card.after .one{position:relative;margin-top:16px;display:grid;gap:4px}
.k2 .ba-card.after .one b{font-size:clamp(40px,7vw,58px);letter-spacing:-.04em;line-height:1;color:#fff}
.k2 .ba-card.after .one span{font-size:15px;color:#dbe7f3}
.k2 .ba-card.after ul{position:relative}
.k2 .ba-card.after li{border-color:rgba(255,255,255,.18);color:#fff;background:rgba(255,255,255,.06)}
.k2 .ba-card.after li svg{color:var(--cyan)}
.k2 .ba-note{margin-top:16px;font-size:13px;color:var(--muted)}
.js .k2 .ba-card li{opacity:0;transform:translateY(8px);transition:opacity .5s ease,transform .5s ease}
.js .k2 .ba.go .ba-card li{opacity:1;transform:none}
.js .k2 .ba.go .ba-card li:nth-child(2){transition-delay:.08s}.js .k2 .ba.go .ba-card li:nth-child(3){transition-delay:.16s}
.js .k2 .ba.go .ba-card li:nth-child(4){transition-delay:.24s}.js .k2 .ba.go .ba-card li:nth-child(5){transition-delay:.32s}

/* ---------- Quatre étapes ---------- */
.k2 .steps{display:grid;gap:14px;margin-top:30px;counter-reset:st}
@media(min-width:800px){.k2 .steps{grid-template-columns:repeat(4,1fr)}}
.k2 .step{position:relative;border:1px solid var(--border);border-radius:14px;padding:22px 20px 20px;background:#fff}
.k2 .step::before{counter-increment:st;content:counter(st,decimal-leading-zero);font-size:40px;font-weight:800;letter-spacing:-.04em;color:var(--cyan);line-height:1;display:block}
.k2 .step h3{font-size:17px;margin-top:10px}
.k2 .step p{font-size:14.5px;margin-top:6px}
.k2 .step small{display:inline-block;margin-top:10px;font-size:12px;font-weight:600;color:var(--brand);background:var(--brand-50);border-radius:999px;padding:4px 10px}

/* ---------- Bande 19,99 % ---------- */
.k2 .rate{background:var(--navy);color:#fff;position:relative;overflow:hidden}
.k2 .rate::before{content:"";position:absolute;inset:0;background:var(--glow)}
.k2 .rate .wrap{position:relative;display:grid;gap:28px;align-items:center}
@media(min-width:900px){.k2 .rate .wrap{grid-template-columns:auto 1fr}}
.k2 .rate .big{font-size:clamp(84px,16vw,170px);font-weight:800;letter-spacing:-.06em;line-height:.9;position:relative;display:inline-block;white-space:nowrap}
.k2 .rate .big::after{content:"";position:absolute;left:-2%;right:-2%;top:50%;height:.07em;background:#f26b4f;transform:rotate(-6deg);border-radius:4px}
.k2 .rate .big small{font-size:.32em;letter-spacing:-.02em;vertical-align:top;margin-left:.08em}
.k2 .rate h2{color:#fff}
.k2 .rate p{color:#c9d8e8;margin-top:12px;font-size:16.5px;max-width:56ch}
.k2 .rate .btn{margin-top:22px}
.k2 .rate .btn-primary{background:#f26b4f}
.k2 .rate .btn-primary:hover{background:#d9593f}
.k2 .rate .fine{font-size:12.5px;color:#8fa9c4;margin-top:14px}

/* ---------- Pourquoi / situations / avis ---------- */
.k2 .cards{display:grid;gap:14px;margin-top:30px}
@media(min-width:800px){.k2 .cards{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1100px){.k2 .cards.four{grid-template-columns:repeat(4,1fr)}}
.k2 .card{border:1px solid var(--border);border-radius:14px;padding:22px 20px;background:#fff}
.k2 .card svg{width:40px;height:40px;color:var(--brand);background:var(--brand-50);border-radius:11px;padding:9px}
.k2 .card h3{font-size:17px;margin-top:14px}
.k2 .card p{font-size:14.5px;margin-top:6px}
.k2 .why{background:var(--surface)}
.k2 .fit{display:grid;gap:14px;margin-top:30px}
@media(min-width:860px){.k2 .fit{grid-template-columns:1.3fr 1fr}}
.k2 .fit .box{border-radius:14px;padding:22px;border:1px solid var(--border)}
.k2 .fit .box.yes{background:#fff}
.k2 .fit .box.no{background:var(--warn-50);border-color:#f3dcc8}
.k2 .fit h3{font-size:16px;display:flex;align-items:center;gap:9px}
.k2 .fit h3 svg{width:22px;height:22px}
.k2 .fit .yes h3 svg{color:var(--ok)}
.k2 .fit .no h3 svg{color:var(--warn)}
.k2 .fit ul{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:9px}
.k2 .fit li{display:flex;gap:10px;font-size:15px;color:var(--ink);align-items:flex-start}
.k2 .fit li svg{flex:none;width:18px;height:18px;margin-top:3px;color:var(--ok)}
.k2 .fit .no li svg{color:var(--warn)}
.k2 .fit .no p{font-size:14px;margin-top:10px}
.k2 .reviews{background:#fff}
.k2 .review{border:1px solid var(--border);border-radius:14px;padding:22px 20px;background:#fff;display:grid;gap:12px}
.k2 .review .st{display:flex;gap:2px}.k2 .review .st svg{width:15px;height:15px;fill:#f5b800}
.k2 .review p{font-size:15px;color:var(--ink)}
.k2 .review .who{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--muted)}
.k2 .review .who b{width:34px;height:34px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;font-size:14px}
.k2 .review .who span{display:block;color:var(--ink);font-weight:600}
.k2 .rev-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:14px}
.k2 .rev-head a{font-weight:600;font-size:14.5px}

/* ---------- FAQ ---------- */
.k2 .faq{background:var(--surface)}
.k2 .faq-list{margin-top:26px;display:grid;gap:10px;max-width:820px}
.k2 details{background:#fff;border:1px solid var(--border);border-radius:12px;padding:0 18px}
.k2 summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:16px 0;font-weight:600;color:var(--ink);font-size:15.5px}
.k2 summary::-webkit-details-marker{display:none}
.k2 summary svg{flex:none;width:20px;height:20px;color:var(--brand);transition:transform .25s}
.k2 details[open] summary svg{transform:rotate(45deg)}
.k2 details p{padding:0 0 16px;font-size:15px}

/* ---------- Appel final ---------- */
.k2 .final{background:var(--brand);color:#fff;text-align:center;position:relative;overflow:hidden}
.k2 .final::before{content:"";position:absolute;inset:0;background:var(--glow)}
.k2 .final .wrap{position:relative}
.k2 .final h2{color:#fff;max-width:20ch;margin:0 auto}
.k2 .final p{color:#dbe7f3;margin-top:12px}
.k2 .final .btn{margin-top:22px;background:#fff;color:var(--brand)}
.k2 .final .btn:hover{background:#eef4fa}
.k2 .final .tel{display:block;margin-top:16px;color:#dbe7f3;text-decoration:none;font-size:14.5px}
.k2 .final .tel b{color:#fff}

/* ---------- Barre collante : CTA corail, un seul bouton ---------- */
.k2 .sticky-cta .btn-primary{background:#f26b4f}

/* mobile : questionnaire plus haut */
@media(max-width:999px){.k2 .hero h1{margin-bottom:8px}.k2 .hero .lead{font-size:15.5px;margin-top:6px}.k2 .hero .pill{font-size:12px;padding:6px 11px}}