@keyframes ws-pulse {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.6;
  }
}
@keyframes ws-float {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-6px);
  }
}
@keyframes ws-shimmer {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}
@keyframes ws-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
@keyframes ws-slide-in-down {
  from {
    opacity: 0;
    transform: translateY(-12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes ws-slide-in-up {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes ws-scale-in {
  from {
    opacity: 0;
    transform: scale(0.95);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes ws-glow {
  0%,
  100% {
    box-shadow: 0 0 0 rgba(77, 242, 193, 0);
  }
  50% {
    box-shadow: 0 0 24px rgba(77, 242, 193, 0.3);
  }
}

.ws-btn-primary {
  animation: ws-glow 3s ease-in-out infinite;
}
.ws-hero-badge {
  animation: ws-pulse 2.5s ease-in-out infinite;
}
.ws-bonus-card:hover .ws-bonus-icon {
  animation: ws-float 1.2s ease-in-out infinite;
}

.ws-mobile-nav.open {
  animation: ws-slide-in-down 0.22s ease;
}
.ws-reply-form.open {
  animation: ws-scale-in 0.18s ease;
}
.ws-rating-details.open {
  animation: ws-scale-in 0.15s ease;
}

.ws-hero-inner {
  animation: ws-slide-in-up 0.45s ease 0.1s both;
}
.ws-review-card {
  animation: ws-scale-in 0.3s ease both;
}

.ws-skeleton {
  background: linear-gradient(
    90deg,
    var(--clr-card) 25%,
    rgba(87, 76, 123, 0.15) 50%,
    var(--clr-card) 75%
  );
  background-size: 200% 100%;
  animation: ws-shimmer 1.5s infinite;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}
