/**
 * HTG Section Header — styles
 *
 * Most of the visual treatment (the .hl-headline highlight effect) is
 * inherited from main.css. This file adds block-specific layout and
 * variant adjustments only.
 */

.htg-section-header {
	display: flex;
	flex-direction: column;
	gap: var(--sp-sm);
}

.htg-section-header--align-center {
	align-items: center;
	text-align: center;
}

.htg-section-header__eyebrow {
	margin: 0;
}

.htg-section-header__headline {
	margin: 0;
}

.htg-section-header__headline {
	font-size: clamp(2rem, 4vw, 3rem);
}

h1.htg-section-header__headline {
	font-size: clamp(2.5rem, 5vw, 4rem);
}

h3.htg-section-header__headline {
	font-size: clamp(1.5rem, 2.5vw, 2rem);
}

h4.htg-section-header__headline {
	font-size: clamp(1.25rem, 2vw, 1.5rem);
}