/* animations.css */

/* Initial states for JS Intersection Observer */
.hidden {
    opacity: 0;
}

.visible.fade-in {
    animation: fadeIn 0.8s ease forwards;
}

.visible.slide-in-up {
    animation: slideInUp 0.8s ease forwards;
}

.visible.slide-in-left {
    animation: slideInLeft 0.8s ease forwards;
}

.visible.slide-in-right {
    animation: slideInRight 0.8s ease forwards;
}

/* Page Load Animations */
.fade-in-up {
    animation: slideInUp 1s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;
}

.fade-in-down {
    animation: slideInDown 0.8s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;
}

.fade-in-left {
    animation: slideInLeft 1.2s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;
}

/* Hover Micro-animations */
.hover-lift {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

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

.hover-scale {
    transition: transform 0.3s ease;
}

/* Floating animation for badge */
.float-anim {
    animation: float 4s ease-in-out infinite;
}

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

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

@keyframes slideInDown {
    from {
        opacity: 0;
        transform: translateY(-40px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideInLeft {
    from {
        opacity: 0;
        transform: translateX(40px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translateX(-40px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes float {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-10px); }
    100% { transform: translateY(0px); }
}