/* Custom Animations */

/* Scroll Reveal Classes (Triggered via IntersectionObserver) */
.reveal {
  opacity: 0;
  transition: opacity 1s cubic-bezier(0.16, 1, 0.3, 1), transform 1s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal-up {
  transform: translateY(50px);
}

.reveal-left {
  transform: translateX(50px);
}

.reveal-right {
  transform: translateX(-50px);
}

.reveal-zoom {
  transform: scale(0.9);
}

.reveal.active {
  opacity: 1;
  transform: translate(0) scale(1);
}

/* Floating Animation for Cards & SVG Elements */
.float-element-slow {
  animation: floatSlow 8s ease-in-out infinite alternate;
}

.float-element-fast {
  animation: floatFast 5s ease-in-out infinite alternate;
}

@keyframes floatSlow {
  0% {
    transform: translateY(0) rotate(0deg);
  }
  100% {
    transform: translateY(-20px) rotate(3deg);
  }
}

@keyframes floatFast {
  0% {
    transform: translateY(0) scale(1);
  }
  100% {
    transform: translateY(-12px) scale(1.03);
  }
}

/* Spinner Spin */
.spin-element {
  animation: spin 20s linear infinite;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* Water Ripple Effect for Buttons */
.ripple-btn {
  position: relative;
  overflow: hidden;
}

.ripple-btn::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  transition: width 0.6s ease-out, height 0.6s ease-out;
}

.ripple-btn:active::after {
  width: 300px;
  height: 300px;
  opacity: 0;
}

/* Card Hover Lift & Glow */
.hover-lift {
  transition: var(--transition-normal);
}

.hover-lift:hover {
  transform: translateY(-8px) scale(1.01);
  box-shadow: var(--shadow-lg);
}

/* Success Scale-up */
@keyframes scaleUp {
  0% {
    transform: scale(0.5);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

/* SVG Line Drawing */
.draw-svg path {
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  animation: drawLine 3s ease-out forwards;
}

@keyframes drawLine {
  to {
    stroke-dashoffset: 0;
  }
}

/* Pulse animation for CTA phone icon */
.pulse-icon {
  position: relative;
}

.pulse-icon::before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: rgba(0, 194, 168, 0.4);
  animation: pulseGlow 2s infinite;
  z-index: -1;
  top: 0;
  left: 0;
}

@keyframes pulseGlow {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(1.8);
    opacity: 0;
  }
}

/* Shimmer styling for Premium feeling */
.shimmer {
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.3) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  background-size: 200% 100%;
  animation: shimmerAnim 2.5s infinite;
}

@keyframes shimmerAnim {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}