/* =========================================================
   SCÈNES DES PAGES INTÉRIEURES — fx-pages.css (07/11/2026)
   Associé à js/fx-pages.js. Chargé avec scroll3d.css (fond, mots, jauges) et fx-lite.css (apparitions).
   ========================================================= */
/* Les anciennes animations d'apparition en cascade laissent la place aux nôtres */
.fx .gallery.stagger.in>*,.fx .video-block.stagger.in>*,.fx .cols3.stagger.in>*{animation:none}

/* Longues galeries : on ne dessine que ce qui est proche de l'écran (moins de travail sur téléphone) */
.fx .gallery.gal-4 figure{content-visibility:auto;contain-intrinsic-size:auto 280px}

/* ---------- Atelier (téléphone) : carrousel à doigt ---------- */
@media (max-width:760px){
  .fx .gallery.fx-car{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:-22px;padding:2px 22px 6px;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
  .fx .gallery.fx-car::-webkit-scrollbar{display:none}
  .fx .gallery.fx-car figure{flex:0 0 82%;scroll-snap-align:center}
  .fx .gallery.fx-car img{aspect-ratio:4/5}
  .fx .gallery.fx-car:focus-visible{outline-offset:-2px}
  .fx-car-meta{display:flex;justify-content:space-between;align-items:center;margin-top:.8rem;font:500 .7rem/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
  .fx-car-meta .n{color:#fff}
  .fx-car-meta .h{transition:opacity .4s ease}
}

/* ---------- Visite (téléphone) : les espaces s'empilent ---------- */
@media (max-width:760px){
  .fx .gallery.fx-stack{display:block}
  .fx .gallery.fx-stack figure{position:sticky;top:calc(18px + var(--i,0) * 15px);margin-bottom:18px;transform-origin:50% 0;will-change:transform;box-shadow:0 18px 40px -20px rgba(0,0,0,.8)}
}

/* ---------- Visite (ordinateur) : « promenade » dans les espaces ---------- */
@media (min-width:981px) and (min-height:620px){
  .fx-walk{position:relative;height:calc(100vh * var(--k,4));height:calc(100svh * var(--k,4));margin-block:.5rem}
  .fx-walk-pin{position:sticky;top:0;height:100vh;height:100svh;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1.1rem}
  .fx .gallery.fx-walk-stage{display:block;position:relative;width:min(1080px,100%);height:min(68vh,660px)}
  .fx .gallery.fx-walk-stage figure{position:absolute;inset:0;display:flex;flex-direction:column;will-change:opacity,transform}
  .fx .gallery.fx-walk-stage figure img{flex:1 1 auto;min-height:0;height:100%;width:100%;aspect-ratio:auto;object-fit:cover}
  .fx .gallery.fx-walk-stage figcaption{flex:0 0 auto;font-size:.95rem}
  .fx-walk-meta{display:flex;gap:.6rem}
  .fx-walk-meta i{width:40px;height:3px;border-radius:3px;background:rgba(255,255,255,.18);transition:background .4s ease}
  .fx-walk-meta i.on{background:var(--brand-light)}
}

/* ---------- Certifications : frise datée des audits ---------- */
.fx-frise{list-style:none;margin:0 0 clamp(1.6rem,4vw,2.6rem);padding:0;position:relative}
.fx-frise::before{content:"";position:absolute;left:7px;top:6px;bottom:6px;width:2px;background:linear-gradient(180deg,var(--brand-light),rgba(75,146,208,.15));transform:scaleY(0);transform-origin:top;transition:transform 1.8s cubic-bezier(.16,1,.3,1)}
.fx-frise.in::before{transform:scaleY(1)}
.fx-frise li{position:relative;padding:0 0 1.4rem 2.1rem}
.fx-frise li:last-child{padding-bottom:0}
.fx-frise li::before{content:"";position:absolute;left:0;top:.15rem;width:16px;height:16px;border-radius:50%;background:var(--bg);border:2px solid var(--brand-light);box-shadow:0 0 0 4px rgba(75,146,208,.18)}
.fx-frise .d{display:block;font:500 .68rem/1.2 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--brand-light)}
.fx-frise b{display:block;margin-top:.4rem;font-family:var(--font-display);font-size:1.02rem;font-weight:700;color:#fff;line-height:1.25}
.fx-frise i{display:block;margin-top:.15rem;font-style:normal;font-size:.86rem;color:var(--ink-soft)}
@media (min-width:761px){
  .fx-frise{display:grid;grid-template-columns:repeat(4,1fr)}
  .fx-frise::before{left:0;right:0;top:7px;bottom:auto;width:auto;height:2px;background:linear-gradient(90deg,var(--brand-light),rgba(75,146,208,.15));transform:scaleX(0);transform-origin:left}
  .fx-frise.in::before{transform:scaleX(1)}
  .fx-frise li{padding:2.1rem 1.2rem 0 0}
  .fx-frise li::before{top:0}
}

/* Carrousel (téléphone) : on ne dessine que les photos proches de l'écran (mesuré : 85 → 95 sur l'Atelier) */
@media (max-width:760px){
  .fx .gallery.fx-car figure{content-visibility:auto;contain-intrinsic-size:auto 82vw auto 440px}
}