/* ---------- RESET ---------- */

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

html,
body{

    width:100%;
    height:100%;

    background:#030508;

    overflow:hidden;

    font-family:"Cormorant Garamond",serif;

    color:#ECECEC;

}

/* ---------- HERO ---------- */

.hero{

    position:relative;

    width:100vw;
    height:100vh;

    background:url("hero.PNG") no-repeat left center;
    background-size:contain;
    background-color:#030508;

}

/* ---------- CONTENT ---------- */

.content {
    position: absolute;
    top: 18%;
    left: 52%;
    max-width: 1000px;

}

/* ---------- LOGO ---------- */

.logo{

    font-size:2.0rem;
    letter-spacing:0.18em;

    font-weight:500;

    margin-bottom:7vh;

}

/* ---------- HEADLINE ---------- */

h1{

    font-family: 'Cormorant Garamond', serif;
    font-size: 2.25rem;
    font-weight: 500;
    line-height: 1.25;
    width: 1000px;      /* <-- important */
    margin: 60px 0 90px 0;
    color: #f5f3ef;

}

/* ---------- SERVICES ---------- */

.services{

    display:flex;

    flex-direction:column;

    gap:4.2vh;

}

/* ---------- INDIVIDUAL BLOCK ---------- */

.service h2{

    font-size:1.45rem;

    font-weight:600;

    margin-bottom:0.4rem;

}

.service p{

    font-size:1.1rem;

    font-weight:400;

    color:#ECECEC;

    line-height:1.25;

}

/* ---------- FOOTER ---------- */

.footer{

    margin-top:9vh;

    font-size:1.2rem;
    letter-spacing:.02em;
    color:#E2E2E2;

}

/* ---------- MENU ---------- */

.menu{

    position:absolute;

    top:28px;
    right:34px;

    display:flex;
    flex-direction:column;

    align-items:flex-end;

    gap:4px;

}

.menu a{

    text-decoration:none;

    color:#8C8C8C;

    font-family:Arial,Helvetica,sans-serif;

    font-size:1.05rem;

    transition:.25s;

}

.menu a:hover{

    color:white;

}

/* ---------- LARGE SCREENS ---------- */

@media (min-width:1900px){

    html{

        font-size:18px;

    }

}

/* ---------- LAPTOP ---------- */

@media (max-width:1600px){

    html{

        font-size:15px;

    }

}

/* ---------- SMALLER LAPTOP ---------- */

@media (max-width:1400px){

    html{

        font-size:13px;

    }

}