.carousel-background-section {
    position: relative;
    overflow: hidden;
}

.carousel-background-section .wp-block-gallery {
    position: absolute;
    inset: 50% 0 auto 0;
    transform: translateY(-50%);
    z-index: -1;
    flex-wrap: nowrap;
    max-width: unset;
    display: flex;
    gap: 20px;
    padding: 20px;
    animation: carousel-scroll 50s linear infinite;
    opacity: 0.25;
}

.carousel-background-section .wp-block-gallery .wp-block-image {
    flex: 0 0 auto;
    /* width: 100vw / 5; */
    height: 100%;
    max-height: 800px;
    aspect-ratio: 1 / 2; /* Format portrait */
}
@media (min-width: 600px) {
    .wp-block-gallery.has-nested-images.columns-default
        figure.wp-block-image:not(#individual-image) {
        width: calc(
            15% - var(--wp--style--unstable-gallery-gap, 16px) * 0.66667
        ) !important;
    }
}

.carousel-background-section .wp-block-gallery .wp-block-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
}

/* Animation du carousel */
@keyframes carousel-scroll {
    0% {
        transform: translateY(-50%) translateX(0);
    }
    100% {
        transform: translateY(-50%)
            translateX(calc(-220px * var(--total-images)));
    }
}

/* Pause au survol */
.carousel-background-section:hover .wp-block-gallery {
    animation-play-state: paused;
}

/* Responsive */
@media (max-width: 768px) {
    .carousel-background-section .wp-block-gallery .wp-block-image {
        min-width: 150px;
    }

    .carousel-background-section .wp-block-gallery {
        max-height: 300px;
        gap: 15px;
        padding: 15px;
    }
}
