.customers-hero{min-height:auto;padding-block:clamp(110px,12vw,166px) clamp(46px,6vw,86px)}
.customers-hero .hero-inner{padding-block:0}
.customers-hero h1{max-width:24ch;margin-block:14px}
.customers-hero h1:lang(zh){max-width:none}
.customers-slogan-end{display:block;color:var(--cyan)}
.customers-wall{padding-block:0 clamp(72px,10vw,128px)}
.customers-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:28px}
.customers-heading h2{margin:0}
.customers-count{display:flex;align-items:center;gap:10px;color:var(--muted);margin:0;white-space:nowrap}
.customers-count strong{font-size:var(--fs-h3);line-height:1;color:var(--cyan)}
.customers-carousel{position:relative;isolation:isolate}
.customers-carousel::before,.customers-carousel::after{
  content:"";position:absolute;z-index:1;inset-block:1px;width:clamp(12px,4vw,46px);
  pointer-events:none;transition:opacity var(--t-panel) var(--e-out)
}
.customers-carousel::before{left:0;background:linear-gradient(90deg,var(--bg-deep),transparent)}
.customers-carousel::after{right:0;background:linear-gradient(270deg,var(--bg-deep),transparent)}
.customers-carousel[data-start]::before,.customers-carousel[data-end]::after{opacity:0}
.customers-viewport{
  overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;
  scrollbar-width:none;border-block:1px solid var(--line-strong);
  background:radial-gradient(ellipse at 40% 20%,rgba(10,132,255,.14),transparent 70%),
    repeating-linear-gradient(0deg,transparent 0 23px,rgba(56,189,248,.025) 23px 24px),
    rgba(9,16,31,.58)
}
.customers-viewport::-webkit-scrollbar{display:none}
.customers-viewport:focus-visible{outline:2px solid var(--cyan);outline-offset:-2px}
@media (pointer:fine){
  .customers-carousel[data-ready] .customers-viewport{cursor:grab;user-select:none}
  .customers-carousel[data-dragging] .customers-viewport{cursor:grabbing;scroll-snap-type:none}
}
.customers-grid{
  --customers-visible:5.25;
  display:flex;padding:0;margin:0;list-style:none
}
.customers-grid li{
  flex:0 0 calc(100% / var(--customers-visible));
  min-width:0;min-height:138px;display:grid;grid-template-rows:64px auto;gap:12px;
  justify-items:center;align-content:center;padding:18px 10px;text-align:center;
  border-inline-end:1px solid var(--line);
  scroll-snap-align:start;transition:background var(--t-panel) var(--e-out)
}
.customers-grid li:last-child{border-inline-end:0}
.customers-logo{display:grid;place-items:center;width:100%;max-width:176px;height:64px}
.customers-logo img{
  display:block;width:auto;height:auto;max-width:86%;max-height:52px;object-fit:contain;
  pointer-events:none;transition:transform var(--t-panel) var(--e-out),filter var(--t-panel) var(--e-out)
}
@media (hover:hover){
  .customers-carousel:not([data-dragging]) li:hover{
    background:radial-gradient(ellipse at 50% 42%,rgba(56,189,248,.2),transparent 74%)
  }
  .customers-carousel:not([data-dragging]) li:hover img{
    transform:translateY(-3px) scale(1.055);filter:drop-shadow(0 0 10px rgba(56,189,248,.42))
  }
}
.customers-logo.mark img{max-width:64%;max-height:61px}
.customers-logo.compact img{max-width:76%;max-height:56px}
.customers-name{color:var(--body);font-size:13px;line-height:1.4;overflow-wrap:anywhere}
.customers-controls{display:flex;align-items:center;gap:8px;margin-top:12px}
.customers-controls[hidden]{display:none}
.customers-control{
  flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:var(--r-sm);
  border:1px solid var(--line-strong);color:var(--text);background:var(--surface);
  cursor:pointer;transition:color var(--t-ctrl),background var(--t-ctrl),border-color var(--t-ctrl)
}
.customers-control:not([aria-disabled="true"]):hover,.customers-control:focus-visible{
  color:var(--cyan);border-color:var(--cyan);background:var(--signal-tint)
}
.customers-control[aria-disabled="true"]{opacity:.42;cursor:default}
.customers-control svg{width:17px;height:17px}
.customers-control [data-play],.customers-control[aria-pressed="false"] [data-pause]{display:none}
.customers-control[aria-pressed="false"] [data-play]{display:block}
.customers-progress{
  height:2px;flex:1;margin-inline:8px;border-radius:var(--r-full);
  background:var(--line-strong);position:relative
}
.customers-progress::before{
  content:"";position:absolute;inset:0;border-radius:inherit;transform-origin:left;
  transform:scaleX(var(--customers-progress,0));
  background:linear-gradient(90deg,var(--signal),var(--cyan));box-shadow:0 0 12px var(--signal)
}
.customers-more{margin-top:22px;display:flex;justify-content:flex-end}
@media (max-width:980px){
  .customers-grid{--customers-visible:3.25}
}
@media (max-width:680px){
  .customers-grid{--customers-visible:2.25}
  .customers-grid li{min-height:110px;padding:12px 8px;gap:6px}
  .customers-heading{align-items:center;gap:12px}
  .customers-more{justify-content:flex-start}
}
@media (prefers-reduced-motion:reduce){
  .customers-carousel li:hover img{transform:none}
}
