/* Isolation Facile — « Noir premium 3D » : couche motion / 3D / calculateurs. S'ajoute à site.css sans le modifier.
 * Tout ce qui bouge est désactivé sous prefers-reduced-motion (bloc en fin de fichier). */

/* ---------- logo officiel « ISO FACILE » (plus large que l'ancien, ratio 860:320) ---------- */
.hd .logo{width:168px}
.foot .logo{width:150px}
@media(max-width:760px){.hd .logo{width:120px}}

/* ---------- héros : scène 3D (canvas) ---------- */
.panel .in{grid-template-areas:"h3d h3d" "thermo liste";grid-template-columns:auto 1fr}
.panel .in:has(.h3d[hidden]){grid-template-areas:"thermo liste"}
.panel .in .h3d{grid-area:h3d}
.panel .in .thermo{grid-area:thermo}
.panel .in>ul{grid-area:liste}
.h3d{position:relative;width:100%;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:radial-gradient(120% 90% at 50% 110%,rgba(214,58,115,.18),transparent 60%),#0a0a0d;border:1px solid var(--ln)}
.h3d canvas{display:block;width:100%!important;height:100%!important}
.h3d-tags{position:absolute;left:14px;bottom:12px;display:flex;gap:8px;pointer-events:none}
.h3d-tags span{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;padding:5px 10px;border-radius:999px;border:1px solid var(--ln2);color:var(--mut);background:rgba(11,11,14,.75);transition:color .4s,border-color .4s,box-shadow .4s}
.h3d[data-phase=sans] .t-sans,.h3d[data-phase=avec] .t-avec{color:#fff;border-color:var(--pk);box-shadow:0 0 16px rgba(214,58,115,.45)}
.h3d:not([hidden]){display:block}

/* ---------- thermomètre : mercure animé au défilement ---------- */
.thermo .merc{transform-box:fill-box;transform-origin:50% 100%}
.thermo .bulb{filter:drop-shadow(0 0 10px rgba(214,58,115,.7))}

/* ---------- révélations (GSAP pose l'état initial via JS ; sans JS rien n'est caché) ---------- */
html.js-motion .rv{opacity:0;transform:translateY(28px)}
html.js-motion .rv.in{opacity:1;transform:none}

/* ---------- lueurs qui respirent ---------- */
@keyframes neonBreathe{0%,100%{text-shadow:0 0 18px rgba(214,58,115,.45)}50%{text-shadow:0 0 26px rgba(214,58,115,.55),0 0 44px rgba(214,58,115,.2)}}
@keyframes lineBreathe{0%,100%{box-shadow:0 0 8px var(--pk)}50%{box-shadow:0 0 14px var(--pk),0 0 22px rgba(214,58,115,.3)}}
@keyframes ctaBreathe{0%,100%{box-shadow:0 0 0 1px rgba(255,255,255,.08) inset,0 10px 40px rgba(194,24,91,.35)}50%{box-shadow:0 0 0 1px rgba(255,255,255,.14) inset,0 14px 56px rgba(214,58,115,.55)}}
@keyframes heatRise{0%{transform:translateY(0);opacity:0}15%{opacity:1}100%{transform:translateY(-18px);opacity:0}}
html.js-motion .neon{animation:neonBreathe 3.6s ease-in-out infinite}
html.js-motion .eyebrow:before,html.js-motion .steps:before{animation:lineBreathe 3.2s ease-in-out infinite}
html.js-motion .hero .ctas .btn:first-child{animation:ctaBreathe 3.2s ease-in-out infinite}
html.js-motion .heatflow g>g>path,html.js-motion .heatflow>g:last-of-type path[stroke="#D63A73"],html.js-motion .house path[stroke="#D63A73"],html.js-motion .win g[stroke="#D63A73"] path{animation:heatRise 2.4s ease-in-out infinite}
html.js-motion .heatflow g>g>path:nth-child(2),html.js-motion .house path[stroke="#D63A73"]:nth-child(2){animation-delay:.8s}
html.js-motion .heatflow g>g>path:nth-child(3),html.js-motion .house path[stroke="#D63A73"]:nth-child(3){animation-delay:1.6s}

/* ---------- inclinaison 3D des cartes au survol ---------- */
.tilt{transform-style:preserve-3d;will-change:transform;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.tilt.on{transition:transform .08s linear}
.tilt .glare{position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(240px circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.12),transparent 60%);opacity:0;transition:opacity .4s}
.tilt.on .glare{opacity:1}
.card,.g,.calc{position:relative}

/* ---------- formulaire : transitions entre étapes ---------- */
.form [data-etape]{will-change:transform,opacity}

/* ---------- calculateurs ---------- */
.calcs .hdr p{max-width:52ch}
.calc-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:start}
.calc-grid.seul{grid-template-columns:1fr;max-width:820px}
.calc{border-radius:20px;padding:1px;background:linear-gradient(160deg,rgba(255,255,255,.3),rgba(255,255,255,.05) 45%,rgba(214,58,115,.55))}
.calc .in{border-radius:19px;background:linear-gradient(170deg,#1a1a20,#0e0e12);padding:34px;position:relative;overflow:hidden}
.calc .sur{font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--pk);margin-bottom:10px}
.calc h3{font-size:26px;margin-bottom:10px}
.calc .aide{color:var(--mut);font-size:15px;margin-bottom:14px}
.calc .fstep{margin-top:18px}
.calc .q{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:20px;margin:6px 0 12px;line-height:1.25;outline:none}
.calc .etq{font-size:13px;font-weight:600;color:var(--mut2);margin:16px 0 8px;display:block}
.opts{display:grid;gap:10px}
.opt{display:flex;align-items:center;gap:14px;width:100%;text-align:left;background:rgba(255,255,255,.03);border:1px solid var(--ln);border-radius:12px;padding:14px 16px;color:#fff;font-size:15px;transition:border-color .15s,background .15s,box-shadow .15s,transform .15s}
.opt small{display:block;color:var(--mut);font-size:13px;font-weight:400;margin-top:2px}
.opt .ck{flex:none;width:22px;height:22px;border-radius:6px;border:1px solid var(--ln2);display:grid;place-items:center;font-size:13px;color:#fff}
.opt:hover{border-color:rgba(214,58,115,.6)}
.opt[aria-pressed=true]{border-color:var(--pk);background:rgba(214,58,115,.08);box-shadow:0 0 24px rgba(214,58,115,.15)}
.opt[aria-pressed=true] .ck{background:var(--pk2);border-color:var(--pk)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:1px solid var(--ln2);border-radius:999px;padding:9px 14px;font-size:14px;color:var(--mut2);transition:all .15s}
.chip:hover,.chip[aria-checked=true]{border-color:var(--pk);color:#fff;background:rgba(214,58,115,.1);box-shadow:0 0 16px rgba(214,58,115,.2)}
.calc .btn{margin-top:18px;width:100%}
.calc .btn[disabled]{opacity:.45;cursor:not-allowed;box-shadow:none}
.calc .btn.ghost{margin-top:10px}
.calc .err{margin-top:10px}
.calc .field{margin-top:10px}
.res{margin-top:4px}
.res .gros{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:clamp(30px,3.2vw,44px);line-height:1.05;letter-spacing:-.02em;margin:6px 0 4px;background:var(--ch);-webkit-background-clip:text;background-clip:text;color:transparent}
.res .sous{font-size:13px;color:var(--mut);margin-bottom:18px}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px}
.mini{background:rgba(255,255,255,.03);border:1px solid var(--ln);border-radius:12px;padding:12px 14px}
.mini span{display:block;font-size:12px;color:var(--mut);margin-bottom:4px}
.mini strong{font-family:'Space Grotesk',sans-serif;font-size:18px}
.mini.aidee{border-color:rgba(214,58,115,.5);background:rgba(214,58,115,.06)}
.mini.aidee strong{color:var(--pk)}
/* jauge 3D : barre « coût » chrome, part « aide » magenta qui glisse par-dessus */
.jauge{position:relative;height:30px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid var(--ln);overflow:hidden;margin:4px 0 16px;perspective:600px}
.jauge .cout{position:absolute;inset:3px;border-radius:999px;background:linear-gradient(180deg,#f4f4f7,#c9cbd3 55%,#8e909c);transform-origin:left center;transform:scaleX(0);box-shadow:inset 0 -6px 10px rgba(0,0,0,.25)}
.jauge .aideb{position:absolute;top:3px;bottom:3px;right:3px;border-radius:999px;background:linear-gradient(180deg,#D63A73,#C2185B 60%,#A3134F);transform-origin:right center;transform:scaleX(0);box-shadow:0 0 18px rgba(214,58,115,.55),inset 0 -6px 10px rgba(0,0,0,.25)}
.jauge .lbl{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between;padding:0 12px;font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#0b0b0e;mix-blend-mode:normal;pointer-events:none}
.jauge .lbl b{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5)}
.lignes{display:grid;gap:8px;margin:6px 0 14px}
.lignes li{background:rgba(255,255,255,.03);border:1px solid var(--ln);border-radius:12px;padding:12px 14px;font-size:14px}
.lignes .tete{display:flex;justify-content:space-between;gap:12px}
.lignes .la{color:var(--pk);font-size:13px;margin-top:3px}
.lignes .ln{color:var(--mut);font-size:12.5px;margin-top:3px}
.avert{font-size:13.5px;color:#ffb36b;background:rgba(255,179,107,.08);border:1px solid rgba(255,179,107,.35);border-radius:10px;padding:10px 12px;margin:8px 0}
.reserve{font-size:12.5px;color:var(--mut);line-height:1.5;margin-top:12px}
.reserve a,.calc details a{color:var(--pk);text-decoration:underline;text-underline-offset:2px}
.calc details.cond{margin-top:12px;border:1px solid var(--ln);border-radius:12px;padding:10px 14px;background:rgba(255,255,255,.02);font-size:13.5px}
.calc details.cond summary{cursor:pointer;font-weight:600;color:var(--mut2);list-style:none;display:flex;justify-content:space-between}
.calc details.cond summary::-webkit-details-marker{display:none}
.calc details.cond summary:after{content:"+";color:var(--pk);font-size:17px}
.calc details.cond[open] summary:after{content:"–"}
.calc details.cond ul{margin:10px 0 4px;display:grid;gap:6px;color:var(--mut2)}
.calc details.cond li{padding-left:14px;position:relative}
.calc details.cond li:before{content:"";position:absolute;left:0;top:9px;width:6px;height:1px;background:var(--pk)}
/* calculateur de subventions : résultat vivant */
.range{width:100%;accent-color:var(--pk);margin:6px 0 4px}
.range-val{display:flex;justify-content:space-between;font-size:13px;color:var(--mut)}
.range-val b{font-family:'Space Grotesk',sans-serif;color:#fff;font-size:16px}
.progs{display:grid;gap:10px;margin-top:16px}
.prog{display:grid;grid-template-columns:1fr auto;gap:6px 14px;align-items:start;background:rgba(255,255,255,.03);border:1px solid var(--ln);border-radius:12px;padding:12px 14px}
.prog.ok{border-color:rgba(214,58,115,.5);background:rgba(214,58,115,.06)}
.prog .nom{font-weight:600;font-size:14.5px}
.prog .mt{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:20px;white-space:nowrap;text-align:right}
.prog.ok .mt{color:var(--pk)}
.prog .dt{grid-column:1/-1;color:var(--mut);font-size:12.5px;line-height:1.45}
.prog .dt a{color:var(--pk);text-decoration:underline;text-underline-offset:2px}
.prog .et{display:inline-block;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;border:1px dashed rgba(214,58,115,.6);color:var(--pk);border-radius:999px;padding:2px 8px;margin-left:6px;vertical-align:middle}
.prog .et.ferme{border-color:rgba(255,255,255,.3);color:var(--mut)}
.total{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:16px;padding-top:14px;border-top:1px solid var(--ln2)}
.total span{font-size:13px;color:var(--mut)}
.total b{font-family:'Space Grotesk',sans-serif;font-size:clamp(26px,2.6vw,36px);background:var(--ch);-webkit-background-clip:text;background-clip:text;color:transparent}
/* thermomètre miniature (jauge « aide ») */
.tmini{display:grid;grid-template-columns:42px 1fr;gap:16px;align-items:center;margin:14px 0 6px}
.tmini svg{width:42px;height:auto}
.tmini .merc{transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(0)}
.tmini p{font-size:13px;color:var(--mut);line-height:1.45}
.tmini p b{color:#fff}

/* ---------- adaptatif ---------- */
@media(max-width:1000px){
  .calc-grid{grid-template-columns:1fr}
  .panel .in{grid-template-areas:"h3d h3d" "thermo liste"}
}
@media(max-width:760px){
  .panel .in{grid-template-areas:"h3d" "liste";grid-template-columns:1fr}
  .panel .in:has(.h3d[hidden]){grid-template-areas:"liste"}
  .h3d{aspect-ratio:4/3}
  .calc .in{padding:22px 18px}
  .calc h3{font-size:22px}
  .duo{grid-template-columns:1fr}
  .tilt{transform:none!important}
}
@media(prefers-reduced-motion:reduce){
  html.js-motion .rv{opacity:1;transform:none}
  html.js-motion .neon,html.js-motion .eyebrow:before,html.js-motion .steps:before,html.js-motion .hero .ctas .btn:first-child,html.js-motion .heatflow path,html.js-motion .house path,html.js-motion .win path{animation:none!important}
  .tilt,.tilt.on{transform:none!important;transition:none}
  .tilt .glare{display:none}
  .h3d{display:none!important}
  .thermo .merc{transform:none!important}
  .jauge .cout,.jauge .aideb{transform:scaleX(1)!important}
  .tmini .merc{transform:scaleY(1)!important}
}