/**
 * PPB Core — page header (hero). Button surface styles: objects/button.css.
 *
 * @package PPB_Core
 */

.ppb-page-header {
	width: 100%;
	box-sizing: border-box;
}

/* --- No image (light intro): one vertical rhythm; `height` does not change padding here. --- */
.ppb-page-header:not(.ppb-page-header--has-image) {
	background-color: var(--ppb-color-surface-page, #f7f6f2);
	padding-block: var(
		--ppb-page-header-padding-block,
		var(--ppb-space-main-gap, clamp(2rem, 5vw, 4rem))
	);
}

/* Your Event: bottom padding duplicated inter-section gap from `.ppb-site-main > * + *`; use main rhythm only. */
body.ppb-page-your-event .ppb-page-header:not(.ppb-page-header--has-image) {
	padding-block-end: 0;
}

/* What’s On: same as Your Event — avoid doubling with `main.ppb-site-main > * + *` after the light intro. */
body.ppb-page-whats-on .ppb-page-header:not(.ppb-page-header--has-image) {
	padding-block-end: 0;
}

/* 404: same seam — one rhythm step from `main > * + *`, not header padding + margin + section padding. */
body.error404 .ppb-page-header:not(.ppb-page-header--has-image) {
	padding-block-end: 0;
}

/*
 * Light intro: title + description use a neutral; eyebrow uses venue primary (ACF).
 * Override with --ppb-page-header-text-fg in theme if needed.
 */
.ppb-page-header:not(.ppb-page-header--has-image) .ppb-page-header__title {
	font-family: var(--font-display, inherit);
	color: var(--ppb-page-header-text-fg, #333333);
}

.ppb-page-header:not(.ppb-page-header--has-image) .ppb-page-header__description {
	font-family: var(--font-body, inherit);
	color: var(--ppb-page-header-text-fg, #333333);
}

.ppb-page-header:not(.ppb-page-header--has-image) .ppb-page-header__eyebrow {
	font-family: var(--font-body, inherit);
	color: var(--color-primary, #917145);
}

/* --- With image (background-image set inline from PHP) --- */
.ppb-page-header--has-image {
	position: relative;
	z-index: 0;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	color: #fefffc;
	color: var(--ppb-color-footer-fg, #fefffc);
}

/* Home and other full-bleed heroes: ~990px cap at large viewports. */
.ppb-page-header--has-image.ppb-page-header--large {
	min-height: min(80vh, 61.875rem);
}

/* Section landing heroes (Eat & Drink, etc.): ~700px — shorter than home for conversion pages. */
.ppb-page-header--has-image.ppb-page-header--medium {
	min-height: min(65vh, 43.75rem);
}

.ppb-page-header--has-image.ppb-page-header--small {
	min-height: min(50vh, 28rem);
}

.ppb-page-header--has-image .ppb-page-header__inner {
	padding-block: clamp(2rem, 5vw, 4rem);
}

.ppb-page-header--has-image .ppb-page-header__title,
.ppb-page-header--has-image .ppb-page-header__description,
.ppb-page-header--has-image .ppb-page-header__eyebrow {
	color: inherit;
}

.ppb-page-header--has-image .ppb-page-header__title {
	font-family: var(--font-display, inherit);
}

.ppb-page-header--has-image .ppb-page-header__description,
.ppb-page-header--has-image .ppb-page-header__eyebrow {
	font-family: var(--font-body, inherit);
}

/* --- Shared layout --- */
.ppb-page-header__inner {
	box-sizing: border-box;
	width: 100%;
}

.ppb-page-header__content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.75rem;
	max-width: 100%;
}

.ppb-page-header--center .ppb-page-header__content {
	align-items: center;
	text-align: center;
}

/* align=center on image heroes: center the block vertically (default image layout pins content to the bottom). */
.ppb-page-header--has-image.ppb-page-header--center {
	justify-content: center;
}

.ppb-page-header__eyebrow {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.35rem;
	margin: 0;
	font-size: var(--ppb-text-base, 1rem);
	line-height: var(--ppb-leading-tight, 1.3);
}

.ppb-page-header__eyebrow-icon-wrap {
	display: inline-flex;
	line-height: 0;
	color: inherit;
}

.ppb-page-header__eyebrow-icon {
	display: block;
	width: 1rem;
	height: 1rem;
}

.ppb-page-header__title {
	margin: 0;
	max-width: var(--ppb-page-header-copy-max, 50ch);
	font-size: clamp(1.75rem, 4vw, 2.75rem);
	line-height: var(--ppb-leading-tight, 1.3);
	/* Real display bold where the theme font ships it; Neighbourhood keeps 400 (no Instrument Serif bold file). */
	font-weight: var(--ppb-font-weight-display-strong, var(--ppb-font-weight-bold, 600));
}

.ppb-page-header__description {
	margin: 0;
	font-size: var(--ppb-text-base, 1rem);
	line-height: var(--ppb-leading-normal, 1.5);
	max-width: var(--ppb-page-header-copy-max, 50ch);
}

.ppb-page-header--center .ppb-page-header__title,
.ppb-page-header--center .ppb-page-header__description {
	margin-inline: auto;
}

.ppb-page-header__description > p:first-child {
	margin-block-start: 0;
}

.ppb-page-header__description > p:last-child {
	margin-block-end: 0;
}

.ppb-page-header__buttons {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
	margin-block-start: clamp(1rem, 3vw, 1.75rem);
}

.ppb-page-header--center .ppb-page-header__buttons {
	justify-content: center;
}

/* Intro + image band (Page Builder `hero_variant` = band). Solid header; photo below. */
.ppb-page-header-band {
	width: 100%;
	aspect-ratio: 1440 / 522;
	max-height: min(522px, 55vh);
	overflow: hidden;
	background: var(--ppb-color-surface-panel, #f0eeea);
}

.ppb-page-header-band__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}