.hero-carousel .carousel-dots{flex-wrap:nowrap;width:max-content;max-width:calc(100% - 2 * var(--pad));justify-content:flex-start}
.hero-carousel .carousel-dots button{flex:0 1 24px;min-width:0}
@media(max-width:360px){.hero-carousel .carousel-dots button{width:20px;flex-basis:20px}.hero-carousel .carousel-dots button::after{left:calc(50% - 2.5px)}.hero-carousel .carousel-dots button[aria-current=true]::after{left:calc(50% - 3.5px)}}