/* Rotating Loop Animations */

/* Keyframe for clockwise rotation */
@keyframes rotate-clockwise {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* Keyframe for counter-clockwise rotation */
@keyframes rotate-counter-clockwise {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(-360deg);
    }
}

/* Animation classes */
.rotate-clockwise {
    animation: rotate-clockwise 50s linear infinite;
}

.rotate-counter-clockwise {
    animation: rotate-counter-clockwise 40s linear infinite;
}

/* Ensure transform-origin is centered for smooth rotation */
.rotate-clockwise,
.rotate-counter-clockwise {
    transform-origin: center center;
}

/* Keyframe for carousel sliding */
@keyframes slide-left {
    from {
        transform: translateX(0%);
    }
    to {
        transform: translateX(-50%);
    }
}

/* Animation classes */
.slide-left {
    animation: slide-left 35s linear infinite;
}

/* scaling up animation */
.hover-scale-up > div,
.hover-scale-up > img {
    transition: transform 0.3s ease-in-out;
}

.hover-scale-up:hover > div,
.hover-scale-up:hover > img {
    transform: scale(1.05);
}