html { 
    background-color: #212234;
}

body {
    font-family:"neue-haas-grotesk-display";
    height: 99vh;
    background-image: url('./assets/background.svg');
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: 55vw;
}

main {
    padding: 40px;
}


h1 {
color: white;
font-size: 3.75rem;
font-style: normal;
font-weight: 500;
margin: 0;
line-height: normal;
 & span {
    color: #9DA1F1;
 }
}

h2 {
color: #9DA1F1;
font-size: 2rem;
font-style: normal;
font-weight: 500;
line-height: normal;
}

.container {
    max-width: 65vw;
}

.logo {
 margin-bottom: 120px;
}

@media screen and (max-width: 1280px) {
    h1 {
        font-size: 2.5rem;
    }
    h2 {
        font-size: 1.5rem;
    }
    .logo {
        margin-bottom: 50px;
    }
    body {
        background-size: 75vw;
    }
}

@media (max-width: 980px) {
    body {
        background-image: url('./assets/background-mobile.svg') !important;
        background-size: 50vw;
    }
}