/* Marketing Hype — pulido final V125
   - Logotipos normalizados en lienzos 2:1 para una escala visual uniforme.
   - Carrusel sin degradados/sombras que oculten los extremos.
   - Botón flotante más discreto y pegado a la esquina en celular.
*/

/* Franja de clientes: limpia, clara y sin oscurecer los logos al entrar o salir. */
.logo-marquee {
  overflow: hidden !important;
  background: linear-gradient(180deg, #ffffff 0%, #f1f6ff 100%) !important;
  border: 1px solid #cbd9ef !important;
  box-shadow: 0 14px 34px rgba(18, 43, 99, 0.10) !important;
}

.logo-marquee::before,
.logo-marquee::after {
  display: none !important;
  content: none !important;
  background: none !important;
  box-shadow: none !important;
}

.logo-viewport {
  overflow: hidden !important;
  padding: 14px 12px !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

.logo-marquee-track {
  align-items: center !important;
  gap: 26px !important;
  padding: 0 !important;
}

.client-logo {
  flex: 0 0 184px !important;
  width: 184px !important;
  height: 94px !important;
  padding: 10px 12px !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  border: 1px solid #d7e2f3 !important;
  box-shadow: 0 7px 18px rgba(18, 43, 99, 0.075) !important;
  opacity: 1 !important;
}

.client-logo::before {
  display: none !important;
  content: none !important;
}

.client-logo img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: none !important;
  animation: none !important;
  filter: none !important;
}

.client-logo:hover {
  transform: translateY(-3px) !important;
  border-color: #b9cdea !important;
  box-shadow: 0 12px 24px rgba(18, 43, 99, 0.12) !important;
}

.client-logo:hover img {
  transform: scale(1.025) !important;
  filter: none !important;
}

/* Botón de regreso arriba: no tapa imágenes ni textos en pantallas pequeñas. */
@media (max-width: 600px) {
  .hype-water-orb {
    right: 10px !important;
    bottom: 10px !important;
    width: 42px !important;
    height: 42px !important;
    border-width: 1px !important;
    box-shadow: 0 10px 24px rgba(0, 3, 36, 0.28), inset 0 1px 6px rgba(255, 255, 255, 0.28) !important;
    animation: none !important;
  }

  .hype-water-arrow {
    font-size: 17px !important;
  }

  .logo-viewport {
    padding: 12px 8px !important;
  }

  .logo-marquee-track {
    gap: 16px !important;
  }

  .client-logo {
    flex-basis: 154px !important;
    width: 154px !important;
    height: 82px !important;
    padding: 8px 10px !important;
    border-radius: 12px !important;
  }
}

@media (max-width: 390px) {
  .hype-water-orb {
    right: 8px !important;
    bottom: 8px !important;
    width: 39px !important;
    height: 39px !important;
  }
}