/* Client logo movement follows the supplied horizontal video reference. */
.rr-clients {
 --rr-client-slot:clamp(180px,20vw,244px);
 --rr-client-gap:clamp(32px,4vw,64px);
 margin:12px 0 42px;
 padding:42px 0 16px;
 border-top:0;
 scroll-margin-top:24px;
 min-width:0;
}
.rr-business .rr-clients-title { margin:0; text-align:center; font:700 clamp(28px,2.5vw,34px)/1.2 var(--serif); letter-spacing:-.02em; color:var(--navy); }
.rr-clients-viewport { position:relative; margin-top:30px; overflow:hidden; }
.rr-clients-track { width:100%; }
.rr-clients-list { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); align-items:center; gap:24px; list-style:none; padding:0; margin:0; }
.rr-business .rr-client { display:flex; align-items:center; justify-content:center; height:132px; min-width:0; margin:0; padding:16px; }
.rr-client img { display:block; width:auto; height:auto; max-width:100%; max-height:90px; object-fit:contain; flex:0 1 auto; }
.rr-client[data-client="aeon-mall"] img { width:90px; }
/* Preserve the official reversed KPJ mark on a quiet navy backing. */
.rr-client[data-client="kpj"] img { box-sizing:content-box; max-width:calc(100% - 28px); padding:16px 14px; background:#163142; border-radius:4px; }
.rr-client[data-client="seven-eleven"] img { max-height:112px; mix-blend-mode:multiply; }
.rr-clients-list[aria-hidden="true"] { display:none; }
/* The logo area itself is the native pause toggle. No visible label or chrome;
   keyboard users retain a clear focus ring and an announced pressed state. */
.rr-clients-pause { position:absolute; z-index:1; inset:0; display:block; width:100%; height:100%; min-height:44px; margin:0; padding:0; appearance:none; border:0; border-radius:0; box-shadow:none; background:transparent; cursor:pointer; }
.rr-clients-pause:focus-visible { outline:2px solid var(--navy); outline-offset:-4px; }
.rr-clients-pause[hidden],
.rr-clients:not(.is-ready) .rr-clients-pause,
.rr-clients.is-reduced .rr-clients-pause { display:none; }
.rr-clients.is-ready:where(:not(.is-reduced)) .rr-clients-viewport { mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent); }
.rr-clients.is-ready .rr-clients-viewport:has(.rr-clients-pause:focus-visible) { mask-image:none; }
.rr-clients.is-ready:where(:not(.is-reduced)) .rr-clients-track { display:flex; width:max-content; animation:rr-client-scroll 28s linear infinite; }
.rr-clients.is-ready:where(:not(.is-reduced)) .rr-clients-list { display:flex; flex:0 0 auto; gap:var(--rr-client-gap); padding-inline-end:var(--rr-client-gap); }
.rr-clients.is-ready:where(:not(.is-reduced)) .rr-client { flex:0 0 var(--rr-client-slot); width:var(--rr-client-slot); }
.rr-clients.is-paused .rr-clients-track,
.rr-clients.is-outside .rr-clients-track,
.rr-clients.is-hidden .rr-clients-track { animation-play-state:paused; }
@media(hover:hover) and (pointer:fine) {
 .rr-clients .rr-clients-viewport:hover .rr-clients-track { animation-play-state:paused; }
}
@keyframes rr-client-scroll { to { transform:translateX(-50%); } }
@media(max-width:600px) {
 .rr-clients { --rr-client-slot:176px; --rr-client-gap:32px; padding-top:30px; margin-bottom:30px; scroll-margin-top:16px; }
 .rr-clients-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
 .rr-business .rr-client { height:112px; padding:12px; }
 .rr-client img { max-height:76px; }
 .rr-client[data-client="seven-eleven"] img { max-height:96px; }
 .rr-clients-viewport { margin-top:22px; }
}
@media(prefers-reduced-motion:reduce) {
 .rr-clients.is-ready .rr-clients-viewport { mask-image:none; }
 .rr-clients.is-ready .rr-clients-track { display:block; width:100%; animation:none; transform:none; }
 .rr-clients.is-ready .rr-clients-list { display:grid; padding:0; gap:24px; }
 .rr-clients.is-ready .rr-client { width:auto; }
 .rr-clients.is-ready .rr-clients-list[aria-hidden="true"],
 .rr-clients-pause { display:none; }
}