.carousel-container{min-height:260px;position:relative;margin:0 auto;width:100%;display:flex;justify-content:center;perspective:800px}.carousel{display:flex;justify-content:center;align-items:center;width:100%;position:relative;padding:20px 0;transform-style:preserve-3d}.carousel img{aspect-ratio:3/4;border-radius:25px;flex-shrink:0;height:auto;object-fit:cover;margin:0 10px;cursor:pointer;position:absolute;transition:.8s cubic-bezier(.25, .1, .25, 1);box-shadow:0 4px 12px rgba(0,0,0,.1);transform-origin:center center}.carousel img.active{width:calc(1.2 * ((100% - 40px)/ 3));opacity:1;transform:translateX(0) scale(1);z-index:10;box-shadow:0 8px 20px rgba(0,0,0,.2)}.carousel img.prev{width:calc(.9 * ((100% - 40px)/ 3));opacity:.8;transform:translateX(-120%) scale(.85);z-index:5}.carousel img.next{width:calc(.9 * ((100% - 40px)/ 3));opacity:.8;transform:translateX(120%) scale(.85);z-index:5}.carousel img.far-prev{width:calc(.7 * ((100% - 40px)/ 3));opacity:.2;transform:translateX(-200%) scale(.7);z-index:1}.carousel img.far-next{width:calc(.7 * ((100% - 40px)/ 3));opacity:.2;transform:translateX(200%) scale(.7);z-index:1}@media (max-width:768px){.carousel img{margin:0 5px;border-radius:10px}.carousel img.active{width:calc(1.2 * ((100% - 20px)/ 3))}.carousel img.next,.carousel img.prev{width:calc(.9 * ((100% - 20px)/ 3));transform:translateX(-100%) scale(.85)}.carousel img.next{transform:translateX(100%) scale(.85)}.carousel img.far-next,.carousel img.far-prev{width:calc(.7 * ((100% - 20px)/ 3));transform:translateX(-170%) scale(.7)}.carousel img.far-next{transform:translateX(170%) scale(.7)}}.carousel-button{color:#999;position:absolute;top:50%;transform:translateY(-50%);background-color:rgba(255,255,255,.7);border:none;width:40px;height:40px;border-radius:50%;cursor:pointer;z-index:99;display:flex;align-items:center;justify-content:center;font-size:18px;box-shadow:0 2px 5px rgba(0,0,0,.2);transition:.3s}.carousel-button:hover{background-color:rgba(255,255,255,.9);box-shadow:0 4px 8px rgba(0,0,0,.3);transform:translateY(-50%) scale(1.1)}.carousel-button.prev{left:0}.carousel-button.next{right:0}.carousel-error{text-align:center;padding:20px;color:#666;background:#f5f5f5;border-radius:8px;margin:10px 0}@media (min-width:768px){.carousel-container{min-height:380px}}