:root {
  --primary: #1173d4;
  --primary-dark: #0d5fb1;
  --primary-glow: rgba(17, 115, 212, 0.3);
  --bg-light: #f6f7f8;
  --bg-dark: #101922;
  --text-dark: #0f172a;
  --glass: rgba(255, 255, 255, 0.7);
  --glass-dark: rgba(16, 25, 34, 0.7);
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes pulse-glow {
  0% { box-shadow: 0 0 0 0 var(--primary-glow); }
  70% { box-shadow: 0 0 0 15px rgba(17, 115, 212, 0); }
  100% { box-shadow: 0 0 0 0 rgba(17, 115, 212, 0); }
}

.premium-card {
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  border: 1px solid rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(8px);
}

.premium-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
  border-color: var(--primary);
}

.hero-gradient {
  background: linear-gradient(135deg, var(--bg-dark) 0%, #1e293b 100%);
}

.btn-premium {
  position: relative;
  overflow: hidden;
  transition: all 0.3s ease;
}

.btn-premium::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 300%;
  height: 300%;
  background: rgba(255, 255, 255, 0.1);
  transform: translate(-50%, -50%) scale(0);
  border-radius: 50%;
  transition: transform 0.6s ease;
}

.btn-premium:hover::after {
  transform: translate(-50%, -50%) scale(1);
}

.glass-nav {
  backdrop-filter: blur(12px);
  background: rgba(255, 255, 255, 0.8);
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.dark .glass-nav {
  background: rgba(16, 25, 34, 0.8);
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.stagger-in > * {
  animation: fadeIn 0.8s ease backwards;
}

.stagger-in > *:nth-child(1) { animation-delay: 0.1s; }
.stagger-in > *:nth-child(2) { animation-delay: 0.2s; }
.stagger-in > *:nth-child(3) { animation-delay: 0.3s; }
.stagger-in > *:nth-child(4) { animation-delay: 0.4s; }