.hero-slider{

    position:relative;
    width:100%;
    height:60vh;
    overflow:hidden;
    background:#000;

}

.slide{

    position:absolute;
    inset:0;

    opacity:0;
    transition:1.2s ease;

}

.slide.active{

    opacity:1;
    z-index:2;

}

.slide img{

    width:100%;
    height:100%;
    object-fit:contain;
    transform:scale(1.08);
    transition:8s linear;

}

.slide.active img{

    transform:scale(1);

}



.btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:15px 38px;

    border:1px solid #d4b16a;

    color:#fff;

    text-decoration:none;

    letter-spacing:2px;

    transition:.35s;

    font-family:Montserrat;

}

.btn:hover{

    background:#d4b16a;
    color:#111;

}

.prev,
.next{

    position:absolute;

    top:50%;

    transform:translateY(-50%);

    width:60px;
    height:60px;

    border:none;

    background:rgba(255,255,255,.08);

    backdrop-filter:blur(12px);

    color:#fff;

    cursor:pointer;

    font-size:28px;

    transition:.4s;

    z-index:10;

}

.prev:hover,
.next:hover{

    background:#d4b16a;
    color:#000;

}

.prev{

    left:35px;

}

.next{

    right:35px;

}

.dots{

    position:absolute;

    bottom:45px;

    left:50%;

    transform:translateX(-50%);

    display:flex;

    gap:14px;

    z-index:10;

}

.dot{

    width:13px;
    height:13px;

    border-radius:50%;

    background:rgba(255,255,255,.45);

    cursor:pointer;

    transition:.35s;

}

.dot.active{

    width:45px;

    border-radius:20px;

    background:#d4b16a;

}

@media(max-width:900px){


.hero-slider{

    height:70vh;

}

}