:root,
::after,
::before {
    /* ------------------------------------------------------------ *\
	core
\* ------------------------------------------------------------ */
    /*  colors  */
    /* --- primary --- */
    --core-color-primarypurple: #F07020;
    --core-color-blue: #494C73;
    --core-color-darkblue: #464646;
    --core-color-beige: #FFFFFF;

    /* --- secondary --- */
    --core-color-success: #F07020;
    --core-color-success-vibrant: #26c485;
    --core-color-failure: #9D1414;
    --core-color-failure-contrast: #b93f3c;
    --core-color-errorfilled: #ffefef;

    /* --- grayscales --- */
    --core-color-white: #ffffff;
    --core-color-lightgray: #edf2f4;
    --core-color-gray: #bfcde0;
    --core-color-bordergray: #464646;
    --core-color-shadegray: #181818;
    --core-color-darkgray: #181818;
    --core-color-almostblack: #181f25;

    /* --- system agnostic colors --- */
    --system-agnostic-color-brown: #3c3c3c;

    /*  fonts  */
    --core-font-primary: "Nunito Sans", sans-serif;
    --core-font-secondary: "Open Sans", sans-serif;

    /* ------------------------------------------------------------ *\
	semantic
\* ------------------------------------------------------------ */
    /*  colors  */
    --semantic-color-primary: var(--core-color-blue);
    --semantic-color-accent: var(--core-color-primarypurple);
    --semantic-color-vibrant: var(--core-color-primarypurple);
    --semantic-color-prominent: var(--core-color-darkblue);

    --semantic-color-success: var(--core-color-success);
    --semantic-color-success-vibrant: var(--core-color-success-vibrant);
    --semantic-color-error: var(--core-color-failure);
    --semantic-color-error-contrast: var(--core-color-failure-contrast);

    --semantic-color-white: var(--core-color-white);
    --semantic-color-neutral: var(--core-color-lightgray);
    --semantic-color-subtle: var(--core-color-gray);
    --semantic-color-shadegray: var(--core-color-shadegray);
    --semantic-color-darkgray: var(--core-color-darkgray);
    --semantic-color-black: var(--core-color-almostblack);

    /*  backgrounds  */
    --semantic-background-color-primary: var(--core-color-white);
    --semantic-background-color-accent: var(--semantic-color-accent);
    --semantic-background-color-subtle: var(--core-color-shadegray);
    --semantic-background-color-shade: var(--semantic-color-prominent);
    --semantic-background-color-dark: var(--core-color-almostblack);
    --semantic-background-color-neutral: var(--core-color-lightgray);
    --semantic-background-color-error: var(--core-color-errorfilled);
    --semantic-background-color-success: var(--semantic-color-success);
    --semantic-background-color-vibrant: var(--semantic-color-vibrant);
    --semantic-background-color-beige: var(--core-color-beige);
    --semantic-background-color-bordergray: var(--core-color-bordergray);

    /*  fills  */
    --semantic-fill-color-neutral: var(--core-color-lightgray);
    --semantic-fill-color-subtle: var(--core-color-gray);
    --semantic-fill-color-accent: var(--semantic-color-accent);
    --semantic-fill-color-success: var(--semantic-color-success);

    /*  borders  */
    --semantic-border-color-subtle: var(--core-color-gray);
    --semantic-border-color-default: var(--core-color-bordergray);
    --semantic-border-color-prominent: var(--core-color-shadegray);

    /*  text  */
    /* --- text font --- */
    --semantic-text-font-primary: var(--core-font-primary);
    --semantic-text-font-secondary: var(--core-font-secondary);

    /* --- text color --- */
    --semantic-text-color-base: var(--core-color-shadegray);
    --semantic-text-color-primary: var(--core-color-blue);
    --semantic-text-color-vibrant: var(--core-color-success);
    --semantic-text-color-accent: var(--core-color-primarypurple);
    --semantic-text-color-prominent: var(--core-color-darkblue);
    --semantic-text-color-success: var(--core-color-success);

    --semantic-text-color-almostblack: var(--core-color-almostblack);
    --semantic-text-color-white: var(--core-color-white);
    --semantic-text-color-black: var(--semantic-color-black);
    --semantic-text-color-darkgray: var(--semantic-color-darkgray);
    --semantic-text-color-lightgray: var(--core-color-lightgray);

    /* ------------------------------------------------------------ *\
    component
\* ------------------------------------------------------------ */

    /*  _body  */
    --body-background-color: var(--semantic-background-color-primary);
    --body-text-font: var(--semantic-text-font-primary);
    --body-text-font-alt: var(--semantic-text-font-secondary);
    --body-text-color: var(--semantic-text-color-base);
    --body-text-color-emphasis: var(--semantic-text-color-prominent);
    --body-text-color-success: var(--semantic-text-color-vibrant);
    --body-text-color-accent: var(--semantic-text-color-accent);
    --body-text-color-darkgray: var(--semantic-text-color-darkgray);

    /*  accordion  */
    --accordion-background-color: var(--semantic-background-color-beige);
    --accordion-icon-color: var(--semantic-fill-color-success);
    --accordion-border-color: var(--semantic-border-color-subtle);
    --accordion-header-text-color: var(--semantic-text-color-success);

    /*  anchor  */
    --anchor-text-color-accent: var(--semantic-text-color-accent);
    --anchor-text-color-vibrant: var(--semantic-text-color-vibrant);
    --anchor-text-color-white: var(--semantic-text-color-white);
    --anchor-text-color-subtle: var(--semantic-text-color-base);
    --anchor-text-color-contrast: #0645ad;
    --anchor-text-color-paging: var(--semantic-color-primary);

    /*  badge  */
    --badge-color-subtle: var(--semantic-color-primary);
    --badge-color-vibrant: var(--semantic-color-success);
    --badge-color-prominent: var(--semantic-color-prominent);
    --badge-color-accent: var(--semantic-color-accent);
    --badge-text-color: var(--semantic-text-color-white);

    /*  banner  */
    --banner-background-color: var(--semantic-background-color-beige);
    --banner-text-color: var(--semantic-text-color-base);

    /*  buttons  */
    --button-dropshadow: rgba(0, 0, 0, 0.2);
    --button-dropshadow-alt: rgba(255, 255, 255, 0.2);
    --button-text-font: var(--semantic-text-font-primary);
    --button-text-color: var(--semantic-text-color-white);

    /* --- primary button --- */
    --button-background-primary: var(--semantic-color-success);
    --button-background-primary-active: #D45F10;
    --button-primary-overlay-highlight: rgba(255, 255, 255, 0);
    --button-primary-overlay-shade: rgba(0, 0, 0, 0.15);

    /* --- secondary button --- */
    --button-background-secondary: none;
    --button-background-secondary-hover: var(
        --semantic-background-color-accent
    );
    --button-background-secondary-active: var(
        --semantic-background-color-vibrant
    );
    --button-stroke-color-secondary: var(--semantic-color-accent);
    --button-secondary-overlay-highlight: rgba(0, 0, 0, 0);
    --button-secondary-overlay-midpoint: rgba(0, 0, 0, 0.0384375);
    --button-secondary-overlay-shade: rgba(0, 0, 0, 0.09);

    /* --- outline button --- */
    --button-outline-border-color-accent: var(
        --semantic-background-color-accent
    );
    --button-outline-border-stroke-color-secondary: var(
        --semantic-color-accent
    );

    /*  callout  */
    --callout-border-color-prominent: var(--semantic-color-prominent);
    --callout-border-color-accent: var(--semantic-color-accent);
    --callout-text-color-prominent: var(--semantic-text-color-prominent);

    /*  custom captcha [uses default SF colors] */
    --captcha-background-color: #f1f5fb;
    --captcha-logo-color: #78869a;
    --captcha-loader-color: #1996d9;

    /*  checkbox  */
    --checkbox-text-font: var(--semantic-text-font-secondary);
    --checkbox-text-color: var(--semantic-text-color-black);
    --checkbox-border-color-alt: var(--semantic-border-color-prominent);
    --checkbox-border-color-checked: var(--semantic-color-success);
    --checkbox-background-color: rgba(255, 255, 255, 0.1); /* verify */
    --checkbox-background-color-default: var(
        --semantic-background-color-primary
    );
    --checkbox-background-color-checked: var(
        --semantic-background-color-success
    );
    --checkbox-boxshadow-customize: rgba(0, 160, 221, 0.5);

    /*  containers  */
    --container-text-color-vibrant: var(--semantic-text-color-vibrant);
    --container-text-font-primary: var(--semantic-text-font-primary);
    --container-text-color-default: var(--semantic-text-color-base);
    --container-text-color-accent: var(--semantic-text-color-accent);
    --container-background-color: var(--semantic-background-color-primary);
    --container-background-color-alt: var(--semantic-background-color-neutral);
    --container-fill-color-neutral: var(--semantic-fill-color-neutral);
    --container-boxshadow-color: rgba(187, 209, 227, 0.5);
    --container-border-color-default: var(--semantic-border-color-default);
    --container-border-color-subtle: var(--semantic-border-color-subtle);

    /* --- container head --- */
    --container-head-text-color: var(--semantic-text-color-white);
    --container-head-text-color-alt: var(--semantic-text-color-lightgray);
    --container-head-border-color: var(--semantic-color-prominent);
    --container-head-background-color: var(--semantic-background-color-shade);
    --container-head-background-color-alt: var(--semantic-color-success);
    --container-head-background-gradient-shade: rgba(0, 0, 0, 0.15);
    --container-head-background-gradient-highlight: rgba(255, 255, 255, 0.15);
    --container-head-background-gradient-highlight-subtle: rgba(
        255,
        255,
        255,
        0
    );

    /*  disclaimer  */
    --disclaimer-text-color-base: var(--semantic-text-color-white);
    --disclaimer-background-color: var(--semantic-background-color-bordergray);

    /*  divider  */
    --divider-color: var(--semantic-color-neutral);
    --divider-color-default: var(--semantic-border-color-default);
    --divider-color-dark: var(--semantic-border-color-prominent);
    --divider-color-subtle: var(--semantic-border-color-subtle);

    /*  footer  */
    --footer-text-color-base: var(--semantic-text-color-white);
    --footer-text-color-anchor: var(--semantic-text-color-white);
    --footer-background-color: #0C1F3F;

    /*  hero  */
    --hero-text-color-prominent: var(--semantic-text-color-white);
    --hero-text-color-subdued: rgba(191, 205, 224, 0.5);
    --hero-text-color-subtle: var(--semantic-text-color-lightgray);
    --hero-background-color-accent: var(--semantic-background-color-accent);
    --hero-background-color-prominent: var(--semantic-background-color-shade);
    --hero-background-gradient-highlight: rgba(13, 10, 45, 0.1);
    --hero-background-gradient-midpoint: rgba(12, 39, 93, 0.3);
    --hero-background-gradient-shade: var(--semantic-color-prominent);

    /*  header  */
    --header-text-contrast: var(--semantic-text-color-almostblack);
    --header-text-primary: var(--semantic-text-color-primary);
    --header-text-prominent: var(--semantic-text-color-prominent);
    --header-text-accent: var(--semantic-text-color-accent);
    --header-text-darkgray: var(--semantic-text-color-darkgray);
    --header-text-success: var(--semantic-text-color-success);

    /*  input-field  */
    --input-background-color-default: var(--semantic-background-color-primary);
    --input-border-color-default: var(--semantic-border-color-default);
    --input-border-color-subtle: var(--semantic-border-color-subtle);
    --input-text-color-placeholder: var(--semantic-color-subtle);
    --input-text-color-contrast: var(--semantic-text-color-black);
    --input-text-color-default: var(--semantic-text-color-primary);
    --input-boxshadow-autofill: var(--semantic-color-white);

    /* ---  input-field::active --- */
    --input-border-color-active: var(--semantic-border-color-default);
    --input-boxshadow-color-highlight-active: var(
        --semantic-border-color-default
    );
    --input-boxshadow-color-midpoint-active: var(--semantic-color-subtle);
    --input-boxshadow-color-fade-active: var(--semantic-color-neutral);

    /* ---  input-field::error --- */
    --input-text-color-error: var(--semantic-color-error);
    --input-border-color-error: var(--semantic-color-error);
    --input-text-color-error-contrast: var(--semantic-color-error-contrast);
    --input-border-color-error-contrast: var(--semantic-color-error-contrast);
    --input-background-color-error: var(--semantic-background-color-error);
    --input-errormessage-border-color: var(--semantic-color-white);
    --input-errormessage-dropshadow: rgba(0, 0, 0, 0.25);

    /* ---  input-field::disabled --- */
    --input-background-color-disabled: var(--semantic-background-color-neutral);
    --input-border-color-disabled: var(--semantic-border-color-subtle);

    /*  loader  */
    --loader-background-color: var(--semantic-background-color-primary);
    --loader-line-color-background: var(--semantic-color-subtle);
    --loader-line-color-highlight: var(--semantic-color-success);
    --loader-text-color: var(--semantic-text-color-vibrant);

    /*  modal  */
    --modal-header-text-color: var(--semantic-text-color-prominent);
    --modal-content-background-color: var(--semantic-background-color-primary);
    --modal-content-header-text-color: var(--semantic-text-color-base);
    --modal-background-color: rgba(0, 0, 0, 0.6);

    /*  nav  */
    --nav-text-color: var(--semantic-text-color-white);
    --nav-icon-color: var(--semantic-fill-color-neutral);
    --nav-background-color: #0C1F3F;
    --nav-background-secondary-color: var(--semantic-background-color-accent);

    /* ---  nav funnel --- */
    --nav-funnel-background-gradient-highlight: rgba(13, 10, 45, 0.1);
    --nav-funnel-background-color-accent: var(
        --semantic-background-color-accent
    );

    /*  pagination  */
    --pagination-text-color-alt: var(--semantic-text-color-white);

    /*  radio button  */
    --radio-label-border-color: var(--semantic-border-color-subtle);
    --radio-border-color-stroke: var(--semantic-color-black);
    --radio-border-color-selected: var(--semantic-color-success);
    --radio-border-color-overlay: var(--semantic-color-white);
    --radio-label-text-color: var(--semantic-text-color-almostblack);
    --radio-fill-color-selected: rgba(0, 154, 164, 0.1);
    --radio-tap-highlight: rgba(255, 255, 255, 0);

    /*  section  */
    --section-text-color-white: var(--semantic-text-color-white);
    --section-text-color-lightgray: var(--semantic-text-color-lightgray);
    --section-background-color-prominent: var(
        --semantic-background-color-shade
    );

    /*  tab  */
    --tab-text-color-loading: var(--semantic-color-subtle);
    --tab-text-color-default: var(--semantic-text-color-primary);
    --tab-background-color-gradient-hightlight: rgba(255, 255, 255, 0);
    --tab-background-color-gradient-shade: rgba(0, 0, 0, 0.15);
    --tab-background-color: var(--semantic-background-color-accent);
    --tab-body-background-color: var(--semantic-background-color-primary);

    /*  tooltip  */
    --tooltip-background-color: var(--semantic-color-darkgray);
    --tooltip-text-color: var(--semantic-text-color-white);

    /*  warning banner  */
    --warning-text-font: var(--semantic-text-font-secondary);
    --warning-text-color-default: var(--semantic-text-color-black);
    --warning-background-color: rgba(237, 242, 244, 0.95);
    --warning-button-text-color: var(--semantic-text-color-white);

    /*  vector  */
    --vector-background-color-vibrant: var(--semantic-color-vibrant);
    --vector-background-color-prominent: var(--semantic-color-prominent);
    --vector-background-color-accent: var(--semantic-background-color-accent);
    --vector-background-color-success: var(--semantic-background-color-success);
    --vector-border-color-vibrant: var(--semantic-color-vibrant);
    --vector-border-color-accent: var(--semantic-color-accent);
    --vector-border-color-subtle: var(--semantic-border-color-subtle);
    --vector-border-color-success: var(--semantic-color-success);
    --vector-border-color-prominent: var(--semantic-color-prominent);
    --vector-fill-color-white: var(--semantic-color-white);
    --vector-fill-color-subtle: var(--semantic-fill-color-subtle);
    --vector-fill-color-shadegray: var(--semantic-color-shadegray);
    --vector-fill-color-success: var(--semantic-fill-color-success);
    --vector-uislider-handle-gray: #d4e2eb;
    --vector-watermark-color: rgba(191, 205, 224, 0.5);
    --vector-sf-fly-top-dropshadow: rgba(12, 37, 70, 0.3);
    --vector-sf-fly-bot-dropshadow: rgba(12, 37, 70, 0.24);
    --vector-map-fade-midpoint: rgba(246, 246, 244, 0.2);
    --vector-asset-dropshadow: rgba(0, 0, 0, 0.25);
    --vector-image-overlay-gradient-highlight: rgba(255, 255, 255, 0);
    --vector-image-overlay-gradient-shade: rgba(0, 0, 0, 0.15);
    --vector-contentspacer-subtle: var(--semantic-border-color-subtle);

    /* unique colors not in use [second half of the modal on people/index */
    --modal-step-bullet-color: #f46119;
    --modal-step-text-color: #b1b1b1;
    --modal-step-loading-color: #6b6b6b;
}

.accordion__body ul li a,
.link-blue.phone-number {
    --anchor-text-color-vibrant: var(--semantic-text-color-base);
}