/* Scroll reveal motion (Elementor-like) */
html,
body {
  overflow-x: clip;
  max-width: 100%;
}

:root{
  --sr-duration: 1100ms;
  --sr-ease: cubic-bezier(.22,1,.36,1);
  --sr-distance: 44px;
}

.sr{
  opacity: 0;
  transform: translate3d(0,var(--sr-distance),0);
  transition-property: opacity, transform;
  transition-duration: var(--sr-duration);
  transition-timing-function: var(--sr-ease);
  will-change: opacity, transform;
}

.sr[data-sr="fade-left"]{ transform: translate3d(calc(var(--sr-distance) * -1), 0, 0); }
.sr[data-sr="fade-right"]{ transform: translate3d(var(--sr-distance), 0, 0); }
.sr[data-sr="fade-up"]{ transform: translate3d(0,var(--sr-distance),0); }
.sr[data-sr="fade-down"]{ transform: translate3d(0,calc(var(--sr-distance) * -1),0); }

.sr.is-visible{
  opacity: 1;
  transform: translate3d(0,0,0);
}

@media (prefers-reduced-motion: reduce){
  .sr{
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* Old-site compatible (de_reveal_animation) stand-in */
.de_reveal_animation_yes{
  --de-duration: 2000ms;
  --de-easing: cubic-bezier(.22,1,.36,1);
  --de-distance: 48px;
  --de-delay: 0ms;
  opacity: 0;
  transform: translate3d(0,var(--de-distance),0);
  transition: opacity var(--de-duration) var(--de-easing) var(--de-delay),
              transform var(--de-duration) var(--de-easing) var(--de-delay);
  will-change: opacity, transform;
}

.de_reveal_animation_yes[data-de-reveal-animation-style="fu"]{ transform: translate3d(0,var(--de-distance),0); }
.de_reveal_animation_yes[data-de-reveal-animation-style="fd"]{ transform: translate3d(0,calc(var(--de-distance) * -1),0); }
.de_reveal_animation_yes[data-de-reveal-animation-style="fl"]{ transform: translate3d(var(--de-distance),0,0); }
.de_reveal_animation_yes[data-de-reveal-animation-style="fr"]{ transform: translate3d(calc(var(--de-distance) * -1),0,0); }

.de_reveal_animation_yes.de-reveal-visible{
  opacity: 1;
  transform: translate3d(0,0,0);
}

@media (prefers-reduced-motion: reduce){
  .de_reveal_animation_yes{
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}