/**
 * PPB Core — full-width banner (BEM hooks + layout structure only).
 * Colour, type scale, radii, imagery treatment: active theme or custom.css.
 * `--boxed` (excluding Pub Club) mirrors `.ppb-venue-showcase` panel (24rem card, padding clamps,
 * `48rem` card-width breakpoint). The **stage** width and horizontal inset match `.ppb-wrap`:
 * `max-width: var(--ppb-layout-max-width)` and `padding-inline: var(--ppb-home-wrap-padding-inline, 1.5rem)`.
 * Tokens `--ppb-fwb-box-bg` / `--ppb-fwb-eyebrow-accent` stay for themes.
 */

.ppb-full-width-banner {
	width: 100%;
	box-sizing: border-box;
}

/* Inline background-image from PHP */
.ppb-full-width-banner--has-image {
	background-size: cover;
	background-position: center;
}

.ppb-full-width-banner__inner {
	box-sizing: border-box;
}

/*
 * Lift shadow when boxed inner has no `.__box` (edge case); Pub Club outer box carries shadow below.
 */
.ppb-full-width-banner__inner.ppb-full-width-banner__inner--boxed:not(:has(.ppb-full-width-banner__box)) {
	box-shadow: var(--ppb-shadow-lift);
}

.ppb-full-width-banner__box {
	box-sizing: border-box;
	width: 100%;
}

.ppb-full-width-banner__box--pub-club {
	box-shadow: var(--ppb-shadow-lift);
}

/**
 * Boxed variant — layout aligned with `.ppb-venue-showcase` panel metrics; horizontal bounds match `.ppb-wrap`
 * (`--ppb-layout-max-width`, `--ppb-home-wrap-padding-inline`). Background image stays on section;
 * gradient overlay matches `.ppb-venue-showcase__overlay`.
 * Pub Club (`--pub-club`) keeps its own split layout — excluded here.
 */
.ppb-full-width-banner--boxed:not(.ppb-full-width-banner--pub-club) {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: min(80vh, 52rem);
	overflow: hidden;
	margin: 0;
	box-sizing: border-box;
}

.ppb-full-width-banner--boxed.ppb-full-width-banner--has-image:not(.ppb-full-width-banner--pub-club)::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background: linear-gradient(
		to bottom,
		color-mix(in srgb, var(--ppb-color-text, #1a1a1a) 15%, transparent) 0%,
		color-mix(in srgb, var(--ppb-color-text, #1a1a1a) 50%, transparent) 100%
	);
}

.ppb-full-width-banner--boxed:not(.ppb-full-width-banner--pub-club) .ppb-full-width-banner__inner--boxed {
	position: relative;
	z-index: 1;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	width: 100%;
	max-width: var(--ppb-layout-max-width, 1460px);
	margin-inline: auto;
	padding-block: clamp(1.5rem, 4vw, 3rem) 0;
	padding-inline: var(--ppb-home-wrap-padding-inline, 1.5rem);
	margin-bottom: clamp(
		var(--ppb-space-stack-md, 1.5rem),
		4vw,
		4.5rem
	);
	min-height: 0;
}

/* Card — mirrors `.ppb-venue-showcase__panel` (no lift shadow; venue panel is flat). */
.ppb-full-width-banner--boxed:not(.ppb-full-width-banner--pub-club)
	.ppb-full-width-banner__box:not(.ppb-full-width-banner__box--pub-club) {
	max-width: 24rem;
	width: 100%;
	background: var(--ppb-color-surface-page, var(--ppb-fwb-box-bg, #f7f6f2));
	border-radius: var(--ppb-radius-card, 0.75rem);
	padding: clamp(1.25rem, 3vw, 2rem);
	display: flex;
	flex-direction: column;
	gap: 0;
}

.ppb-full-width-banner--boxed:not(.ppb-full-width-banner--pub-club) .ppb-full-width-banner__content {
	align-items: stretch;
	gap: 0.75rem;
	max-width: none;
	width: 100%;
	text-align: start;
}

.ppb-full-width-banner--boxed:not(.ppb-full-width-banner--pub-club)
	.ppb-full-width-banner__content > * + * {
	margin-top: 0;
}

.ppb-full-width-banner--boxed:not(.ppb-full-width-banner--pub-club)
	.ppb-full-width-banner__content > .ppb-full-width-banner__eyebrow + .ppb-full-width-banner__title {
	margin-top: 0;
}

/* Mirrors `.ppb-venue-showcase__actions` top nudge */
.ppb-full-width-banner--boxed:not(.ppb-full-width-banner--pub-club) .ppb-full-width-banner__cta {
	margin-top: 0.25rem;
	margin-bottom: 0;
}

/* Mirrors `.ppb-venue-showcase__panel-title` */
.ppb-full-width-banner--boxed:not(.ppb-full-width-banner--pub-club) .ppb-full-width-banner__title {
	margin: 0;
	font-family: var(--font-display, inherit);
	font-size: var(--ppb-text-3xl, 1.875rem);
	font-weight: var(--ppb-font-weight-display-strong, 700);
	color: var(--ppb-color-text);
	line-height: var(--ppb-leading-tight, 1.2);
}

/* Mirrors `.ppb-venue-showcase__summary` */
.ppb-full-width-banner--boxed:not(.ppb-full-width-banner--pub-club) .ppb-full-width-banner__text {
	max-width: none;
	font-size: var(--ppb-text-sm, 0.875rem);
	line-height: var(--ppb-leading-normal, 1.6);
	color: var(--ppb-color-text);
}

.ppb-full-width-banner--boxed:not(.ppb-full-width-banner--pub-club)
	.ppb-full-width-banner__text.ppb-u-prose {
	max-width: none;
}

.ppb-full-width-banner--boxed:not(.ppb-full-width-banner--pub-club) .ppb-full-width-banner__body {
	font-size: inherit;
	line-height: inherit;
}

@media (max-width: 48rem) {
	.ppb-full-width-banner--boxed:not(.ppb-full-width-banner--pub-club)
		.ppb-full-width-banner__box:not(.ppb-full-width-banner__box--pub-club) {
		max-width: 100%;
	}

	/* Extra vertical inset so more of the section background shows above and below the card */
	.ppb-full-width-banner--boxed:not(.ppb-full-width-banner--pub-club)
		.ppb-full-width-banner__inner--boxed {
		padding-block-start: calc(clamp(1.5rem, 4vw, 3rem) * 2);
		margin-bottom: calc(
			clamp(
				var(--ppb-space-stack-md, 1.5rem),
				4vw,
				4.5rem
			) * 2
		);
	}
}

.ppb-full-width-banner__text {
	max-width: var(--ppb-measure-wide, 50rem);
	box-sizing: border-box;
}

/* Beat `.ppb-u-prose` (65ch) when both classes are present */
.ppb-full-width-banner__text.ppb-u-prose {
	max-width: var(--ppb-measure-wide, 50rem);
}

.ppb-full-width-banner__body > p:last-child {
	margin-bottom: 0;
}

.ppb-full-width-banner__body {
	font-size: clamp(var(--ppb-text-base, 1rem), 0.35vw + 0.92rem, var(--ppb-text-lg, 1.125rem));
	line-height: var(--ppb-leading-normal, 1.5);
}

.ppb-full-width-banner--pub-club .ppb-full-width-banner__body + .ppb-full-width-banner__promo-list {
	margin-top: var(--ppb-space-stack-md, 1.5rem);
}

/* Copy stack: eyebrow + title tight; equal steps for title / body / CTA (do not zero `.__cta` margin — it clears this) */
.ppb-full-width-banner__content {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.ppb-full-width-banner__content > * + * {
	margin-top: var(--ppb-space-stack-lg, 2rem);
}

.ppb-full-width-banner__content > .ppb-full-width-banner__eyebrow + .ppb-full-width-banner__title {
	margin-top: 0.25rem;
}

/* Homepage Eat & drink — full-bleed image, curved top-right, bottom-aligned copy in `.ppb-wrap` */
.ppb-full-width-banner--eat-drink {
	display: flex;
	flex-direction: column;
	min-height: 900px;
	box-sizing: border-box;
}

.ppb-full-width-banner--eat-drink.ppb-full-width-banner--has-image {
	position: relative;
	overflow: hidden;
	/* Desktop 450px; scales down on narrow viewports */
	border-top-right-radius: clamp(2rem, 25vw, 450px);
	background-size: cover;
	background-position: center;
}

.ppb-full-width-banner--eat-drink.ppb-full-width-banner--has-image::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background: rgba(0, 0, 0, 0.45);
}

.ppb-full-width-banner--eat-drink .ppb-full-width-banner__inner--eat-drink {
	position: relative;
	z-index: 1;
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 0;
	padding-bottom: 4rem;
	box-sizing: border-box;
}

.ppb-full-width-banner--eat-drink .ppb-wrap {
	width: 100%;
}

.ppb-full-width-banner--eat-drink .ppb-full-width-banner__content {
	max-width: none;
}

.ppb-full-width-banner--eat-drink .ppb-full-width-banner__eyebrow {
	color: #fff;
}

.ppb-full-width-banner--eat-drink .ppb-full-width-banner__title {
	margin: 0;
	font-family: var(--font-display, inherit);
	font-size: var(--ppb-text-4xl, 2.5rem);
	font-weight: var(--ppb-font-weight-regular, 400);
	line-height: 1.15;
	color: #fff;
}

.ppb-full-width-banner--eat-drink .ppb-full-width-banner__text {
	font-family: var(--font-body, inherit);
	color: #fff;
}

.ppb-full-width-banner--eat-drink .ppb-full-width-banner__body {
	font-size: clamp(var(--ppb-text-lg, 1.125rem), 1.5vw + 0.75rem, var(--ppb-text-4xl, 2.3125rem));
	line-height: var(--ppb-leading-tight, 1.32);
}

.ppb-full-width-banner--eat-drink .ppb-full-width-banner__text p {
	margin: 0;
}

/* Homepage Featured promotion — section chrome only (boxed layout follows venue-showcase shell above) */
.ppb-full-width-banner--featured-promotion.ppb-full-width-banner--has-image {
	position: relative;
	overflow: hidden;
	border-top-right-radius: clamp(2rem, 25vw, 450px);
	background-size: cover;
	background-position: center;
	min-height: min(72vh, 48rem);
}

.ppb-full-width-banner--featured-promotion.ppb-full-width-banner--has-image::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background: rgba(0, 0, 0, 0.45);
}

/* Boxed: dark flat overlay omitted — gradient matches `.ppb-venue-showcase__overlay` via boxed `::after` */
.ppb-full-width-banner--featured-promotion.ppb-full-width-banner--has-image.ppb-full-width-banner--boxed::before {
	display: none;
}

/* Shared Pub Club promo — 50/50 panel + image; eyebrow = primary; list ≈26px */
.ppb-full-width-banner--pub-club.ppb-full-width-banner--boxed {
	background: transparent;
}

.ppb-full-width-banner--pub-club .ppb-full-width-banner__inner--boxed {
	width: 100%;
	max-width: var(--ppb-layout-max-width, 1460px);
	margin-inline: auto;
	padding-inline: var(--ppb-space-stack-md, 1rem);
	padding-block: var(--ppb-space-stack-lg, 2rem);
	box-sizing: border-box;
}

.ppb-full-width-banner__box--pub-club {
	width: 100%;
	overflow: hidden;
	border-radius: var(--ppb-radius-card, 0.75rem);
	background: transparent;
}

.ppb-full-width-banner__split {
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: stretch;
	min-height: var(--ppb-pub-club-media-height, 46.875rem);
}

.ppb-full-width-banner__split--text-only {
	grid-template-columns: 1fr;
	min-height: 0;
}

.ppb-full-width-banner__panel {
	display: flex;
	flex-direction: column;
	justify-content: center;
	box-sizing: border-box;
	padding: clamp(1.5rem, 3vw, 2.75rem) clamp(1.5rem, 4vw, 3rem);
	min-height: 0;
}

/*
 * Right column: fill full cell height (match left panel), edge-to-edge crop like the design.
 * Absolute img avoids inline width/height constraining the layout.
 */
.ppb-full-width-banner--pub-club .ppb-full-width-banner__media {
	position: relative;
	align-self: stretch;
	min-height: 0;
	overflow: hidden;
	background: #000;
}

.ppb-full-width-banner--pub-club .ppb-full-width-banner__media-img {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.ppb-full-width-banner--pub-club .ppb-full-width-banner__content {
	max-width: none;
	text-align: left;
	align-items: stretch;
}

.ppb-full-width-banner--pub-club .ppb-full-width-banner__eyebrow {
	color: var(--color-primary, var(--ppb-fwb-eyebrow-accent, #917145));
}

.ppb-full-width-banner--pub-club .ppb-full-width-banner__title {
	margin: 0;
	font-family: var(--font-display, inherit);
	font-size: var(--ppb-text-4xl, 2.5rem);
	font-weight: var(--ppb-font-weight-display-strong, var(--ppb-font-weight-bold, 700));
	line-height: var(--ppb-leading-tight, 1.3);
	color: var(--ppb-color-text, #1a1a1a);
}

.ppb-full-width-banner--pub-club .ppb-full-width-banner__text {
	max-width: none;
	margin-inline: 0;
	color: var(--ppb-color-text, #1a1a1a);
}

/* Circle stroke, SVG mask fill, and text icons — same as Venue branding → Primary colour (ACF) */
.ppb-full-width-banner--pub-club {
	--ppb-pub-club-accent: var(--color-primary, var(--ppb-fwb-eyebrow-accent, #917145));
	/* Promo row copy + icons only (~2/3). Do not use for eyebrow, title, CTA — see .cursor/rules/portobello.mdc */
	--ppb-pub-club-promo-scale: 0.6666667;
}

.ppb-full-width-banner--pub-club .ppb-full-width-banner__promo-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
}

.ppb-full-width-banner--pub-club .ppb-full-width-banner__promo-item {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 1rem;
}

.ppb-full-width-banner--pub-club .ppb-full-width-banner__promo-item--no-icon {
	display: block;
}

.ppb-full-width-banner--pub-club .ppb-full-width-banner__promo-icon {
	flex-shrink: 0;
	width: calc(3.25rem * var(--ppb-pub-club-promo-scale, 0.6666667));
	height: calc(3.25rem * var(--ppb-pub-club-promo-scale, 0.6666667));
	border-radius: 50%;
	border: 1px solid var(--ppb-pub-club-accent);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
}

.ppb-full-width-banner--pub-club .ppb-full-width-banner__promo-icon-mono {
	display: block;
	width: 65%;
	height: 65%;
	max-width: calc(2.125rem * var(--ppb-pub-club-promo-scale, 0.6666667));
	max-height: calc(2.125rem * var(--ppb-pub-club-promo-scale, 0.6666667));
	flex-shrink: 0;
	background-color: var(--ppb-pub-club-accent);
	-webkit-mask-image: var(--ppb-promo-icon-mask);
	mask-image: var(--ppb-promo-icon-mask);
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
}

.ppb-full-width-banner--pub-club .ppb-full-width-banner__promo-icon--image {
	padding: calc(0.35rem * var(--ppb-pub-club-promo-scale, 0.6666667));
}

.ppb-full-width-banner--pub-club .ppb-full-width-banner__promo-icon-img {
	display: block;
	width: auto;
	height: auto;
	max-width: 65%;
	max-height: 65%;
	margin: 0 auto;
	object-fit: contain;
}

/* Lucide SVG from shared library — same footprint as mono mask / raster icon */
.ppb-full-width-banner--pub-club .ppb-full-width-banner__promo-icon-lucide {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 65%;
	height: 65%;
	max-width: calc(2.125rem * var(--ppb-pub-club-promo-scale, 0.6666667));
	max-height: calc(2.125rem * var(--ppb-pub-club-promo-scale, 0.6666667));
	flex-shrink: 0;
	color: var(--ppb-pub-club-accent);
}

.ppb-full-width-banner--pub-club .ppb-full-width-banner__promo-icon-lucide svg {
	display: block;
	width: 100%;
	height: 100%;
	stroke: currentColor;
	fill: none;
}

.ppb-full-width-banner--pub-club .ppb-full-width-banner__promo-line {
	flex: 1;
	min-width: 0;
	font-family: var(--font-body, inherit);
	font-size: calc(var(--ppb-text-2xl, 1.625rem) * var(--ppb-pub-club-promo-scale, 0.6666667));
	line-height: var(--ppb-leading-normal, 1.5);
	color: var(--ppb-color-text, #1a1a1a);
}

.ppb-full-width-banner--pub-club .ppb-full-width-banner__promo-line p {
	margin: 0;
}

@media (max-width: 48rem) {
	.ppb-full-width-banner__split {
		grid-template-columns: 1fr;
		min-height: 0;
	}

	.ppb-full-width-banner--pub-club .ppb-full-width-banner__media {
		order: -1;
		/* Stack layout: image band above copy — half the desktop column height to reduce scroll on small screens */
		height: calc(var(--ppb-pub-club-media-height, 46.875rem) * 0.5);
		min-height: calc(var(--ppb-pub-club-media-height, 46.875rem) * 0.5);
	}

	.ppb-full-width-banner--pub-club .ppb-full-width-banner__media-img {
		position: absolute;
		inset: 0;
	}
}
