/* ==========================================================================
   HUSKIVA BAG - Animations & Transitions
   ========================================================================== */

/* Scroll Indicator Bounce Animation */
@keyframes bounce {
    0%, 20%, 50%, 80%, 100% { 
        transform: translateY(0); 
    }
    40% { 
        transform: translateY(-10px); 
    }
    60% { 
        transform: translateY(-5px); 
    }
}

.animate-bounce {
    display: inline-block;
    animation: bounce 2s infinite;
}

/* Reusable Hover & Animation Utility Classes */
.hover-lift {
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.hover-lift:hover { 
    transform: translateY(-8px); 
    box-shadow: 0 15px 30px rgba(0,0,0,0.08) !important; 
}

.hover-scale {
    transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.hover-scale:hover { 
    transform: scale(1.05); 
}

.transition-all { 
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); 
}

.transition-colors { 
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1); 
}

.transition-transform { 
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1); 
}

.hover-color:hover { filter: grayscale(0%) !important; opacity: 1 !important; }
.grayscale { filter: grayscale(100%); opacity: 0.6; }
.hover-text-white:hover { color: #fff !important; }
.hover-opacity-100:hover { opacity: 1 !important; }
.mix-blend-multiply { mix-blend-mode: multiply; }

.group:hover .group-hover-scale { transform: scale(1.2); }