.hero-counter-photo.hero-carousel{display:block;position:relative;isolation:isolate}
.hero-counter-photo.hero-carousel:focus-visible{outline:3px solid #3279bc;outline-offset:4px}
.hero-carousel-viewport{position:relative;width:100%;aspect-ratio:1;overflow:hidden;border-radius:inherit;background:#e8f0f6;touch-action:pan-y}
.hero-carousel-slide{position:absolute;inset:0;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .5s ease,visibility .5s}
.hero-carousel-slide.is-active{opacity:1;visibility:visible;pointer-events:auto}
.hero-counter-photo .hero-carousel-slide picture{height:100%}
.hero-counter-photo .hero-carousel-slide img{width:100%;height:100%;object-fit:cover}
.hero-carousel-slide--delivery::before{content:'';position:absolute;inset:-24px;background:url('/marketing-assets/taro-delivery-hero-v1-800.webp') center/cover;filter:blur(24px);opacity:.38}
.hero-counter-photo .hero-carousel-slide--delivery img{object-fit:contain}
.hero-carousel-slide--warehouse::before{content:'';position:absolute;inset:-24px;background:url('/marketing-assets/taro-warehouse-hero-v1-800.webp') center/cover;filter:blur(24px);opacity:.38}
.hero-counter-photo .hero-carousel-slide--warehouse img{object-fit:contain}
.hero-carousel-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(prefers-reduced-motion:reduce){.hero-carousel-slide{transition:none!important}.hero-carousel-slide--delivery::before,.hero-carousel-slide--warehouse::before{filter:none}}

/* On phones the existing carousel is the hero backdrop, behind the real copy. */
@media(max-width:600px){
 .hero.shell{position:relative;isolation:isolate;width:100%;min-height:min(760px,calc(100svh - 72px));grid-template-columns:minmax(0,1fr);gap:0;padding:56px 22px 64px;background:#102c43}
 .hero .hero-copy{z-index:2;width:100%;padding:0}
 .hero h1{color:#fff;text-shadow:0 2px 20px rgba(3,18,31,.2)}
 .hero .hero-lead{max-width:36ch;color:#f3f8fc;text-wrap:pretty}
 .hero .hero-actions{width:min(100%,320px);margin-inline:auto}
 .hero .hero-actions .button-quiet{border-color:rgba(255,255,255,.65);background:rgba(7,25,41,.38);color:#fff;backdrop-filter:blur(6px)}
 .hero .hero-actions .button-quiet:hover{background:rgba(7,25,41,.55)}
 .hero .hero-actions .button:focus-visible{outline-color:#fff}
 .hero .hero-visual.hero-counter-photo.hero-carousel{position:absolute;inset:0;z-index:0;width:100%;height:100%;min-height:0;margin:0;border:0;border-radius:0;box-shadow:none;transform:none;opacity:1}
 .hero .hero-carousel-viewport{height:100%;aspect-ratio:auto;border-radius:0;background:#102c43}
 .hero .hero-carousel-viewport::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(7,25,41,.64),rgba(7,25,41,.62) 52%,rgba(7,25,41,.76))}
 .hero .hero-counter-photo .hero-carousel-slide img{object-fit:cover;object-position:center}
 .hero .hero-carousel-slide--delivery::before,.hero .hero-carousel-slide--warehouse::before{display:none}
 .hero .hero-carousel:focus-visible{outline-color:#c5e2f2;outline-offset:-5px}
}