/* VyxPay landing hero media override. */
#inicio {
  isolation: isolate;
  background: #030305;
}

#inicio svg[viewBox="0 0 696 316"],
#inicio .vyx-hero-wave {
  display: none !important;
}

#inicio .vyx-hero-video-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  pointer-events: none;
  opacity: 0.58;
  filter: saturate(1.15) contrast(1.05) brightness(0.72);
}

#inicio::before,
#inicio::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

#inicio::before {
  background:
    radial-gradient(ellipse 54% 36% at 50% 40%, hsl(var(--primary) / 0.13), transparent 70%),
    linear-gradient(to bottom, rgba(3, 3, 5, 0.5) 0%, rgba(3, 3, 5, 0.18) 42%, #030305 96%);
}

#inicio::after {
  background: linear-gradient(90deg, rgba(3, 3, 5, 0.9) 0%, rgba(3, 3, 5, 0.18) 48%, rgba(3, 3, 5, 0.7) 100%);
}

#inicio .vyx-dashboard-premium-glow {
  position: relative;
  box-shadow:
    0 0 0 1px hsl(var(--primary) / 0.22),
    0 0 16px hsl(var(--primary) / 0.28),
    0 0 38px hsl(var(--primary) / 0.18),
    0 26px 70px rgba(0, 0, 0, 0.56) !important;
}

#inicio .vyx-dashboard-premium-glow::before {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  pointer-events: none;
  border: 1px solid hsl(var(--primary) / 0.3);
  box-shadow: inset 0 0 22px hsl(var(--primary) / 0.08);
}

@media (max-width: 768px) {
  #inicio .vyx-hero-video-bg {
    opacity: 0.44;
    object-position: 58% center;
  }

  #inicio .vyx-dashboard-premium-glow {
    box-shadow:
      0 0 0 1px hsl(var(--primary) / 0.18),
      0 0 18px hsl(var(--primary) / 0.18),
      0 18px 50px rgba(0, 0, 0, 0.5) !important;
  }
}