@font-face {
    font-family: Fraunces;
    src: url(/assets/fonts/fraunces/Fraunces-VariableFont_SOFT\,WONK\,opsz\,wght.ttf);
}

@font-face {
    font-family: Montserrat;
    src: url(/assets/fonts/montserrat/Montserrat-VariableFont_wght.ttf);
}

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

:root {
    /* fonts */

    --font-fraunces: Fraunces, sans-serif;
    --font-mont: Montserrat, sans-serif;
    --font-regular: 500;
    --font-bold: 700;

    /* primary */

    --dark-cyan: hsl(158, 36%, 37%);
    --cream: hsl(30, 38%, 92%);

    /* neutral */

    --very-dark-blue: hsl(212, 21%, 14%);
    --dark-grayish-blue: hsl(228, 12%, 48%);
    --light: hsl(0, 0%, 100%);
}

body {
    background: var(--cream);

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    
    min-height: 100vh;
}