/* Initial state — JS adds .is-inview on scroll (Webflow: SCROLL_INTO_VIEW + SLIDE_EFFECT) */
.eff-animate {
  opacity: 0;
  transform: translate3d(0, 12%, 0);
  transition: opacity var(--eff-motion-duration) var(--eff-motion-ease),
    transform var(--eff-motion-duration) var(--eff-motion-ease);
  transition-delay: var(--eff-delay, 0ms);
}

.eff-animate--fade {
  transform: none;
}

.eff-animate--grow {
  transform: scale(0.92);
}

.eff-animate--left {
  transform: translate3d(-8%, 0, 0);
}

.eff-animate.is-inview {
  opacity: 1;
  transform: none;
}

/* Hero / PAGE_START — class on body or section via Breakdance */
.eff-hero-animate .eff-animate--on-load {
  opacity: 0;
  transform: translate3d(0, 8%, 0);
  animation: eff-hero-in var(--eff-motion-duration) var(--eff-motion-ease) forwards;
  animation-delay: var(--eff-delay, 0ms);
}

@keyframes eff-hero-in {
  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes eff-heading-fill-in {
  from {
    color: transparent;
    -webkit-text-fill-color: transparent;
  }
  to {
    color: var(--eff-white) !important;
    -webkit-text-fill-color: var(--eff-white) !important;
    -webkit-text-stroke-color: var(--eff-white);
  }
}

@media (prefers-reduced-motion: reduce) {
  .eff-animate,
  .eff-animate--grow,
  .eff-animate--left,
  .eff-hero-animate .eff-animate--on-load {
    opacity: 1;
    transform: none;
    animation: none;
    transition: none;
  }

  .eff-media__img,
  .eff-media__veil,
  .eff-stat-bar__fill,
  .eff-btn__overlay,
  .eff-btn__arrow {
    transition: none;
  }

  .eff-media__img {
    transform: scale(var(--eff-media-scale-end, 1));
  }

  .eff-media__veil {
    transform: translateY(-110%);
  }
    animation: none;
    transform: scale(1);
  }

  .eff-media--hover-grow.is-inview:hover .eff-media__img {
    transform: scale(var(--eff-media-scale-end));
  }

  .eff-stat-bar__fill {
    width: var(--eff-bar-width, 96%);
  }

  .eff-heading--hero .eff-heading-fill,
  .eff-hero-animate .eff-heading-fill {
    animation: none;
    color: var(--eff-white) !important;
    -webkit-text-fill-color: var(--eff-white) !important;
  }
}
