.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.screen-reader-text:focus {
	top: var(--ewh-space-2);
	left: var(--ewh-space-2);
	z-index: 100000;
	width: auto;
	height: auto;
	padding: var(--ewh-space-2);
	clip: auto;
	background: var(--ewh-color-white);
	color: var(--ewh-color-black);
	white-space: normal;
}

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

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

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

.ewh-text-muted {
	color: var(--ewh-color-muted-text);
}

.ewh-bg-black :where(h1, h2, h3, h4, h5, h6, a),
.ewh-bg-navy :where(h1, h2, h3, h4, h5, h6, a) {
	color: var(--ewh-color-white);
}

.ewh-bg-black .ewh-eyebrow,
.ewh-bg-navy .ewh-eyebrow {
	color: var(--ewh-color-white);
}

.ewh-bg-black :focus-visible,
.ewh-bg-navy :focus-visible {
	outline-color: var(--ewh-color-white);
}
