@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap');

* {
    font-family: "DM Sans", serif;
}

body{
    font-family: "DM Sans", serif;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--header-colour);
    background-color: var(--background-colour);
    z-index: 2;
    margin: 0rem;
    width: 100%;
    height: 100%;
    overflow-x: hidden;

}

h1{
    position: relative;
    line-height: 4rem;
    font-size: 3.5rem;
    font-weight: 600;
    z-index: 2;
}

h2{
    position: relative;
    font-size: 2rem;
    line-height: 3rem;
    font-weight: 400;
    z-index: 2;
}

h3{
    position: relative;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    z-index: 2;
}

h4{
    position: relative;
    font-size:1.25rem;
    line-height:1.5rem;
    font-weight: 400;
    z-index: 2;
}

p{
    display:block;
    position: relative;
    font-size:1.125rem;
    line-height: 1.25rem;
    font-weight: 400;
    z-index: 2;
}

hr{
    width: 100%;
    border-style: solid;
    border-width: 0.05px;
    color: #434347;
}

::selection {
    background: #f5f5f7;
    color: #1d1d1f;
}

b{
    font-weight: 900;
}

a{
    text-decoration: none;
    color: var(--header-colour);
}

:root{
    --background-colour: #1d1d1f;
    --header-colour: #ffffff;
    --caption-colour: #adaeb3;
    --spacing-1: 0.25rem; 
    --spacing-2: 0.5rem;
    --spacing-3: 0.75rem;
    --spacing-4: 1rem;
    --spacing-5: 1.25rem;
    --spacing-6: 1.5rem;
    --spacing-8: 2rem;
    --spacing-10: 2.5rem;
    --spacing-12: 3rem;
    --spacing-14: 3.5rem;
    --spacing-16: 4rem;
    --spacing-18: 4.5rem;
    --spacing-20: 5rem;
    --spacing-24: 6rem;
    --spacing-32: 8rem;
    --spacing-40: 10rem;
}

@media (max-width: 800px){

    h1{
        position: relative;
        line-height: 2rem;
        font-size: 1.75rem;
        font-weight: 700;
        z-index: 2;
    }
    
    h2{
        position: relative;
        font-size: 1.25rem;
        line-height: 1.5rem;
        font-weight: 400;
        z-index: 2;
    }
    
    h3{
        position: relative;
        font-size: 1rem;
        line-height: 1.25rem;
        font-weight: 400;
        z-index: 2;
    }
    
    h4{
        position: relative;
        font-size:1rem;
        line-height:1.25rem;
        font-weight: 400;
        z-index: 2;
    }
    
    p{
        display:block;
        position: relative;
        font-size: 0.875rem;
        line-height: 1rem;
        font-weight: 400;
        z-index: 2;
    }

}