.home-banner{position:relative;overflow:hidden;border-radius:20px;background:#fff;box-shadow:0 4px 20px #0f172a08}
#bannerScroller{position:relative;z-index:1;display:flex;overflow-x:auto;aspect-ratio:7/3;scroll-snap-type:x mandatory;scrollbar-width:none}
#bannerScroller::-webkit-scrollbar{display:none}
#bannerScroller>img{display:block;flex:0 0 100%;width:100%;min-width:0;height:100%;aspect-ratio:auto;object-fit:cover;scroll-snap-align:center}
.banner-dots{position:absolute;left:0;right:0;bottom:6px;z-index:2;display:flex;justify-content:center;gap:2px;height:34px;align-items:center;padding:0 12px;pointer-events:none;background:linear-gradient(180deg,transparent 0%,rgba(6,24,55,.2) 100%)}
.banner-dots button{display:grid;place-items:center;width:32px;height:32px;border:0;background:transparent;padding:0;cursor:pointer;pointer-events:auto}
.banner-dots button:before{content:'';width:6px;height:6px;border-radius:6px;background:rgba(255,255,255,.58);box-shadow:0 1px 4px rgba(4,18,45,.26)}
.banner-dots button[aria-current=true]:before{width:18px;background:#fff;box-shadow:0 1px 4px rgba(4,18,45,.36)}