/* Supplied campaign artwork. Only the coupon and text-free artwork use visible HTML copy. */
.hero .banner {
  box-sizing: border-box;
  margin: 0;
  min-width: 100%;
  background-image: var(--hero-mobile);
  background-size: cover;
  background-position: right center;
  background-repeat: no-repeat;
}
.hero .banner > * { max-width: 75%; }
/* Only the first banner's artwork loads with the page (owner 2026-10-28, PageSpeed): the hero preloads it, and home.js lets the
   others in once the page has loaded, so they do not compete with it. */
.js .hero:not(.hero--ready) .banner ~ .banner { background-image: none; }
.hero .banner--coupon {
  --hero-mobile: url('../img/banners/iluminaras-home-cupon-mes-mobile-366x249-v02.webp');
  --hero-desktop: url('../img/banners/iluminaras-home-cupon-mes-desktop-1400x313-v02.webp');
}
.hero .banner--boom {
  --hero-mobile: url('../img/banners/iluminaras-home-boom-sale-mobile-366x249-v02.webp');
  --hero-desktop: url('../img/banners/iluminaras-home-boom-sale-desktop-1400x313-v02.webp');
}
.hero .banner--shipping {
  --hero-mobile: url('../img/banners/iluminaras-home-envio-gratis-mobile-366x249-v02.webp');
  --hero-desktop: url('../img/banners/iluminaras-home-envio-gratis-desktop-1400x313-v02.webp');
}
.hero .banner--pickup {
  --hero-mobile: url('../img/banners/iluminaras-home-envio-gratis-mobile-800x560-v01.webp');
  --hero-desktop: url('../img/banners/iluminaras-home-envio-gratis-desktop-2800x640-v01.webp');
}
.hero .banner--halloween {
  background-color: #503555;
  --hero-mobile: url('../img/banners/iluminaras-home-halloween-mobile-366x249-v02.webp');
  --hero-desktop: url('../img/banners/iluminaras-home-halloween-desktop-1400x313-v02.webp');
}
.hero .banner--primavera {
  background-color: #ffb94f;
  color: #432a18;
  --hero-mobile: url('../img/banners/iluminaras-home-primavera-mobile-800x560-v01.webp');
  --hero-desktop: url('../img/banners/iluminaras-home-primavera-desktop-2800x640-v01.webp');
}
.hero .banner--cables-led-2x1 {
  background-color: #030719;
  --hero-mobile: url('../img/banners/iluminaras-home-cables-led-2x1-mobile-800x560-v01.webp');
  --hero-desktop: url('../img/banners/iluminaras-home-cables-led-2x1-desktop-2800x640-v01.webp');
}
.hero .banner--cargador-auto {
  background-color: #061c2c;
  --hero-mobile: url('../img/banners/iluminaras-home-cargador-auto-mobile-800x560-v01.webp');
  --hero-desktop: url('../img/banners/iluminaras-home-cargador-auto-desktop-2800x640-v01.webp');
}
/* Preserve every word and painted button: these three images are the complete banner. */
.hero .banner--boom, .hero .banner--halloween, .hero .banner--shipping {
  position: relative;
  align-self: flex-start;
  min-height: 0;
  padding: 0;
  aspect-ratio: 366 / 249;
  background-size: 100% 100%;
}
.hero .banner > .banner__image-link {
  position: absolute;
  inset: 0;
  max-width: none;
  border-radius: inherit;
}
.hero .banner > .banner__image-link:focus-visible {
  outline: 3px solid #fff;
  outline-offset: -5px;
  box-shadow: inset 0 0 0 7px #172a3a;
}
@media (min-width: 900px) {
  .hero .banner { background-image: var(--hero-desktop); }
  .hero .banner > :not(.banner__image-link) { max-width: 62%; }
  .hero .banner--boom, .hero .banner--halloween, .hero .banner--shipping { aspect-ratio: 1400 / 313; }
}