/*
 * Client logos strip (sections/home-clients.php). Logos render as plain
 * text wordmarks - there are no logo files, and the company names
 * themselves are invented demo copy, not real ASSET HR customers (see
 * CLAUDE.md registry).
 *
 * Written against the sections above it: section rhythm and the centered
 * 1.88vw heading come from .advantages / .audience, the tile is the same
 * white shadow card as .course-card, and the strip runs in the shared
 * .slider skin (00-slider.css) inside .container, so the skin's arrows hang
 * in the page gutter exactly as they do in the advantages slider.
 */

.clients {
    padding: 3vw 0 4.5vw;
}

.clients__title {
    font-size: 1.88vw;
    margin: 0 0 2.08vw;
}

.clients__track {
    gap: 0 1.25vw;
}

.clients__slide {
    flex: 0 0 calc((100% - 3.75vw) / 4);
}

.clients__logo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 5.2vw;
    padding: 1.25vw;
    font-size: 1.04vw;
    font-weight: 700;
    color: var(--color-text-muted);
    text-align: center;
    transition: color 0.2s ease;
}

.clients__logo:hover {
    color: var(--color-primary);
}

@media (prefers-reduced-motion: reduce) {
    .clients__logo {
        transition: none;
    }

    .clients__logo:hover {
        transform: none;
    }
}

@media only screen and (max-width: 767.98px) {
    .clients__title {
        font-size: 6.4vw;
        margin: 0 0 5.33vw;
    }

    .clients {
        padding: 6vw 0 9vw;
    }

    .clients__track {
        gap: 0 4vw;
        padding: 2vw 0;
    }

    .clients__slide {
        flex: 0 0 calc((100% - 4vw) / 2);
    }

    .clients__logo {
        min-height: 22vw;
        padding: 4vw;
        font-size: 4.27vw;
    }
}