/* selectraven 1.12.0 — six-piece desktop composition and collision-safe responsive layout. */
.hero-next-stage .hero-preview-product img {
  object-fit: contain !important;
  object-position: center !important;
}
.hero-next-stage .hero-preview-1 {
  left: 5.2% !important;
  top: 34% !important;
  width: clamp(228px, 16vw, 326px) !important;
}
.hero-next-stage .hero-preview-2 {
  right: 10.5% !important;
  top: 7% !important;
  width: clamp(164px, 10.8vw, 220px) !important;
}
.hero-next-stage .hero-preview-3 {
  left: 16% !important;
  bottom: 6% !important;
  width: clamp(144px, 9vw, 184px) !important;
}
.hero-next-stage .hero-preview-4 {
  right: 12% !important;
  bottom: 5.5% !important;
  width: clamp(190px, 12.6vw, 256px) !important;
}
.hero-next-stage .hero-preview-5 {
  left: 21.5% !important;
  top: 3% !important;
  width: clamp(166px, 10.8vw, 220px) !important;
}
.hero-next-stage .hero-preview-6 {
  z-index: 2;
  right: 2.8%;
  top: 35%;
  width: clamp(216px, 15vw, 306px);
  --entrance-x: 150px;
  --entrance-y: 35px;
  --preview-tilt: 4deg;
  --preview-delay: .55;
}

/* Tablet and small laptop: reserve a clean central column for the title. */
@media (min-width: 768px) and (max-width: 1180px) {
  .hero-stage-heading { width: min(58vw, 650px) !important; }
  .hero-stage-heading > h2 { font-size: clamp(58px, 7.1vw, 82px) !important; line-height: .82 !important; }
  .hero-stage-heading > span { max-width: 430px; }
  .hero-next-stage .hero-preview-1 { left: 1.5% !important; top: 35% !important; width: clamp(170px, 19vw, 214px) !important; }
  .hero-next-stage .hero-preview-2 { right: 2% !important; top: 6% !important; width: clamp(126px, 15vw, 172px) !important; }
  .hero-next-stage .hero-preview-3 { left: 5% !important; bottom: 4% !important; width: clamp(108px, 13vw, 142px) !important; }
  .hero-next-stage .hero-preview-4 { right: 5% !important; bottom: 4% !important; width: clamp(142px, 17vw, 190px) !important; }
  .hero-next-stage .hero-preview-5 { left: 16% !important; top: 2% !important; width: clamp(124px, 15vw, 164px) !important; }
  .hero-next-stage .hero-preview-6 { right: 1.5% !important; top: 38% !important; width: clamp(170px, 19vw, 214px) !important; }
}

/* Phone: four fully visible products, with the fifth and sixth removed from the reading corridor. */
@media (max-width: 767px) {
  .hero-next-stage { overflow: hidden !important; }
  .hero-stage-heading { width: min(70vw, 300px) !important; }
  .hero-stage-heading > h2 { font-size: clamp(39px, 10.8vw, 50px) !important; }
  .hero-next-stage .hero-preview-1 { left: 10px !important; top: 9% !important; width: clamp(88px, 24vw, 106px) !important; }
  .hero-next-stage .hero-preview-2 { right: 10px !important; top: 10% !important; width: clamp(76px, 21vw, 92px) !important; }
  .hero-next-stage .hero-preview-3 { left: 14px !important; bottom: 8% !important; width: clamp(74px, 20vw, 90px) !important; }
  .hero-next-stage .hero-preview-4 { right: 10px !important; bottom: 7% !important; width: clamp(92px, 25vw, 110px) !important; }
  .hero-next-stage .hero-preview-5,
  .hero-next-stage .hero-preview-6 { display: none !important; }
}
