
/* LORENTS motion v1.0 — mu-plugin lorents-motion.php
   1. Hero anime : archives de categorie (.lrs-ah, gabarits 359332 + 349368)
      et page realisations 2504, plus articles prestation (.lrs-ah--post,
      gabarit 349167).
      100 % CSS : aucun script, donc rien que LiteSpeed puisse geler.
   2. Fade-up global : l'etat masque n'existe que sous html.lrs-m, classe
      posee par le script d'ouverture quand IntersectionObserver existe et
      que le visiteur n'a pas demande la reduction des animations.
      Sans script : tout est visible, rien ne bouge. */

/* ================= 1. HERO ================= */
@keyframes lrsm-kb{from{transform:translateX(-50%) scale(1)}to{transform:translateX(-50%) scale(1.1) translateY(-1%)}}
@keyframes lrsm-kbp{from{transform:scale(1)}to{transform:scale(1.1) translateY(-1%)}}
@keyframes lrsm-up{from{opacity:0;transform:translate3d(0,34px,0);filter:blur(8px)}to{opacity:1;transform:translate3d(0,0,0);filter:blur(0)}}
@keyframes lrsm-line{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes lrsm-glow{from{background-position:0 0,10% 20%,0 0}to{background-position:0 0,90% 60%,0 0}}

/* photo : zoom lent (archives : la photo est le ::before perce 100vw du kit,
   on anime son transform en gardant le recentrage translateX(-50%)) */
html body:is(.archive,.page-id-2504,.page-id-16) .e-con.lrs-ah::before{
  animation:lrsm-kb 26s cubic-bezier(.25,.46,.45,.94) forwards;
  /* origine sur le bord bas : le conteneur d'archive ne peut pas clipper
     (la photo perce 100vw), le zoom ne doit donc jamais deborder sous le
     voile ; le debord haut disparait derriere la barre fixe, le lateral
     est coupe par body{overflow-x:clip} du theme */
  transform-origin:50% 100%;will-change:transform;backface-visibility:hidden}

/* articles : la photo a la une est le fond du conteneur ; le ::before
   (overlay Elementor, opacite 0 dans le gabarit) devient sa copie animee */
html body .e-con.lrs-ah--post{overflow:hidden;isolation:isolate}
html body .e-con.lrs-ah--post::before{content:"";display:block;position:absolute;inset:0;z-index:0;
  pointer-events:none;border-radius:0;mix-blend-mode:normal;opacity:1;transition:none;
  background-image:inherit;background-size:cover;background-position:inherit;background-repeat:no-repeat;
  animation:lrsm-kbp 26s cubic-bezier(.25,.46,.45,.94) forwards;
  transform-origin:50% 45%;will-change:transform;backface-visibility:hidden}

/* voile : le degrade du kit, plus une lumiere chaude qui traverse la scene
   (18 s, une seule fois, puis plus aucun repaint) et un grain fin */
html body:is(.archive,.page-id-2504,.page-id-16) .e-con.lrs-ah::after,
html body .e-con.lrs-ah--post::after{
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='160'%20height='160'%3E%3Cfilter%20id='n'%3E%3CfeTurbulence%20type='fractalNoise'%20baseFrequency='.85'%20numOctaves='3'%20stitchTiles='stitch'/%3E%3CfeColorMatrix%20values='0%200%200%200%201%200%200%200%200%201%200%200%200%200%201%200%200%200%20.07%200'/%3E%3C/filter%3E%3Crect%20width='160'%20height='160'%20filter='url(%23n)'/%3E%3C/svg%3E"),
    radial-gradient(ellipse 55% 42% at 50% 42%,rgba(224,122,74,.14) 0,rgba(224,122,74,.05) 40%,rgba(224,122,74,0) 72%),
    linear-gradient(180deg,rgba(13,13,13,.78) 0,rgba(13,13,13,.66) 55%,#0D0D0D 100%);
  background-size:160px 160px,60% 90%,100% 100%;
  background-repeat:repeat,no-repeat,no-repeat;
  background-position:0 0,10% 20%,0 0;
  animation:lrsm-glow 18s cubic-bezier(.4,0,.2,1) forwards;
  opacity:1}

/* texte : topline, titre, chapo, boutons — montee floutee, en cascade */
html body:is(.archive,.page-id-2504,.page-id-16) .e-con.lrs-ah .elementor-widget,
html body .e-con.lrs-ah--post .elementor-widget{
  animation:lrsm-up 1.1s cubic-bezier(.16,1,.3,1) both;animation-delay:.4s}
html body:is(.archive,.page-id-2504,.page-id-16) :is(.e-con.lrs-ah,.e-con.lrs-ah>.e-con-inner)>.elementor-widget:nth-child(1){animation-delay:.15s}
html body:is(.archive,.page-id-2504,.page-id-16) :is(.e-con.lrs-ah,.e-con.lrs-ah>.e-con-inner)>.elementor-widget:nth-child(2){animation-delay:.3s}
html body:is(.archive,.page-id-2504,.page-id-16) :is(.e-con.lrs-ah,.e-con.lrs-ah>.e-con-inner)>.elementor-widget:nth-child(3){animation-delay:.5s}
html body:is(.archive,.page-id-2504,.page-id-16) :is(.e-con.lrs-ah,.e-con.lrs-ah>.e-con-inner)>.elementor-widget:nth-child(n+4){animation-delay:.65s}
html body .e-con.lrs-ah--post .elementor-widget-shortcode{animation-delay:.15s}
html body .e-con.lrs-ah--post .elementor-element-d552c0a{animation-delay:.3s}
html body .e-con.lrs-ah--post .elementor-widget-theme-post-excerpt{animation-delay:.5s}
html body .e-con.lrs-ah--post .elementor-element-fcb562b>.elementor-widget{animation-delay:.68s}
html body .e-con.lrs-ah--post .elementor-element-fcb562b>.elementor-widget:nth-child(2){animation-delay:.78s}
html body .e-con.lrs-ah--post .elementor-element-fcb562b>.elementor-widget:nth-child(3){animation-delay:.88s}

/* rangee des boutons du hero d'article (fcb562b) : sur les pages ou le
   kit masque le module video (.lrs-vd en display:none), son widget
   enveloppe reste dans le flex avec le gap de 20 px, et « en savoir + »
   se retrouvait 10 px a gauche du centre. Le gap horizontal passe en
   marges portees par les elements visibles eux-memes. */
html body .e-con.lrs-ah--post .elementor-element-fcb562b{column-gap:0 !important}
html body .e-con.lrs-ah--post .elementor-element-fcb562b>.elementor-widget-button{margin-left:10px !important;margin-right:10px !important}
html body .e-con.lrs-ah--post .elementor-element-fcb562b .lrs-vd{margin-left:10px;margin-right:10px}

/* filet accent qui se trace sous le H1 */
html body:is(.archive,.page-id-2504,.page-id-16) .e-con.lrs-ah h1.elementor-heading-title::after,
html body .e-con.lrs-ah--post .elementor-element-d552c0a .elementor-heading-title::after{
  content:"";display:block;width:64px;height:2px;margin:24px auto 0;border-radius:2px;
  background:linear-gradient(90deg,#E07A4A,#E07A4A);transform:scaleX(0);
  animation:lrsm-line 1.1s .85s cubic-bezier(.16,1,.3,1) forwards}

/* les animations d'entree Elementor sont neutralisees par le kit
   (.elementor-invisible visible) mais rejouees au premier mouvement de
   souris, quand LiteSpeed libere le JS : on coupe la rediffusion */
.elementor-element.animated:not(.elementor-popup-modal .elementor-element){animation:none !important}

@media(max-width:767px){
  html body:is(.archive,.page-id-2504,.page-id-16) .e-con.lrs-ah::before,
  html body .e-con.lrs-ah--post::before{animation-duration:20s}
  html body:is(.archive,.page-id-2504,.page-id-16) .e-con.lrs-ah h1.elementor-heading-title::after,
  html body .e-con.lrs-ah--post .elementor-element-d552c0a .elementor-heading-title::after{width:48px;margin-top:18px}
}

/* ================= 2. FADE-UP GLOBAL ================= */
html.lrs-m{--lrsm-y:28px;--lrsm-t:.72s;--lrsm-e:cubic-bezier(.22,1,.36,1)}
@media(max-width:767px){html.lrs-m{--lrsm-y:20px;--lrsm-t:.6s}}

/* etat masque : chaque widget Elementor, sauf l'en-tete fixe, les popups,
   les hero (qui ont leur propre choregraphie), les modules plein ecran
   lrs-ph / lrs-mh, les widgets enveloppes (contenu d'article, listes dont
   les cartes sont animees une a une) et l'interieur des cartes de boucle */
html.lrs-m .elementor-widget:not(.lrs-vu):not(.elementor-widget-theme-post-content):not(.elementor-widget-archive-posts):not(.elementor-widget-posts):not(.elementor-widget-loop-grid):not(.elementor-location-header *):not(.elementor-popup-modal *):not(.lrs-ah *):not(.lrs-ah--post *):not(.e-loop-item *):not(:has(.lrs-ph,.lrs-mh,.lrs-ag)){
  opacity:0;transform:translate3d(0,var(--lrsm-y),0)}
/* second niveau : les cartes une a une */
html.lrs-m .elementor-widget-archive-posts .elementor-post:not(.lrs-vu),
html.lrs-m .elementor-widget-posts .elementor-post:not(.lrs-vu),
html.lrs-m .e-loop-item:not(.lrs-vu),
html.lrs-m ul.products>li.product:not(.lrs-vu),
html.lrs-m .lrs-up:not(.lrs-vu){
  opacity:0;transform:translate3d(0,var(--lrsm-y),0)}
/* la transition vit sur l'etat d'arrivee ; --lrs-d est l'echelonnement pose par le script */
html.lrs-m .lrs-vu{
  transition:opacity var(--lrsm-t) var(--lrsm-e) var(--lrs-d,0ms),transform var(--lrsm-t) var(--lrsm-e) var(--lrs-d,0ms)}

@media print{
  html.lrs-m .elementor-widget,html.lrs-m .elementor-post,html.lrs-m .e-loop-item,html.lrs-m li.product,html.lrs-m .lrs-up{opacity:1 !important;transform:none !important}}

@media(prefers-reduced-motion:reduce){
  html body:is(.archive,.page-id-2504,.page-id-16) .e-con.lrs-ah::before,html body .e-con.lrs-ah--post::before,
  html body:is(.archive,.page-id-2504,.page-id-16) .e-con.lrs-ah::after,html body .e-con.lrs-ah--post::after,
  html body:is(.archive,.page-id-2504,.page-id-16) .e-con.lrs-ah .elementor-widget,html body .e-con.lrs-ah--post .elementor-widget,
  html body:is(.archive,.page-id-2504,.page-id-16) .e-con.lrs-ah h1.elementor-heading-title::after,
  html body .e-con.lrs-ah--post .elementor-element-d552c0a .elementor-heading-title::after{animation:none !important}
  html body:is(.archive,.page-id-2504,.page-id-16) .e-con.lrs-ah h1.elementor-heading-title::after,
  html body .e-con.lrs-ah--post .elementor-element-d552c0a .elementor-heading-title::after{transform:none}
}

