/* La technologie (2026-10-26) : scène en coupe pilotée par le défilement.
   La section se fige à l'écran pendant qu'on fait défiler ; quatre
   chapitres (froid, chaud, EMS, élimination) se succèdent. Les effets
   dépendent des variables --c, --h, --e, --l (0 à 1) posées par
   cryo-science.js. Sans JavaScript : les quatre chapitres l'un sous
   l'autre, schéma fixe. */
.cryo-tech{background:var(--navy);color:var(--cream);padding-top:112px;position:relative}
.cryo-tech-head{max-width:1280px;margin-bottom:24px}
.cryo-tech-eyebrow{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:18px}
.cryo-tech-head h2{max-width:900px}
.cryo-tech-head h2 em{color:var(--gold)}
.cryo-tech-head>p:last-child{max-width:560px;margin-top:24px;font-size:15px;color:var(--cryo-light-muted)}

.cryo-tech-sticky{padding-block:40px 80px}
.cryo-tech-layout{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(32px,5vw,80px);align-items:center}
.cryo-tech-rail{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;list-style:none;margin:0 0 34px;padding:0;position:relative}
.cryo-tech-rail::before,.cryo-tech-rail::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:color-mix(in srgb,var(--cream) 14%,transparent)}
.cryo-tech-rail::after{right:auto;width:calc(var(--p,0)*100%);background:linear-gradient(90deg,#7cc8ff,#ffa45c 38%,var(--gold) 66%,#7fe0c8)}
.cryo-tech-rail button{display:flex;flex-direction:column;gap:2px;width:100%;padding:0 0 14px;text-align:left;font-size:12px;letter-spacing:.04em;color:color-mix(in srgb,var(--cream) 55%,transparent);transition:color .4s var(--vb-ease)}
.cryo-tech-rail button span{font-family:var(--font-display);font-size:20px;letter-spacing:0;color:inherit}
.cryo-tech-rail button[aria-current="step"]{color:var(--cream)}
.cryo-tech-rail button[aria-current="step"] span{color:var(--gold)}
.cryo-chapter{--tone:#7cc8ff;padding-bottom:28px}
.cryo-chapter[data-chapter="1"]{--tone:#ffa45c}
.cryo-chapter[data-chapter="2"]{--tone:var(--gold)}
.cryo-chapter[data-chapter="3"]{--tone:#7fe0c8}
.cryo-chapter-kicker{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--tone);margin-bottom:14px}
.cryo-chapter h3{font-size:clamp(34px,3.4vw,48px);line-height:1.04;margin-bottom:18px}
.cryo-chapter>p:not([class]){font-size:15px;line-height:1.75;color:var(--cryo-light-muted);max-width:470px}
.cryo-chapter-chip{display:inline-flex;align-items:center;gap:8px;margin-top:20px;padding:7px 14px;border:1px solid color-mix(in srgb,var(--tone) 55%,transparent);border-radius:40px;font-size:12px;letter-spacing:.06em;color:var(--tone)}
.cryo-chapter-chip::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--tone);box-shadow:0 0 12px var(--tone)}

.cryo-stage{position:relative;margin:0;--c:0;--h:0;--e:0;--l:0;--cv:0;--hv:0;--ev:0;--in:1;--t:.6;--glow:transparent}
.cryo-stage[data-mode="cold"]{--glow:rgba(95,176,234,.35)}
.cryo-stage[data-mode="heat"]{--glow:rgba(255,138,69,.32)}
.cryo-stage[data-mode="ems"]{--glow:rgba(201,169,110,.32)}
.cryo-stage[data-mode="elim"]{--glow:rgba(127,224,200,.26)}
.cryo-stage-frame{position:relative;border-radius:16px;overflow:hidden;box-shadow:0 50px 100px -50px rgba(0,0,0,.85),0 0 90px -20px var(--glow),0 0 0 1px color-mix(in srgb,var(--gold) 18%,transparent);transition:box-shadow .8s var(--vb-ease)}
.cryo-scene{display:block;width:100%;height:auto}
.cryo-stage>figcaption{margin-top:12px;color:var(--cryo-light-muted)}
.cryo-stage .cryo-motion-toggle{position:absolute;right:14px;top:14px;display:flex;align-items:center;gap:8px;min-height:36px;padding:0 14px;border-radius:30px;background:rgba(7,17,28,.55);backdrop-filter:blur(8px);font-size:11px;color:var(--cream);border:1px solid color-mix(in srgb,var(--cream) 18%,transparent)}
.cryo-stage .cryo-motion-toggle svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round}

/* Tableau de bord, sous la scène */
.cryo-hud{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:10px;margin-top:12px}
.cryo-hud>div{padding:12px 16px 14px;border-radius:12px;background:color-mix(in srgb,var(--cream) 5%,transparent);border:1px solid color-mix(in srgb,var(--cream) 10%,transparent);opacity:.4;transition:opacity .5s var(--vb-ease),border-color .5s var(--vb-ease)}
.cryo-hud-label{display:block;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:color-mix(in srgb,var(--cream) 62%,transparent);margin-bottom:6px}
.cryo-hud-value{display:block;font-family:var(--font-display);font-weight:400;font-size:36px;line-height:1;font-variant-numeric:tabular-nums;color:var(--tcol,var(--cream));text-shadow:0 0 24px var(--tcol,transparent)}
.cryo-hud-bar{display:block;height:3px;margin-top:10px;border-radius:3px;background:color-mix(in srgb,var(--cream) 14%,transparent);overflow:hidden}
.cryo-hud-bar i{display:block;height:100%;width:calc(var(--t)*100%);background:linear-gradient(90deg,#5aa9e6,#e8e4dc 45%,#ff8a45)}
.cryo-hud-weeks .cryo-hud-bar i{width:calc(var(--l)*100%);background:#7fe0c8;box-shadow:0 0 10px #7fe0c8}
.cryo-hud-pulse{display:flex;align-items:flex-end;gap:4px;height:36px}
.cryo-hud-pulse i{width:6px;height:18%;border-radius:2px;background:var(--gold)}
.cryo-stage[data-mode="idle"] .cryo-hud-temp,.cryo-stage[data-mode="cold"] .cryo-hud-temp,.cryo-stage[data-mode="heat"] .cryo-hud-temp,.cryo-stage[data-mode="ems"] .cryo-hud-ems,.cryo-stage[data-mode="elim"] .cryo-hud-weeks{opacity:1;border-color:color-mix(in srgb,var(--cream) 22%,transparent)}
.cryo-stage[data-mode="ems"] .cryo-hud-pulse i{animation:cs-bar .9s var(--vb-ease) infinite}
.cryo-hud-pulse i:nth-child(2){animation-delay:.06s!important}.cryo-hud-pulse i:nth-child(3){animation-delay:.12s!important}.cryo-hud-pulse i:nth-child(4){animation-delay:.18s!important}.cryo-hud-pulse i:nth-child(5){animation-delay:.24s!important}.cryo-hud-pulse i:nth-child(6){animation-delay:.3s!important}.cryo-hud-pulse i:nth-child(7){animation-delay:.36s!important}.cryo-hud-pulse i:nth-child(8){animation-delay:.42s!important}
@keyframes cs-bar{0%,100%{height:16%}25%{height:100%}55%{height:34%}}

/* ── Scène ─────────────────────────────────────────────────────────── */
.cs-legend circle{fill:var(--gold)}
.cs-legend text{fill:rgba(248,245,239,.82);font-family:var(--font-sans);font-size:16px;font-weight:500;letter-spacing:1.8px;text-transform:uppercase;paint-order:stroke;stroke:rgba(9,19,32,.55);stroke-width:3px;stroke-linejoin:round}
.cs-legend-lymph{opacity:calc(.15 + var(--l)*.85)}
.cs-legend-lymph circle{fill:#7fe0c8}
.cs-pad{transform:translateY(calc((1 - var(--in)) * -90px + var(--dip,0) * 1px));opacity:var(--in)}
.cs-plate{fill:#c9d0d7;transition:fill .6s ease}
.cryo-stage[data-mode="cold"] .cs-plate{fill:#a8e0ff;filter:url(#cs-glow)}
.cryo-stage[data-mode="heat"] .cs-plate{fill:#ffbc7c;filter:url(#cs-glow)}
.cryo-stage[data-mode="ems"] .cs-plate{fill:#f1d9a0;filter:url(#cs-glow)}
.cs-frost{opacity:var(--cv)}
.cs-frost path{stroke:#eefaff;stroke-width:1.7;fill:none;stroke-linecap:round;filter:url(#cs-glow)}
.cs-bloom{transform-box:fill-box;transform-origin:50% 0}
.cs-bloom-cold{opacity:calc(var(--cv)*.85);transform:scale(calc(.4 + var(--c)*.6))}
.cs-bloom-heat{opacity:var(--hv);transform:scale(calc(.4 + var(--h)*.6))}
.cs-bloom-ems{opacity:calc(var(--ev)*.7)}
.cryo-stage[data-mode="ems"] .cs-bloom-ems{animation:cs-flash .9s var(--vb-ease) infinite}
/* ondes qui partent du pad, couleur selon l'étape */
.cs-rings{opacity:max(var(--cv),var(--hv),calc(var(--ev)*.8));stroke:#f3dc9c}
.cryo-stage[data-mode="cold"] .cs-rings{stroke:#a8e0ff}
.cryo-stage[data-mode="heat"] .cs-rings{stroke:#ffb46a}
.cs-rings ellipse{stroke-width:3;transform-box:fill-box;transform-origin:50% 0;animation:cs-ring 3.2s cubic-bezier(.2,.7,.3,1) infinite;opacity:0}
.cs-rings ellipse:nth-child(2){animation-delay:-.8s}.cs-rings ellipse:nth-child(3){animation-delay:-1.6s}.cs-rings ellipse:nth-child(4){animation-delay:-2.4s}
.cryo-stage[data-mode="ems"] .cs-rings ellipse{animation-duration:1.8s}
.cs-ice{opacity:var(--cv)}
.cs-ice path{fill:#effaff;filter:url(#cs-glow);animation:cs-drift 5s ease-in-out infinite}
.cs-caps use{transition:stroke .5s ease}
.cryo-stage[data-mode="heat"] .cs-caps use{stroke:#ff5a48;filter:url(#cs-glow)}
.cs-blood{opacity:var(--hv)}
.cs-bolts{opacity:var(--ev)}
.cs-bolts path{stroke:#fff6dc;stroke-width:3.4;filter:url(#cs-glow);animation:cs-zap .9s steps(1) infinite}
.cs-bolts path:nth-child(2n){animation-delay:-.3s}.cs-bolts path:nth-child(3n){animation-delay:-.6s}
.cs-muscle{transform-box:fill-box;transform-origin:50% 0}
.cryo-stage[data-mode="ems"] .cs-muscle{animation:cs-contract .9s var(--vb-ease) infinite}
.cs-muscleflash{opacity:0}
.cryo-stage[data-mode="ems"] .cs-muscleflash{animation:cs-mflash .9s var(--vb-ease) infinite}
.cs-fibers path{fill:url(#cs-fiber);stroke:#5a1b1d;stroke-opacity:.5;stroke-width:1}
.cs-lymph{opacity:calc(.12 + var(--l)*.88)}
.cs-debris{opacity:var(--l)}
.cs-debris circle{filter:url(#cs-glow)}
.cs-cell .ice{opacity:var(--fz,0)}
.cs-cell path{opacity:var(--fz,0);stroke:#fff;stroke-width:1.3;fill:none}
@keyframes cs-ring{0%{transform:scale(.25);opacity:0}12%{opacity:.95}100%{transform:scale(1.9);opacity:0}}
@keyframes cs-drift{0%,100%{transform:translate(0,0);opacity:.35}50%{transform:translate(5px,16px);opacity:1}}
@keyframes cs-zap{0%{opacity:1}22%{opacity:.3}40%{opacity:1}65%{opacity:.45}100%{opacity:1}}
@keyframes cs-flash{0%,100%{opacity:calc(var(--ev)*.25)}25%{opacity:calc(var(--ev)*.85)}}
@keyframes cs-contract{0%,100%{transform:scale(1,1)}25%{transform:scale(1.015,.86)}55%{transform:scale(1,.95)}}
@keyframes cs-mflash{0%,100%{opacity:0}25%{opacity:.22}}
.cryo-stage.is-paused *{animation-play-state:paused!important}

.cryo-tech-hint{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);display:flex;align-items:center;gap:12px;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--cryo-light-muted);opacity:calc(1 - var(--p,0)*12);pointer-events:none}
.cryo-tech-hint span{width:1px;height:28px;background:linear-gradient(var(--gold),transparent);animation:cs-hint 1.8s var(--vb-ease) infinite}
@keyframes cs-hint{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ── Mode défilement (JavaScript prêt) ─────────────────────────────── */
.cryo-tech.is-ready .cryo-tech-scroll{height:460vh;position:relative}
.cryo-tech.is-ready .cryo-tech-sticky{position:sticky;top:0;height:100vh;height:100svh;display:flex;flex-direction:column;justify-content:center;padding-block:24px}
.cryo-tech.is-ready .cryo-tech-chapters{display:grid}
.cryo-tech.is-ready .cryo-chapter{grid-area:1/1;opacity:0;transform:translate3d(0,26px,0);filter:blur(6px);transition:opacity .7s var(--vb-ease),transform .8s var(--vb-ease),filter .7s var(--vb-ease);pointer-events:none}
.cryo-tech.is-ready .cryo-chapter.is-active{opacity:1;transform:none;filter:none;pointer-events:auto}
.cryo-tech:not(.is-ready) .cryo-tech-rail,.cryo-tech:not(.is-ready) .cryo-tech-hint,.cryo-tech:not(.is-ready) .cryo-motion-toggle,.cryo-tech:not(.is-ready) .cryo-hud{display:none}

/* ── Bloc des pads (section « La précision du soin ») ─────────────── */
.cryo-pads{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(36px,6vw,96px);align-items:center;margin-bottom:20px}
/* Les pads sortent du bord gauche de l'écran, sans fond (image détourée) */
.cryo-pads-img{position:relative;--edge:max(clamp(24px,4.5vw,72px),calc((100vw - 1280px)/2 + clamp(24px,4.5vw,72px)));margin:0 0 0 calc(var(--edge) * -1)}
.cryo-pads-img img{display:block;width:100%;height:auto;filter:drop-shadow(0 26px 30px rgba(13,27,42,.16))}
.cryo-pads-copy .cryo-tech-eyebrow{color:var(--gold-hover)}
.cryo-pads-copy h3{font-size:clamp(44px,5vw,72px);line-height:.98;margin-bottom:24px}
.cryo-pads-copy h3 em{color:color-mix(in srgb,var(--gold-hover) 85%,var(--navy))}
.cryo-pads-copy>p:not([class]){font-size:15px;color:var(--cryo-muted);max-width:520px;margin-bottom:26px}
.cryo-pads-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:22px 28px}
.cryo-pads-steps li{display:flex;gap:14px;border-top:1px solid color-mix(in srgb,var(--navy) 15%,transparent);padding-top:16px}
.cryo-pads-steps span{font-family:var(--font-display);font-size:22px;line-height:1;color:var(--gold-hover)}
.cryo-pads-steps strong{display:block;font-weight:500;font-size:14px;margin-bottom:4px}
.cryo-pads-steps p{font-size:13px;color:var(--cryo-muted);line-height:1.6}

@media (max-width:900px){
  .cryo-tech{padding-top:80px}
  .cryo-tech-layout{grid-template-columns:1fr;gap:18px}
  .cryo-tech.is-ready .cryo-tech-layout{display:flex;flex-direction:column-reverse}
  .cryo-tech-rail{margin-bottom:16px}
  .cryo-tech-rail button{font-size:10px;padding-bottom:10px}
  .cryo-tech-rail button span{font-size:16px}
  .cryo-chapter h3{font-size:clamp(26px,7vw,34px);margin-bottom:10px}
  .cryo-chapter>p:not([class]){font-size:13.5px;line-height:1.6}
  .cryo-chapter-chip{margin-top:12px;font-size:11px;padding:5px 12px}
  .cryo-hud{grid-template-columns:1.3fr 1fr 1fr;gap:6px;margin-top:8px}
  .cryo-hud>div{padding:7px 9px 8px;border-radius:9px}
  .cryo-hud-label{font-size:7px;letter-spacing:.1em;margin-bottom:3px}
  .cryo-hud-value{font-size:22px}
  .cryo-hud-pulse{height:22px;gap:2px}
  .cryo-hud-pulse i{width:4px}
  .cryo-hud-bar{margin-top:6px}
  .cryo-stage .cryo-motion-toggle{top:auto;bottom:10px;right:10px;min-height:30px;font-size:10px}
  .cryo-stage>figcaption{display:none}
  .cs-legend text{font-size:26px;stroke-width:4px}
  .cryo-pads{grid-template-columns:1fr}
  .cryo-pads-img{width:calc(100% + var(--edge))}
  .cryo-pads-steps{grid-template-columns:1fr}
}
@media (max-width:900px) and (max-height:700px){.cryo-chapter>p:not([class]){font-size:12.5px}.cryo-chapter h3{font-size:24px}.cryo-chapter-chip{display:none}}
@media (prefers-reduced-motion:reduce){
  .cryo-stage *{animation:none!important}
  .cryo-tech.is-ready .cryo-chapter{transition-duration:.01ms;filter:none;transform:none}
  .cs-pad{transform:none}
}