/**
 * Custom Styles for Hostinger Deployment Pack
 * System of Ballet Class Landing Page
 */

/* 1. Reset & Smooth Scrolling */
html {
  scroll-behavior: smooth;
}

/* 2. Custom Keyframe Animations */
@keyframes pulseSlow {
  0%, 100% {
    opacity: 1;
    transform: translate(50%, -50%) scale(1);
  }
  50% {
    opacity: 0.9;
    transform: translate(50%, -50%) scale(1.03);
  }
}

.animate-pulse-slow {
  animation: pulseSlow 3s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

/* Scrollbar customization for popups */
.scrollbar-thin::-webkit-scrollbar {
  width: 5px;
}
.scrollbar-thin::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 99px;
}
.scrollbar-thin::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.2);
  border-radius: 99px;
}
.scrollbar-thin::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.3);
}

/* 3. Helper utility classes */
.bg-stone-850 {
  background-color: #20201e;
}

/* Custom overlay background blur */
.backdrop-blur-xs {
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}