.page--header {
	--height: 250px;
	--radius: calc(max(var(--box-x-limit), 600px) * 1.5);
	padding: var(--site-header-offset, 100px) 0 0;
	display: grid;
	grid:
		'figure'
		'body  '
		/ 100%
	;
}
@media (min-width: 1200px) { .page--header {
	grid:
		[body-start]
		'figure figure figure figure' [body-end]
		/ var(--box-x-offset) [body-start] 1fr [body-end] 1fr var(--box-x-offset)
	;
} }
.page--header--figure {
	grid-area: figure;
	overflow: hidden;
	position: relative;
	height: var(--height);
	background: linear-gradient(0deg, #C8DEF0 -15%, #FFF 60%);
	clip-path: margin-box ellipse(var(--radius) 100% at 50% 0%);
}
.page--header--image {
	position: absolute;
	right: 50%;
	top: 0;
	width: auto;
	max-width: none;
	height: 100%;
	transform: translateX(50%);
}
.page--header--body {
	grid-area: body;
	z-index: 0;
	align-self: center;
	margin: calc(var(--box-y-offset) * 0.5) var(--box-x-offset) 0;
	display: grid;
	grid: auto auto / auto 1fr;
	gap: 10px;
	align-items: start;
}
@media (min-width: 1200px) { .page--header--body {
	margin: 0;
	gap: 20px;
} }
.page--header--title {
	grid-column: 1 / -1;
	margin: 0;
	font-size: 32px;
	line-height: 1.1;
}
@media (min-width: 1200px) { .page--header--title {
	font-size: 36px;
} }
.page--header--icon {
	width: 40px;
}
@media (min-width: 1200px) { .page--header--icon {
	width: 60px;
} }
.page--header--text {
	/*font-size: 16px;*/
	font-size: 14px;
}
@media (min-width: 1200px) { .page--header--text {
	/*font-size: 22px;*/
	font-size: 20px;
} }
