/* All views share one stage. Hidden views still contribute their natural
   caption height, keeping controls steady without clipping text or media. */
.product-page .spotlight-gallery .gallery-stage {
 display:grid;
 grid-template-columns:minmax(0,1fr);
 height:auto;
 min-height:0;
 max-height:none;
 aspect-ratio:auto;
 isolation:isolate;
 overflow:hidden;
}
.product-page .spotlight-gallery .gallery-stage::before {
 content:'';
 grid-area:1 / 1;
 width:100%;
 aspect-ratio:1;
 pointer-events:none;
}
.product-page .spotlight-gallery .gallery-stage.white-product-view {
 border-color:transparent;
}
/* Keep the controls in place when a direction reaches the end of the gallery. */
.product-page .spotlight-gallery .gallery-controls .gallery-arrow:disabled {
 visibility:hidden;
 pointer-events:none;
}
.product-page .spotlight-gallery .gallery-slide,
.product-page .spotlight-gallery .gallery-slide.has-story {
 grid-area:1 / 1;
 display:flex;
 flex-direction:column;
 align-self:stretch;
 position:relative;
 inset:auto;
 width:100%;
 height:auto;
 min-width:0;
 aspect-ratio:auto;
}
.product-page .spotlight-gallery .gallery-slide[hidden] {
 display:flex!important;
 visibility:hidden;
 pointer-events:none;
}
.product-page .spotlight-gallery .gallery-slide>img {
 position:absolute;
 inset:0;
 display:block;
 width:100%;
 height:100%;
 object-fit:contain;
}
/* The camera exports contain a thin dark line at their outer raster edge.
   Keep the square image at its original scale, then mask that margin on the
   image itself (not the taller shared stage, which may contain letterboxing). */
.product-page .spotlight-gallery .gallery-slide[data-slide="8"]>img {
 inset:50% auto auto 0;
 height:auto;
 aspect-ratio:1;
 transform:translateY(-50%);
 clip-path:inset(.25%);
}
.product-page .spotlight-gallery #tab-8 img {
 width:min(100%,60px);
 height:auto;
 aspect-ratio:1;
 margin-inline:auto;
 clip-path:inset(.25%);
}
@media(max-width:740px) {
 .product-page .spotlight-gallery #tab-8 img { width:min(100%,42px); }
}
.product-page .spotlight-gallery .has-story video {
 position:relative;
 inset:auto;
 display:block;
 flex:none;
 width:100%;
 height:auto;
 aspect-ratio:3 / 2;
 object-fit:contain;
 object-position:center;
}
.product-page .spotlight-gallery .demo-caption {
 position:relative;
 inset:auto;
 height:auto;
 min-height:0;
 flex:1 0 auto;
 padding:clamp(20px,2vw,32px);
}
.product-page .spotlight-gallery .gallery-tabs {
 position:relative;
 inset:auto;
 transform:none;
 isolation:isolate;
 max-width:100%;
}
.product-page .spotlight-gallery .gallery-tabs button,
.product-page .spotlight-gallery .gallery-tabs button[aria-selected=true] {
 z-index:1;
 padding:7px;
 border-width:1px;
 border-radius:16px;
 scroll-snap-align:center;
}
.product-page .spotlight-gallery .gallery-tabs.has-selection button {
 background:transparent;
 border-color:#1a433c18;
}
.product-page .spotlight-gallery .gallery-tabs.has-selection button[aria-selected=true] {
 background:transparent;
 border-color:transparent;
}
.product-page .spotlight-gallery .gallery-tabs button:focus-visible {
 outline-offset:-3px;
}
.product-page .spotlight-gallery .gallery-selection {
 position:absolute;
 left:0;
 top:0;
 z-index:0;
 display:block;
 margin:0;
 box-sizing:border-box;
 border:3px solid #000;
 border-radius:16px;
 background:#fff;
 box-shadow:none;
 backdrop-filter:none;
 -webkit-backdrop-filter:none;
 pointer-events:none;
}
.product-page .spotlight-gallery .selection-ready .gallery-selection {
 transition:transform 340ms cubic-bezier(.22,1,.36,1),width 340ms cubic-bezier(.22,1,.36,1),height 340ms cubic-bezier(.22,1,.36,1);
}
@media(prefers-reduced-motion:reduce) {
 .product-page .spotlight-gallery .selection-ready .gallery-selection { transition:none; }
}