/**
 * Page Hero (synced pattern) + page color theme hooks.
 * Background comes from --mhsi-page-theme-bg (set by page meta), not a hard-coded fill.
 * Children styled via .mhsi-page-hero descendants — no nested BEM classes required.
 */

.mhsi-page-hero {
	background-color: var(--mhsi-page-theme-bg, var(--mhsi-color-minty, #e3faf0));
	color: var(--mhsi-page-theme-fg, var(--mhsi-color-black-text, #212121));
	min-height: 450px;
	box-sizing: border-box;
	/* Bottom-align title/star row within the min-height hero. */
	display: flex !important;
	flex-direction: column;
	justify-content: flex-end;
	padding: 0 var(--wp--preset--spacing--40, 1rem) clamp(2.5rem, 5vw, 3.5rem);
}

.mhsi-page-hero > .wp-block-columns {
	align-items: flex-end !important;
	width: 100%;
	margin-block: 0;
	margin-top: auto;
}

.mhsi-page-hero h1,
.mhsi-page-hero .wp-block-heading {
	margin: 0 !important;
	font-weight: 500;
	font-size: clamp(2.5rem, 5.5vw, 4.8125rem);
	line-height: 1.23;
	letter-spacing: -0.04em;
	max-width: 42rem;
}

.mhsi-page-hero h1:not(.has-text-color),
.mhsi-page-hero .wp-block-heading:not(.has-text-color) {
	color: inherit;
}

.mhsi-page-hero > .wp-block-columns > .wp-block-column:last-child .wp-block-image {
	margin: 0 0 0.35rem auto !important;
	display: flex;
	justify-content: flex-end;
	align-items: flex-end;
}

.mhsi-page-hero > .wp-block-columns > .wp-block-column:last-child .wp-block-image img {
	display: block;
	width: 2.9rem;
	height: auto;
	margin: 0;
}

/* Teal / on-dark: hero copy + star use page-theme foreground (white). */
body.mhsi-page-theme-on-dark .mhsi-page-hero,
body.mhsi-theme-teal .mhsi-page-hero {
	color: var(--mhsi-page-theme-fg, #fff);
}

body.mhsi-page-theme-on-dark .mhsi-page-hero h1:not(.has-text-color),
body.mhsi-page-theme-on-dark .mhsi-page-hero .wp-block-heading:not(.has-text-color),
body.mhsi-theme-teal .mhsi-page-hero h1:not(.has-text-color),
body.mhsi-theme-teal .mhsi-page-hero .wp-block-heading:not(.has-text-color) {
	color: var(--mhsi-page-theme-fg, #fff);
}

body.mhsi-page-theme-on-dark .mhsi-page-hero .wp-block-image img,
body.mhsi-theme-teal .mhsi-page-hero .wp-block-image img {
	filter: brightness(0) invert(1);
}

/* Title block (core/post-title) + site title — white on teal/on-dark. */
body.mhsi-page-theme-on-dark .wp-block-post-title:not(.has-text-color),
body.mhsi-page-theme-on-dark .wp-block-post-title:not(.has-text-color) a:not(.has-text-color),
body.mhsi-page-theme-on-dark .wp-block-site-title:not(.has-text-color),
body.mhsi-page-theme-on-dark .wp-block-site-title:not(.has-text-color) a:not(.has-text-color),
body.mhsi-theme-teal .wp-block-post-title:not(.has-text-color),
body.mhsi-theme-teal .wp-block-post-title:not(.has-text-color) a:not(.has-text-color),
body.mhsi-theme-teal .wp-block-site-title:not(.has-text-color),
body.mhsi-theme-teal .wp-block-site-title:not(.has-text-color) a:not(.has-text-color) {
	color: var(--mhsi-page-theme-fg, #fff);
}

@media (max-width: 781px) {
	.mhsi-page-hero > .wp-block-columns {
		flex-direction: column !important;
	}

	.mhsi-page-hero > .wp-block-columns > .wp-block-column:last-child .wp-block-image {
		margin-left: 0 !important;
		margin-top: 1.5rem !important;
		justify-content: flex-start;
	}
}