/* Keyframe Animations */
@keyframes pulse-glow {
  0%,
  100% {
    box-shadow: 0 0 20px rgba(220, 38, 38, 0.5), 0 0 40px rgba(220, 38, 38, 0.3);
  }
  50% {
    box-shadow: 0 0 30px rgba(220, 38, 38, 0.8), 0 0 60px rgba(220, 38, 38, 0.5);
  }
}

@keyframes float {
  0%,
  100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-10px);
  }
}

@keyframes slide-in {
  from {
    transform: translateX(-100%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes marquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

@keyframes tilt {
  0%,
  100% {
    transform: rotate(-1deg);
  }
  50% {
    transform: rotate(1deg);
  }
}

@keyframes spin-wheel {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

@keyframes shimmer {
  0% {
    background-position: -1000px 0;
  }
  100% {
    background-position: 1000px 0;
  }
}

/* Utility Classes */
.pulse-glow {
  animation: pulse-glow 2s ease-in-out infinite;
}

.float-animation {
  animation: float 3s ease-in-out infinite;
}

.tilt-animation {
  animation: tilt 2s ease-in-out infinite;
}

.marquee {
  animation: marquee 30s linear infinite;
}

.shimmer {
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
  background-size: 1000px 100%;
  animation: shimmer 3s infinite;
}

/* Gradient Backgrounds */
.gradient-hero {
  background: linear-gradient(135deg, #1a1a1a 0%, #2d1a1a 50%, #1a1a1a 100%);
}

.gradient-dark {
  background: linear-gradient(180deg, #0f0f0f 0%, #1a1a1a 100%);
}

.gradient-red {
  background: linear-gradient(135deg, #dc2626 0%, #991b1b 100%);
}

/* Card Styles */
.game-card {
  transition: all 0.3s ease;
  background: rgba(30, 30, 30, 0.8);
  backdrop-filter: blur(10px);
}

.game-card:hover {
  transform: translateY(-8px) scale(1.02);
  box-shadow: 0 20px 40px rgba(220, 38, 38, 0.3);
}

/* Prose Styling */
.prose {
  max-width: 65ch;
  color: #e5e5e5;
}

.prose h2 {
  color: #ffffff;
  font-weight: 700;
  margin-top: 2em;
  margin-bottom: 1em;
}

.prose h3 {
  color: #f5f5f5;
  font-weight: 600;
  margin-top: 1.6em;
  margin-bottom: 0.6em;
}

.prose p {
  margin-top: 1.25em;
  margin-bottom: 1.25em;
  line-height: 1.7;
}

.prose ul,
.prose ol {
  margin-top: 1.25em;
  margin-bottom: 1.25em;
  padding-left: 1.625em;
}

.prose li {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}

.prose strong {
  color: #dc2626;
  font-weight: 600;
}

.prose a {
  color: #dc2626;
  text-decoration: underline;
  transition: color 0.2s;
}

.prose a:hover {
  color: #991b1b;
}

/* Pattern Background */
.pattern-dots {
  background-image: radial-gradient(circle, rgba(220, 38, 38, 0.1) 1px, transparent 1px);
  background-size: 20px 20px;
}

.pattern-grid {
  background-image: linear-gradient(rgba(220, 38, 38, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(220, 38, 38, 0.05) 1px, transparent 1px);
  background-size: 50px 50px;
}

/* Smooth Scroll */
html {
  scroll-behavior: smooth;
}

/* Mobile Menu */
.mobile-menu {
  transform: translateX(100%);
  transition: transform 0.3s ease-in-out;
}

.mobile-menu.active {
  transform: translateX(0);
}

/* Sticky CTA Banner */
.sticky-cta {
  transform: translateY(100%);
  transition: transform 0.3s ease-in-out;
}

.sticky-cta.visible {
  transform: translateY(0);
}

/* Slot Badge Styles */
.slot-badge {
  font-size: 0.7rem;
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
  font-weight: 600;
  text-transform: uppercase;
}

.badge-rtp {
  background: linear-gradient(135deg, #10b981, #059669);
}

.badge-jackpot {
  background: linear-gradient(135deg, #f59e0b, #d97706);
}

.badge-bonus {
  background: linear-gradient(135deg, #8b5cf6, #7c3aed);
}

/* Winner Card Animation */
.winner-card {
  background: linear-gradient(135deg, rgba(220, 38, 38, 0.2), rgba(153, 27, 27, 0.2));
  border: 2px solid rgba(220, 38, 38, 0.5);
}

/* Feature Glow */
.feature-glow {
  box-shadow: 0 0 40px rgba(220, 38, 38, 0.6), 0 0 80px rgba(220, 38, 38, 0.4);
  border: 3px solid #dc2626;
}

/* Trustpilot Style Rating */
.rating-stars {
  color: #00b67a;
}

/* Wheel of Luck */
.wheel-container {
  position: relative;
}

.wheel {
  width: 300px;
  height: 300px;
  border-radius: 50%;
  border: 8px solid #dc2626;
  position: relative;
  overflow: hidden;
}

.wheel-segment {
  position: absolute;
  width: 50%;
  height: 50%;
  transform-origin: 100% 100%;
}

/* Alert Banner */
.alert-banner {
  background: rgba(220, 38, 38, 0.1);
  border-left: 4px solid #dc2626;
}

/* 3D Button Effect */
.btn-3d {
  box-shadow: 0 6px 0 #991b1b, 0 8px 10px rgba(0, 0, 0, 0.5);
  transition: all 0.1s;
}

.btn-3d:active {
  box-shadow: 0 2px 0 #991b1b, 0 3px 5px rgba(0, 0, 0, 0.5);
  transform: translateY(4px);
}

/* Payment Grid */
.payment-logo {
  filter: grayscale(100%) brightness(0.8);
  transition: filter 0.3s;
}

.payment-logo:hover {
  filter: grayscale(0%) brightness(1);
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .wheel {
    width: 200px;
    height: 200px;
  }
}