/*
 * Strong Foundations brand colors
 * Edit the values below to change colors across the entire site.
 * See also colors.txt in the project root.
 */

:root {

	--color-primary: #184690;
	--color-primary-light: #2c72e2;
	--color-primary-dark: #113164; 
	--color-primary-darker: #0a1c39; 
	--color-secondary: #169a9c;
	--color-accent-red: #f45947;
}

/* Page background */
body {
	background: var(--color-primary) !important;
}

/* Template overrides */
#sidebar {
	background: var(--color-primary-darker) !important;
}

#header {
	background-color: var(--color-primary-dark) !important;
}

.wrapper.style1 {
	background-color: var(--color-primary) !important;
}

.wrapper.style1-alt {
	background-color: var(--color-primary-dark) !important;
}

.wrapper.style2 {
	background-color: var(--color-secondary) !important;
}

.wrapper.style3 {
	background-color: var(--color-primary-dark) !important;
}

.wrapper.alt {
	background-color: var(--color-primary-dark) !important;
}

.wrapper.style1 .icon.major:before {
	color: var(--color-primary) !important;
}

.wrapper.style1-alt .icon.major:before {
	color: var(--color-primary-dark) !important;
}

.wrapper.style2 .icon.major:before {
	color: var(--color-secondary) !important;
}

.wrapper.style3 .icon.major:before {
	color: var(--color-primary-dark) !important;
}

/* Site-specific */
.headshot {
	border-radius: 0.25em;
	max-width: 400px;
	width: 100%;
}

.headshot-circle {
	border-radius: 50%;
	max-width: 220px;
	width: 100%;
}

.quote-block {
	/* Accent line matches quote text color (body text); reserved for future use */
	border-left: 4px solid rgba(255, 255, 255, 0.55);
	padding-left: 1.25em;
	margin: 1.5em 0;
}

.quote-attribution {
	margin-top: 0.5em;
	font-style: italic;
}

.content-section h2 {
	margin-bottom: 1em;
}

.content-section h3 {
	margin-top: 1.5em;
	margin-bottom: 0.75em;
}

.content-section h4 {
	margin-top: 1.25em;
	margin-bottom: 0.5em;
}

.content-section ul {
	margin-bottom: 1.5em;
}

.bio-header {
	display: flex;
	flex-wrap: wrap;
	gap: 2em;
	align-items: flex-start;
	margin-bottom: 2em;
}

.bio-header-text {
	flex: 1;
	min-width: 240px;
}

.tagline {
	font-size: 1.1em;
	font-style: italic;
	margin-top: 1em;
}

.contact-list li {
	margin-bottom: 0.75em;
}