/* The Clients page uses the same vector artwork as the homepage, in white. */
.clients-logo-ribbon{position:relative;background:#000;color:#fff;padding:24px 0 28px}
.clients-logo-viewport{overflow-x:auto;overflow-y:hidden;padding:8px var(--gutter);scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;cursor:grab}
.clients-logo-viewport::-webkit-scrollbar{display:none}
.clients-logo-viewport:focus-visible{outline:1px solid #fff;outline-offset:-4px}
.clients-logo-viewport.is-dragging{cursor:grabbing;user-select:none}
.clients-logo-track,.clients-logo-group{display:flex;align-items:center;gap:clamp(42px,5vw,80px);width:max-content}
.clients-logo-group{flex:none}
.clients-logo-link{display:flex;align-items:center;justify-content:center;flex:none;width:clamp(142px,14vw,220px);height:100px;transition:opacity .2s ease}
.clients-logo-link img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;margin:0;border:0;background:transparent;filter:brightness(0) invert(1);user-select:none;-webkit-user-drag:none}
.clients-logo-link:hover{opacity:.7}
.clients-logo-link:focus-visible{outline:1px solid #fff;outline-offset:5px}
.clients-logo-ribbon+.client-stage .client-names{padding-top:max(10svh,calc(30svh - 168px))}
@media(max-width:700px){
 .clients-logo-ribbon{padding:16px 0 20px}
 .clients-logo-viewport{padding-left:20px;padding-right:20px}
 .clients-logo-track,.clients-logo-group{gap:44px}
 .clients-logo-link{width:148px;height:84px}
 .clients-logo-ribbon+.client-stage .client-names{padding-top:max(10svh,calc(30svh - 136px))}
}
@media(prefers-reduced-motion:reduce){.clients-logo-link{transition:none}}