/* =========================================================
   LAYOUT
========================================================= */

.hero {

    position: relative;

    min-height:
        100svh;

    display:
        flex;

    flex-direction:
        column;

}


.hero-container {

    position: relative;

    z-index: 3;

    flex:
        1;

    display:
        flex;

    align-items:
        center;

}


.hero-content {

    width:
        58%;

    padding-top:
        100px;

}


.hero-benefits {

    position: relative;

    z-index: 5;

}