/*
 * Hero headline scale. `core/heading` has no font-size control (see
 * `strip_heading_font_size_support` in inc/editor.php) — heading size follows
 * the semantic level everywhere else, so the hero's display size has to come
 * from here. Literal clamp rather than `--wp--preset--font-size--display`:
 * preset font-size vars are redefined on block markup (see docs/styling.md).
 */
.nomon-hero :is(h1, h2, h3, h4, h5, h6) {
	font-size: clamp(2.125rem, 1.5649rem + 2.4894vw, 4.875rem);
	line-height: 1.12;
	letter-spacing: -0.03em;
}

.nomon-hero--statement h1 { line-height: 1; }

/* Same headline-to-lead gap the service masthead had before it became this block. */
.nomon-hero :is(h1, h2) + p { margin-top: var(--wp--preset--spacing--xxl); }

.nomon-hero--statement :is(h1, h2) {
	max-width: 26ch;
	text-wrap: balance;
	margin: 0;
	font-size: clamp(2.5rem, -0.5rem + 7.5vw, 5.5rem);
	letter-spacing: -0.02em;
}

/* Narrower than the prose cap, which outranks a utility class here. */
.nomon-hero--statement .nomon-hero__intro {
	max-width: 20.75rem;
	font-size: 1rem;
	line-height: 1.5;
	font-weight: 500;
	letter-spacing: 0.01em;
}

/* Column tracks the viewport the way the reference site's does, capped where its own growth stops. */
@media (min-width: 48rem) {
	.nomon-hero--statement .nomon-hero__intro {
		width: min(29.5rem, calc(25vw - 28px));
		max-width: none;
	}
}