/* Shared Base Styles */
*, ::before, ::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Utility: Animate onScroll fade-up */
.animate-fade-in {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.animate-fade-in.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Hover lift */
.hover-lift {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.hover-lift:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(0,0,0,0.10);
}

/* Glass morphism */
.glass-panel {
  background: rgba(255,255,255,0.82);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,0.55);
  border-radius: 16px;
}

/* Smooth pulse for CTA rings */
@keyframes pulse-ring {
  0% { box-shadow: 0 0 0 0 rgba(59,130,246,0.45); }
  70% { box-shadow: 0 0 0 18px rgba(59,130,246,0); }
  100% { box-shadow: 0 0 0 0 rgba(59,130,246,0); }
}
.pulse-ring {
  animation: pulse-ring 2.4s infinite;
}

/* Section spacing */
.section-pad {
  padding: 80px 0;
}
@media (max-width: 768px) {
  .section-pad {
    padding: 48px 0;
  }
}

/* ============================================
   Page-Specific Custom Styles - HHPoker CS
   Theme: Warm Amber + Brown Club Platform
   ============================================ */

/* Gold shimmer animation on CTA button */
@keyframes shimmer {
  0% {
    background-position: -200% center;
  }
  100% {
    background-position: 200% center;
  }
}

.btn-shimmer {
  position: relative;
  overflow: hidden;
}

.btn-shimmer::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255, 255, 255, 0.25) 25%,
    rgba(255, 255, 255, 0.4) 50%,
    rgba(255, 255, 255, 0.25) 75%,
    transparent 100%
  );
  background-size: 200% 100%;
  animation: shimmer 2.5s ease-in-out infinite;
  pointer-events: none;
}

/* Warm glow effect for cards on hover */
.warm-glow {
  transition: box-shadow 0.4s ease;
}
.warm-glow:hover {
  box-shadow: 0 0 30px rgba(245, 158, 11, 0.2), 0 0 60px rgba(245, 158, 11, 0.08);
}

/* Soft amber pulse for live indicator */
@keyframes amber-pulse {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.5);
  }
  50% {
    box-shadow: 0 0 0 12px rgba(245, 158, 11, 0);
  }
}

.amber-pulse-ring {
  animation: amber-pulse 2s ease-in-out infinite;
}

/* FAQ accordion styles */
.faq-toggle i {
  transition: transform 0.3s ease;
}
.faq-toggle[aria-expanded="true"] i {
  transform: rotate(180deg);
}
.faq-body {
  transition: max-height 0.4s ease, opacity 0.3s ease;
}

/* Counter animation */
@keyframes countUp {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.counter-animated {
  animation: countUp 0.6s ease forwards;
}

/* Hero wave divider smoothness */
.hero-wave {
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
}

/* Custom scrollbar for warm theme */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: #fffbeb;
}
::-webkit-scrollbar-thumb {
  background: linear-gradient(to bottom, #f59e0b, #b45309);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(to bottom, #d97706, #92400e);
}

/* Testimonial card lift */
.testimonial-card {
  transition: transform 0.35s ease, box-shadow 0.35s ease;
}
.testimonial-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 24px 48px rgba(120, 53, 15, 0.12);
}

/* CTA section extra hover effects */
#cta a {
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
#cta a:hover {
  transform: translateY(-3px);
}

/* Stats section text rendering */
#stats .counter-value {
  text-shadow: 0 2px 10px rgba(245, 158, 11, 0.3);
}

/* Navbar scroll shadow enhancement */
nav.sticky {
  transition: box-shadow 0.3s ease;
}

/* Mobile optimizations */
@media (max-width: 768px) {
  .btn-shimmer::after {
    animation-duration: 3.5s;
  }

  #hero h1 {
    font-size: 2.5rem;
    line-height: 1.2;
  }

  #hero .trust-badges {
    flex-wrap: wrap;
    gap: 0.75rem;
  }
}

/* Print styles */
@media print {
  nav, #cta, footer {
    display: none;
  }
}
