/*--------------------------------------------------------------
  Motion system — subtle scroll reveals, parallax, hero depth.
  Overrides the vendor animate.css keyframes already wired to the
  site's existing .wow elements so every section that already
  animates on scroll becomes calmer, without touching markup.
--------------------------------------------------------------*/

/* Softer, shorter, consistent timing for every .wow element */
.animated {
  animation-duration: 850ms;
  animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
  animation-fill-mode: both;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 26px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translate3d(0, -26px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translate3d(-26px, 0, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translate3d(26px, 0, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

/* ---- Image reveal (JS adds .img-reveal, then .is-visible once in view) ---- */
.img-reveal {
  opacity: 0;
  transform: translateY(18px) scale(1.03);
  transition: opacity 800ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 900ms cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}

.img-reveal.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* ---- Generic fade-up reveal (JS adds .reveal-up, then .is-visible once in view) ---- */
.reveal-up {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 800ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 800ms cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}

.reveal-up.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ---- Stat / counter number ---- */
.odometer {
  display: inline-block;
}

/* ---- Hero depth-on-scroll ---- */
.main-slider-one__content,
.main-slider-one__img {
  transition: opacity 200ms linear;
}

.main-slider-one .image-layer,
.main-slider-one__img {
  will-change: transform;
}

/* ---- Parallax containers: content stays put, background/image drifts ---- */
[data-parallax] {
  will-change: transform;
}

/* ---- Sticky header: smoother state change ---- */
.stricky-header--one.stricky-header .main-menu__wrapper {
  transition: background-color 300ms ease, box-shadow 300ms ease;
}

/* ---- Service / list cards: restrained lift on hover ---- */
.services-two__list-item {
  transition: transform 350ms cubic-bezier(0.16, 1, 0.3, 1);
}

.services-two__list-item:hover {
  transform: translateY(-4px);
}

.services-one__right-content ul li .outer-box {
  transition: transform 350ms cubic-bezier(0.16, 1, 0.3, 1);
}

/* ---- Respect reduced motion: kill non-essential animation entirely ---- */
@media (prefers-reduced-motion: reduce) {

  .wow,
  .animated,
  .img-reveal,
  .reveal-up {
    animation: none !important;
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
  }

  .main-slider-one .image-layer,
  .main-slider-one__content,
  .main-slider-one__img,
  [data-parallax] {
    transform: none !important;
    transition: none !important;
  }

  .services-two__list-item:hover,
  .team-one__single:hover .team-one__single-img .inner img,
  .team-two__single:hover .team-two__single-img .inner img {
    transform: none !important;
  }
}