/* ==========================
   MAZETECH HUB ANIMATIONS
========================== */


/* Fade in */

.fade-in{

    opacity:0;
    animation:fadeIn 1.2s ease forwards;

}


@keyframes fadeIn{

    from{

        opacity:0;

    }

    to{

        opacity:1;

    }

}



/* Slide from left */

.slide-left{

    opacity:0;
    transform:translateX(-50px);
    animation:slideLeft 1s ease forwards;

}


@keyframes slideLeft{

    from{

        opacity:0;
        transform:translateX(-50px);

    }

    to{

        opacity:1;
        transform:translateX(0);

    }

}



/* Slide from right */

.slide-right{

    opacity:0;
    transform:translateX(50px);
    animation:slideRight 1s ease forwards;

}


@keyframes slideRight{

    from{

        opacity:0;
        transform:translateX(50px);

    }


    to{

        opacity:1;
        transform:translateX(0);

    }

}



/* Floating effect */

.float{

    animation:floating 3s infinite ease-in-out;

}


@keyframes floating{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-10px);

    }

    100%{

        transform:translateY(0);

    }

}



/* Button glow */

.btn-glow:hover{

    box-shadow:0 0 20px rgba(22,163,74,0.6);

}

/* ==========================================================
   FAST SITE ANIMATIONS
========================================================== */

.fade-in {
    animation-duration: 0.35s !important;
    animation-delay: 0s !important;
}

.slide-left,
.slide-right {
    animation-duration: 0.35s !important;
    animation-delay: 0s !important;
}

.animate {
    animation-duration: 0.35s !important;
    animation-delay: 0s !important;
    transition-duration: 0.25s !important;
}

/* Floating objects can stay smooth */
.float {
    animation-duration: 4s !important;
}

/* ==========================================================
   NAVBAR MUST ALWAYS LOAD IMMEDIATELY
========================================================== */

.custom-navbar,
.navbar {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    animation: none !important;
    transition: background-color .2s ease,
                box-shadow .2s ease !important;
}

/* Prevent animation classes from delaying the navbar */
.custom-navbar.fade-in,
.custom-navbar.slide-left,
.custom-navbar.slide-right,
.navbar.fade-in,
.navbar.slide-left,
.navbar.slide-right {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
}

/* ==========================================================
   FAQ - FAST ANIMATIONS
========================================================== */

.faq .animate,
.faq .fade-in,
.faq .slide-left,
.faq .slide-right {
    animation-duration: 0.25s !important;
    animation-delay: 0s !important;
    transition-duration: 0.2s !important;
}

/* FAQ accordion open/close speed */
.faq .accordion-collapse {
    transition: height 0.2s ease !important;
}

/* Prevent slow staggered FAQ loading */
.faq .accordion-item {
    animation-delay: 0s !important;
}

/* ==========================================================
   FAQ - INSTANT OPEN / CLOSE
========================================================== */

.faq .accordion-collapse,
.faq .accordion-collapse.collapsing {
    transition: none !important;
    animation: none !important;
}

.faq .accordion-button,
.faq .accordion-button::after {
    transition: none !important;
}

/* FAQ entrance should also be immediate */
.faq .animate,
.faq .fade-in,
.faq .slide-left,
.faq .slide-right {
    animation: none !important;
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
}