/* Carrusel infinito de logos de clientes (inicio y services.php) */
.svc-marquee {
  --logo-w: 180px;
  --gap: 1rem;
  overflow: hidden;
  padding: 1rem 0 1.5rem;
  /* Bordes difuminados a izquierda y derecha */
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.svc-marquee__track {
  display: flex;
  width: max-content;
  animation: svc-marquee 40s linear infinite;
}
.svc-marquee:hover .svc-marquee__track,
.svc-marquee:focus-within .svc-marquee__track { animation-play-state: paused; }
.svc-marquee__list {
  list-style: none;
  margin: 0;
  padding: 0 var(--gap) 0 0;
  display: flex;
  gap: var(--gap);
}
.svc-marquee__list li { flex: 0 0 var(--logo-w); }
@keyframes svc-marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
.svc-marquee a,
.svc-marquee__logo {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 110px;
  padding: 0.8rem;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
  transition: transform 0.3s, box-shadow 0.3s;
}
.svc-marquee a:hover { transform: scale(1.05); box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1); }
.svc-marquee img { max-width: 100%; max-height: 80px; object-fit: contain; }
@media (max-width: 768px) {
  .svc-marquee { --logo-w: 130px; --gap: 0.75rem; }
  .svc-marquee__track { animation-duration: 30s; }
  .svc-marquee a, .svc-marquee__logo { height: 90px; }
}


@media (prefers-reduced-motion: reduce) {
  /* Sin movimiento: los logos se muestran en una cuadrícula fija */
  .svc-marquee { -webkit-mask-image: none; mask-image: none; }
  .svc-marquee__track { animation: none; width: auto; }
  .svc-marquee__list { flex-wrap: wrap; justify-content: center; padding: 0; }
  .svc-marquee__list[aria-hidden="true"] { display: none; }
  .svc-marquee a:hover { transform: none; }
}
