/* CCL Landing — Team Logos Bar */

.team-logos-bar {
    background-color: var(--color-white);
    border-bottom: 1px solid var(--color-grey-light);
    padding: 0.5rem 0;
    overflow: hidden;
}

.team-logos-inner {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1rem 1.5rem;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}

.team-logo-item {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: transform var(--transition-fast), filter var(--transition-fast);
}

.team-logo-item img {
    height: 40px;
    width: auto;
    max-width: 80px;
    object-fit: contain;
    filter: grayscale(10%);
    transition: filter var(--transition-fast), transform var(--transition-fast);
}

.team-logo-item:hover img,
.team-logo-item:focus-within img {
    filter: grayscale(0%) drop-shadow(0 2px 4px rgba(0,0,0,0.15));
    transform: scale(1.1);
}

/* Make the whole item clickable if wrapped in an anchor */
.team-logo-link {
    display: flex;
    align-items: center;
    justify-content: center;
}

@media (max-width: 767px) {
    .team-logos-inner {
        gap: 0.75rem 1rem;
    }
    .team-logo-item img {
        height: 32px;
    }
}

@media (max-width: 479px) {
    .team-logo-item img {
        height: 28px;
        max-width: 60px;
    }
}