/*
 * Comportement commun des bandes défilantes : le glisser-déposer, et une règle de découpage
 * indispensable.
 */

/*
 * UNE BANDE DÉFILANTE EST SON PROPRE BLOC DE RÉFÉRENCE.
 *
 * Sans « position: relative », les descendants en position absolue — au premier chef les textes
 * masqués « screen-reader-text » qui nomment chaque logo — se rattachent à un ancêtre situé HORS
 * de la bande. Ils échappent alors à son découpage tout en gardant leur position dans le
 * défilement : la page se retrouvait étirée à 5490px au lieu de 1905, avec une barre de
 * défilement horizontale sur toute la page d'accueil. Mesuré, et corrigé ici pour les trois
 * bandes d'un seul endroit.
 */
[data-drag-scroll] {
    position: relative;
}

/*
 * Glisser-déposer à la souris : le curseur annonce que la bande se prend en main.
 *
 * Réservé aux pointeurs de précision : sur un écran tactile il n'y a pas de curseur, et le
 * défilement au doigt est déjà celui du navigateur.
 */
@media (hover: hover) and (pointer: fine) {
    [data-drag-scroll] {
        cursor: grab;
    }

    [data-drag-scroll].is-dragging {
        cursor: grabbing;
        /* Pendant le glissement, le navigateur sélectionnerait le texte survolé. */
        user-select: none;
    }
}

/*
 * L'accrochage est SUSPENDU pendant le glissement.
 *
 * Sur une bande en « scroll-snap-type: mandatory » — le carrousel de contenu —, le navigateur
 * ramenait chaque position intermédiaire au point d'accroche le plus proche : la bande ne bougeait
 * pas d'un pixel sous le curseur. Constaté, pas supposé.
 *
 * Rétabli au relâchement, le navigateur accroche alors de lui-même la diapositive la plus proche :
 * on garde donc l'accrochage franc à la molette et au doigt, et un glissement libre à la souris.
 */
[data-drag-scroll].is-dragging {
    scroll-snap-type: none;
}