/* ==================================================
   KENAZER HERO
   Version 1.0
================================================== */


/* ==========================================
   HERO SECTION
========================================== */

.kenazer-hero{

    position:relative;

    min-height:650px;

    display:flex;

    align-items:center;

    background-size:cover;

    background-position:center center;

    background-repeat:no-repeat;

    overflow:hidden;

}


/* ==========================================
   DARK OVERLAY
========================================== */

.kenazer-hero::before{

    content:"";

    position:absolute;

    inset:0;

    background:rgba(11,44,82,.35);

    z-index:1;

}


/* ==========================================
   HERO CONTENT
========================================== */

.hero-content{

    position:relative;

    z-index:2;

    max-width:700px;

    color:#ffffff;

    padding:80px;

}


/* ==========================================
   TITLE
========================================== */

.hero-content h1{

    color:#ffffff;

    font-size:58px;

    font-weight:700;

    line-height:1.15;

    margin-bottom:25px;

}


/* ==========================================
   DESCRIPTION
========================================== */

.hero-content p{

    color:#ffffff;

    font-size:20px;

    line-height:1.8;

    margin-bottom:35px;

}


/* ==========================================
   BUTTON
========================================== */

.hero-button{

    display:inline-block;

    background:#D4AF37;

    color:#ffffff;

    padding:16px 34px;

    border-radius:8px;

    font-weight:600;

    text-decoration:none;

    transition:.35s;

}

.hero-button:hover{

    background:#b99622;

    transform:translateY(-3px);

}


/* ==========================================
   ANIMATION
========================================== */

.hero-content{

    animation:heroFade 1s ease;

}

@keyframes heroFade{

    from{

        opacity:0;

        transform:translateY(30px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}


/* ==========================================
   RESPONSIVE
========================================== */

@media(max-width:992px){

    .kenazer-hero{

        min-height:550px;

    }

    .hero-content{

        padding:50px;

    }

    .hero-content h1{

        font-size:44px;

    }

}


@media(max-width:768px){

    .kenazer-hero{

        min-height:480px;

    }

    .hero-content{

        max-width:100%;

        padding:35px;

    }

    .hero-content h1{

        font-size:34px;

    }

    .hero-content p{

        font-size:18px;

    }

}