.carousel{position:relative;padding:0 50px}
.carousel-track{display:flex;gap:20px;margin:0;padding:4px 0 12px;list-style:none;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-ms-overflow-style:none;scrollbar-width:none}
.carousel-track::-webkit-scrollbar{display:none}
.carousel-item{flex:0 0 calc((100% - 40px)/3);min-width:0;scroll-snap-align:start}
.carousel-arrow{position:absolute;top:50%;z-index:5;display:grid;width:44px;height:44px;place-items:center;border:1px solid #d7e6f0;border-radius:50%;background:#fff;box-shadow:var(--shadow-sm,0 6px 18px rgba(10,50,90,.08));color:#0879e4;font:20px/1 Montserrat,sans-serif;cursor:pointer;transform:translateY(-50%);transition:background .2s,color .2s,box-shadow .2s,transform .2s}
.carousel-arrow:hover{transform:translateY(-52%);background:#0879e4;color:#fff}
.carousel-arrow:disabled{opacity:.3;cursor:default;pointer-events:none}
.carousel-prev{left:0}
.carousel-next{right:0}
.carousel-dots{display:flex;justify-content:center;gap:8px;margin-top:6px}
.carousel-dots span{width:7px;height:7px;border-radius:50%;background:#c9dcea}
.carousel-dots span.is-active{background:#0879e4}
@media(max-width:900px){.carousel{padding:0 44px}.carousel-item{flex:0 0 calc((100% - 20px)/2)}}
@media(max-width:640px){.carousel{padding:0 8px}.carousel-item{flex:0 0 100%}.carousel-arrow{width:36px;height:36px;box-shadow:0 6px 14px rgba(10,50,90,.16)}.carousel-prev{left:2px}.carousel-next{right:2px}}