#ccda-culture-suivre {
    --ccda-ticker-blue: #073d86;
    --ccda-ticker-ink: #07182f;
    --ccda-ticker-line: #dce3ec;
    position: relative;
    width: 100%;
    box-sizing: border-box;
    margin: 0 0 clamp(26px, 3.6vw, 44px);
    padding: clamp(15px, 1.9vw, 22px) 0 clamp(16px, 2vw, 23px);
    overflow: hidden;
    background: var(--ccda-ticker-blue);
    color: #fff;
    isolation: isolate;
}

#ccda-culture-suivre::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: linear-gradient(112deg, rgba(255,255,255,.04), transparent 52%, rgba(0,0,0,.08));
}

.ccda-culture-suivre__title {
    margin: 0 0 11px;
    padding: 0 clamp(17px, 3vw, 38px);
    color: #fff !important;
    font: inherit;
    font-size: clamp(17px, 1.8vw, 23px);
    font-weight: 650;
    line-height: 1.15;
    letter-spacing: -.015em;
}

/* Seule la barre qui défile est blanche. */
.ccda-culture-suivre__viewport {
    position: relative;
    width: 100%;
    overflow: hidden;
    border-top: 1px solid var(--ccda-ticker-line);
    border-bottom: 1px solid var(--ccda-ticker-line);
    background: #fff;
}

.ccda-culture-suivre__viewport::before,
.ccda-culture-suivre__viewport::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 2;
    width: clamp(22px, 5vw, 72px);
    pointer-events: none;
}

.ccda-culture-suivre__viewport::before {
    left: 0;
    background: linear-gradient(90deg, #fff, rgba(255,255,255,0));
}

.ccda-culture-suivre__viewport::after {
    right: 0;
    background: linear-gradient(270deg, #fff, rgba(255,255,255,0));
}

.ccda-culture-suivre__track {
    display: flex;
    width: max-content;
    will-change: transform;
}

.ccda-culture-suivre__group {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    min-width: max-content;
    padding: 10px 0;
}

.ccda-culture-suivre__item {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    color: var(--ccda-ticker-ink) !important;
    font-size: clamp(12px, 1.05vw, 14px);
    font-weight: 620;
    line-height: 1.25;
    text-decoration: none !important;
    white-space: nowrap;
    transition: opacity .18s ease;
}

.ccda-culture-suivre__item:hover,
.ccda-culture-suivre__item:focus-visible {
    color: #020a14 !important;
    opacity: .68;
    outline: none;
    text-decoration: underline !important;
    text-underline-offset: 3px;
}

.ccda-culture-suivre__separator {
    display: inline-block;
    flex: 0 0 auto;
    margin: 0 19px;
    color: rgba(7,24,47,.38);
    font-size: 9px;
    line-height: 1;
}

.ccda-culture-suivre__loading,
.ccda-culture-suivre__empty {
    margin: 0;
    padding: 10px clamp(17px, 3vw, 38px);
    color: rgba(7,24,47,.72);
    font-size: 13px;
}

@media (max-width: 600px) {
    #ccda-culture-suivre {
        margin-bottom: 27px;
        padding-top: 14px;
        padding-bottom: 15px;
    }

    .ccda-culture-suivre__title {
        margin-bottom: 9px;
        padding-right: 15px;
        padding-left: 15px;
        font-size: 17px;
    }

    .ccda-culture-suivre__group {
        padding-top: 9px;
        padding-bottom: 9px;
    }

    .ccda-culture-suivre__item {
        font-size: 12px;
    }

    .ccda-culture-suivre__separator {
        margin-right: 15px;
        margin-left: 15px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ccda-culture-suivre__viewport {
        overflow-x: auto;
        scrollbar-width: thin;
    }

    .ccda-culture-suivre__track {
        transform: none !important;
        will-change: auto;
    }

    .ccda-culture-suivre__group[aria-hidden="true"] {
        display: none;
    }
}
