/* Novos enquadramentos sem alterar a primeira imagem aprovada. */
.store-banners{background:#202429}
.store-banners .hero-slide{opacity:0;visibility:hidden;z-index:0;will-change:opacity;transition:opacity 1.8s ease-in-out,visibility 0s linear 1.8s}
.store-banners .hero-slide.is-active{opacity:1;visibility:visible;z-index:1;transition:opacity 1.8s ease-in-out}
.store-banners .hero-slide.is-leaving{opacity:0;visibility:visible;z-index:2;pointer-events:none;transition:opacity 1.8s ease-in-out}
.hero-photo-slide{background:#202429}
.hero-photo-image{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.hero-panorama-image{position:absolute;top:-40%;left:0;display:block;width:auto;height:180%;max-width:none;object-fit:cover;will-change:transform}
.hero-panorama:is(.is-active,.is-leaving) .hero-panorama-image{animation:showroom-pan 16s ease-in-out both;animation-play-state:var(--pan-state,running)}
@keyframes showroom-pan{from{object-position:0% 50%}to{object-position:100% 50%}}
@media(max-width:700px){
 .hero-store-angle .hero-photo-image{object-position:57% center}
 .hero-panorama-image{top:-15%;height:130%}
 .hero-panorama:is(.is-active,.is-leaving) .hero-panorama-image{animation-name:showroom-pan-mobile;animation-duration:20s}
}
@keyframes showroom-pan-mobile{from{object-position:50% 0%}to{object-position:50% 100%}}
@media(prefers-reduced-motion:reduce){.store-banners .hero-slide,.store-banners .hero-slide.is-active,.store-banners .hero-slide.is-leaving{transition:none}}
