/* Compact shared geometry for all six stories. Text is measured at its real
   width; minimum heights reserve the largest state without clipping content. */
#heroLuxury.hero-luxury-v32[data-world] {
  --hero-copy-height-v43: 25rem;
  --hero-meta-height-v43: 7.5rem;
  --hero-bottom-height-v43: 58px;
  --hero-shell-gutter: 20px;
  margin-inline: var(--hero-shell-gutter);
  padding: 28px max(28px, 4vw) 16px;
  gap: 16px 4%;
}
/* Keep the product strip in its own flow box, with the same content edge as
   the banner. A transparent surface lets the page atmosphere continue through
   the gap instead of drawing a second, full-width rectangular colour block. */
#heroLuxury.hero-luxury-v32 + .hero-shopping {
  box-sizing: border-box;
  position: relative;
  isolation: isolate;
  margin: 24px 20px 0;
  padding: 16px max(28px, 4vw) 28px;
  width: auto;
  min-width: 0;
  border: 0;
  background: transparent !important;
  box-shadow: none;
  content-visibility: visible;
}
#heroLuxury.hero-luxury-v32 + .hero-shopping .hero-shopping-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 16px;
  margin-bottom: 20px;
}
#heroLuxury.hero-luxury-v32 + .hero-shopping .hero-shopping-heading > div { min-width: 0; }
#heroLuxury.hero-luxury-v32 + .hero-shopping .rail-controls { flex-shrink: 0; }
#heroLuxury.hero-luxury-v32 + .hero-shopping .rail-controls button { flex: 0 0 44px; }
#heroLuxury.hero-luxury-v32[data-world] .hero-copy {
  box-sizing: border-box;
  min-height: var(--hero-copy-height-v43);
  height: auto;
  padding: 0;
}
#heroLuxury.hero-luxury-v32[data-world] #heroEyebrow { margin-bottom: 14px; font-size: 11px; }
#heroLuxury.hero-luxury-v32[data-world] #heroTitle {
  margin-bottom: 16px;
  font-size: clamp(36px, 3.8vw, 56px);
  line-height: 1.08;
}
#heroLuxury.hero-luxury-v32[data-world] #heroDescription {
  margin-bottom: 18px;
  font-size: 15px;
  line-height: 1.55;
}
#heroLuxury.hero-luxury-v32[data-world] .hero-ctas .button { min-height: 44px; padding: 10px 20px; }
#heroLuxury.hero-luxury-v32[data-world] #heroProof { margin-top: 18px; }
#heroLuxury.hero-luxury-v32[data-world] .hero-visual-v32 {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(var(--hero-meta-height-v43), auto);
  width: 100%;
  max-width: 400px;
  gap: 8px;
  justify-self: center;
  align-items: start;
}
/* One square preserves all original crops/container-relative silhouettes,
   with a smaller shared cap than the previous 540px image frame. */
#heroLuxury.hero-luxury-v32[data-world] #heroStage.hero-stage {
  grid-column: 1;
  grid-row: 1;
  box-sizing: border-box;
  width: 100%;
  height: auto;
  min-width: 0;
  min-height: 0;
  max-width: none;
  max-height: none;
  aspect-ratio: 1;
  margin: 0;
  align-self: start;
}
/* The real caption + optional selector share one measured area. This removes
   the blank Aqua-only row above every other product and measures combined
   states rather than adding unrelated maximum caption/control heights. */
#heroLuxury.hero-luxury-v32[data-world] .hero-meta-v44 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  grid-column: 1;
  grid-row: 2;
  box-sizing: border-box;
  min-height: var(--hero-meta-height-v43);
  height: auto;
  min-width: 0;
  align-self: start;
}
#heroLuxury.hero-luxury-v32[data-world] .hero-caption-v32 {
  box-sizing: border-box;
  min-height: 0;
  height: auto;
  padding-top: 8px;
}
#heroLuxury.hero-luxury-v32[data-world] #heroSpotlight > span { margin-bottom: 3px; font-size: 9px; line-height: 1.4; }
#heroLuxury.hero-luxury-v32[data-world] #heroProductName { font-size: 14px; line-height: 1.4; }
#heroLuxury.hero-luxury-v32[data-world] #heroCredit { margin-top: 3px; font-size: 11px; line-height: 1.4; }
#heroLuxury.hero-luxury-v32[data-world] .aqua-view-switch-v33 {
  display: none;
  box-sizing: border-box;
  min-height: 0;
  max-width: 100%;
  align-self: center;
  justify-content: center;
  align-items: center;
  gap: 2px;
  padding: 2px;
  border: 1px solid transparent;
}
#heroLuxury.hero-luxury-v32[data-world="aqua-mist"] .aqua-view-switch-v33 { display: flex; }
#heroLuxury.hero-luxury-v32[data-world] .aqua-view-switch-v33 button { min-height: 44px; padding: 7px 10px; gap: 4px; font-size: 11px; }
#heroLuxury.hero-luxury-v32[data-world] .aqua-view-switch-v33 small { font-size: 8px; }
#heroLuxury.hero-luxury-v32[data-world] .hero-bottom {
  box-sizing: border-box;
  min-height: var(--hero-bottom-height-v43);
  height: auto;
  padding-top: 12px;
}
@media (max-width: 1100px) {
  #heroLuxury.hero-luxury-v32[data-world] { --hero-shell-gutter: 14px; --hero-bottom-height-v43: 104px; padding: 24px 28px 14px; }
  #heroLuxury.hero-luxury-v32 + .hero-shopping { margin-inline: 14px; padding-inline: 28px; }
  #heroLuxury.hero-luxury-v32[data-world] #heroTitle { font-size: clamp(34px, 4.2vw, 46px); }
}
@media (max-width: 800px) {
  #heroLuxury.hero-luxury-v32[data-world] { --hero-shell-gutter: 12px; --hero-copy-height-v43: 23rem; padding: 24px 22px 14px; gap: 14px; }
  #heroLuxury.hero-luxury-v32 + .hero-shopping { margin: 20px 12px 0; padding: 12px 22px 24px; }
  #heroLuxury.hero-luxury-v32[data-world] .hero-visual-v32 { max-width: 340px; }
  #heroLuxury.hero-luxury-v32[data-world] #heroTitle { font-size: clamp(34px, 5.5vw, 44px); margin-bottom: 12px; }
  #heroLuxury.hero-luxury-v32[data-world] #heroEyebrow { margin-bottom: 10px; }
  #heroLuxury.hero-luxury-v32[data-world] #heroDescription { margin-bottom: 14px; font-size: 14px; line-height: 1.5; }
  #heroLuxury.hero-luxury-v32[data-world] #heroProof { margin-top: 14px; }
}
@media (max-width: 480px) {
  #heroLuxury.hero-luxury-v32[data-world] { --hero-shell-gutter: 8px; --hero-copy-height-v43: 25rem; --hero-meta-height-v43: 8rem; padding: 20px 16px 12px; }
  #heroLuxury.hero-luxury-v32 + .hero-shopping { margin: 18px 8px 0; padding: 10px 16px 22px; }
  #heroLuxury.hero-luxury-v32 + .hero-shopping .hero-shopping-heading { gap: 10px; }
  #heroLuxury.hero-luxury-v32 + .hero-shopping .hero-shopping-heading h2 { font-size: 21px; line-height: 1.3; overflow-wrap: anywhere; }
  #heroLuxury.hero-luxury-v32[data-world] .hero-visual-v32 { max-width: 300px; }
  #heroLuxury.hero-luxury-v32[data-world] #heroTitle { font-size: clamp(31px, 8.4vw, 39px); }
  #heroLuxury.hero-luxury-v32[data-world="kbeauty"] #heroProof { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  #heroLuxury.hero-luxury-v32[data-world] #heroProof > button { padding: 7px 4px; font-size: 11px; min-height: 44px; }
  #heroLuxury.hero-luxury-v32[data-world] .hero-ctas { gap: 6px 16px; }
  #heroLuxury.hero-luxury-v32[data-world] .hero-ctas .button { padding: 10px 16px; }
  #heroLuxury.hero-luxury-v32[data-world] .hero-bottom { padding-top: 10px; }
}
@media (max-width: 380px) {
  #heroLuxury.hero-luxury-v32[data-world] .hero-bottom { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  #heroLuxury.hero-luxury-v32[data-world] .hero-story-caption { grid-column: 1; grid-row: 1; }
  #heroLuxury.hero-luxury-v32[data-world] .hero-controls { grid-column: 1; grid-row: 2; justify-self: start; }
  #heroLuxury.hero-luxury-v32[data-world] .hero-story-timeline { grid-column: 1; grid-row: 3; }
}
@media (max-width: 360px) {
  #heroLuxury.hero-luxury-v32[data-world] .hero-story-timeline { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  #heroLuxury.hero-luxury-v32[data-world],
  #heroLuxury.hero-luxury-v32[data-world] .hero-copy,
  #heroLuxury.hero-luxury-v32[data-world] .hero-visual-v32,
  #heroLuxury.hero-luxury-v32[data-world] .hero-meta-v44 { transition: none; }
}