.expandable-carousel{width:100%;background-color:#000;padding:0;overflow:hidden}.carousel-container{display:flex;height:400px;width:100%;position:relative}.carousel-card{position:relative;flex:1;overflow:hidden;cursor:pointer;transition:flex .5s cubic-bezier(.4,0,.2,1);border-right:2px solid #ffffff}.carousel-card:last-child{border-right:none}.carousel-card.active{flex:3}.card-background{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .5s cubic-bezier(.4,0,.2,1)}.carousel-card:hover .card-background{transform:scale(1.05)}.placeholder-bg{background:linear-gradient(135deg,#1a1a1a,#2a2a2a)}.card-overlay{position:absolute;top:0;left:0;width:100%;height:100%;transition:background .5s ease}.carousel-card.active .card-overlay{background:#0006}.card-content{position:absolute;bottom:0;left:0;width:100%;padding:40px 30px;color:#fff;z-index:10;transition:all .5s ease}.card-title{font-size:18px;font-weight:600;margin:0;line-height:1.3;transition:all .5s ease;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.carousel-card.active .card-title{font-size:24px;margin-bottom:12px;white-space:normal}.card-description{font-size:14px;line-height:1.6;margin:0;opacity:0;max-height:0;overflow:hidden;transition:all .5s ease;color:#e0e0e0}.carousel-card.active .card-description{opacity:1;max-height:200px;margin-top:12px}.carousel-placeholder{display:flex;align-items:center;justify-content:center;width:100%;height:100%;color:#fff;font-size:16px;text-align:center;padding:40px}@media screen and (max-width:968px){.carousel-container{height:350px}.card-content{padding:30px 20px}.card-title{font-size:16px}.carousel-card.active .card-title{font-size:20px}.card-description{font-size:13px}}@media screen and (max-width:640px){.carousel-container{flex-direction:column;height:auto;min-height:600px}.carousel-card{flex:1;min-height:120px;border-right:none;border-bottom:2px solid #ffffff}.carousel-card:last-child{border-bottom:none}.carousel-card.active{flex:2.5;min-height:200px}.card-content{padding:20px}.card-title{font-size:15px;white-space:normal}.carousel-card.active .card-title{font-size:18px}.card-description{font-size:12px}}@media screen and (min-width:641px){.carousel-card:hover{flex:3}.carousel-card:hover .card-title{font-size:24px;white-space:normal}.carousel-card:hover .card-description{opacity:1;max-height:200px;margin-top:12px}.carousel-card:hover .card-overlay{background:#0006}}
/*# sourceMappingURL=/cdn/shop/t/3/assets/expandable-carousel.css.map */