/* Source Sans Pro Font Faces */
@font-face {
	font-family: "Source Sans Pro";
	src: url("../../fonts/SourceSans3-Regular.woff2") format("woff2"),
			 url("../../fonts/SourceSans3-Regular.woff") format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Source Sans Pro";
	src: url("../../fonts/SourceSans3-Italic.woff2") format("woff2"),
			 url("../../fonts/SourceSans3-Italic.woff") format("woff");
	font-weight: 400;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: "Source Sans Pro";
	src: url("../../fonts/SourceSans3-SemiBold.woff2") format("woff2"),
			 url("../../fonts/SourceSans3-SemiBold.woff") format("woff");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Source Sans Pro";
	src: url("../../fonts/SourceSans3-SemiBoldItalic.woff2") format("woff2"),
			 url("../../fonts/SourceSans3-SemiBoldItalic.woff") format("woff");
	font-weight: 600;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: "Source Sans Pro";
	src: url("../../fonts/SourceSans3-Medium.woff2") format("woff2"),
			 url("../../fonts/SourceSans3-Medium.woff") format("woff");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Source Sans Pro";
	src: url("../../fonts/SourceSans3-MediumItalic.woff2") format("woff2"),
			 url("../../fonts/SourceSans3-MediumItalic.woff") format("woff");
	font-weight: 500;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: "Source Sans Pro";
	src: url("../../fonts/SourceSans3-Light.woff2") format("woff2"),
			 url("../../fonts/SourceSans3-Light.woff") format("woff");
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Source Sans Pro";
	src: url("../../fonts/SourceSans3-LightItalic.woff2") format("woff2"),
			 url("../../fonts/SourceSans3-LightItalic.woff") format("woff");
	font-weight: 300;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: "Source Sans Pro";
	src: url("../../fonts/SourceSans3-ExtraLight.woff2") format("woff2"),
			 url("../../fonts/SourceSans3-ExtraLight.woff") format("woff");
	font-weight: 200;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Source Sans Pro";
	src: url("../../fonts/SourceSans3-ExtraLightItalic.woff2") format("woff2"),
			 url("../../fonts/SourceSans3-ExtraLightItalic.woff") format("woff");
	font-weight: 200;
	font-style: italic;
	font-display: swap;
}

:root {
	--portal-navy: #062f4f;
	--portal-navy-2: #0c3f66;
	--portal-sky: #1f77c8;
	--portal-sky-soft: #e8f3ff;
	--portal-ink: #0f2540;
	--portal-white: #ffffff;
	--portal-muted: #d9e3ef;
	--portal-focus: #f59f00;
}


* {
	box-sizing: border-box;
}

html,
body {
	overflow-x: hidden;
}

body {
	font-family: "Source Sans Pro", sans-serif;
	color: var(--portal-ink);
	background-color: #f6f8fb;
}

.skip-link {
	position: absolute;
	top: -50px;
	left: 0.5rem;
	z-index: 1050;
	background: var(--portal-focus);
	color: #1f1f1f;
	padding: 0.5rem 0.8rem;
	font-weight: 700;
	text-decoration: none;
	border-radius: 0.35rem;
}

.skip-link:focus {
	top: 0.5rem;
}

a:focus-visible,
button:focus-visible,
input:focus-visible {
	outline: 3px solid var(--portal-focus);
	outline-offset: 2px;
}

.gov-banner {
	background: var(--portal-navy);
	color: rgba(255, 255, 255, 0.95);
}

.gov-banner-row {
	display: flex;
	align-items: baseline;
	flex-wrap: nowrap;
	gap: 0.55rem;
	min-height: 2.15rem;
}

.gov-banner-text {
	color: rgba(255, 255, 255, 0.97);
	white-space: nowrap;
	line-height: 1.25;
	font-size: 1rem;
}

.gov-toggle {
	color: #33a0ff;
	text-decoration: underline;
	text-underline-offset: 2px;
	border: 0;
	background: transparent;
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	line-height: 1.2;
	font-size: 1rem;
	white-space: nowrap;
}

.gov-toggle:hover,
.gov-toggle:focus-visible {
	color: #8cc8ff;
}

.gov-chevron {
	transition: transform 0.2s ease;
	font-size: 0.75rem;
}

.gov-toggle[aria-expanded="true"] .gov-chevron {
	transform: rotate(180deg);
}

#howYouKnowPanel {
	border-top: 1px solid rgba(255, 255, 255, 0.18);
	background: #072f50;
}

.howyouknow-item {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	color: #ffffff;
	font-size: 1.06rem;
	line-height: 1.45;
}

.howyouknow-icon {
	flex: 0 0 auto;
	color: #ffffff;
	font-size: 1.5rem;
	line-height: 1;
	margin-top: 0.2rem;
}

.gov-panel-link {
	color: #33a0ff;
}

.gov-panel-link:hover,
.gov-panel-link:focus-visible {
	color: #8cc8ff;
}

.portal-navbar {
	background: var(--portal-white);
	border-bottom: 1px solid #dce5f1;
}

.brand-logo {
	width: clamp(160px, 18vw, 230px);
	height: auto;
	object-fit: contain;
}

.brand-text-wrap {
	display: inline-flex;
	flex-direction: column;
	line-height: 1.05;
}

.brand-title {
	font-size: 0.8rem;
	font-weight: 700;
	color: #1d3e60;
}

.brand-subtitle {
	font-size: 1.2rem;
	font-weight: 700;
	color: #0a3153;
}

.nav-link {
	color: #193a5a;
	font-weight: 600;
}

.nav-link:hover,
.nav-link:focus-visible {
	color: var(--portal-sky);
}

.nav-link.active {
	color: var(--portal-sky);
	text-decoration: underline;
	text-underline-offset: 0.25rem;
}

.contrast-toggle {
	border: 1px solid #0e3e67;
	color: #0e3e67;
	background: #ffffff;
	font-weight: 700;
}

.contrast-toggle:hover,
.contrast-toggle:focus-visible {
	background: #0e3e67;
	color: #ffffff;
}

.profile-btn {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	border: 0;
	background-color: #0e3e67;
	/* blue */
	color: #ffffff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	opacity: 1;
}

.profile-btn:hover,
.profile-btn:focus {
	background-color: #0e3e67;
	/* darker blue */
	color: #ffffff;
}

.header-actions {
	gap: 0.75rem;
}

.hero-section {
	min-height: 360px;
	background-image: url("../../images/dmi/Content_Area_top_image.png");
	position: relative;
	background-size: cover;
	background-position: center 40%;
	display: flex;
	padding: 5rem 0 4rem;
}

.hero-title {
	font-size: clamp(1.7rem, 2.2vw + 1rem, 3rem);
	color: #ffffff;
	font-weight: 700;
}

.hero-title span {
	color: #ffffff;
}

.hero-actions .btn {
	min-width: 12.5rem;
}

.hero-actions .btn-primary {
	background-color: var(--portal-sky);
	border-color: var(--portal-sky);
}

.hero-actions .btn-primary:hover,
.hero-actions .btn-primary:focus-visible {
	background-color: #1366b3;
	border-color: #1366b3;
}

.welcome-section {
	background: linear-gradient(180deg, #0a3153 0%, #062b47 100%);
	color: #f7fbff;
}

.welcome-section .lead {
	color: #d5e7f8;
	font-size: 1.15rem;
}

.subscribe-card {
	border: 1px solid rgba(173, 209, 241, 0.5);
	border-radius: 0.5rem;
	padding: 1.25rem;
	background: rgba(7, 51, 83, 0.6);
}

.subscribe-card p {
	color: #d8e8f9;
}

.btn-subscribe {
	background: #2e89d9;
	color: #ffffff;
	border: 1px solid #2e89d9;
}

.btn-subscribe:hover,
.btn-subscribe:focus-visible {
	background: #1d72bd;
	border-color: #1d72bd;
	color: #ffffff;
}

#emailInput.is-invalid {
	border-color: #dc3545;
}

#emailInput.is-invalid:focus {
	box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
}

#subscribeFeedback {
	min-height: 1.25rem;
}

.reports-section {
	position: relative;
}

.reports-section-white {
	background: #ffffff;
	padding: 3rem 0 0;
}

.reports-section-image {
	background-image:
		linear-gradient(0deg, rgba(238, 247, 255, 0) 9.5%, #ffffff 93.6%),
		url("../../images/dmi/Content_Area_bottom_image.jpg");
	background-size: cover;
	background-position: center 28%;
	position: relative;
	padding: 15px 0 3rem;
}

.reports-stack {
	max-width: 980px;
	margin: 0 auto;
	display: grid;
	gap: 0.9rem;
}

.report-card {
	background: #ffffff;
	border: 1px solid #d8e3f0;
	border-radius: 0.35rem;
	padding: 1rem 1.2rem;
	box-shadow: 0 2px 7px rgba(11, 46, 74, 0.08);
}

.report-card h3 {
	color: #065ba7;
	font-size: 1.2rem;
}

.report-card h3 a {
	color: inherit;
	text-decoration: none;
}

.report-card h3 a:hover,
.report-card h3 a:focus-visible {
	text-decoration: underline;
}

.report-card p {
	color: #334c65;
}

.report-card-note {
	background: #e8f3ff;
}

.portal-footer {
	background: var(--portal-navy);
	color: #ebf5ff;
}

.footer-logo {
	width: 220px;
	max-width: 100%;
	height: auto;
}

.portal-footer a {
	color: #ffffff !important;
}

.portal-footer a:hover,
.portal-footer a:focus-visible {
	color: #ffffff !important;
}

.footer-contact {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}

.footer-contact-title {
	display: inline-grid;
	grid-template-columns: 1.1rem auto;
	align-items: center;
	gap: 0.45rem;
	margin: 0 0 0.5rem;
}

.footer-contact p {
	margin-left: 1.55rem;
}

.footer-contact-phone {
	margin-left: 0;
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
}

.footer-divider {
	border-color: rgba(196, 223, 246, 0.28);
}

body.hc-mode {
	background: #000000;
	color: #ffffff;
}

body.hc-mode .gov-banner,
body.hc-mode .portal-footer,
body.hc-mode .welcome-section {
	background: #000000;
	color: #ffffff;
}

body.hc-mode .gov-toggle,
body.hc-mode .gov-panel-link,
body.hc-mode .gov-banner-text,
body.hc-mode .howyouknow-item,
body.hc-mode .howyouknow-icon {
	color: #ffff00;
}

body.hc-mode .portal-navbar,
body.hc-mode .report-card,
body.hc-mode .subscribe-card,
body.hc-mode .report-card-note {
	background: #000000;
	color: #ffffff;
	border-color: #ffffff;
}

body.hc-mode .hero-section,
body.hc-mode .reports-section-white,
body.hc-mode .reports-section-image {
	background: #000000;
}

body.hc-mode a,
body.hc-mode .nav-link,
body.hc-mode .hero-title span,
body.hc-mode .report-card h3,
body.hc-mode .brand-title,
body.hc-mode .brand-subtitle,
body.hc-mode .report-card p,
body.hc-mode .welcome-section .lead,
body.hc-mode .subscribe-card p,
body.hc-mode .hero-title {
	color: #ffff00;
}

body.hc-mode .btn-primary,
body.hc-mode .btn-light,
body.hc-mode .btn-subscribe,
body.hc-mode .contrast-toggle {
	background: #000000;
	color: #ffff00;
	border-color: #ffff00;
}

body.hc-mode .btn-primary:hover,
body.hc-mode .btn-light:hover,
body.hc-mode .btn-subscribe:hover,
body.hc-mode .contrast-toggle:hover {
	background: #ffff00;
	color: #000000;
}

@media (max-width: 991.98px) {
	.portal-navbar .navbar-collapse {
		border-top: 1px solid #dce5f1;
		margin-top: 0.75rem;
		padding-top: 0.75rem;
	}

	.hero-section {
		min-height: 320px;
		padding: 4rem 0 3.2rem;
	}
}

@media (max-width: 575.98px) {
	.gov-banner-row {
		flex-wrap: wrap;
		row-gap: 0.2rem;
		min-height: auto;
	}

	.gov-banner-text,
	.gov-toggle {
		font-size: 0.95rem;
	}

	.howyouknow-item {
		font-size: 0.97rem;
	}

	.howyouknow-icon {
		font-size: 1.25rem;
	}

	.brand-subtitle {
		font-size: 1rem;
	}

	.hero-actions .btn {
		width: 100%;
	}

	.welcome-section .lead {
		font-size: 1rem;
	}

	.report-card h3 {
		font-size: 1.1rem;
	}

	.footer-links .list-inline-item {
		display: block;
		margin-bottom: 0.45rem;
	}
}