.hero{

    position:relative;

    min-height:100vh;

    display:flex;

    align-items:center;

    background:url('../images/hero.jpg');

    background-size:cover;

    background-position:center;

    overflow:hidden;

}

.hero-overlay{

    position:absolute;

    inset:0;

    background:
    linear-gradient(
        to right,
        rgba(20,20,20,.75),
        rgba(20,20,20,.3)
    );

}

.hero-content{

    position:relative;

    z-index:2;

    max-width:850px;

    color:white;

}

.hero h1{

    font-family:'Playfair Display',serif;

    font-size:84px;

    line-height:1.05;

    margin-bottom:25px;

}

.hero p{

    font-size:20px;

    line-height:1.9;

    opacity:.9;

}

.hero-buttons{

    display:flex;

    gap:18px;

    margin-top:40px;

}