/* Custom Styles for Šumperský Majáles 2026 */

/* Smooth scrolling is handled in JavaScript with proper offset calculation */

/* ============================================================================
   SKELETON SCREEN - Minimalist Loading State
   ============================================================================ */

/* Skeleton overlay - shown only while hero image is loading */
#skeleton-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: linear-gradient(135deg, #f9344f 0%, #f94b7f 50%, #f9344f 100%);
    background-size: 400% 400%;
    animation: gradientPulse 3s ease infinite;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 1;
    transition: opacity 0.5s ease, visibility 0.5s ease;
}

#skeleton-overlay.hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

/* Pulsing gradient animation */
@keyframes gradientPulse {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}

/* No additional skeleton elements needed - just clean gradient */

/* Smooth fade-in for actual content once loaded */
body.loaded #hero {
    animation: fadeIn 0.6s ease-out;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Infinite Gallery Scroll */
.gallery-scroll {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE and Edge */
}

.gallery-scroll::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera */
}

.gallery-track {
    display: flex;
    gap: 1.5rem;
    animation: scroll-left 30s linear infinite;
    will-change: transform;
}

.gallery-item {
    flex-shrink: 0;
    height: 600px;
}

.gallery-item img {
    height: 100%;
    width: auto;
    object-fit: cover;
}

@media (max-width: 768px) {
    .gallery-item {
        height: 300px;
    }
    .gallery-track {
        animation: scroll-left 20s linear infinite;
    }
}

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

/* Smooth transition for dragging */
.gallery-scroll {
    user-select: none;
    -webkit-overflow-scrolling: touch; /* iOS momentum scrolling */
    touch-action: pan-x; /* Only allow horizontal scrolling */
}

.gallery-track img {
    pointer-events: none;
    user-select: none;
    -webkit-user-drag: none;
    -webkit-touch-callout: none; /* Disable iOS image save dialog */
}

/* Custom animations */
@keyframes fade-in {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes slide-up {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fade-in {
    animation: fade-in 1s ease-out;
}

.animate-slide-up {
    animation: slide-up 0.8s ease-out;
}

.animation-delay-200 {
    animation-delay: 0.2s;
    animation-fill-mode: backwards;
}

.animation-delay-400 {
    animation-delay: 0.4s;
    animation-fill-mode: backwards;
}

/* Artist card hover effects */
.artist-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.artist-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(249, 52, 79, 0.3);
}

/* Navbar show/hide */
#navbar.navbar-visible {
    transform: translateY(0) !important;
}

/* Modal animations */
#artist-modal {
    backdrop-filter: blur(10px);
}

#artist-modal.show {
    display: flex !important;
}

/* Responsive typography */
@media (max-width: 768px) {
    .font-display {
        letter-spacing: 0.05em;
    }
}

/* Gradient text effect */
.gradient-text {
    background: linear-gradient(135deg, #f9344f 0%, #f94b7f 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ============================================================================
   MICROINTERACTIONS - Premium Button Effects
   ============================================================================ */

/* Subtle pulse animation for primary CTA buttons */
@keyframes pulse-glow {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(249, 52, 79, 0.7);
    }
    50% {
        box-shadow: 0 0 0 15px rgba(249, 52, 79, 0);
    }
}

/* Gentle shake to grab attention */
@keyframes shake-gentle {
    0%, 100% { transform: translateX(0); }
    10%, 30%, 50%, 70%, 90% { transform: translateX(-2px); }
    20%, 40%, 60%, 80% { transform: translateX(2px); }
}

/* Heartbeat pulse for extra emphasis */
@keyframes heartbeat {
    0%, 100% { transform: scale(1); }
    10%, 30% { transform: scale(1.05); }
    20%, 40% { transform: scale(1); }
}

/* Ripple effect on click */
@keyframes ripple {
    0% {
        transform: scale(0);
        opacity: 0.6;
    }
    100% {
        transform: scale(4);
        opacity: 0;
    }
}

/* Primary CTA button - subtle continuous pulse */
.btn-cta-primary {
    position: relative;
    overflow: hidden;
    animation: pulse-glow 3s ease-in-out infinite;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-cta-primary:hover {
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 10px 30px rgba(249, 52, 79, 0.4);
    animation: none; /* Stop pulse on hover */
}

.btn-cta-primary:active {
    transform: translateY(0) scale(0.98);
    transition-duration: 0.1s;
}

/* Secondary CTA button - scale on hover */
.btn-cta-secondary {
    position: relative;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-cta-secondary:hover {
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.btn-cta-secondary:active {
    transform: translateY(0) scale(0.98);
    transition-duration: 0.1s;
}

/* Ripple effect overlay (will be added via JS) */
.ripple-effect {
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.6);
    pointer-events: none;
    animation: ripple 0.6s ease-out;
}

/* Attention grabber - occasional shake */
.attention-shake {
    animation: shake-gentle 0.5s ease-in-out;
}

/* Periodic heartbeat for "Nyní v prodeji" indicators */
.heartbeat-pulse {
    animation: heartbeat 2s ease-in-out infinite;
}

/* Icon wiggle on hover */
.icon-wiggle {
    display: inline-block;
    transition: transform 0.2s ease;
}

.btn-cta-primary:hover .icon-wiggle,
.btn-cta-secondary:hover .icon-wiggle {
    animation: wiggle 0.5s ease-in-out;
}

@keyframes wiggle {
    0%, 100% { transform: rotate(0deg); }
    25% { transform: rotate(-5deg); }
    75% { transform: rotate(5deg); }
}

/* Glow effect on focus (accessibility) */
.btn-cta-primary:focus,
.btn-cta-secondary:focus {
    outline: none;
    box-shadow: 0 0 0 4px rgba(249, 52, 79, 0.3);
}

/* Loading state for buttons */
.btn-loading {
    pointer-events: none;
    opacity: 0.7;
}

.btn-loading::after {
    content: '';
    position: absolute;
    width: 16px;
    height: 16px;
    top: 50%;
    left: 50%;
    margin-left: -8px;
    margin-top: -8px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin 0.6s linear infinite;
}

@keyframes spin-fast {
    to { transform: rotate(360deg); }
}

/* Loading animation */
@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

.loading {
    animation: spin 1s linear infinite;
}

/* Image hover zoom effect */
.hover-zoom {
    overflow: hidden;
}

.hover-zoom img {
    transition: transform 0.5s ease;
}

.hover-zoom:hover img {
    transform: scale(1.1);
}

/* Section reveal animation */
.reveal {
    opacity: 0;
    transform: translateY(50px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* Ticket card special effects */
.ticket-card {
    position: relative;
    overflow: hidden;
}

.ticket-card::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: linear-gradient(
        45deg,
        transparent,
        rgba(255, 255, 255, 0.1),
        transparent
    );
    transform: rotate(45deg);
    transition: all 0.5s ease;
}

.ticket-card:hover::before {
    left: 100%;
}

/* Mobile menu transition */
#mobile-menu {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

#mobile-menu.show {
    max-height: 500px;
}

/* Parallax effect helper */
.parallax {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

/* Text shadow for better readability on images */
.text-shadow {
    text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8);
}

/* Glowing effect for important elements */
.glow {
    box-shadow: 0 0 20px rgba(249, 52, 79, 0.5);
}

.glow:hover {
    box-shadow: 0 0 30px rgba(249, 52, 79, 0.8);
}

/* Underline animation */
.underline-animation {
    position: relative;
}

.underline-animation::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    height: 2px;
    background: #f9344f;
    transition: width 0.3s ease;
}

.underline-animation:hover::after {
    width: 100%;
}

/* Grid layout improvements */
.grid-auto-fit {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
}

/* Backdrop blur for modals */
.backdrop-blur {
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* Partner grid - automatic border removal for last items in row */
/* Fixed row height for all partner grids */
.partner-grid > div {
    height: 140px;
    padding: 1.5rem;
}

@media (min-width: 768px) {
    .partner-grid > div {
        height: 180px;
        padding: 2.5rem;
    }
}

@media (min-width: 1024px) {
    .partner-grid > div {
        height: 200px;
        padding: 3rem;
    }
}

/* Mobile: 2 columns for all */
.partner-grid.grid-cols-2 > div:nth-child(2n) {
    border-right: none !important;
}

.partner-grid.grid-cols-3 > div:nth-child(3n) {
    border-right: none !important;
}

/* Tablet (md): 768px+ */
@media (min-width: 768px) {
    /* Za podpory: 2 → 2 (stays same) */
    .partner-grid.grid-cols-2.md\:grid-cols-2 > div:nth-child(2n) {
        border-right: none !important;
    }
    
    /* Generální: 2 → 3 */
    .partner-grid.grid-cols-2.md\:grid-cols-3 > div:nth-child(2n) {
        border-right: 1px solid rgb(229 231 235) !important;
    }
    .partner-grid.grid-cols-2.md\:grid-cols-3 > div:nth-child(3n) {
        border-right: none !important;
    }
    
    /* Hlavní: 3 → 4 */
    .partner-grid.grid-cols-3.md\:grid-cols-4 > div:nth-child(3n) {
        border-right: 1px solid rgb(229 231 235) !important;
    }
    .partner-grid.grid-cols-3.md\:grid-cols-4 > div:nth-child(4n) {
        border-right: none !important;
    }
}

/* Desktop (lg): 1024px+ */
@media (min-width: 1024px) {
    /* Za podpory: 2 → 4 */
    .partner-grid.grid-cols-2.md\:grid-cols-2.lg\:grid-cols-4 > div:nth-child(2n) {
        border-right: 1px solid rgb(229 231 235) !important;
    }
    .partner-grid.grid-cols-2.md\:grid-cols-2.lg\:grid-cols-4 > div:nth-child(4n) {
        border-right: none !important;
    }
    
    /* Generální: 3 → 4 */
    .partner-grid.grid-cols-2.md\:grid-cols-3.lg\:grid-cols-4 > div:nth-child(3n) {
        border-right: 1px solid rgb(229 231 235) !important;
    }
    .partner-grid.grid-cols-2.md\:grid-cols-3.lg\:grid-cols-4 > div:nth-child(4n) {
        border-right: none !important;
    }
    
    /* Hlavní: 4 → 5 */
    .partner-grid.grid-cols-3.md\:grid-cols-4.lg\:grid-cols-5 > div:nth-child(4n) {
        border-right: 1px solid rgb(229 231 235) !important;
    }
    .partner-grid.grid-cols-3.md\:grid-cols-4.lg\:grid-cols-5 > div:nth-child(5n) {
        border-right: none !important;
    }
    
    /* Partneři (nová sekce): 4 → 6 */
    .partner-grid.grid-cols-3.md\:grid-cols-4.lg\:grid-cols-6 > div:nth-child(4n) {
        border-right: 1px solid rgb(229 231 235) !important;
    }
    .partner-grid.grid-cols-3.md\:grid-cols-4.lg\:grid-cols-6 > div:nth-child(6n) {
        border-right: none !important;
    }
}

/* ============================================================================
   REMOVE BOTTOM BORDER FROM LAST ROW - SECTION-SPECIFIC SOLUTION
   ============================================================================
   
   Since CSS can't count dynamically, we target specific grids:
   - Za podpory (grid-cols-2.md:grid-cols-2.lg:grid-cols-4): 3 items
   - Generální partneři (grid-cols-2.md:grid-cols-3.lg:grid-cols-4): 12 items  
   - Hlavní partneři (grid-cols-3.md:grid-cols-4.lg:grid-cols-5): 20 items
   ============================================================================ */

/* Za podpory: 3 items, 2 columns mobile */
/* Last row = item 3 only */
.partner-grid.grid-cols-2.md\:grid-cols-2.lg\:grid-cols-4 > div:nth-child(3) {
    border-bottom: none !important;
}

/* Generální partneři: 12 items, 2 columns mobile */
/* Last row = items 11, 12 */
.partner-grid.grid-cols-2.md\:grid-cols-3.lg\:grid-cols-4 > div:nth-child(11),
.partner-grid.grid-cols-2.md\:grid-cols-3.lg\:grid-cols-4 > div:nth-child(12) {
    border-bottom: none !important;
}

/* Hlavní partneři: 20 items, 3 columns mobile */
/* Last row = items 19, 20 (7th row: 19 is col1, 20 is col2, col3 empty) */
.partner-grid.grid-cols-3.md\:grid-cols-4.lg\:grid-cols-5 > div:nth-child(19),
.partner-grid.grid-cols-3.md\:grid-cols-4.lg\:grid-cols-5 > div:nth-child(20) {
    border-bottom: none !important;
}

/* Partneři: 24 items, 3 columns mobile */
/* Last row = items 22, 23, 24 (8th row: 3×7=21, so 22-24 in row 8) */
.partner-grid-24 > div:nth-child(22),
.partner-grid-24 > div:nth-child(23),
.partner-grid-24 > div:nth-child(24) {
    border-bottom: none !important;
}

/* Podporovatelé: 11 items, 3 columns mobile */
/* Last row = items 10, 11 (4th row: 3×3=9, so 10-11 in row 4) */
.partner-grid-11 > div:nth-child(10),
.partner-grid-11 > div:nth-child(11) {
    border-bottom: none !important;
}

/* Mediální partneři: 3 items, 3 columns mobile */
/* All items in first row = items 1, 2, 3 */
.partner-grid-3 > div:nth-child(1),
.partner-grid-3 > div:nth-child(2),
.partner-grid-3 > div:nth-child(3) {
    border-bottom: none !important;
}

/* Gastro partneři: 12 items, 3 columns mobile */
/* Last row = items 10, 11, 12 (4th row: 3×3=9, so 10-12 in row 4) */
.partner-grid-12 > div:nth-child(10),
.partner-grid-12 > div:nth-child(11),
.partner-grid-12 > div:nth-child(12) {
    border-bottom: none !important;
}

/* Tablet (md): 768px+ */
@media (min-width: 768px) {
    /* Reset mobile rules - restore all borders first */
    .partner-grid > div {
        border-bottom: 1px solid rgb(229 231 235) !important;
    }
    
    /* Za podpory: 3 items, 2 columns tablet */
    /* Last row = item 3 (alone in row 2) */
    .partner-grid.grid-cols-2.md\:grid-cols-2.lg\:grid-cols-4 > div:nth-child(3) {
        border-bottom: none !important;
    }
    
    /* Generální partneři: 12 items, 3 columns tablet */
    /* Last row = items 10, 11, 12 (4th row: 3×3=9, so 10-12 in row 4) */
    .partner-grid.grid-cols-2.md\:grid-cols-3.lg\:grid-cols-4 > div:nth-child(10),
    .partner-grid.grid-cols-2.md\:grid-cols-3.lg\:grid-cols-4 > div:nth-child(11),
    .partner-grid.grid-cols-2.md\:grid-cols-3.lg\:grid-cols-4 > div:nth-child(12) {
        border-bottom: none !important;
    }
    
    /* Hlavní partneři: 20 items, 4 columns tablet */
    /* Last row = items 17, 18, 19, 20 (5th row: 4×4=16, so 17-20 in row 5) */
    .partner-grid.grid-cols-3.md\:grid-cols-4.lg\:grid-cols-5 > div:nth-child(17),
    .partner-grid.grid-cols-3.md\:grid-cols-4.lg\:grid-cols-5 > div:nth-child(18),
    .partner-grid.grid-cols-3.md\:grid-cols-4.lg\:grid-cols-5 > div:nth-child(19),
    .partner-grid.grid-cols-3.md\:grid-cols-4.lg\:grid-cols-5 > div:nth-child(20) {
        border-bottom: none !important;
    }
    
    /* Partneři: 24 items, 4 columns tablet */
    /* Last row = items 21, 22, 23, 24 (6th row: 4×5=20, so 21-24 in row 6) */
    .partner-grid-24 > div:nth-child(21),
    .partner-grid-24 > div:nth-child(22),
    .partner-grid-24 > div:nth-child(23),
    .partner-grid-24 > div:nth-child(24) {
        border-bottom: none !important;
    }
    
    /* Podporovatelé: 11 items, 4 columns tablet */
    /* Last row = items 9, 10, 11 (3rd row: 4×2=8, so 9-11 in row 3) */
    .partner-grid-11 > div:nth-child(9),
    .partner-grid-11 > div:nth-child(10),
    .partner-grid-11 > div:nth-child(11) {
        border-bottom: none !important;
    }
    
    /* Mediální partneři: 3 items, 4 columns tablet */
    /* All items in first row = items 1, 2, 3 */
    .partner-grid-3 > div:nth-child(1),
    .partner-grid-3 > div:nth-child(2),
    .partner-grid-3 > div:nth-child(3) {
        border-bottom: none !important;
    }
    
    /* Gastro partneři: 12 items, 4 columns tablet */
    /* Last row = items 9, 10, 11, 12 (3rd row: 4×2=8, so 9-12 in row 3) */
    .partner-grid-12 > div:nth-child(9),
    .partner-grid-12 > div:nth-child(10),
    .partner-grid-12 > div:nth-child(11),
    .partner-grid-12 > div:nth-child(12) {
        border-bottom: none !important;
    }
}

/* Desktop (lg): 1024px+ */
@media (min-width: 1024px) {
    /* Reset tablet rules - restore all borders first */
    .partner-grid > div {
        border-bottom: 1px solid rgb(229 231 235) !important;
    }
    
    /* Za podpory: 3 items, 4 columns desktop */
    /* Last row = items 1, 2, 3 (all in row 1, none in hypothetical row 2) */
    /* So all 3 items are in first AND last row - remove all borders */
    .partner-grid.grid-cols-2.md\:grid-cols-2.lg\:grid-cols-4 > div:nth-child(1),
    .partner-grid.grid-cols-2.md\:grid-cols-2.lg\:grid-cols-4 > div:nth-child(2),
    .partner-grid.grid-cols-2.md\:grid-cols-2.lg\:grid-cols-4 > div:nth-child(3) {
        border-bottom: none !important;
    }
    
    /* Generální partneři: 12 items, 4 columns desktop */
    /* Last row = items 9, 10, 11, 12 (3rd row: 4×2=8, so 9-12 in row 3) */
    .partner-grid.grid-cols-2.md\:grid-cols-3.lg\:grid-cols-4 > div:nth-child(9),
    .partner-grid.grid-cols-2.md\:grid-cols-3.lg\:grid-cols-4 > div:nth-child(10),
    .partner-grid.grid-cols-2.md\:grid-cols-3.lg\:grid-cols-4 > div:nth-child(11),
    .partner-grid.grid-cols-2.md\:grid-cols-3.lg\:grid-cols-4 > div:nth-child(12) {
        border-bottom: none !important;
    }
    
    /* Hlavní partneři: 20 items, 5 columns desktop */
    /* Last row = items 16, 17, 18, 19, 20 (4th row: 5×3=15, so 16-20 in row 4) */
    .partner-grid.grid-cols-3.md\:grid-cols-4.lg\:grid-cols-5 > div:nth-child(16),
    .partner-grid.grid-cols-3.md\:grid-cols-4.lg\:grid-cols-5 > div:nth-child(17),
    .partner-grid.grid-cols-3.md\:grid-cols-4.lg\:grid-cols-5 > div:nth-child(18),
    .partner-grid.grid-cols-3.md\:grid-cols-4.lg\:grid-cols-5 > div:nth-child(19),
    .partner-grid.grid-cols-3.md\:grid-cols-4.lg\:grid-cols-5 > div:nth-child(20) {
        border-bottom: none !important;
    }
    
    /* Partneři: 24 items, 6 columns desktop */
    /* Last row = items 19, 20, 21, 22, 23, 24 (4th row: 6×3=18, so 19-24 in row 4) */
    .partner-grid-24 > div:nth-child(19),
    .partner-grid-24 > div:nth-child(20),
    .partner-grid-24 > div:nth-child(21),
    .partner-grid-24 > div:nth-child(22),
    .partner-grid-24 > div:nth-child(23),
    .partner-grid-24 > div:nth-child(24) {
        border-bottom: none !important;
    }
    
    /* Podporovatelé: 11 items, 6 columns desktop */
    /* Last row = items 7, 8, 9, 10, 11 (2nd row: 6×1=6, so 7-11 in row 2) */
    .partner-grid-11 > div:nth-child(7),
    .partner-grid-11 > div:nth-child(8),
    .partner-grid-11 > div:nth-child(9),
    .partner-grid-11 > div:nth-child(10),
    .partner-grid-11 > div:nth-child(11) {
        border-bottom: none !important;
    }
    
    /* Mediální partneři: 3 items, 6 columns desktop */
    /* All items in first row = items 1, 2, 3 */
    .partner-grid-3 > div:nth-child(1),
    .partner-grid-3 > div:nth-child(2),
    .partner-grid-3 > div:nth-child(3) {
        border-bottom: none !important;
    }
    
    /* Gastro partneři: 12 items, 6 columns desktop */
    /* Last row = items 7, 8, 9, 10, 11, 12 (2nd row: 6×1=6, so 7-12 in row 2) */
    .partner-grid-12 > div:nth-child(7),
    .partner-grid-12 > div:nth-child(8),
    .partner-grid-12 > div:nth-child(9),
    .partner-grid-12 > div:nth-child(10),
    .partner-grid-12 > div:nth-child(11),
    .partner-grid-12 > div:nth-child(12) {
        border-bottom: none !important;
    }
}

/* Temporarily hide lineup section */
#lineup {
    display: none !important;
}

/* Mobile menu visibility control */
#mobile-menu {
    display: none;
}

#mobile-menu.show {
    display: block !important;
}

/* Hide mobile menu on desktop regardless of .show class */
@media (min-width: 1024px) {
    #mobile-menu,
    #mobile-menu.show {
        display: none !important;
    }
}

/* Performance optimization for animations */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Advanced background animations */
@keyframes gradientFlow {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

@keyframes gradientShift {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

@keyframes floatBlob1 {
    0%, 100% {
        transform: translate(0, 0) scale(1);
    }
    25% {
        transform: translate(80px, -60px) scale(1.2);
    }
    50% {
        transform: translate(-60px, 80px) scale(0.85);
    }
    75% {
        transform: translate(70px, 40px) scale(1.1);
    }
}

@keyframes floatBlob2 {
    0%, 100% {
        transform: translate(0, 0) scale(1);
    }
    25% {
        transform: translate(-70px, 50px) scale(1.15);
    }
    50% {
        transform: translate(80px, -70px) scale(0.9);
    }
    75% {
        transform: translate(-50px, -40px) scale(1.2);
    }
}

@keyframes floatBlob3 {
    0%, 100% {
        transform: translate(-50%, -50%) scale(1);
    }
    33% {
        transform: translate(calc(-50% + 70px), calc(-50% - 60px)) scale(1.2);
    }
    66% {
        transform: translate(calc(-50% - 70px), calc(-50% + 60px)) scale(0.85);
    }
}

@keyframes pulse {
    0%, 100% {
        transform: translate(-50%, 0) scale(1);
        opacity: 0.5;
    }
    50% {
        transform: translate(-50%, 0) scale(1.3);
        opacity: 0.6;
    }
}

@keyframes floatSlow {
    0%, 100% {
        transform: translate(0, 0) scale(1);
    }
    50% {
        transform: translate(-60px, -60px) scale(1.15);
    }
}

/* ============================================================================
   COUNTDOWN TIMER
   ============================================================================ */

/* Clean fade-in animation on page load */
#countdown-container {
    animation: fadeInUp 0.8s ease-out;
}

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

/* Subtle hover effect on countdown cards */
#countdown > div > div {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

#countdown > div > div:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
}

/* ============================================================================
   FLOATING CTA BUTTON (Mobile Only)
   ============================================================================ */

#floating-cta {
    /* Subtle continuous pulse animation */
    animation: floating-pulse 2s ease-in-out infinite;
}

#floating-cta.visible {
    opacity: 1 !important;
    transform: translateY(0) scale(1) !important;
    pointer-events: auto !important;
}

/* Pulse animation for floating button */
@keyframes floating-pulse {
    0%, 100% {
        box-shadow: 0 10px 30px rgba(249, 52, 79, 0.4);
    }
    50% {
        box-shadow: 0 10px 40px rgba(249, 52, 79, 0.6);
    }
}

/* Hover effect - slight scale up */
#floating-cta:hover {
    transform: translateY(0) scale(1.1) !important;
}

/* Active state - press down */
#floating-cta:active {
    transform: translateY(0) scale(0.95) !important;
}

/* ============================================================================
   PARTNER LOGOS - Hover Effects
   ============================================================================ */

/* Partner logo wrapper - smooth transition */
.partner-grid a {
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Partner logo image - transform on hover */
.partner-grid a img {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Hover effect - scale up */
.partner-grid a:hover img {
    transform: scale(1.1);
}

/* Active/pressed state */
.partner-grid a:active img {
    transform: scale(1.05);
}

/* ============================================================================
   3D TILT EFFECT - Cards
   ============================================================================ */

.artist-card,
.ticket-card {
    transform-style: preserve-3d;
    will-change: transform;
}

/* Disable tilt on mobile/touch devices */
@media (hover: none) {
    .artist-card,
    .ticket-card {
        transform: none !important;
    }
}

/* Disable tilt for users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
    .artist-card,
    .ticket-card {
        transform: none !important;
    }
}

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