/* CAROUSEL */
.carousel{
position:relative;
height: 100%;
width:100%;
max-width:1100px;
overflow:hidden;
border-radius:18px;
background:var(--card);
}
@media (max-width:768px){
.carousel{border-radius:0;}
}
.carousel-track{
position:relative;
width:100%;
height:100%;
}
.slide{
position:absolute;
inset:0;
opacity:0;
transition:opacity .9s ease;
display:flex;
align-items:center;
justify-content:center;
overflow:hidden;
}
.slide.active{
opacity:1;
z-index:2;
}
.slide img{
position:absolute;
top:50%;
left:50%;
max-width:85%;
max-height:85%;
width:auto;
height:auto;
transform:translate(-50%,-50%) scale(1);
transition:transform 5s ease;
will-change:transform;
}

.slide.active img{
transform:translate(-50%,-50%) scale(1.06);
}

.carousel-dots{
position:absolute;
bottom:18px;
left:50%;
transform:translateX(-50%);
display:flex;
gap:10px;
z-index:5;
}

.carousel-dots button{
width:10px;
height:10px;
border-radius:50%;
border:none;
background:rgba(255,255,255,.35);
cursor:pointer;
transition:all .25s ease;
}

.carousel-dots button.active{
background:var(--dots);
transform:scale(1.2);
}