/* Homepage customer marks. Deliberately isolated from the shared Yasa shell. */
.yasa-client-logos {
  --logo-gap: 38px;
  --logo-item-width: 198px;
  --logo-height: 76px;
  --logo-width: 174px;
  width: min(100%, 1280px);
  max-width: 100%;
  min-width: 0;
  margin: 0 auto;
  padding: 20px 0 44px;
}
.yasa-client-logos__viewport {
  width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  -ms-overflow-style: none;
  touch-action: pan-x pan-y;
  -webkit-overflow-scrolling: touch;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 24px, #000 calc(100% - 24px), transparent);
  mask-image: linear-gradient(90deg, transparent, #000 24px, #000 calc(100% - 24px), transparent);
}
.yasa-client-logos__viewport::-webkit-scrollbar { display: none; }
.yasa-client-logos__viewport:focus-visible {
  outline: 2px solid #f3aa58;
  outline-offset: 5px;
  border-radius: 4px;
}
.yasa-client-logos .yasa-client-logos__track {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: var(--logo-gap);
  width: max-content;
  max-width: none;
  margin: 0;
  padding: 14px 24px;
  list-style: none;
}
.yasa-client-logos .yasa-client-logos__item {
  display: flex;
  flex: 0 0 var(--logo-item-width);
  align-items: center;
  justify-content: center;
  width: var(--logo-item-width);
  height: 110px;
  margin: 0;
  padding: 0;
}
.yasa-client-logos__item a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 12px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  text-decoration: none;
  -webkit-user-drag: none;
  user-select: none;
}
.yasa-client-logos__item a:focus-visible {
  outline: 2px solid #f3aa58;
  outline-offset: -3px;
}
.yasa-client-logos__item img {
  display: block;
  width: min(100%, var(--logo-width));
  height: var(--logo-height);
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 7px 9px rgba(0, 0, 0, .38)) drop-shadow(0 0 10px rgba(127, 174, 225, .16));
  transition: filter .22s ease, transform .22s ease;
  pointer-events: none;
  -webkit-user-drag: none;
  user-select: none;
}
.yasa-client-logos.is-enhanced .yasa-client-logos__viewport { cursor: grab; overflow: clip; touch-action: pan-y; }
.yasa-client-logos.is-enhanced .yasa-client-logos__track { will-change: transform; }
@media (pointer: coarse), (max-width: 900px) {
  .yasa-client-logos.is-enhanced .yasa-client-logos__viewport {
    overflow-x: auto;
    overflow-y: hidden;
    touch-action: pan-x pan-y;
  }
}
.yasa-client-logos.is-dragging .yasa-client-logos__viewport,
.yasa-client-logos.is-dragging a { cursor: grabbing; }
@media (hover: hover) and (pointer: fine) {
  .yasa-client-logos__item a:hover img {
    filter: drop-shadow(0 8px 10px rgba(0, 0, 0, .4)) drop-shadow(0 0 13px rgba(127, 174, 225, .26));
    transform: translateY(-2px);
  }
}
@media (max-width: 600px) {
  .yasa-client-logos {
    --logo-gap: 20px;
    --logo-item-width: 154px;
    --logo-width: 138px;
    --logo-height: 68px;
    padding: 8px 0 28px;
  }
  .yasa-client-logos .yasa-client-logos__item { height: 100px; }
  .yasa-client-logos__item a { padding: 8px; }
  .yasa-client-logos__viewport {
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 12px, #000 calc(100% - 12px), transparent);
    mask-image: linear-gradient(90deg, transparent, #000 12px, #000 calc(100% - 12px), transparent);
  }
  .yasa-client-logos .yasa-client-logos__track { padding-inline: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .yasa-client-logos__item img { transition: none; }
  .yasa-client-logos__item a:hover img { transform: none; }
}