/* Animations CSS */

/* Fade In Animations */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translate3d(0, -100%, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fadeInLeft {
    from {
        opacity: 0;
        transform: translate3d(-100%, 0, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translate3d(100%, 0, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

/* Slide Animations */
@keyframes slideInLeft {
    from {
        transform: translate3d(-100%, 0, 0);
        visibility: visible;
    }
    to {
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slideInRight {
    from {
        transform: translate3d(100%, 0, 0);
        visibility: visible;
    }
    to {
        transform: translate3d(0, 0, 0);
    }
}

/* Animation Classes */
.animated {
    animation-duration: 1s;
    animation-fill-mode: both;
}

.fadeIn {
    animation-name: fadeIn;
}

.fadeInUp {
    animation-name: fadeInUp;
}

.fadeInDown {
    animation-name: fadeInDown;
}

.fadeInLeft {
    animation-name: fadeInLeft;
}

.fadeInRight {
    animation-name: fadeInRight;
}

.slideInLeft {
    animation-name: slideInLeft;
}

.slideInRight {
    animation-name: slideInRight;
}

/* Delay Classes */
.delay-1s { animation-delay: 1s; }
.delay-2s { animation-delay: 2s; }
.delay-3s { animation-delay: 3s; }
.delay-4s { animation-delay: 4s; }
.delay-5s { animation-delay: 5s; }

/* Duration Classes */
.slow { animation-duration: 2s; }
.slower { animation-duration: 3s; }
.fast { animation-duration: 0.8s; }
.faster { animation-duration: 0.5s; }

/* Infinite Animation */
.infinite { animation-iteration-count: infinite; }

/* Hover Effects */
.hover-effect {
    transition: all 0.3s ease;
}

.hover-effect:hover {
    transform: translateY(-5px);
}

/* Text Rotation Animation */
@keyframes textRotation {
    0% { opacity: 1; }
    25% { opacity: 1; }
    33% { opacity: 0; }
    100% { opacity: 0; }
}

.text-rotation .item {
    animation: textRotation 6s infinite;
}

.text-rotation .item:nth-child(2) {
    animation-delay: 2s;
}

.text-rotation .item:nth-child(3) {
    animation-delay: 4s;
}

