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

.slider{
    position: absolute;
    top:0;
    left:0;
    height:100vh;
    width:100%;
    background:linear-gradient(to left, #ba7453, #d1a984);
    z-index:-1;
}


nav{
    display: grid;
    grid-template-columns: 10vw repeat(3, 1fr) 10vw;
    min-height: 10vh;
    color:#fff;
    align-items: center;
}

#logo{
    grid-column: 2/3;
    font-size:24px;
}

.burger{
    fill:#fff;
    grid-column: 4/5;
    justify-self: end;
}

section{
    display: flex;
    height:80vh;
    justify-content: center;
    align-items: center;
}

.hero{
    position:relative;
    height:60%;
    width:100%;
}

.hero img{
    width:100%;
    height:100%;
    object-fit: cover;
    object-position: center center;
}

.headline{
    position: absolute;
    top:70%;
    left:10%;
    font-size: 7rem;
    transform:translate(-20%, -70%);
    color:white;
    z-index:3;
}

.hero::after{
    content:"";
    background:black;
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    opacity:0.3;
    
}

@media (max-width:950px){

}