/* =====================================================
   BOOZ BAZZAR HERO
===================================================== */

.hero-banner{
    position:relative;
    width:100%;
    height:100vh;
    min-height:750px;
    overflow:hidden;
}

.hero-banner img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    animation:heroZoom 15s ease-in-out infinite alternate;
}

.hero-overlay{
    position:absolute;
    inset:0;

    background:
    linear-gradient(rgba(0,0,0,.55),rgba(0,0,0,.55)),
    linear-gradient(to right,
    rgba(0,0,0,.55),
    rgba(0,0,0,.25));

    display:flex;
    justify-content:center;
    align-items:center;
}

.hero-text{

    max-width:900px;

    text-align:center;

    color:#fff;

    padding:20px;

}

.hero-text span{

    display:inline-block;

    color:#D4AF37;

    font-size:16px;

    letter-spacing:5px;

    text-transform:uppercase;

    margin-bottom:25px;

}

.hero-text h1{

    font-family:'Cinzel',serif;

    font-size:90px;

    line-height:1.05;

    margin-bottom:30px;

}

.hero-text p{

    max-width:700px;

    margin:auto;

    color:#ddd;

    line-height:1.9;

    font-size:20px;

}

.hero-buttons{

    margin-top:45px;

    display:flex;

    justify-content:center;

    gap:20px;

    flex-wrap:wrap;

}

.hero-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:18px 40px;

    border-radius:50px;

    text-decoration:none;

    transition:.4s;

    font-weight:600;

}

.hero-btn.primary{

    background:#D4AF37;

    color:#000;

}

.hero-btn.primary:hover{

    background:#fff;

    transform:translateY(-6px);

}

.hero-btn.secondary{

    border:2px solid #fff;

    color:#fff;

}

.hero-btn.secondary:hover{

    background:#fff;

    color:#000;

}

@keyframes heroZoom{

    from{

        transform:scale(1);

    }

    to{

        transform:scale(1.08);

    }

}


/*=========================
Responsive
==========================*/

@media(max-width:1200px){

.hero-text h1{

font-size:70px;

}

}

@media(max-width:992px){

.hero-banner{

height:90vh;

}

.hero-text h1{

font-size:56px;

}

.hero-text p{

font-size:18px;

}

}

@media(max-width:768px){

.hero-banner{

height:80vh;

}

.hero-text h1{

font-size:42px;

}

.hero-text p{

font-size:16px;

}

.hero-btn{

width:230px;

}

}

@media(max-width:480px){

.hero-banner{

height:70vh;

}

.hero-text span{

font-size:12px;

letter-spacing:3px;

}

.hero-text h1{

font-size:32px;

}

.hero-text p{

font-size:15px;

}

}