/* EFLABS Pvt. Ltd. - Animations */

@keyframes ripple {
  to {
    transform: scale(3.2);
    opacity: 0;
  }
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes scrollDot {
  0% {
    transform: translateY(0);
    opacity: 1;
  }
  70% {
    transform: translateY(12px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 0;
  }
}

@keyframes gridDrift {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(-64px, -64px, 0);
  }
}

@keyframes float1 {
  from {
    transform: translate3d(0, 0, 0) scale(1);
  }
  to {
    transform: translate3d(6vw, 8vh, 0) scale(1.12);
  }
}

@keyframes float2 {
  from {
    transform: translate3d(0, 0, 0) scale(1.05);
  }
  to {
    transform: translate3d(-7vw, -6vh, 0) scale(0.95);
  }
}

/* Scroll reveal */
[data-reveal] {
  opacity: 0;
  transform: translate3d(0, 18px, 0);
  transition: opacity var(--dur-slow) var(--ease), transform var(--dur-slow) var(--ease);
  will-change: opacity, transform;
}
[data-reveal="fade"] {
  transform: none;
}
[data-reveal="scale"] {
  transform: scale(0.96);
}
[data-reveal="slide-left"] {
  transform: translate3d(-22px, 0, 0);
}
[data-reveal].is-visible {
  opacity: 1;
  transform: none;
}

/* Image reveal */
.img-reveal {
  overflow: hidden;
  border-radius: var(--radius-lg);
}
.img-reveal img {
  transform: scale(1.06);
  transition: transform var(--dur-slow) var(--ease);
}
.img-reveal.is-visible img,
.img-reveal:hover img {
  transform: scale(1);
}

/* Page transition */
.page-fade {
  animation: pageIn var(--dur-mid) var(--ease) both;
}
@keyframes pageIn {
  from {
    opacity: 0;
    transform: translate3d(0, 8px, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
  [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
  }
  .bg-canvas,
  .mouse-glow {
    display: none;
  }
}