/* Preserve the user's square demo; parallax belongs to its outer wrapper. */
.home-page.structure-preview .product-slider:has([data-label-demo]) {
  /* Clip decoration without letting focus scroll the product under the header. */
  overflow: clip;
}
.home-page.structure-preview .hero-label-scene {
  position: absolute;
  inset: 0;
  z-index: 4;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
  place-items: center;
  container-type: size;
  pointer-events: none;
  user-select: none;
}
@media (min-width: 821px) {
  .home-page.structure-preview .hero-label-scene {
    left: -7vw;
  }
}
.home-page.structure-preview .hero-label-parallax {
  /* Size the complete original composition against both available axes. */
  width: min(120cqw, calc(100cqh + 20px), 850px);
  aspect-ratio: 1 / 1;
  transform: translate3d(var(--parallax-image-x, 0px), var(--parallax-image-y, 0px), 0);
  will-change: transform;
}
.home-page.structure-preview .hero-label-stage {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: visible;
}
.home-page.structure-preview .hero-label-bottle {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.home-page.structure-preview .hero-label-traveler {
  position: absolute;
  left: 31.10%;
  top: 17.46%;
  width: 41.47%;
  opacity: 1;
  transform: translate(0, 0) scale(1);
  will-change: transform, opacity;
}
.home-page.structure-preview .hero-label-art {
  display: block;
  width: 100%;
  height: auto;
  transform: rotate(24deg);
  transform-origin: 50% 50%;
  filter: drop-shadow(10px 12px 12px rgba(17, 58, 91, .16));
  will-change: filter;
}
.home-page.structure-preview .hero-label-scene[data-label-state="floating"] .hero-label-traveler {
  animation: simarcDemoFloatSubtle 2.8s ease-in-out infinite;
}
@keyframes simarcDemoFloatSubtle {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(0, -1.1%) scale(1.003); }
}
@media (max-width: 820px) {
  .home-page.structure-preview .hero-label-parallax {
    width: min(120cqw, calc(100cqh + 12px), 540px);
  }
}
@media (max-width: 520px) {
  .home-page.structure-preview .hero-label-parallax {
    width: min(120cqw, calc(100cqh + 12px), 430px);
  }
}
@media (prefers-reduced-motion: reduce) {
  .home-page.structure-preview .hero-label-parallax {
    transform: none;
    will-change: auto;
  }
  .home-page.structure-preview .hero-label-traveler {
    animation: none !important;
    transform: none !important;
    opacity: 1 !important;
    will-change: auto;
  }
  .home-page.structure-preview .hero-label-art {
    will-change: auto;
  }
}
