/* ==========================
   RESET
========================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    font-family:'Inter',sans-serif;
    background:#070707;
    color:#fff;
    overflow-x:hidden;
}

a{
    text-decoration:none;
    color:inherit;
}

ul{
    list-style:none;
}

img{
    max-width:100%;
    display:block;
}



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

.hero{

    width:100%;

    height:100vh;

    position:relative;

    display:flex;

    align-items:center;
}

.hero::before{

    content:"";

    position:absolute;

    inset:0;

    background:

    linear-gradient(rgba(0,0,0,.55),rgba(0,0,0,.75)),

    url("../img/hero.jpg");

    background-size:cover;

    background-position:center;

    z-index:-2;
}

.hero-content{

    width:min(1400px,92%);

    margin:auto;

    padding-top:80px;

}

.hero h1{

    font-size:72px;

    line-height:1.05;

    max-width:700px;
}

.hero p{

    margin-top:25px;

    font-size:22px;

    color:#ddd;
}

.hero-buttons{

    display:flex;

    gap:20px;

    margin-top:45px;
}

.btn{

    padding:18px 35px;

    border-radius:50px;

    transition:.30s;
}

.btn-primary{

    background:#C5A46D;
}

.btn-secondary{

    border:1px solid rgba(255,255,255,.4);
}

.btn:hover{

    transform:translateY(-3px);
}

.hero-date{

    letter-spacing:3px;

    font-size:13px;

    color:#C5A46D;

    margin-bottom:20px;

    font-weight:600;

}

.scroll-down{

    margin-top:70px;

    font-size:35px;

    animation:updown 1.6s infinite;

    opacity:.8;

}

@keyframes updown{

    0%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(10px);
    }

    100%{
        transform:translateY(0);
    }

}