@import url('https://fonts.googleapis.com/css2?family=Bitter:wght@420&family=Fira+Sans:wght@420&display=swap');

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: var(--gray-100);
}

::-webkit-scrollbar-thumb {
    background: var(--navy-light);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--sky);
}

:root {
    --navy: #001A4D;
    --navy-light: #0A2A6E;
    --navy-dark: #000F2E;
    --sky: #3399FF;
    --sky-light: #66B3FF;
    --cyan: #00D4FF;
    --white: #FFFFFF;
    --gray-50: #F7F9FC;
    --gray-100: #EEF1F6;
    --gray-400: #94A3B8;
    --gray-600: #64748B;
}

body {
    font-family: "Bitter", serif;
    font-weight: 420;
    color: var(--navy-dark);
    font-size: 18px;
    line-height: 31px;
    background-color: white;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Fira Sans", sans-serif !important;
    font-weight: 420 !important;
    color: var(--navy-dark);
    font-size: 23px !important;
    line-height: 30px !important;
}

h1 {
    font-size: 32px !important;
    /* Making the main title slightly larger than secondary headers for hierarchy, though user specified 23px for headings */
}