.hero-banner-wrap.hero-carousel{display:block;position:relative;background:#071e27;overflow:hidden;padding-bottom:42px;aspect-ratio:auto}
.hero-carousel .hero-slide{display:block;margin:0;animation:none;position:relative;width:100%}
.hero-carousel .hero-slide[hidden]{display:none}
.hero-carousel .hero-slide picture,.hero-carousel .hero-banner-img{display:block;width:100%;max-width:none;height:auto;aspect-ratio:2048/762;object-fit:contain}
.hero-carousel .hero-slide-in{position:relative;z-index:2;animation:amis-slide-left .8s ease-in-out both}
.hero-carousel .hero-slide-out{position:absolute;inset:0 0 auto;z-index:1}
@keyframes amis-slide-left{from{transform:translateX(100%)}to{transform:translateX(0)}}
.hero-carousel-controls{position:absolute;bottom:0;left:0;right:0;height:42px;display:flex;justify-content:center;align-items:center;gap:4px;background:#0b3c49;z-index:4}
.hero-carousel-controls .hero-carousel-dot{width:32px;height:32px;padding:0;border:0;border-radius:50%;background:transparent;cursor:pointer;display:grid;place-items:center}
.hero-carousel-dot::before{content:"";width:9px;height:9px;border-radius:50%;background:#fff8;border:1px solid #fff}
.hero-carousel-dot[aria-pressed="true"]::before{background:#f4a340;border-color:#f4a340}
.hero-carousel-dot:focus-visible{outline:2px solid #f4a340;outline-offset:0}
.hero-carousel-note{position:absolute;right:.5rem;bottom:48px;z-index:3;margin:0;padding:.25rem .5rem;background:#071e27dc;color:white;font-size:.75rem;max-width:85%}
.hero-carousel-controls[hidden],.hero-carousel-note[hidden]{display:none}
@media(max-width:600px){.hero-carousel-note{font-size:.6rem}}
@media(prefers-reduced-motion:reduce){.hero-carousel *{animation:none!important;transition:none!important}}