/* DEMO_PLOMBERIE PUBLIC V2.1 — MOTION-01
   Non-destructive scroll polish: CSS enabled only after JS capability checks.
   Progressive enhancement, zero layout shifts, respects reduced-motion.
*/
:root{--mo-motion-ease:cubic-bezier(.2,.72,.22,1)}
#mo-scroll-progress{
 position:fixed;inset:0 auto auto 0;width:100%;height:3px;z-index:80;
 pointer-events:none;transform:scaleX(0);transform-origin:left center;
 background:linear-gradient(90deg,#087fa6 0%,#29d5ee 66%,#f5b544 100%);
 box-shadow:0 1px 9px rgba(13,170,209,.25);
 will-change:transform;
}
html.mo-scrolled .glass-header{
 box-shadow:0 13px 33px rgba(9,40,62,.11);
 border-bottom-color:rgba(126,192,215,.43);
}
@media(prefers-reduced-motion:no-preference){
 @supports (translate:0 0){
  html.mo-motion-on .mo-reveal{
   opacity:0;
   translate:0 23px;
   transition:opacity .76s var(--mo-motion-ease),translate .86s var(--mo-motion-ease);
   transition-delay:var(--mo-delay,0ms);
  }
  html.mo-motion-on .mo-reveal.mo-in-view{
   opacity:1;
   translate:0 0;
  }
  /* The left/right shifts are restrained and never affect layout or hover transforms. */
  html.mo-motion-on .mo-reveal[data-mo-direction="left"]:not(.mo-in-view){translate:-24px 11px}
  html.mo-motion-on .mo-reveal[data-mo-direction="right"]:not(.mo-in-view){translate:24px 11px}
  html.mo-motion-on #accueil .hero-motif{translate:0 var(--mo-hero-shift,0px)}
  html.mo-motion-on #geberit .geberit-product-figure>img{
   scale:1.035;
   translate:0 var(--mo-product-shift,0px);
  }
 }
}
/* Existing image hover transforms, CTAs and grids remain independent. */
@media(max-width:767px){
 #mo-scroll-progress{height:2px}
 html.mo-motion-on #accueil .hero-motif{translate:0 0!important}
 html.mo-motion-on #geberit .geberit-product-figure>img{scale:1;translate:0 0!important}
 @supports(translate:0 0){
  html.mo-motion-on .mo-reveal{transition-duration:.55s,.64s}
  html.mo-motion-on .mo-reveal[data-mo-direction="left"]:not(.mo-in-view),
  html.mo-motion-on .mo-reveal[data-mo-direction="right"]:not(.mo-in-view){translate:0 18px}
 }
}
@media(prefers-reduced-motion:reduce){
 #mo-scroll-progress{display:none}
 html.mo-motion-on .mo-reveal{opacity:1!important;translate:none!important;transition:none!important}
 html.mo-motion-on #accueil .hero-motif,
 html.mo-motion-on #geberit .geberit-product-figure>img{translate:0 0!important;scale:1!important}
}