:root {
  --dusk: #201547;
  --dusk-rgb: 32, 21, 71;
  --dusk-darkest: #120C27;
  --dusk-darkest-rgb: 18, 12, 39;
  --dusk-light: #202258;
  --dusk-light-rgb: 32, 34, 88;
  --dusk-lighter: #3f4193;
  --dusk-lighter-rgb: 63, 65, 147;
  --amethyst-darkest-2: #2e2a80;
  --amethyst-darkest-2-rgb: 46, 42, 128;
  --amethyst-darkest: #3a368e;
  --amethyst-darkest-rgb: 58, 54, 142;
  --amethyst-darker-2: #4541AA;
  --amethyst-darker-2-rbg: 198, 197, 25;
  --amethyst-darker-1: #514bc6;
  --amethyst-darker-1-rbg: 81, 75, 198;
  --amethyst-dark: #5C56E3;
  --amethyst-dark-rgb: 92, 86, 227;
  --amethyst: #6861ff;
  --amethyst-rgb: 104, 97, 255;
  --amethyst-lighter-2: #9B98F7;
  --amethyst-lighter-2-rgb: 155, 152, 247;
  --amethyst-lightest: #ADABFA;
  --amethyst-lightest-rgb: 173, 171, 250;
  --bister-light: #fff9ef;
  --bister-light-rgb: 255, 249, 239;
  --bister-lighter-1: #FFFBF5;
  --bister-lighter-1-rgb: 255, 251, 245;
  --bister-lighter-2: #FFFDFA;
  --bister-lighter-2-rgb: 255, 253, 250;
  --bister-dark: #FEF4E5;
  --bister-dark-rgb: 254, 244, 229;
  --bister-darker-1: #FFF1DB;
  --bister-darker-1-rgb: 255, 241, 219;
  --bister-lighter-2: #FFFDFA;
  --bister-lighter-2-rgb: 255, 253, 250;
  --bister-darker-2: #F9E9D1;
  --bister-darker-2-rgb: 249, 233, 209;
  --bister-darkest: #F3E0C4;
  --bister-darker-2-rgb: 243, 224, 196;
  --goldenrod: #f2ae17;
  --goldenrod-rgb: 242, 175, 24;
  --goldenrod-darkest: #8F5F00;
  --goldenrod-darkest-rgb: 143, 95, 0;
  --goldenrod-darker-1: #E09606;
  --goldenrod-darker-1-rgb: 224, 150, 0;
  --goldenrod-darker-2: #D98F00;
  --goldenrod-darker-2-rgb: 217, 143, 0;
  --goldenrod-light: #f3bc42;
  --goldenrod-light-rgb: 243, 188, 66;
  --goldenrod-lighter-2: #f4c65d;
  --goldenrod-lighter-2-rgb: 248, 198, 93;
  --goldenrod-lightest: #fbd788;
  --goldenrod-lightest-rgb: 251, 215, 136;
  --lavender-darker-1: #a6a5f5;
  --lavender-darker-1-rgb: 166, 165, 245;
  --lavender: #c6c5ff;
  --lavender-rgb: 198, 197, 255;
  --lavender-lightest: #E3E3FF;
  --lavender-lightest-rgb: 227, 227, 255;
  --black: #000000;
  --black-rgb: 0, 0, 0;
  --white: #fef6ea;
  --white-rgb: 254, 246, 234;
  --off-white: var(--bister-darker-2);
  --off-white-rgb: var(--bister-darker-2-rgb);
  --soft: var(--bister-darker-2);
  --soft-rgb: var(--bister-darker-2-rgb);
  --ada-gray: #757575;
  --bg-color: var(--off-white);
  --bg-color-header: var(--white);
  --bg-color-contrast-lighter: var(--white);
  --bg-color-contrast-darker: var(--bister-darker-2);
  --text-color: var(--dusk);
  --headers-color: var(--dusk);
  --link-color: var(--amethyst-darker-1);
  --link-color-visited: var(--amethyst-darker-1);
  --link-color-hover: var(--dusk);
  --link-color-active: var(--dusk);
  --link-underline: var(--amethyst-darker-1);
  --link-underline-hover: var(--dusk);
  --link-bg-hover: var(--goldenrod-lightest);
  --link-color-subtext: var(--dusk);
  --content-label-color: var(--goldenrod-darkest);
  --border-color: #e6d3b8;
  --bs-border-color: #e6d3b8;
  --accent-color: var(--goldenrod);
  --accent-color-rgb: var(--goldenrod-rgb);
  --accent-color-2: var(--lavender-lightest);
  --accent-color-2-rgb: var(--lavender-lightest-rgb);
  --bg-color-default: var(--bg-color);
  --card-bg-color: var(--white);
  --text-color-default: var(--text-color);
  --link-color-default: var(--link-color);
  --link-color-visited-default: var(--link-color-visited);
  --link-color-hover-default: var(--link-color-hover);
  --link-color-active-default: var(--link-color-active);
}

.bg-color-soft {
  --bg-color: var(--off-white);
  --bg-color-contrast-lighter: var(--white);
  --bg-color-contrast-darker: var(--bister-darker-2);
}

.bg-color-default,
.bg-color-off-white,
.bg-color-white,
.bg-color-bright-white,
.bg-color-bister-darkest {
  --bg-color-contrast-lighter: var(--lavender-lightest);
  --bg-color-contrast-darker: var(--bister-darker-2);
  --accent-color-2: var(--lavender-lightest);
  --text-color: var(--dusk);
  --headers-color: var(--dusk);
  --link-color: var(--amethyst-darker-1);
  --link-color-visited: var(--amethyst-darker-1);
  --border-color: #d3b68d;
  --accent-color-rgb: var(--goldenrod-rgb);
  --content-label-color: var(--goldenrod-darkest);
}

.bg-color-default {
  --bg-color: transparent;
}

.bg-color-default,
.bg-color-off-white,
.bg-color-soft,
.bg-color-bister-darkest {
  --card-bg-color: var(--white);
}

.bg-color-bister-darkest {
  --bg-color: var(--bister-darkest);
}

.bg-color-white {
  --bg-color: var(--white);
  --card-bg-color: var(--bister-lighter-2);
}

.bg-color-bright-white {
  --bg-color: var(--bister-lighter-1);
  --card-bg-color: var(--bister-dark);
}

.bg-color-dusk {
  --bg-color: var(--dusk);
  --bg-color-contrast-lighter: var(--amethyst-darker-2);
  --bg-color-contrast-darker: var(--dusk-darkest);
  --text-color: var(--white);
  --headers-color: var(--white);
  --link-color: var(--goldenrod-light);
  --link-color-visited: var(--goldenrod-light);
  --border-color: var(--dusk-lighter);
  --bs-border-color: var(--dusk-lighter);
  --accent-color: var(--amethyst-lightest);
  --accent-color-rgb: var(--amethyst-lightest-rgb);
  --form-label: var(--link-color);
  --content-label-color: var(--amethyst-lightest);
  --card-bg-color: var(--dusk-light);
}

.bg-color-dusk-links {
  --bg-color: var(--dusk);
  --bg-color-contrast-lighter: var(--dusk-darkest);
  --bg-color-contrast-darker: var(--dusk-darkest);
  --text-color: var(--amethyst-lightest);
  --headers-color: var(--amethyst-lightest);
  --link-color: var(--white);
  --link-color-visited: var(--white);
  --border-color: var(--lavender-darker-1);
  --bs-border-color: var(--lavender-darker-1);
  --accent-color: var(--amethyst-lightest);
  --accent-color-rgb: var(--amethyst-lightest-rgb);
  --form-label: var(--link-color);
  --content-label-color: var(--amethyst-lightest);
  --card-bg-color: var(--dusk-light);
}

.bg-color-goldenrod {
  --bg-color: var(--goldenrod-lighter-2);
  --bg-color-contrast-lighter: var(--goldenrod-lightest);
  --bg-color-contrast-darker: var(--goldenrod-light);
  --text-color: var(--dusk);
  --headers-color: var(--dusk);
  --accent-color: var(--dusk);
  --accent-color-rgb: var(--dusk);
  --link-color: var(--dusk);
  --link-color-visited: var(--dusk);
  --link-bg-hover: var(--bister-light);
  --border-color: var(--goldenrod-darker-1);
  --bs-border-color: var(--goldenrod-darker-1);
  --form-label: var(--dusk);
  --content-label-color: var(--dusk);
  --card-bg-color: var(--white);
}

.bg-color-lavender {
  --bg-color: var(--lavender);
  --bg-color-contrast-lighter: var(--lavender-lightest);
  --bg-color-contrast-darker: var(--lavender-darker-1);
  --text-color: var(--dusk);
  --headers-color: var(--dusk);
  --accent-color: var(--goldenrod);
  --accent-color-rgb: var(--goldenrod-rgb);
  --link-color: var(--dusk);
  --link-color-visited: var(--dusk);
  --border-color: var(--lavender-darker-1);
  --bs-border-color: var(--lavender-darker-1);
  --form-label: var(--dusk-color);
  --content-label-color: var(--dusk);
  --card-bg-color: var(--lavender-lightest);
}

.bg-color-amethyst {
  --bg-color: var(--amethyst-darkest);
  --bg-color-contrast-lighter: var(--amethyst-darker-2);
  --bg-color-contrast-darker: var(--amethyst-darkest-2);
  --text-color: var(--white);
  --headers-color: var(--white);
  --link-color: var(--goldenrod-light);
  --link-color-visited: var(--goldenrod-light);
  --border-color: var(--amethyst);
  --bs-border-color: var(--amethyst);
  --accent-color: var(--amethyst-lightest);
  --accent-color-rgb: var(--amethyst-lightest-rgb);
  --form-label: var(--link-color);
  --content-label-color: var(--amethyst-lightest);
  --card-bg-color: var(--amethyst-darker-1);
}

.bg-ada-multiply {
  --bg-color: var(--ada-gray);
  --text-color: var(--white);
  --headers-color: var(--white);
  --link-color: var(--goldenrod-light);
  --link-color-visited: var(--goldenrod-light);
  --border-color: var(--lavender-darker-1);
  --bs-border-color: var(--lavender-darker-1);
  --accent-color: var(--goldenrod);
  --accent-color-rgb: var(--goldenrod-rgb);
  --form-label: var(--link-color);
  --content-label-color: var(--goldenrod);
}

.btn-primary {
  --bs-border-radius: 100px;
  --bs-btn-color: var(--dusk);
  --bs-btn-bg: var(--goldenrod);
  --bs-btn-border-color: var(--goldenrod);
  --bs-btn-hover-color: var(--dusk);
  --bs-btn-hover-bg: var(--goldenrod-lightest);
  --bs-btn-hover-border-color: var(--goldenrod-lightest);
  --bs-btn-active-color: var(--dusk);
  --bs-btn-active-bg: var(--goldenrod-lightest);
  --bs-btn-active-border-color: var(--goldenrod-lightest);
  --bs-btn-disabled-color: rgba(var(--dusk), 0.7);
  --bs-btn-disabled-bg: rgba(var(--goldenrod), 0.7);
  --bs-btn-disabled-border-color: rgba(var(--goldenrod), 0.7);
}

.btn-secondary {
  --bs-border-radius: 100px;
  --bs-btn-color: var(--white);
  --bs-btn-bg: var(--amethyst-darker-1);
  --bs-btn-border-color: var(--amethyst-darker-1);
  --bs-btn-hover-color: var(--dusk);
  --bs-btn-hover-bg: var(--goldenrod-lightest);
  --bs-btn-hover-border-color: var(--goldenrod-lightest);
  --bs-btn-active-color: var(--dusk);
  --bs-btn-active-bg: var(--goldenrod-lightest);
  --bs-btn-active-border-color: var(--goldenrod-lightest);
  --bs-btn-disabled-color: rgba(var(--white-rgb), 0.7);
  --bs-btn-disabled-bg: rgba(var(--amethyst-darker-1-rgb), 0.7);
  --bs-btn-disabled-border-color: rgba(var(--amethyst-darker-1-rgb), 0.7);
}

.btn-primary + .dropdown-menu,
.btn-secondary + .dropdown-menu {
  --bg-color: var(--goldenrod-lightest);
  --link-color: var(--dusk);
  --link-color-visited: var(--dusk);
  --link-color-hover: var(--dusk);
  --link-color-active: var(--dusk);
  --link-bg-hover: var(--bister-light);
}

.btn-tertiary {
  --bs-border-radius: 100px;
  --bs-btn-color: var(--amethyst-darker-1);
  --bs-btn-bg: var(--bister-light);
  --bs-btn-border-color: var(--bister-light);
  --bs-btn-hover-color: var(--dusk);
  --bs-btn-hover-bg: var(--goldenrod-lightest);
  --bs-btn-hover-border-color: var(--goldenrod-lightest);
  --bs-btn-active-color: var(--dusk);
  --bs-btn-active-bg: var(--goldenrod-lightest);
  --bs-btn-active-border-color: var(--goldenrod-lightest);
  --bs-btn-disabled-color: rgba(var(--white-rgb), 0.7);
  --bs-btn-disabled-bg: rgba(var(--amethyst-darker-1-rgb), 0.7);
  --bs-btn-disabled-border-color: rgba(var(--amethyst-darker-1-rgb), 0.7);
}

:root {
  --form-color: var(--text-color);
  --form-label: var(--headers-color);
  --form-border: var(--text-color);
  --form-bg-color: var(--white);
  --form-shadow-opacity: 0;
}

:root {
  --mobile-nav-bp: 1200px;
  --bs-border-radius: 0.25rem;
  --bs-border-radius-sm: 0.25rem;
  --bs-border-radius-lg: 0.25rem;
  --bs-border-radius-xl: 1rem;
  --bs-border-radius-xxl: 2rem;
  --bs-border-radius-2xl: var(--bs-border-radius-xxl);
  --bs-gutter-x: 1.5rem;
}

#header {
  --bg-color: var(--white);
  --bg-color-scrolled-down: var(--bister-lighter-1);
  --bg-color-menu: var(--dusk);
  --logo-wordmark-color: var(--dusk);
  --logo-lines-color: var(--goldenrod);
  --logo-circle-color: var(--goldenrod);
  --logo-bolt-color: var(--dusk);
}

.nav-primary-btn,
.nav-primary-link {
  --link-color: var(--white);
  --link-color-visited: var(--white);
  --link-color-hover: var(--goldenrod);
  --link-color-active: var(--goldenrod);
  --link-underline: transparent;
  --link-underline-hover: transparent;
  --link-bg-hover: transparent;
  --link-color-subtext: var(--lavender-darker-1);
}
@media (min-width: 1200px) {
  .nav-primary-btn,
  .nav-primary-link {
    --icon-color: var(--goldenrod);
    --link-color: var(--dusk);
    --link-color-hover: var(--amethyst-darker-1);
  }
}

.nav-utility-btn {
  --icon-color: var(--goldenrod);
  --link-color: var(--dusk);
  --link-color-hover: var(--amethyst-darker-1);
}

.nav-utility-btn.btn-circle {
  --icon-color: var(--goldenrod);
  --link-color: var(--dusk);
  --link-color-hover: var(--amethyst-darker-1);
}

.header-nav-menu,
#header:after {
  --bg-color: var(--dusk);
  --footer-bg-color-mobile: var(--amethyst-darkest);
  --text-color: var(--goldenrod);
  --headers-color: var(--white);
  --border-color: var(--amethyst);
  --link-color: var(--goldenrod);
  --link-color-visited: var(--goldenrod);
  --link-color-hover: var(--white);
  --link-color-active: var(--white);
  --link-underline: transparent;
  --link-underline-hover: transparent;
  --link-bg-hover: transparent;
  --link-color-subtext: var(--lavender-darker-1);
}

:root {
  --type-serif: "Playfair Display", Times, "Times New Roman", serif;
  --type-sans-serif: "Poppins", Gill Sans, Gill Sans MT, Calibri, sans-serif;
  --weight-heavy: 900;
  --weight-bold: 700;
  --weight-normal: 400;
  --weight-thin: 200;
}
