/* ══════════════════════════════════════════════════════════════
   ANIMATIONS
   
   Centralized keyframe definitions for all CSS animations.
   Used across pages and components for consistent motion.
   
   Related files:
   - vorasense-pages.css (base styles)
   - landing-artifact.css (aurora animations)
   - landing-pricing.css (price lock animations)
   ══════════════════════════════════════════════════════════════ */

/* Fade-in Animation - Primary entrance effect */
@keyframes vs-fade-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

/* Aurora Pulse - Breathing glow effect */
@keyframes vs-aurora-pulse {
  0% {
    opacity: 0.3;
    transform: scale(1);
  }

  50% {
    opacity: 0.6;
    transform: scale(1.1);
  }

  100% {
    opacity: 0.3;
    transform: scale(1);
  }
}

/* Aurora Shimmer - Animated gradient position */
@keyframes vs-aurora-shimmer {
  0% {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 50%;
  }

  100% {
    background-position: 0% 50%;
  }
}

/* Lock Unlock - Scale and rotate entrance */
@keyframes vs-lock-unlock {
  0% {
    transform: rotate(0deg) scale(0);
    opacity: 0;
  }

  60% {
    transform: rotate(0deg) scale(1.15);
  }

  100% {
    transform: rotate(0deg) scale(1);
    opacity: 1;
  }
}

/* Scale In - Entrance with scale */
@keyframes vs-scale-in {
  0% {
    transform: scale(0.8);
    opacity: 0;
  }

  100% {
    transform: scale(1);
    opacity: 1;
  }
}

/* Savings Pulse - Outward pulse with shadow */
@keyframes vs-savings-pulse {
  0% {
    transform: scale(0.8);
    opacity: 0;
    box-shadow: 0 0 0 0 rgba(230, 154, 71, 0.4);
  }

  50% {
    box-shadow: 0 0 0 8px rgba(230, 154, 71, 0);
  }

  100% {
    transform: scale(1);
    opacity: 1;
    box-shadow: 0 0 0 0 rgba(230, 154, 71, 0);
  }
}

/* Badge Slide In - Horizontal entry */
@keyframes vs-badge-slide-in {
  0% {
    opacity: 0;
    transform: translateX(-50%) translateY(-20px);
  }

  100% {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }
}

/* Pulse Rotate - Subtle rotation with scale */
@keyframes vs-pulse-rotate {

  0%,
  100% {
    transform: rotate(0deg) scale(1);
  }

  25% {
    transform: rotate(-8deg) scale(1.05);
  }

  75% {
    transform: rotate(8deg) scale(1.05);
  }
}

/* Seal Stamp - Stamp impression effect */
@keyframes vs-seal-stamp {
  0% {
    transform: scale(0) rotate(-180deg);
    opacity: 0;
  }

  60% {
    transform: scale(1.2) rotate(10deg);
  }

  100% {
    transform: scale(1) rotate(0deg);
    opacity: 1;
  }
}

/* Sparkle - Pulse scale effect */
@keyframes vs-sparkle {

  0%,
  100% {
    transform: scale(1);
    opacity: 1;
  }

  50% {
    transform: scale(1.2);
    opacity: 0.8;
  }
}
