/* Esselith Core — page openers (0.35.0). Four ways a listing page opens; all
   read the suite tokens (spacing, widths, corners, label style). The accent
   word (<em>) is orange only on dark (large display text clears contrast
   there); on the light openers it is teal — orange text on cream fails. */
.es-opener {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	padding: var(--es-space-opener, clamp(4.5rem, 9vw, 7.5rem)) max(24px, env(safe-area-inset-left, 0px));
	font-family: var(--es-font-body, 'Montserrat', system-ui, sans-serif);
}
.es-opener-inner {
	max-width: var(--es-width-wide, 1200px);
	margin: 0 auto;
}
.es-opener-eyebrow {
	margin: 0 0 14px;
	font-size: var(--es-eyebrow, 0.8125rem);
	font-weight: var(--es-eyebrow-weight, 700);
	letter-spacing: var(--es-eyebrow-tracking, 0.14em);
	text-transform: uppercase;
	color: var(--es-brand-secondary, #004F71);
}
.es-opener-title {
	margin: 0;
	font-family: var(--es-font-display, 'Playfair Display', Georgia, serif);
	font-weight: 400;
	font-size: var(--es-h1-hero, clamp(2.5rem, 2.11rem + 1.66vw, 3.875rem));
	line-height: 1.05;
	letter-spacing: 0;
	text-wrap: balance;
	color: var(--es-ink, #071120);
}
.es-opener-title em { font-style: italic; color: var(--es-brand-secondary, #004F71); }
.es-opener-intro {
	margin: 18px 0 0;
	max-width: 52ch;
	font-size: var(--es-lead, 1.3125rem);
	line-height: 1.55;
	color: var(--es-text, #2E3D48);
}

/* Light openers sit on the page colour. */
.es-opener--photo,
.es-opener--quiet { background: var(--es-page-bg, #F7F3EC); }

/* Photo beside the title */
.es-opener--photo .es-opener-inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(28px, 5vw, 72px);
	align-items: center;
}
.es-opener-photo { min-width: 0; }
.es-opener-photo .es-opener-img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--es-radius-feature, 24px);
}

/* Quiet title — words only, closed by a fine rule */
.es-opener--quiet .es-opener-inner {
	padding-bottom: clamp(28px, 4vw, 44px);
	border-bottom: 1px solid var(--es-subtle-bg, #D5D3CF);
}
.es-opener--quiet .es-opener-words { max-width: var(--es-width-text, 720px); }

/* Full photo — the title over the photo, bottom-left, on a scrim */
.es-opener--full {
	min-height: clamp(340px, 48vw, 560px);
	display: flex;
	align-items: flex-end;
	color: var(--es-text-on-dark, #E8ECF5);
}
.es-opener--full .es-opener-inner { width: 100%; }
.es-opener--full > .es-opener-img {
	position: absolute;
	inset: 0;
	z-index: -2;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.es-opener-scrim {
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(180deg, rgba(7, 17, 32, 0.25) 0%, rgba(7, 17, 32, 0.45) 45%, rgba(7, 17, 32, 0.82) 100%);
}
.es-opener--full .es-opener-words { max-width: var(--es-width-text, 720px); }

/* Centered on a dark band */
.es-opener--centered {
	background: linear-gradient(165deg, var(--es-deep-a, #064058), var(--es-deep-b, #04293A));
	color: var(--es-text-on-dark, #E8ECF5);
	text-align: center;
}
.es-opener--centered .es-opener-words { max-width: var(--es-width-text, 720px); margin: 0 auto; }
.es-opener--centered .es-opener-intro { margin-left: auto; margin-right: auto; }

/* On dark: white words, the one orange accent word */
.es-opener--full .es-opener-eyebrow,
.es-opener--centered .es-opener-eyebrow { color: var(--es-text-on-dark, #E8ECF5); }
.es-opener--full .es-opener-title,
.es-opener--centered .es-opener-title { color: #FFFFFF; }
.es-opener--full .es-opener-title em,
.es-opener--centered .es-opener-title em { color: var(--es-brand-primary, #ED8B00); }
.es-opener--full .es-opener-intro,
.es-opener--centered .es-opener-intro { color: var(--es-text-on-dark, #E8ECF5); }

@media (max-width: 782px) {
	.es-opener--photo .es-opener-inner { grid-template-columns: minmax(0, 1fr); }
	.es-opener-intro { font-size: 1.0625rem; }
}