/* Two real references; repeated bands are decorative and scroll-driven. */
.client-references{
 --reference-row-height:104px;
 --reference-row-gap:28px;
 padding-block:clamp(56px,7vw,104px);
 background:#000;
 overflow:hidden;
}
.client-references-stage{
 position:relative;
 margin-top:clamp(32px,4vw,56px);
 min-height:calc(var(--reference-row-height)*2 + var(--reference-row-gap));
}
.client-references-list{
 display:grid;
 grid-template-rows:repeat(2,var(--reference-row-height));
 gap:var(--reference-row-gap);
 margin:0;
 padding:0;
 list-style:none;
}
.client-references-list>.client-reference{justify-self:center}
.client-reference{
 display:flex;
 align-items:center;
 flex:none;
 gap:22px;
 min-height:var(--reference-row-height);
 white-space:nowrap;
}
.client-reference img{width:64px;height:64px;object-fit:contain;flex:none}
.client-reference-name{
 display:block;
 color:var(--text,#f0f2f3);
 font-size:clamp(32px,3.4vw,48px);
 font-weight:500;
 line-height:1.15;
 letter-spacing:-.035em;
}
.client-reference-name small{
 display:block;
 margin-top:8px;
 color:var(--muted,#a1a8ad);
 font-size:14px;
 font-weight:400;
 line-height:1.4;
 letter-spacing:0;
}
.client-references-bands{
 display:none;
 position:absolute;
 inset:0;
 grid-template-rows:repeat(2,var(--reference-row-height));
 gap:var(--reference-row-gap);
 pointer-events:none;
 user-select:none;
}
.client-references-row{position:relative;min-width:0}
.client-references-band{
 position:relative;
 left:50%;
 display:flex;
 justify-content:space-around;
 align-items:center;
 gap:clamp(64px,7vw,100px);
 width:max-content;
 min-width:calc(100% + 440px);
 height:var(--reference-row-height);
 transform:translate3d(-50%,0,0);
}
.client-references.is-motion-ready .client-references-bands{display:grid}
.client-references.is-motion-ready .client-references-list{
 position:absolute;
 width:1px;
 height:1px;
 min-height:0;
 padding:0;
 margin:-1px;
 overflow:hidden;
 clip-path:inset(50%);
 white-space:nowrap;
}
@media(max-width:640px){
 .client-references{--reference-row-height:84px;--reference-row-gap:24px}
 .client-reference{gap:16px}
 .client-reference img{width:48px;height:48px}
 .client-reference-name{font-size:32px}
 .client-reference-name small{font-size:13px;margin-top:6px}
}
@media(prefers-reduced-motion:reduce){
 .client-references.is-motion-ready .client-references-bands{display:none}
 .client-references.is-motion-ready .client-references-list{
  position:static;
  width:auto;
  height:auto;
  margin:0;
  overflow:visible;
  clip-path:none;
 }
}