@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:ital,wght@0,200..900;1,200..900&display=swap');

:root {
    --text-color-main: #323232;
    --text-color-muted: #646464;
    --text-color-more-muted: #969696;

    /* --font-family-base: "Inter", sans-serif; */
    --font-family-base: "Source Sans 3", sans-serif;
    --font-size-base: 12px;

    --color-primary-1: #003EAB;
    --color-complementary-1: #FFA400;
    --color-primary-2: #43B12E;
    --color-complementary-2: #CD3544;
    --color-primary-3: #00A4EB;
    --color-complementary-3: #FF8700;
    --color-primary-4: #FFA40D;
    --color-complementary-4: #1654AB;

    --background-color-muted: #EEEEEE; 

    --color-primary: var(--color-primary-1);
    --color-complementary: var(--color-primary-2);
    --color-primary-alpha: #003EAB1A;
    --color-complementary-alpha: #43B12E1A;

    --color-primary-2-alpha: #43B12E1A;
    --color-primary-3-alpha: #00A4EB1A;
    --color-primary-4-alpha: #FFA40D1A;

    --gutter: calc(var(--font-size-base) / 2);

    --navbar-height: 8rem;
    --page-content-padding-y: 2rem;

    --box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
}

.sfs {
    --color-primary: var(--color-primary-1);
    --color-complementary: var(--color-primary-1);
    --color-primary-alpha: #003EAB1A;
    --color-complementary-alpha: #003EAB1A;
}

.srl {
    --color-primary: var(--color-primary-2);
    --color-complementary: var(--color-primary-2);
    --color-primary-alpha: #43B12E1A;
    --color-complementary-alpha: #43B12E1A;
}