/* Tongui Motion — styles structurels uniquement. */

/* État initial anti-flash, activé très tôt dans le <head>. */
html.tg-motion-js body:not(.elementor-editor-active):not(.elementor-editor-preview)
:is(
  .tg-fade-in,
  .tg-fade-up,
  .tg-scale,
  .tg-stagger,
  .tg-reveal-text
) {
  opacity: 0;
  visibility: hidden;
}

html.tg-motion-js body:not(.elementor-editor-active):not(.elementor-editor-preview)
.tg-stagger > * {
  opacity: 0;
  visibility: hidden;
}


/* Zoom au scroll : l'image est masquée uniquement pendant les quelques
 * millisecondes nécessaires à GSAP pour poser son véritable état initial.
 * Aucun transform CSS permanent ne concurrence ensuite le tween. */
html.tg-motion-js
body:not(.elementor-editor-active):not(.elementor-editor-preview)
.tg-image-zoom:not(.tg-image-zoom-ready)
:is(.elementor-widget-container img, .elementor-image img, img) {
  visibility: hidden;
}

.tg-image-zoom {
  overflow: hidden;
}

.tg-image-zoom
:is(.elementor-widget-container img, .elementor-image img, img) {
  transform-origin: center center;
  backface-visibility: hidden;
}

/* Parallax d’une image de fond Elementor.
 * La couche est créée par le moteur à l’intérieur du conteneur. Son z-index
 * négatif reste borné par `isolation:isolate`, posé uniquement pendant l’effet,
 * afin que le contenu et l’overlay Elementor demeurent fixes au-dessus. */
.tg-image-parallax[data-tg-image-parallax-target="background"]
> .tg-image-parallax__background {
  position: absolute;
  z-index: -1;
  display: block;
  pointer-events: none;
  background-color: transparent;
  transform-origin: center center;
  backface-visibility: hidden;
}

/* Elementor peut rendre le fond sur le wrapper, une couche interne ou un
 * pseudo-élément. Ces classes ne masquent que la copie statique détectée par
 * le moteur, afin que la couche GSAP reste la seule image visible. */
.tg-image-parallax__hide-before-background::before,
.tg-image-parallax__hide-after-background::after {
  background-image: none !important;
}

.tg-reveal-image {
  overflow: hidden;
}

/* État initial du masque avant le premier paint.
 * Contrairement à opacity/visibility, le clip-path reste visible pendant
 * l'ouverture et évite le flash de l'image complète sur le front. */
html.tg-motion-js body:not(.elementor-editor-active):not(.elementor-editor-preview)
.tg-reveal-image[data-tg-reveal-direction="left-to-right"] {
  clip-path: inset(0 100% 0 0);
  -webkit-clip-path: inset(0 100% 0 0);
}

html.tg-motion-js body:not(.elementor-editor-active):not(.elementor-editor-preview)
.tg-reveal-image[data-tg-reveal-direction="right-to-left"] {
  clip-path: inset(0 0 0 100%);
  -webkit-clip-path: inset(0 0 0 100%);
}

html.tg-motion-js body:not(.elementor-editor-active):not(.elementor-editor-preview)
.tg-reveal-image[data-tg-reveal-direction="top-to-bottom"] {
  clip-path: inset(0 0 100% 0);
  -webkit-clip-path: inset(0 0 100% 0);
}

html.tg-motion-js body:not(.elementor-editor-active):not(.elementor-editor-preview)
.tg-reveal-image[data-tg-reveal-direction="bottom-to-top"] {
  clip-path: inset(100% 0 0 0);
  -webkit-clip-path: inset(100% 0 0 0);
}

.tg-reveal-image img {
  display: block;
  width: 100%;
}

/* Les masques Reveal Text / Reveal Lines sont ajustés en JavaScript
 * directement sur les wrappers officiels `split.masks`.
 * Aucune compensation générique ne modifie la typographie Elementor. */

/* SplitText doit préserver la composition typographique Elementor. */
.tg-motion-line,
.tg-motion-line-mask {
  display: block;
}

.tg-motion-word,
.tg-motion-char,
.tg-motion-word-mask,
.tg-motion-char-mask {
  display: inline-block;
}

.tg-motion-line,
.tg-motion-word,
.tg-motion-char,
.tg-motion-line-mask,
.tg-motion-word-mask,
.tg-motion-char-mask {
  font: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  text-align: inherit;
}

/* Dans la maquette Elementor, les états sont pilotés par GSAP.
 * Ne pas forcer opacity/transform avec !important : cela neutraliserait
 * tous les aperçus sauf Scale. */

@media (prefers-reduced-motion: reduce) {
  .tg-fade-in,
  .tg-fade-up,
  .tg-scale,
  .tg-stagger,
  .tg-reveal-text,
  .tg-stagger > *,
  .tg-reveal-image img,
  .tg-image-zoom img,
  .tg-image-parallax__background,
  [data-tg-motion-split] {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    clip-path: none !important;
    transition: none !important;
    animation: none !important;
  }
}


/* Pan au scroll */
.tg-image-pan {
  overflow: hidden;
}

.tg-image-pan
:is(.elementor-widget-container img, .elementor-image img, img) {
  transform-origin: center center;
  backface-visibility: hidden;
  will-change: transform;
}


/* Accent de texte — Text Highlight
 * Le dessin repose sur background-size et non sur un pseudo-élément absolu.
 * Il fonctionne donc avec un span inline normal, avec ou sans SplitText. */
.tg-text-highlight .tg-highlight,
.tg-text-highlight .tg-highlight-fragment {
  --tg-highlight-size: 100% var(--tg-highlight-thickness, 0.42em);
  display: inline;
  padding-inline: 0;
  background-image: linear-gradient(
    var(--tg-highlight-color, #d9e86c),
    var(--tg-highlight-color, #d9e86c)
  );
  background-repeat: no-repeat;
  background-position: left 88%;
  background-size: 0 var(--tg-highlight-thickness, 0.42em);
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  transition:
    background-size 0.82s cubic-bezier(0.22, 1, 0.36, 1)
    var(--tg-highlight-delay, 0.15s);
}

.tg-text-highlight[data-tg-text-highlight-direction="right-to-left"]
.tg-highlight,
.tg-text-highlight[data-tg-text-highlight-direction="right-to-left"]
.tg-highlight-fragment {
  background-position: right 88%;
}

.tg-text-highlight[data-tg-text-highlight-style="underline"]
.tg-highlight,
.tg-text-highlight[data-tg-text-highlight-style="underline"]
.tg-highlight-fragment {
  --tg-highlight-underline-size:
    max(2px, calc(var(--tg-highlight-thickness, 0.42em) * 0.18));
  background-position: left 100%;
  background-size: 0 var(--tg-highlight-underline-size);
}

.tg-text-highlight[data-tg-text-highlight-style="underline"]
.tg-highlight.tg-highlight-ready,
.tg-text-highlight[data-tg-text-highlight-style="underline"]
.tg-highlight-fragment.tg-highlight-ready {
  background-size: 100% var(--tg-highlight-underline-size);
}

.tg-text-highlight[data-tg-text-highlight-style="underline"]
.tg-highlight {
  background-position-y: 100%;
}

.tg-text-highlight[data-tg-text-highlight-style="underline"]
[data-tg-text-highlight-direction="right-to-left"] .tg-highlight {
  background-position-x: right;
}

.tg-text-highlight .tg-highlight.tg-highlight-ready,
.tg-text-highlight .tg-highlight-fragment.tg-highlight-ready {
  background-size: var(--tg-highlight-size);
}

@media (prefers-reduced-motion: reduce) {
  .tg-text-highlight .tg-highlight,
  .tg-text-highlight .tg-highlight-fragment {
    transition: none !important;
  }

  .tg-text-highlight .tg-highlight.tg-highlight-ready,
  .tg-text-highlight .tg-highlight-fragment.tg-highlight-ready {
    background-size: var(--tg-highlight-size) !important;
  }

  .tg-text-highlight[data-tg-text-highlight-style="underline"]
  .tg-highlight.tg-highlight-ready {
    background-size: 100% var(--tg-highlight-underline-size) !important;
  }
}


/* Underline Draw */
.tg-underline-draw .tg-underline {
  position: relative;
  display: inline;
  background-image: linear-gradient(
    var(--tg-underline-color, #111111),
    var(--tg-underline-color, #111111)
  );
  background-repeat: no-repeat;
  background-position: left 100%;
  background-size: 0 var(--tg-underline-weight, 2px);
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  transition:
    background-size 0.72s cubic-bezier(0.22, 1, 0.36, 1);
}

.tg-underline-draw[data-tg-underline-direction="right-to-left"]
.tg-underline {
  background-position-x: right;
}

.tg-underline-draw .tg-underline.tg-underline-ready {
  background-size: 100% var(--tg-underline-weight, 2px);
}

@media (prefers-reduced-motion: reduce) {
  .tg-underline-draw .tg-underline {
    transition: none !important;
    background-size: 100% var(--tg-underline-weight, 2px) !important;
  }
}



/* Card Lift */
.tg-card-lift {
  transform-origin: center center;
  backface-visibility: hidden;
}


/* Card Float */
.tg-card-float {
  transform-origin: center center;
  backface-visibility: hidden;
}


/* Mask Reveal */
.tg-mask-reveal {
  isolation: isolate;
  backface-visibility: hidden;
}



.tg-mask-reveal img,
.tg-mask-reveal > .e-con-inner,
.tg-mask-reveal > .elementor-widget-container {
  backface-visibility: hidden;
  transform-origin: center center;
}

/* Count Up */
.tg-count-up .elementor-heading-title,
.tg-count-up .elementor-counter-number,
.tg-count-up [data-tg-count-value] {
  font-variant-numeric: tabular-nums;
}



/* Count Up — modes rouleau et défilement global */
.tg-count-up .tg-count-roller,
.tg-count-up .tg-count-global-window {
  display: inline-flex;
  align-items: baseline;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.tg-count-up .tg-count-digit-window,
.tg-count-up .tg-count-global-window {
  display: inline-block;
  height: 1em;
  line-height: 1em;
  overflow: hidden;
  vertical-align: -0.08em;
}

.tg-count-up .tg-count-digit-track,
.tg-count-up .tg-count-global-track {
  display: flex;
  flex-direction: column;
  line-height: 1em;
  will-change: transform;
}

.tg-count-up .tg-count-digit-cell,
.tg-count-up .tg-count-global-cell {
  display: block;
  flex: 0 0 1em;
  height: 1em;
  line-height: 1em;
  white-space: nowrap;
}

.tg-count-up .tg-count-fixed {
  display: inline-block;
  white-space: pre;
}

/* Count Up — éviter l'affichage fugitif de la valeur finale avant initialisation. */
.tg-motion-js .tg-count-up:not(.tg-count-up-ready) .elementor-heading-title,
.tg-motion-js .tg-count-up:not(.tg-count-up-ready) .elementor-counter-number,
.tg-motion-js .tg-count-up:not(.tg-count-up-ready) [data-tg-count-value] {
  visibility: hidden;
}


/* Component — Button Arrow
 * La classe est appliquée au widget Elementor, pas au lien interne.
 * Aucun style graphique n'est imposé : seule l'icône est animée.
 */
.tg-button-arrow {
  --tg-button-arrow-distance: 0.38em;
  --tg-button-arrow-duration: 220ms;
  --tg-button-arrow-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

.tg-button-arrow .elementor-button-icon,
a.tg-button-arrow > [aria-hidden="true"] {
  display: inline-block;
  transform: translate3d(0, 0, 0);
  transition: transform var(--tg-button-arrow-duration) var(--tg-button-arrow-ease);
  will-change: transform;
}

.tg-button-arrow:hover .elementor-button-icon.elementor-align-icon-right,
.tg-button-arrow:focus-within .elementor-button-icon.elementor-align-icon-right,
a.tg-button-arrow:hover > [aria-hidden="true"]:last-child,
a.tg-button-arrow:focus-visible > [aria-hidden="true"]:last-child {
  transform: translate3d(var(--tg-button-arrow-distance), 0, 0);
}

.tg-button-arrow:hover .elementor-button-icon.elementor-align-icon-left,
.tg-button-arrow:focus-within .elementor-button-icon.elementor-align-icon-left,
a.tg-button-arrow:hover > [aria-hidden="true"]:first-child,
a.tg-button-arrow:focus-visible > [aria-hidden="true"]:first-child {
  transform: translate3d(calc(var(--tg-button-arrow-distance) * -1), 0, 0);
}

@media (prefers-reduced-motion: reduce) {
  .tg-button-arrow .elementor-button-icon,
  a.tg-button-arrow > [aria-hidden="true"] {
    transition: none !important;
    transform: none !important;
    will-change: auto;
  }
}


/* Editorial Motion */
.tg-number-marker,
.tg-reveal-accent [data-tg-accent],
.tg-reveal-accent .elementor-icon,
.tg-reveal-accent img {
  transform-origin: center center;
  backface-visibility: hidden;
}

.tg-quote-reveal .tg-quote-mark,
.tg-quote-reveal .tg-quote-text,
.tg-quote-reveal .tg-quote-author {
  will-change: transform, opacity;
}

@media (prefers-reduced-motion: reduce) {
  .tg-kicker-reveal,
  .tg-quote-reveal,
  .tg-number-marker,
  .tg-reveal-accent,
  .tg-reveal-accent [data-tg-accent],
  .tg-reveal-accent .elementor-icon,
  .tg-reveal-accent img {
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    clip-path: none !important;
  }
}


/* 1.25.1 — Reveal Image / Mask Reveal */
.tg-reveal-image,
.tg-mask-reveal {
  isolation: isolate;
}

.tg-reveal-image img {
  backface-visibility: hidden;
  transform-origin: center center;
}

.tg-mask-reveal[data-tg-mask-direction^="diagonal"],
.tg-mask-reveal[data-tg-mask-direction^="circle"],
.tg-mask-reveal[data-tg-mask-direction^="corner"] {
  overflow: hidden;
}


/* Menu Reveal */
.tg-menu-reveal .elementor-nav-menu--main > .elementor-nav-menu > li,
.tg-menu-reveal .elementor-nav-menu--dropdown > .elementor-nav-menu > li,
.tg-menu-reveal .e-n-menu-wrapper > .e-n-menu > .e-n-menu-item,
.tg-menu-reveal nav > ul.menu > li,
.tg-menu-reveal [role="menubar"] > [role="none"],
.tg-menu-reveal [role="menubar"] > [role="menuitem"] {
  backface-visibility: hidden;
}

@media (prefers-reduced-motion: reduce) {
  .tg-menu-reveal .elementor-nav-menu--main > .elementor-nav-menu > li,
  .tg-menu-reveal .elementor-nav-menu--dropdown > .elementor-nav-menu > li,
  .tg-menu-reveal .e-n-menu-wrapper > .e-n-menu > .e-n-menu-item,
  .tg-menu-reveal nav > ul.menu > li,
  .tg-menu-reveal [role="menubar"] > [role="none"],
  .tg-menu-reveal [role="menubar"] > [role="menuitem"] {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    translate: none !important;
  }
}

/* Interactions Bouton */
.tg-button-hover-lift .elementor-button,
.tg-button-hover-scale-soft .elementor-button {
  transition:
    translate 240ms cubic-bezier(0.22, 1, 0.36, 1),
    scale 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.tg-button-hover-icon-slide .elementor-button-icon {
  transition: translate 260ms cubic-bezier(0.22, 1, 0.36, 1);
}

.tg-button-hover-light-sweep .elementor-button {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.tg-button-hover-light-sweep .elementor-button::before {
  position: absolute;
  z-index: 0;
  top: -35%;
  left: -45%;
  width: 32%;
  height: 170%;
  content: "";
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.5),
    transparent
  );
  transform: skewX(-18deg);
  translate: 0 0;
  transition:
    translate 600ms cubic-bezier(0.22, 1, 0.36, 1),
    opacity 180ms ease-out;
}

.tg-button-hover-light-sweep .elementor-button-content-wrapper {
  position: relative;
  z-index: 1;
}

@media (hover: hover) and (pointer: fine) {
  .tg-button-hover-lift .elementor-button:hover,
  .tg-button-hover-lift .elementor-button:focus-visible {
    translate: 0 -3px;
  }

  .tg-button-hover-scale-soft .elementor-button:hover,
  .tg-button-hover-scale-soft .elementor-button:focus-visible {
    scale: 1.035;
  }

  .tg-button-hover-icon-slide .elementor-button:hover .elementor-button-icon,
  .tg-button-hover-icon-slide .elementor-button:focus-visible .elementor-button-icon {
    translate: 6px 0;
  }

  .tg-button-hover-icon-slide .elementor-button:hover .elementor-align-icon-left,
  .tg-button-hover-icon-slide .elementor-button:focus-visible .elementor-align-icon-left {
    translate: -6px 0;
  }

  .tg-button-hover-light-sweep .elementor-button:hover::before,
  .tg-button-hover-light-sweep .elementor-button:focus-visible::before {
    opacity: 1;
    translate: 470% 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .tg-button-hover-lift .elementor-button,
  .tg-button-hover-scale-soft .elementor-button,
  .tg-button-hover-icon-slide .elementor-button-icon,
  .tg-button-hover-light-sweep .elementor-button::before {
    transition: none !important;
    translate: none !important;
    scale: 1 !important;
  }

  .tg-button-hover-light-sweep .elementor-button::before {
    display: none !important;
  }
}

