.logo-cloud__grid {
    display: grid;
    grid-template-columns: repeat(var(--columns), 1fr);
    gap: 1rem;
    align-items: center;
}

.logo-cloud__item {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.logo-cloud__image {
    max-width: 100%;
    height: auto;
    object-fit: contain;
    transition: opacity 0.5s ease-in-out;
    max-height: 6rem;
}

.logo-cloud__image.fade-out {
    opacity: 0;
}

.logo-cloud__image.fade-in {
    opacity: 1;
}

/* Animation de transition */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fadeOut {
    from { opacity: 1; }
    to { opacity: 0; }
}

.fade-in {
    animation: fadeIn 1s linear forwards;
}

.fade-out {
    animation: fadeOut 1s linear forwards;
}

@media (max-width:1000px)
{
    .logo-cloud__grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width:768px)
{
    .logo-cloud__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}