/**
 * Section heading — eyebrow + title with brand accent lines.
 * Pattern: section-heading
 */

.bnb-section-heading {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	width: 100%;
	max-width: 100%;
	/* padding-top: var(--wp--preset--spacing--60, clamp(1.25rem, 4vw, 2rem));
	padding-bottom: var(--wp--preset--spacing--60, clamp(1.25rem, 4vw, 2rem));
	box-sizing: border-box; */
}

/* Up to 80% of .bnb-section-heading; stays narrower when the line is short */
.bnb-section-heading-subtitle {
	margin-block: 0;
	margin-inline: auto;
	width: fit-content;
	max-width: 80%;
	box-sizing: border-box;
	overflow-wrap: break-word;
	word-break: break-word;
	font-size: 48px;
	font-weight: 500;
	color: #464646;
}

.bnb-section-heading-main-title-row {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	margin-block: 0 !important;
}

/* core/separator — share remaining row width so the center column gets a real width for % title */
.bnb-section-heading-main-title-row > .wp-block-separator {
	flex: 1 1 0;
	min-width: 0;
	margin: 0;
	border: none;
	border-top: none;
	height: 3px;
	min-height: 3px;
	background-color: #ecc4c0;
	opacity: 1 !important;
	width: auto !important;
}

/* Up to 80% of the title row; stays narrower when the title is short */
.bnb-section-heading-content {
	flex: 0 1 auto;
	min-width: 0;
	max-width: 80%;
	align-self: center;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: center;
	box-sizing: border-box;
}

/* Fills .bnb-section-heading-content; wraps at the content column’s width */
.bnb-section-heading-title {
	margin: 0;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	overflow-wrap: break-word;
	word-break: break-word;
	font-size: 55px;
	font-weight: 500;
	color: #ecc4c0;
	line-height: 1;
}

/* Text blocks that may be added inside the pattern root */
.bnb-section-heading > .wp-block-paragraph,
.bnb-section-heading > p {
	max-width: 80%;
	margin-inline: auto;
	overflow-wrap: break-word;
	word-break: break-word;
}

/* Below 500px: smaller than desktop (62% of 48px / 55px — was 70%). */
@media (max-width: 500px) {
	.bnb-section-heading-subtitle {
		font-size: calc(48px * 0.62);
	}

	.bnb-section-heading-title {
		font-size: calc(55px * 0.62);
	}
}