.logo-marquee{--logo-filter:grayscale(1) brightness(1.12);--logo-ink:#c4c1be;position:relative;width:100%;padding:22px 0;border:0;color:var(--logo-ink);overflow:hidden}
.logo-marquee-window{overflow:hidden;padding-block:14px;margin-block:-14px;mask-image:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent)}
/* Automatic loop; hovering or keyboard focus pauses without visible controls. */
.logo-marquee .logo-marquee-track{display:flex;width:max-content;animation:client-logos-drift 360s linear infinite!important}
.logo-marquee-group{display:flex;flex:0 0 auto;align-items:center;gap:32px;margin:0;padding:0 16px;list-style:none}
.logo-marquee-group li{flex:0 0 auto;width:min(144px,calc(var(--logo-ratio)*57.6px));height:57.6px;transition:transform .25s cubic-bezier(.2,.7,.2,1)!important}
.logo-marquee-group img{display:block;width:100%;height:100%;object-fit:contain;filter:var(--logo-filter)}
.logo-marquee-window:focus-visible .logo-marquee-track{animation-play-state:paused!important}
.logo-marquee-window:focus-visible{outline:1px solid var(--logo-ink);outline-offset:-1px}
@media(hover:hover) and (pointer:fine){.logo-marquee:hover .logo-marquee-track{animation-play-state:paused!important}.logo-marquee-group li:hover{transform:translateY(-5px) scale(1.08)}}
html[data-theme="light"] .logo-marquee{--logo-filter:grayscale(1) brightness(0);--logo-ink:#605f5f;--logo-line:rgba(96,95,95,.18)}
@keyframes client-logos-drift{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(max-width:600px){.logo-marquee{padding-block:18px}.logo-marquee-group{gap:24px;padding-inline:12px}.logo-marquee-group li{width:min(128px,calc(var(--logo-ratio)*51.2px));height:51.2px}.logo-marquee .logo-marquee-track{animation-duration:300s!important}}
