.sl-clients{padding:70px 0 65px;background:#f4f4f5;overflow:hidden;scroll-margin-top:100px}
.sl-clients-heading{width:86%;max-width:1640px;margin:0 auto 36px;display:flex;justify-content:space-between;align-items:baseline;gap:24px}
.sl-clients h2{font-size:clamp(40px,4.8vw,70px);font-weight:800;letter-spacing:-.05em;line-height:1;margin:0}
.sl-clients h2>span{color:var(--accent)}
.sl-clients-heading p{font-size:13px;color:#666;margin:0}
.sl-client-marquee{width:100%;overflow:hidden;mix-blend-mode:multiply;mask-image:linear-gradient(90deg,transparent,#000 6% 94%,transparent)}
.sl-client-track{display:flex;width:max-content;animation:slClientRun 48s linear infinite}
.sl-client-set{display:flex;flex-shrink:0;align-items:center;gap:80px;padding:20px 40px}
.sl-logo{width:238px;height:124px;flex:0 0 238px;display:flex;justify-content:center;align-items:center}
/* Viewports trim only the supplied files' empty margins. Both SVG and image
   retain their native aspect ratio; no mark is stretched to fit the slot. */
.sl-logo svg{display:block;width:100%;height:78px;overflow:hidden;filter:grayscale(1);mix-blend-mode:multiply}
.sl-logo-metroflex svg{width:220px;height:72px}
.sl-logo-kongu-sweets svg{width:208px;height:62px;filter:grayscale(1) invert(1) contrast(3)}
.sl-logo-kongu-mess svg{width:232px;height:62px}
.sl-logo-dc svg{width:235px;height:64px;filter:brightness(0)}
.sl-logo-crest svg{width:114px;height:114px;filter:grayscale(1) contrast(1.12)}
.sl-logo-dakshin svg{width:222px;height:78px;filter:brightness(0)}
/* Kanya was supplied as a photographed sign, so keep that source intact.
   A monochrome presentation retains the lettering without redrawing it. */
.sl-logo-kanya svg{width:224px;height:70px;filter:grayscale(1) brightness(1.75) contrast(2.2)}
.sl-client-marquee:hover .sl-client-track,.sl-client-marquee:focus-within .sl-client-track,.sl-clients[data-product-visible=false] .sl-client-track,body[data-motion-paused=true] .sl-client-track{animation-play-state:paused}
@keyframes slClientRun{to{transform:translateX(-50%)}}
@media(max-width:767px){
 .sl-clients{padding:47px 0 40px;scroll-margin-top:85px}
 .sl-clients-heading{width:88%;gap:15px;margin-bottom:25px}
 .sl-clients h2{font-size:39px}
 .sl-clients-heading p{font-size:11px;max-width:130px;text-align:right;line-height:1.4}
 .sl-client-set{gap:44px;padding:16px 22px}
 .sl-logo{width:190px;height:110px;flex-basis:190px}
 .sl-logo svg{max-width:100%;max-height:100%}
 .sl-logo-crest svg{width:100px;height:100px}
}
@media(prefers-reduced-motion:reduce){
 html:not(.motion-enabled) .sl-client-track{animation:none}
 html:not(.motion-enabled) .sl-client-marquee{overflow-x:auto;mask-image:none;scrollbar-width:thin}
 html:not(.motion-enabled) .sl-client-set{gap:40px}
 html:not(.motion-enabled) .sl-client-set+.sl-client-set{display:none}
}

