@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 100 900;
    src: url("../fonts/roboto-latin.woff2") format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "Roboto Slab";
    font-style: normal;
    font-weight: 100 900;
    src: url("../fonts/roboto-slab-latin.woff2") format("woff2");
    font-display: swap;
}

:root {
    --color-navy: #0f2a51;
    --color-accent: #fc3b29;
    --color-white: #ffffff;
    --color-black: #000000;
    --color-text: #373737;
    --color-muted: #858585;
    --font-sans: "Roboto", "Helvetica Neue", sans-serif;
    --font-display: "Roboto Slab", Georgia, serif;
    --space-1: .5rem;
    --space-2: 1rem;
    --space-3: 1.5rem;
    --space-4: 2rem;
    --space-5: 3rem;
    --space-6: 5rem;
    --content-max-width: 1200px;
    --transition-base: 300ms ease;
}