/*-------------------------------------------------------------------------
  Shared page header (secondary pages)
-------------------------------------------------------------------------*/

.wpw-page-header {
	background: var(--wpw-color-dark);
	color: var(--wpw-color-white);
	padding-block: clamp(1.15rem, 2.4vw, 1.75rem);
}

.wpw-page-header__inner {
	width: min(100% - (var(--wpw-pad-inline) * 2), var(--wpw-wide-size));
	margin-inline: auto;
}

.wpw-page-header__eyebrow {
	margin: 0 0 0.4rem;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	line-height: 1.2;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--wpw-color-primary) 75%, var(--wpw-color-white));
}

.wpw-page-header__title {
	margin: 0;
	font-size: clamp(1.45rem, 2.8vw, 1.85rem);
	font-weight: 800;
	letter-spacing: 0.06em;
	line-height: 1.15;
	text-transform: uppercase;
	color: var(--wpw-color-white);
}

.wpw-page-header__title::after {
	content: "";
	display: block;
	width: 2rem;
	height: 2px;
	margin-top: 0.55rem;
	background: var(--wpw-color-primary);
}

.wpw-page-header__intro {
	margin: 0.7rem 0 0;
	max-width: 36rem;
	font-size: clamp(0.9375rem, 1.2vw, 1.015rem);
	line-height: 1.5;
	color: color-mix(in srgb, var(--wpw-color-white) 82%, transparent);
}

.wpw-page-header__intro p {
	margin: 0;
}

.wpw-page-header__highlight {
	display: flex;
	align-items: flex-start;
	gap: 0.65rem;
	max-width: 40rem;
	margin: 1rem 0 0;
	padding: 0.7rem 0.85rem;
	border-radius: 6px;
	background: color-mix(in srgb, var(--wpw-color-primary) 22%, transparent);
	color: var(--wpw-color-white);
	font-size: 0.875rem;
	line-height: 1.45;
}

.wpw-page-header__highlight-icon {
	display: inline-flex;
	flex-shrink: 0;
	margin-top: 0.05rem;
	color: color-mix(in srgb, var(--wpw-color-primary) 55%, var(--wpw-color-white));
}

.wpw-page-header__highlight-text {
	min-width: 0;
}