/* Block: logo-strip
 *
 * Figma (frame 280:1505): a rule at y=893, then a 47px band of client logos
 * starting at 912 on an 83px gap. Each logo keeps the size it is drawn at
 * rather than being scaled to a shared height, so the markup carries the
 * Figma width as --logo-w and the band just centres them.
 */
.logo-strip {
    border-top: 1px solid var(--tgc-line);
    padding: calc(19 * var(--tgc-u)) 0 calc(34 * var(--tgc-u));
    overflow: hidden;
}

.logo-strip__viewport {
    display: flex;
    width: max-content;
    animation: logo-strip-scroll 46s linear infinite;
}

.logo-strip__track {
    display: flex;
    align-items: center;
    gap: calc(83 * var(--tgc-u));
    margin: 0;
    padding: 0 calc(83 * var(--tgc-u)) 0 0;
    list-style: none;
}

.logo-strip__item {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    height: calc(47 * var(--tgc-u));
}

/* The artwork is already flat black, as drawn in Figma — no grey-out. */
.logo-strip__item img {
    max-height: 100%;
    width: auto;
    object-fit: contain;
}

/* Drawn at its Figma width so the strip keeps the designed rhythm of wide
   wordmarks against small marks. Entries added through the block editor have
   no Figma size and keep the fit-to-band behaviour above. */
.logo-strip__logo--sized {
    width: calc(var(--logo-w) * var(--tgc-u));
    max-height: none;
    height: auto;
}

.logo-strip__name {
    font-family: var(--tgc-font-display);
    font-size: calc(19 * var(--tgc-ut));
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--tgc-ink);
    white-space: nowrap;
}

@keyframes logo-strip-scroll {
    from {
        transform: translate3d(0, 0, 0);
    }

    to {
        transform: translate3d(-50%, 0, 0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .logo-strip__viewport {
        animation: none;
    }
}