:root {
	--brand-green: #20FA83;
	--brand-midnight: #111B1E;
	--brand-navy: #012537;
	--brand-dark-purple: #333891;
	--brand-light-purple: #B69EFD;
	--brand-purple: #724CF9;
	--brand-reverb: #34CAD2;
	--black: #000000;
	--light-gray: #F5F5F5;
	--medium-gray: #D5D5D5;
	--white: #FEFEFE;
}

/** BACKGROUNDS + TEXT **/

.background-black, .background-midnight, .background-navy, .background-purple {
	background-color: var(--black);
	color: var(--white);
}

.background-midnight {
	background-color: var(--brand-midnight);
}

.background-navy {
	background-color: var(--brand-navy);
}

.background-purple {
	background-color: var(--brand-purple);
}

.background-light-gray, .background-white {
	background-color: var(--light-gray);
	color: var(--black);
}

.background-white {
	background-color: var(--white);
}

/* EYEBROWS */

.eyebrow {
	color: var(--brand-purple);
}

/** GRID/BORDER **/

.background-black .grid-container.border, .background-midnight .grid-container.border, .background-navy .grid-container.border, .background-purple .grid-container.border {
	border-left: solid .0625rem var(--brand-dark-purple);
}

.background-light-gray .grid-container.border, .background-white .grid-container.border {
	border-left: solid .0625rem var(--medium-gray);
}

.border h4, .border .h4 {
	border-left: solid .125rem var(--brand-reverb);
}

.columns-border h4, .columns-border .h4 {
	border-left: none;
}

.columns-border .column .grid-100 {
	border: solid .125rem var(--brand-purple);
}

/** LINKS **/

.background-black a, .background-midnight a, .background-navy a, .background-purple a {
	color: var(--white);
}

.background-light-gray a, .background-white a {
	color: var(--black);
}

.global-nav a {
	color: #64F9F5;
}

/** BUTTONS **/

/* NAV */

.cta-menu a {
	background-color: var(--brand-green);
}

/* PRIMARY */

.background-black a.button.primary, .background-midnight a.button.primary, .background-navy a.button.primary, .background-purple a.button.primary {
	background-color: var(--white);
	color: var(--black);
}

.background-midnight a.button.primary {
	color: var(--brand-midnight);
}

.background-navy a.button.primary {
	color: var(--brand-navy);
}

.background-purple a.button.primary {
	color: var(--brand-purple);
}

.background-light-gray a.button.primary, .background-white a.button.primary {
	background-color: var(--brand-purple);
	color: var(--white);
}

/* SECONDARY */

.background-black a.button.secondary, .background-midnight a.button.secondary, .background-navy a.button.secondary, .background-purple a.button.secondary {
	background: linear-gradient(to right, var(--brand-light-purple), var(--brand-purple));
	color: var(--white);
}

.background-light-gray a.button.secondary, .background-white a.button.secondary {
	background-color: transparent;
	color: var(--black);
	border: solid .125rem var(--black);
}
