/* A slim company-logo preview between the hero and About us. */
.client-logos{padding:20px var(--gutter);border-bottom:1px solid}
.client-logos-inner{display:grid;grid-template-columns:112px minmax(0,1fr) 44px;align-items:center;gap:32px;max-width:1600px;margin-inline:auto}
.client-logos-label{font-family:var(--sans);font-size:13px;font-weight:400;line-height:1.5;letter-spacing:0;margin:0}
.client-logos-window{min-width:0;overflow-x:auto;scrollbar-width:thin;mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.client-logo-track{display:flex;width:max-content}
.client-logo-group{display:flex;align-items:center;gap:40px;list-style:none;margin:0;padding:0 40px 0 0}
.client-logo-group[hidden]{display:none}
.client-logo-item{display:flex;align-items:center;justify-content:center;flex:0 0 162px;height:44px}
.client-logo-item img{display:block;width:auto;height:auto;max-width:140px;max-height:28px;object-fit:contain;filter:grayscale(1);opacity:.8}
.client-logo-item-google img{max-width:110px;max-height:32px}
.client-logo-item-ibm img{max-width:86px;max-height:30px}
.client-logo-item-sony img{max-width:120px}
.client-logos-toggle{display:grid;place-items:center;width:44px;height:44px;padding:12px;border:0;border-radius:var(--radius-button);transition:background .2s}
.client-logos-toggle[hidden]{display:none}
.client-logos-toggle svg{width:18px;height:18px}
.client-logos-toggle .resume-icon{display:none}
.client-logos-toggle[aria-pressed="true"] .pause-icon{display:none}
.client-logos-toggle[aria-pressed="true"] .resume-icon{display:block}
.client-logos.is-animated .client-logos-window{overflow:hidden}
.client-logos.is-animated .client-logo-track{animation:client-logos-drift 50s linear infinite}
.client-logos.is-paused .client-logo-track{animation-play-state:paused}
@keyframes client-logos-drift{to{transform:translateX(-50%)}}
@media(max-width:700px){
  .client-logos{padding-block:14px}
  .client-logos-inner{grid-template-columns:minmax(0,1fr) 44px;gap:8px 16px}
  .client-logos-label{grid-column:1;grid-row:1}
  .client-logos-toggle{grid-column:2;grid-row:1}
  .client-logos-window{grid-column:1 / -1;grid-row:2}
  .client-logo-group{gap:28px;padding-right:28px}
  .client-logo-item{flex-basis:144px;height:36px}
}
@media(prefers-reduced-motion:reduce){
  .client-logos.is-animated .client-logo-track{animation:none}
  .client-logos.is-animated .client-logos-window{overflow-x:auto}
  .client-logo-group[aria-hidden="true"]{display:none}
  .client-logos-toggle{display:none;transition:none}
}
