body.exg-generic-page {
	background: #f5f5f3;
	color: #111;
}

.exg-generic-container {
	width: min(1120px, calc(100% - 48px));
	margin-inline: auto;
}

.exg-generic-hero {
	padding: clamp(64px, 9vw, 112px) 0 clamp(48px, 6vw, 76px);
	background: #111;
	color: #fff;
}

.exg-generic-eyebrow {
	margin: 0 0 12px;
	font: 700 14px/1.3 var(--exg-display, sans-serif);
	letter-spacing: .09em;
	text-transform: uppercase;
	color: #ffbf00;
}

.exg-generic-hero h1 {
	max-width: 900px;
	margin: 0;
	font: 700 clamp(46px, 7vw, 78px)/.98 var(--exg-display, sans-serif);
	letter-spacing: -.025em;
	text-transform: uppercase;
	text-wrap: balance;
	color: #fff;
}

.exg-generic-content {
	padding-block: clamp(54px, 7vw, 88px);
	font: 400 18px/1.65 var(--exg-body, sans-serif);
}

.exg-generic-content > * {
	max-width: 820px;
}

.exg-generic-content > .alignwide {
	max-width: 1120px;
}

.exg-generic-content > .alignfull {
	max-width: none;
}

.exg-generic-content h2,
.exg-generic-content h3,
.exg-generic-content h4 {
	margin: 1.6em 0 .55em;
	font-family: var(--exg-display, sans-serif);
	line-height: 1.08;
	text-wrap: balance;
}

.exg-generic-content h2 {
	font-size: clamp(34px, 4vw, 52px);
}

.exg-generic-content h3 {
	font-size: clamp(26px, 3vw, 34px);
}

.exg-generic-content a {
	color: #725500;
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

.exg-generic-content img {
	height: auto;
	max-width: 100%;
}

@media (max-width: 640px) {
	.exg-generic-container {
		width: min(100% - 32px, 1120px);
	}
}