.client-section{margin-top:52px;background:#252923;color:#f8f7f4;padding:32px 0 45px;border-radius:18px}
.client-heading{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:0 clamp(24px,4vw,64px)}
.client-heading h2{display:flex;align-items:center;gap:14px;margin:0;font-size:16px;font-weight:500;line-height:1.5;letter-spacing:-.025em}
.client-heading h2>span{flex:0 0 24px;height:2px;border-radius:2px;background:var(--gradient)}
.client-pause{display:inline-flex;align-items:center;gap:7px;flex-shrink:0;min-height:34px;padding:4px 0 4px 12px;color:#b9bdb4;font-size:11px;line-height:1.5;background:none}
.client-pause:hover{color:#fff}
.client-pause svg{width:16px;height:16px}
.client-pause .client-play-icon,.client-pause[aria-pressed=true] .client-pause-icon{display:none}
.client-pause[aria-pressed=true] .client-play-icon{display:block}
.client-window{margin-top:36px}
.client-logos{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:36px 60px;list-style:none;padding:0 32px;margin:0}
.client-logo{display:flex;align-items:center;justify-content:center;flex:0 0 200px;min-height:70px}
.client-logo img{display:block;width:100%;height:auto;max-height:65px;object-fit:contain;filter:brightness(0) invert(1);opacity:.87}
.client-logo-stratos img{width:94%}
.client-logo-love-and-wander img{width:96%}
.client-logo-kraamraam img{width:82%}
.client-logo-lengers img{width:100%}
.client-section[data-motion=true] .client-window{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.client-section[data-motion=true] .client-track{display:flex;width:max-content;animation:client-drift 60s linear infinite;animation-play-state:paused;will-change:transform}
.client-section[data-motion=true] .client-logos{flex:0 0 auto;min-width:min(calc(100vw - 64px),1920px);flex-wrap:nowrap;justify-content:space-around;gap:clamp(48px,6vw,96px);padding:0 clamp(48px,6vw,96px) 0 0}
.client-section[data-motion=true] .client-logo{flex-basis:clamp(170px,15vw,220px);width:clamp(170px,15vw,220px)}
.client-section[data-motion=true][data-playing=true] .client-track{animation-play-state:running}
.client-section:not([data-motion=true]) [data-client-clone]{display:none}
@keyframes client-drift{to{transform:translateX(-50%)}}
@media(max-width:760px){
 .client-section{margin:32px 16px 0;padding:25px 0 30px;border-radius:14px}
 .client-heading{padding-inline:22px;gap:12px}
 .client-heading h2{font-size:13px;gap:10px}
 .client-heading h2>span{flex-basis:15px}
 .client-pause{padding-left:4px;min-width:28px;min-height:34px;justify-content:center}
 .client-pause>span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .client-window{margin-top:26px}
 .client-logo{flex-basis:150px;min-height:60px}
 .client-logos{gap:26px 32px;padding-inline:22px}
 .client-section[data-motion=true] .client-track{animation-duration:54s}
}
@media(prefers-reduced-motion:reduce){
 .client-section .client-track{animation:none!important;will-change:auto!important;transform:none!important;width:auto!important;display:block!important}
 .client-section .client-logos{flex-wrap:wrap!important;justify-content:center!important;gap:30px 50px!important;padding-inline:24px!important}
 .client-section .client-window{mask-image:none!important;overflow:visible!important}
 .client-section [data-client-clone],.client-pause{display:none!important}
}
