:root{
--gold:#a97a1e;
--gold-light:#eed882;
}

.wm-carousel{
max-width:1200px;
margin:40px auto;
padding:0 16px;
font-family:Arial, sans-serif;
}

.wm-carousel__title{
font-size:24px;
font-weight:700;
margin-bottom:16px;
}

.wm-carousel__wrapper{
display:flex;
align-items:center;
gap:12px;
}

.wm-carousel__viewport{
overflow:hidden;
flex:1;
}

.wm-carousel__track{
display:flex;
gap:16px;
transition:transform .6s ease;
}

.wm-slide{
flex:0 0 calc((100% - 3*16px)/4);
border:1px solid var(--gold);
border-radius:12px;
overflow:hidden;
position:relative;
background:#000;
}

.wm-slide img{
width:100%;
height:auto;
display:block;
}

.wm-slide__overlay{
position:absolute;
inset:0;
padding:14px;
display:flex;
flex-direction:column;
justify-content:flex-end;
background:linear-gradient(to top, rgba(0,0,0,.7), transparent);
}

.wm-slide__overlay h3{
margin:0;
color:#fff;
font-size:18px;
text-align: center;
}

.wm-slide__btn{
margin-top:8px;
padding:8px 14px;
border-radius:8px;
border:1px solid var(--gold);
background:linear-gradient(to left,var(--gold),var(--gold-light),var(--gold));
font-weight:700;
color:#1b1200;
text-align: center;
}

.wm-arrow{
width:44px;
height:44px;
border-radius:50%;
border:1px solid var(--gold);
background:rgba(0,0,0,.6);
color:#fff;
font-size:24px;
cursor:pointer;
}

/* Responsivo */
@media(max-width:1024px){
.wm-slide{ flex:0 0 calc((100% - 16px)/2); }
}
@media(max-width:600px){
.wm-slide{ flex:0 0 100%; }
}
@media(max-width:425px){
.wm-arrow{
width: 30px !important;
height: 30px !important;
font-size: 15px !important;
}
}