.column-carousel-wrapper:has(.bg-black){background-color:var(--color-black)}.column-carousel-wrapper:has(.bg-sanddrift-light){background-color:var(--sanddrift-light)}.column-carousel{max-width:var(--container-max-width);margin:0 auto;display:flex;flex-direction:column;gap:16px;padding:16px 12px}.column-carousel .carousel-navigation-header .slide-buttons{display:flex}.column-carousel nav{height:24px;width:100%;display:flex;align-items:center}.column-carousel.nav-disabled .carousel-navigation-header .slide-buttons,.column-carousel.nav-disabled nav{visibility:hidden}.column-carousel h3{font:var(--hero-font-family);font-size:var(--cc-title-mobile-font-size);color:var(--text-color);line-height:32px;text-transform:var(--hero-font-family-transform)}.column-carousel.bg-black h3{color:var(--color-neutral-50)}.column-carousel .carousel-slides p a{width:fit-content}.column-carousel.bg-black .carousel-navigation-heading a{color:var(--color-neutral-50);text-decoration:underline;text-decoration-color:var(--color-neutral-50)}.column-carousel .carousel-navigation-header{display:flex;justify-content:space-between;align-items:center;gap:16px}.column-carousel .carousel-navigation-header .carousel-navigation-heading{padding-left:16px;display:flex;flex-direction:column;gap:4px;flex-grow:1}.column-carousel .carousel-navigation-header button{margin:0;padding:0;width:44px;height:44px;position:relative;cursor:pointer;transition:all .5s ease;background-color:var(--color-neutral-50);border:1px solid var(--border-color)}.column-carousel .carousel-navigation-header button.slide-prev{border-right:.5px solid var(--border-color)}.column-carousel .carousel-navigation-header button:after{display:block;content:"";border:3px var(--color-neutral-700) solid;border-bottom:0;border-left:0;height:.75rem;width:.75rem;position:absolute;top:50%;left:calc(50% + 3px);transform:translate(-50%,-50%) rotate(-135deg)}.column-carousel .carousel-navigation-header button:hover:after{border-color:var(--color-neutral-700)}.column-carousel .carousel-navigation-header button.slide-next:after{transform:translate(-50%,-50%) rotate(45deg);left:calc(50% - 3px)}.column-carousel .carousel-navigation-header .slide-buttons button.disabled{pointer-events:none}.column-carousel .carousel-navigation-header .slide-buttons button.disabled:after{border-color:var(--link-button-color)}.column-carousel .carousel-slides{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}.column-carousel .carousel-slides.active{cursor:grabbing}.column-carousel .carousel-slides::-webkit-scrollbar{display:none}.column-carousel.bg-black .carousel-slides{background-color:var(--color-black)}.column-carousel.bg-sanddrift-light .carousel-slides{background-color:var(--sanddrift-light)}.column-carousel .carousel-slides h4{font:var(--sub-hero-font-family-3);font-size:var(--cc-slide-heading-mobile-font-size);line-height:28px;color:var(--text-color)}.column-carousel .carousel-slides p{font:var(--body-font-family);font-size:15px;color:var(--color-neutral-700);display:flex;flex-direction:column;gap:8px}.column-carousel.column-3 .carousel-slide,.column-carousel.column-4 .carousel-slide{flex:0 0 calc(100% / 1.2);background-color:var(--color-neutral-50)}.column-carousel .carousel-slide .carousel-slide-content{display:flex;flex-direction:column;gap:8px;padding:16px}.column-carousel.text-center .carousel-slide .carousel-slide-content,.column-carousel.text-center .carousel-slide .carousel-slide-content p{align-items:center}nav .carousel-slide-indicators{height:2px;width:100%;background-color:#ddd;position:relative}nav .carousel-slide-indicator{position:absolute;bottom:0;height:200%;width:calc(100% / 3);background-color:#666}@media(not (max-width:480px))and (max-width:767px){.column-carousel.column-3 .carousel-slide,.column-carousel.column-4 .carousel-slide{flex:0 0 50%}}@media(min-width:768px){.column-carousel{padding:48px}.column-carousel.column-3.w-800{max-width:800px;padding-left:0;padding-right:0}.column-carousel.column-3 .carousel-slide,.column-carousel.column-4 .carousel-slide{flex:0 0 calc((100% - 16px) / 3)}.column-carousel .carousel-navigation-header .carousel-navigation-heading{flex-direction:row;justify-content:space-between;align-items:center;flex-grow:1}}@media(min-width:1280px){.column-carousel.column-4 .carousel-slide{flex:0 0 calc((100% - 24px)/4)}}@media(min-width:1024px){.column-carousel h3{font-size:40px;line-height:40px}.column-carousel .carousel-slides h4{font-size:32px;line-height:32px}.column-carousel p{gap:10px}}
/*# sourceMappingURL=/cdn/shop/t/148/assets/c-us-column-carousel.css.map */