/* Modern FlashEvent Styles */

/* Custom Animations */
@keyframes gradient-shift {
    0%, 100% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
}

/* Navigation Links */
.nav-link {
    @apply text-gray-300 hover:text-white transition-colors duration-300 font-medium relative;
}

.nav-link::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    height: 2px;
    background: linear-gradient(to right, #E63946, #5DADE2);
    transition: width 0.3s ease;
}

.nav-link:hover::after {
    width: 100%;
}

/* CTA Buttons */
.cta-button {
    @apply px-8 py-4 rounded-full font-bold text-white bg-gradient-to-r from-primary to-secondary
           hover:shadow-2xl hover:scale-105 transition-all duration-300 flex items-center space-x-3
           shadow-lg hover:from-primary/90 hover:to-secondary/90;
}

.cta-button-small {
    @apply px-6 py-3 rounded-full font-semibold text-white bg-gradient-to-r from-primary to-accent
           hover:shadow-xl hover:scale-105 transition-all duration-300 flex items-center
           shadow-md hover:from-primary/90 hover:to-accent/90;
}

/* Stats Cards */
.stat-card {
    @apply text-center p-6 rounded-2xl bg-white/5 backdrop-blur-sm border border-white/10
           hover:bg-white/10 hover:border-white/20 transition-all duration-300;
}

/* Bento Grid Cards */
.bento-card {
    @apply p-8 rounded-3xl bg-gradient-to-br from-white/5 to-white/10 backdrop-blur-sm
           border border-white/10 hover:border-white/30 transition-all duration-500
           hover:transform hover:scale-[1.02] hover:shadow-2xl;
}

/* Step Cards */
.step-card {
    @apply relative text-center p-8 rounded-3xl bg-gradient-to-br from-white/5 to-white/10
           backdrop-blur-sm border border-white/10 hover:border-primary/50
           transition-all duration-500 hover:transform hover:scale-105;
}

.step-number {
    @apply absolute -top-6 left-1/2 transform -translate-x-1/2 w-12 h-12 rounded-full
           bg-gradient-to-br from-primary to-accent flex items-center justify-center
           text-2xl font-black text-white shadow-lg;
}

/* Testimonial Cards */
.testimonial-card {
    @apply p-8 rounded-3xl bg-gradient-to-br from-white/5 to-white/10 backdrop-blur-sm
           border border-white/10 hover:border-primary/30 transition-all duration-500
           hover:transform hover:scale-105 hover:shadow-2xl;
}

/* Glassmorphism Effects */
.glass {
    @apply bg-white/10 backdrop-blur-xl border border-white/20;
}

.glass-dark {
    @apply bg-black/10 backdrop-blur-xl border border-black/20;
}

/* Gradient Text */
.gradient-text {
    @apply bg-gradient-to-r from-primary via-accent to-secondary bg-clip-text text-transparent;
}

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

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: #000;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(to bottom, #E63946, #5DADE2);
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(to bottom, #C8293A, #4A9DD6);
}

/* Focus States */
a:focus,
button:focus {
    @apply outline-none ring-2 ring-primary/50 ring-offset-2 ring-offset-black;
}

/* Hover Glow Effects */
.hover-glow:hover {
    filter: drop-shadow(0 0 20px rgba(230, 57, 70, 0.5));
}

/* Background Patterns */
.grid-pattern {
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
    background-size: 60px 60px;
}

/* Mobile Optimizations */
@media (max-width: 768px) {
    .bento-card {
        @apply p-6;
    }

    .step-card {
        @apply p-6;
    }

    .testimonial-card {
        @apply p-6;
    }
}

/* Print Styles */
@media print {
    .no-print {
        display: none !important;
    }
}

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