/* Custom Animations for AK Auditing */

/* Fade In Up */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translate3d(0, 40px, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

.animate-fade-in-up {
    opacity: 0; /* Initially hidden */
    animation-fill-mode: forwards; /* Keep state after animation */
}

/* Slide In Right */
@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translate3d(50px, 0, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

.animate-slide-in-right {
    opacity: 0;
    animation-fill-mode: forwards;
}

/* Zoom In */
@keyframes zoomIn {
    from {
        opacity: 0;
        transform: scale3d(0.8, 0.8, 0.8);
    }
    to {
        opacity: 1;
        transform: scale3d(1, 1, 1);
    }
}

.animate-zoom-in {
    opacity: 0;
    animation-fill-mode: forwards;
}

/* Moving/Floating Animation (Continuous) */
@keyframes float {
    0% { transform: translate(0, 0px); }
    50% { transform: translate(0, 10px); }
    100% { transform: translate(0, 0px); }
}

.animate-float {
    animation: float 6s ease-in-out infinite;
}

/* Animation Classes to be triggered by JS */
.start-animation.animate-fade-in-up {
    animation: fadeInUp 0.8s ease-out forwards;
}

.start-animation.animate-slide-in-right {
    animation: slideInRight 0.8s ease-out forwards;
}

.start-animation.animate-zoom-in {
    animation: zoomIn 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
}

/* Enhanced Hover Effects */
.hover-scale-up {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.hover-scale-up:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
}

.hover-glow:hover {
    box-shadow: 0 0 15px rgba(9, 44, 128, 0.3); /* Blue Glow */
}


/* Stagger delays */
.delay-100 { animation-delay: 0.1s; }
.delay-200 { animation-delay: 0.2s; }
.delay-300 { animation-delay: 0.3s; }
.delay-400 { animation-delay: 0.4s; }
.delay-500 { animation-delay: 0.5s; }

/* Fade Out */
@keyframes fadeOut {
    from { opacity: 1; }
    to { opacity: 0; }
}
.animate-fade-out {
    animation: fadeOut 0.5s ease-out forwards;
}

/* Immediate animations (not dependent on IntersectionObserver) */
.animate-zoom-in.immediate {
    opacity: 1;
    animation: zoomIn 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
.animate-fade-in {
    animation: fadeIn 0.5s ease-out forwards;
}