/* ==========================================================================
   The colour-world entry page (19 Oct 2026; docs/prototypes/entry-b-colour-world.html).
   Markup is added by inc/landing-poster.php around the landing's hero block. The ground is the
   section's own colour (--bnjc-section), the type on it is the section ink, so changing a
   Section's colour in the admin recolours the whole entry page. Loaded after components.css and
   area-landings.css, so the selectors below name the wrapper to win without more !important
   than the earlier files already force.
   ========================================================================== */

.bnjc-poster-wrap {
	--bnjc-gutter: max(var(--wp--style--root--padding-left, 24px), calc((100% - var(--wp--style--global--wide-size, 1344px)) / 2));
	--bnjc-poster-fs: clamp(40px, calc(150vw / var(--n, 5)), 520px);
	position: relative;
	margin-block: 0;
	overflow: clip;
	background: var(--bnjc-section, var(--wp--preset--color--navy));
	color: var(--bnjc-section-ink, var(--wp--preset--color--navy));
}

/* ---- The name, huge ---------------------------------------------------------------- */
.bnjc-poster {
	position: relative;
	z-index: 1;
	/* The foot is room for the descenders (the y of "Stay"). The hero starts below this padding and
	   never covers the name: visitors found the cut-off wording hard to read (feedback, 26 Oct 2026). */
	padding: clamp(16px, 2.4vw, 32px) var(--bnjc-gutter) calc(var(--bnjc-poster-fs) * 0.14);
}

.bnjc-poster span {
	display: block;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: var(--bnjc-poster-fs);
	line-height: 0.9;
	letter-spacing: -0.045em;
	margin-inline-start: -0.04em;
	white-space: nowrap;
	user-select: none;
}

/* ---- The hero, directly under it ---------------------------------------------------- */
.bnjc-poster-wrap .wp-block-cover.alignfull.bnjc-section-hero {
	display: grid !important;
	grid-template-columns: minmax(0, 5fr) minmax(0, 3fr);
	gap: 20px;
	align-items: end;
	position: relative;
	z-index: 2;
	min-block-size: 0 !important;
	margin-block: 0;
	padding: 0 var(--bnjc-gutter) !important;
	background: transparent;
	overflow: visible;
}

.bnjc-poster-wrap .bnjc-section-hero .wp-block-cover__background {
	display: none;
}

.bnjc-poster-wrap .bnjc-section-hero .wp-block-cover__image-background {
	position: relative;
	inset: auto;
	inline-size: 100%;
	block-size: auto;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	border-radius: var(--radius-xs, 2px);
}

.bnjc-poster-wrap .bnjc-section-hero .wp-block-cover__inner-container {
	box-sizing: border-box;
	inline-size: 100%;
	padding: clamp(22px, 2.6vw, 38px);
	background: var(--wp--preset--color--cream);
	color: var(--wp--preset--color--navy);
	border-radius: var(--radius-xs, 2px);
}

.bnjc-poster-wrap .bnjc-section-hero:not(:has(.wp-block-cover__image-background)) .wp-block-cover__inner-container {
	grid-column: 1 / -1;
}

.bnjc-poster-wrap .bnjc-section-hero .wp-block-cover__inner-container :is(h1, p) {
	color: var(--wp--preset--color--navy) !important;
}

.bnjc-poster-wrap .bnjc-section-hero .wp-block-cover__inner-container h1 {
	font-size: var(--wp--preset--font-size--display-s) !important;
	line-height: 1.04;
}

.bnjc-poster-wrap .bnjc-section-hero .wp-block-cover__inner-container .bnjc-overline {
	margin-block-end: 14px;
}

/* On-dark buttons were made for a photograph; on the cream card they become the outline pill. */
.bnjc-poster-wrap .bnjc-section-hero .is-style-on-dark .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--navy);
	border: 2px solid var(--wp--preset--color--navy);
}

/* On a phone the whole word has to fit between the gutters, however long the page title is
   ("Stay With Us" is twelve letters). The display face runs about 0.44em a letter, so the size
   is the free width divided by that; a short word stops at 200px. Welcome sets its own size
   (area-welcome.css). */
@media (max-width: 599px) {
	.bnjc-poster-wrap {
		--bnjc-poster-fs: clamp(40px, calc((100vw - 56px) / (0.44 * var(--n, 5))), 200px);
	}
}

/* ---- Stay: the booking hero keeps its photograph, under the name ---- */
.bnjc-poster-wrap .wp-block-cover.bnjc-stay-hero {
	margin-block: 0;
}

@media (max-width: 899px) {
	.bnjc-poster-wrap .wp-block-cover.alignfull.bnjc-section-hero {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ---- Facts band and menus: plain information (art direction, 20 Oct) ------------------- */
/* Hours and contact details are information, not a feature, so the band keeps the calm
   cream-deep strip from components.css. Links in it read as links. */
.bnjc-poster-wrap + .bnjc-hours-band {
	margin-block-start: 0;
}

.bnjc-hours-band .bnjc-hours a {
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 2px;
}

/* YOFI's menus: a plain ruled list of choices. Numbers are for sequences. */
.bnjc-menu-cards {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 0;
	border-block-start: 2px solid var(--wp--preset--color--navy);
}

.bnjc-menu-cards li {
	border-block-end: 1px solid color-mix(in srgb, var(--wp--preset--color--navy) 25%, transparent);
}

.bnjc-menu-cards .bnjc-menu-card {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: baseline;
	column-gap: clamp(16px, 3vw, 40px);
	padding: clamp(16px, 2vw, 26px) 0;
	background: transparent;
	border: 0;
	box-shadow: none;
	transition: background 0.2s, padding 0.2s;
}

.bnjc-menu-cards .bnjc-menu-card:hover {
	background: color-mix(in srgb, var(--wp--preset--color--gold) 35%, transparent);
	padding-inline: 14px;
}

.bnjc-menu-cards .bnjc-menu-card__name {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: clamp(var(--wp--preset--font-size--heading-m), 3vw, var(--wp--preset--font-size--display-s));
	letter-spacing: -0.01em;
}

.bnjc-menu-cards .bnjc-menu-card__note {
	text-align: end;
}

.bnjc-menu-cards .bnjc-menu-card__go {
	grid-column: 1 / -1;
}

/* ---- Band headings: back in the display face, larger ----------------------------------- */
:is(.bnjc-section-intro, .bnjc-shabbat-yofi, .bnjc-deli-band, .bnjc-catering-band, .bnjc-closing-band, .bnjc-menu-cards-band, .bnjc-order-band, .bnjc-plans-band, .bnjc-tour-band, .bnjc-doors-band, .bnjc-book-band, .bnjc-apply-band, .bnjc-stay-groups, .bnjc-faq) h2.wp-block-heading {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	letter-spacing: -0.01em;
	line-height: 1.04;
	font-size: clamp(var(--wp--preset--font-size--heading-l), 4.2vw, var(--wp--preset--font-size--display-m)) !important;
}

/* ---- The doors: display names ---------------------------------------------------------- */
.bnjc-door__name,
.bnjc-door:not(.is-primary) .bnjc-door__name {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: clamp(var(--wp--preset--font-size--heading-m), 2.2vw, var(--wp--preset--font-size--display-xs));
	letter-spacing: -0.01em;
}

/* The photo-legibility fade belongs to the old full-bleed hero; the headline now sits on its own card. */
.bnjc-poster-wrap .bnjc-section-hero .wp-block-cover__inner-container::before {
	display: none;
}