@keyframes loop-scroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-100%);
    }
}

.scroll-container {
    width: 100%;
    overflow: hidden;
    white-space: nowrap; /* Prevents logos from wrapping */
}

.scroll-content {
    display: flex;
    gap: 1rem;
    animation: loop-scroll 10s linear infinite; /* Adjust timing for smoothness */
    min-width: 200%; /* Ensure width to accommodate both original and duplicated logos */
}

.scroll-content img {
    display: inline-block;
}

@keyframes breathing {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    50% {
        transform: scale(1.08);
        opacity: 0.8;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

.breathing-effect {
    animation: breathing 1s ease-in-out infinite;
}