.association-scroll-section {
    position: var(--positionrelative);
    width: var(--widthfull);
    overflow: var(--hidden);
    background: var(--background1);
}

.association-scroll-shell {
    width: var(--widthfull);
    padding: var(--fortypixels) var(--eightypixels);
    display: var(--displayflex);
    flex-direction: var(--flexcolumn);
    gap: var(--twentyfourpixels);
}

.association-scroll-copy {
    display: var(--displayflex);
    flex-direction: var(--flexcolumn);
    align-items: var(--aligncenter);
    justify-content: var(--justifycenter);
    text-align: var(--aligncenter);
    gap: var(--tenpixels);
}

.association-scroll-eyebrow {
    margin: var(--marginzero);
    color: rgba(255, 239, 208, 0.84);
    font-size: var(--sixteenpixels);
    font-weight: var(--weightsemibold);
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.association-marquee {
    position: var(--positionrelative);
    width: var(--widthfull);
    overflow: var(--hidden);
    mask-image: linear-gradient(90deg, transparent 0%, #000 10%, #000 90%, transparent 100%);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 10%, #000 90%, transparent 100%);
}

.association-marquee-track {
    width: max-content;
    display: var(--displayflex);
    align-items: var(--aligncenter);
    gap: var(--twentyeightpixels);
    animation: association-scroll 28s linear infinite;
    will-change: transform;
}

.association-marquee-group {
    display: var(--displayflex);
    align-items: var(--aligncenter);
    gap: var(--twentyeightpixels);
    flex-shrink: var(--zero);
}

.association-logo-card {
    width: 220px;
    min-width: 220px;
    height: 124px;
    display: var(--displayflex);
    align-items: var(--aligncenter);
    justify-content: var(--justifycenter);
    padding: var(--twentypixels) var(--twentyfourpixels);
    border-radius: var(--twentytwopixels);
    background: rgba(255, 255, 255, 0.14);
    border: var(--onepixel) solid rgba(255, 255, 255, 0.18);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.28);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    flex-shrink: var(--zero);
    transition: transform 0.25s ease, background 0.25s ease, border-color 0.25s ease;
}

.association-logo-card:hover {
    transform: translateY(-2px);
    background: rgba(255, 255, 255, 0.18);
    border-color: rgba(255, 239, 208, 0.22);
}

.association-logo-card img {
    display: var(--displayblock);
    height: 68px;
    width: var(--auto);
    max-width: var(--widthfull);
    object-fit: var(--contain);
    object-position: var(--aligncenter);
}

.association-logo-placeholder {
    display: var(--displayflex);
    align-items: var(--aligncenter);
    justify-content: var(--justifycenter);
    width: var(--widthfull);
    height: 68px;
    border: var(--onepixel) dashed rgba(255, 239, 208, 0.28);
    border-radius: var(--sixteenpixels);
    color: rgba(255, 255, 255, 0.78);
    font-size: var(--textsizebodyregular);
    font-weight: var(--weightmedium);
    text-align: var(--aligncenter);
    padding: 0 var(--twelvepixels);
}

.association-marquee:hover .association-marquee-track {
    animation-play-state: paused;
}

@keyframes association-scroll {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(calc(-50% - 14px));
    }
}

@media (max-width: 900px) {
    .association-scroll-shell {
        padding: var(--fortypixels) var(--twentypixels);
    }

    .association-logo-card {
        width: 190px;
        min-width: 190px;
        height: 112px;
        padding: var(--eighteenpixels) var(--twentypixels);
    }

    .association-logo-placeholder,
    .association-logo-card img {
        height: 56px;
    }
}

@media (max-width: 640px) {
    .association-scroll-shell {
        padding: var(--thirtypixels) var(--sixteenpixels);
        gap: var(--twentypixels);
    }

    .association-logo-card {
        width: 160px;
        min-width: 160px;
        height: 96px;
        border-radius: var(--eighteenpixels);
        padding: var(--sixteenpixels);
    }

    .association-marquee-track,
    .association-marquee-group {
        gap: var(--twentypixels);
    }

    .association-logo-placeholder,
    .association-logo-card img {
        height: 48px;
        font-size: var(--textsizetiny);
    }
}

@media (prefers-reduced-motion: reduce) {
    .association-marquee-track {
        animation: none;
    }
}