/** Story opening surfaces and shared hero retreat. Masthead: global-masthead.css. */

body.wiscohana-blocksy-shell.wiscohana-shell--photographic {
	--wiscohana-story-opening-surface: var(
		--wiscohana-parity-reading-surface,
		var(--wiscohana-color-paper, #f8f5ee)
	);
}

body.wiscohana-blocksy-shell.wiscohana-shell--photographic
	#main > [class*="ct-container"][data-vertical-spacing*="top"] {
	padding-top: 0 !important;
}

/* The light reading surface enters in normal flow above the photographic shell. */
body.wiscohana-blocksy-shell.wiscohana-shell--photographic
	.wiscohana-story > :is(
		.wiscohana-story-introduction--immersive,
		.wiscohana-story-introduction--overlay,
		.wiscohana-feature-opening,
		.wiscohana-immersive-introduction
	) {
	position: relative;
	z-index: 0;
}

body.wiscohana-blocksy-shell.wiscohana-shell--photographic
	.wiscohana-story > :is(
		.wiscohana-story-introduction--immersive,
		.wiscohana-story-introduction--overlay,
		.wiscohana-feature-opening,
		.wiscohana-immersive-introduction
	) ~ .wiscohana-feature-section {
	position: relative;
	z-index: 1;
	background: var(--wiscohana-story-opening-surface);
	box-shadow: 0 0 0 100vmax var(--wiscohana-story-opening-surface);
	/* Extend the reading surface sideways, never over following content. */
	clip-path: inset(0 -100vmax);
}

body.wiscohana-blocksy-shell.wiscohana-shell--photographic
	.wiscohana-story :is(
		.wiscohana-story-introduction--immersive,
		.wiscohana-story-introduction--overlay,
		.wiscohana-feature-opening,
		.wiscohana-immersive-introduction
	) .wp-block-cover {
	overflow: hidden;
}

/* Stories retain their independent Enhanced Immersion opt-in. Home explicitly
 * reuses this same timeline, range, keyframes and reduced-motion fallback. */
body.wiscohana-blocksy-shell.wiscohana-shell--photographic.wiscohana-enhanced-immersion
	.wiscohana-story > :is(
		.wiscohana-story-introduction--immersive,
		.wiscohana-story-introduction--overlay,
		.wiscohana-feature-opening,
		.wiscohana-immersive-introduction
	),
.wiscohana-home[data-hero-mode="static"] .wiscohana-home-hero:not(.wiscohana-home-hero--text) {
	view-timeline-name: --wiscohana-story-opening;
	view-timeline-axis: block;
}

/* CSS-only progressive enhancement: the image gives up distance more slowly
 * while its container and the reading surface retain ordinary page scrolling. */
@supports (animation-timeline: view()) {
	body.wiscohana-blocksy-shell.wiscohana-shell--photographic.wiscohana-enhanced-immersion
		.wiscohana-story :is(
			.wiscohana-story-introduction--immersive,
			.wiscohana-story-introduction--overlay,
			.wiscohana-feature-opening,
			.wiscohana-immersive-introduction
		 ) .wp-block-cover__image-background,
	.wiscohana-home[data-hero-mode="static"] .wiscohana-home-hero__media img {
		animation: wiscohana-story-hero-retreat linear both;
		animation-timeline: --wiscohana-story-opening;
		animation-range: exit 0% exit 100%;
		transform-origin: 50% 50%;
	}
}

/* Home begins at the approved crop. Its top-of-page clipped image needs no
 * extra enlargement: the translated upper edge remains above the viewport. */
.wiscohana-home[data-hero-mode="static"] .wiscohana-home-hero { --wiscohana-hero-retreat-scale:1; }

@keyframes wiscohana-story-hero-retreat {
	from { transform: translate3d(0, 0, 0) scale(var(--wiscohana-hero-retreat-scale, 1.035)); }
	to { transform: translate3d(0, 42%, 0) scale(var(--wiscohana-hero-retreat-scale, 1.035)); }
}

@media (max-width: 48.875rem) {
	body.wiscohana-blocksy-shell.wiscohana-shell--photographic
		.wiscohana-story .wp-block-cover:is(
			.is-style-wiscohana-story-opening,
			.wiscohana-immersive-introduction
		) {
		height: auto;
		min-height: min(46rem, 88svh);
		padding-block: 0;
	}
}

@media (max-height: 31rem) and (orientation: landscape) {
		body.wiscohana-blocksy-shell.wiscohana-shell--photographic
		.wiscohana-story .wp-block-cover:is(
			.is-style-wiscohana-story-opening,
			.wiscohana-immersive-introduction
		) {
		height: auto;
		min-height: max(22rem, 100svh);
		padding-block: 0;
	}
}

/* Narrows' approved opening is the shared style, not a post-specific geometry.
 * Explicit framing maps older native openings onto this same style at render.
 * A minimum, rather than a fixed height, leaves enlarged title/deck text available. */
body.wiscohana-shell--photographic .wiscohana-story .wp-block-cover.is-style-wiscohana-story-opening {
	--wiscohana-opening-height: max(88svh, calc(100svh - 3.75rem));
	--wiscohana-opening-title-size: clamp(4.5rem, 5.56vw, 5rem);
	--wiscohana-opening-title-leading: 1.1;
	--wiscohana-opening-bottom: calc(1.125rem + max(0px, (var(--wiscohana-opening-height) - 88svh) / 2));
	height: auto;
	min-height: var(--wiscohana-opening-height) !important;
	padding: 0;
	align-items: stretch;
	font-size: clamp(1.125rem, 1.05rem + 0.24vw, 1.25rem);
}

body.wiscohana-shell--photographic .wiscohana-story .is-style-wiscohana-story-opening .wp-block-cover__image-background {
	object-position: 50% 52%;
}

body.wiscohana-shell--photographic .wiscohana-story .is-style-wiscohana-story-opening .wp-block-cover__background {
	background: linear-gradient(180deg, rgb(14 14 14 / 2%) 24%, rgb(14 14 14 / 18%) 56%, rgb(14 14 14 / 78%) 100%) !important;
}

body.wiscohana-shell--photographic .wiscohana-story .is-style-wiscohana-story-opening .wp-block-cover__inner-container {
	min-height: 0;
	align-items: flex-end;
}

body.wiscohana-shell--photographic .wiscohana-story .is-style-wiscohana-story-opening .wiscohana-opening-copy {
	width: min(calc(100% - 2 * (clamp(1.25rem, 3.3vw, 3rem) + 1em)), 72rem);
	margin-inline: auto;
	padding: max(7rem, 104px) 0 var(--wiscohana-opening-bottom);
	text-align: center;
}

.wiscohana-story .is-style-wiscohana-story-opening .wiscohana-feature-title {
	max-width: 18ch;
	margin: 0 auto;
	font-size: var(--wiscohana-opening-title-size);
	font-weight: 600;
	letter-spacing: -0.045em;
	line-height: var(--wiscohana-opening-title-leading);
	text-align: center;
}

body.wiscohana-shell--photographic .wiscohana-story .is-style-wiscohana-story-opening .wiscohana-opening-copy > p {
	max-width: 28ch;
	margin: clamp(1rem, 2vw, 1.5rem) auto 0;
	color: #fff;
	font-family: var(--wiscohana-font-display);
	font-size: clamp(1.75rem, 2.484vw, 2.235rem) !important;
	font-style: italic;
	font-weight: 500;
	letter-spacing: -0.02em !important;
	line-height: 1.18;
	text-align: center;
	text-transform: capitalize;
}

@media (max-width: 48.875rem) {
	body.wiscohana-shell--photographic .wiscohana-story .wp-block-cover.is-style-wiscohana-story-opening {
		--wiscohana-opening-height: 88svh;
		--wiscohana-opening-bottom: 1.125rem;
	}
}
@media (max-width: 48rem) {
	body.wiscohana-shell--photographic .wiscohana-story .wp-block-cover.is-style-wiscohana-story-opening {
		--wiscohana-opening-title-size: 3rem;
		--wiscohana-opening-title-leading: 1.08;
	}
}
@media (max-height: 31rem) and (orientation: landscape) {
	body.wiscohana-shell--photographic .wiscohana-story .wp-block-cover.is-style-wiscohana-story-opening {
		--wiscohana-opening-height: max(22rem, 100svh);
	}
}

/* Editorial framing stays within the existing Cover family. No-crop uses an
 * in-flow photograph and copy; Framed Crop retains the overlay and existing motion.
 * Narrow portrait has one optional override. Framed height joins Viewport Fill
 * continuously as width increases; the former composition-threshold switch is gone.
 * Minimum heights and rem floors preserve enlarged-text reflow. */
@media (width > 40rem), (orientation: landscape) {
	body.wiscohana-hero-framing--preserve-full .wiscohana-story .wp-block-cover:is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) {
	 display: block; height: auto; min-height: 0 !important; padding: 0;
	 overflow: visible; color: var(--wiscohana-ink); background: var(--wiscohana-story-opening-surface);
	}
	body.wiscohana-hero-framing--preserve-full .wiscohana-story :is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) .wp-block-cover__image-background {
	 position: relative; inset: auto; display: block; width: 100%; height: auto;
	 max-height: none; object-fit: contain; animation: none !important; transform: none !important;
	}
	body.wiscohana-hero-framing--preserve-full .wiscohana-story :is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) .wp-block-cover__background { display: none; }
	body.wiscohana-hero-framing--preserve-full .wiscohana-story :is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) .wiscohana-opening-copy {
	 width: min(calc(100% - 2 * clamp(1.25rem, 3.3vw, 3rem)), 72rem);
	 padding-block: clamp(2rem, 5vw, 4rem);
	}
	body.wiscohana-hero-framing--preserve-full .wiscohana-story :is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) :is(.wiscohana-feature-title, .wiscohana-opening-copy > p) { color: var(--wiscohana-ink); }
	body.wiscohana-hero-framing--framed-crop .wiscohana-story .wp-block-cover:is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) {
	 --wiscohana-opening-height: min(72svh, 66.667vw);
	 --wiscohana-opening-bottom: 1.125rem;
	 --wiscohana-opening-title-size: clamp(3rem, 5.56vw, 5rem);
	 height: auto; min-height: var(--wiscohana-opening-height) !important; padding: 0; align-items: stretch;
	}
	body.wiscohana-hero-framing--framed-crop .wiscohana-story :is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) .wp-block-cover__inner-container { min-height: 0; align-items: flex-end; }
	body.wiscohana-hero-framing--framed-crop .wiscohana-story :is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) .wiscohana-opening-copy {
	 width: min(calc(100% - 2 * clamp(1.25rem, 3.3vw, 3rem)), 72rem);
	 margin-inline: auto; padding: max(7rem, 104px) 0 var(--wiscohana-opening-bottom);
	}
	body.wiscohana-hero-framing--framed-crop .wiscohana-story :is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) .wiscohana-feature-title { font-size: var(--wiscohana-opening-title-size); }
}
@media (width <= 40rem) and (orientation: portrait) {
	body:is(.wiscohana-hero-framing-narrow--preserve-full, .wiscohana-hero-framing--preserve-full:not(.wiscohana-hero-framing-narrow--framed-crop)) .wiscohana-story .wp-block-cover:is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) {
	 display: block; height: auto; min-height: 0 !important; padding: 0;
	 overflow: visible; color: var(--wiscohana-ink); background: var(--wiscohana-story-opening-surface);
	}
	body:is(.wiscohana-hero-framing-narrow--preserve-full, .wiscohana-hero-framing--preserve-full:not(.wiscohana-hero-framing-narrow--framed-crop)) .wiscohana-story :is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) .wp-block-cover__image-background {
	 position: relative; inset: auto; display: block; width: 100%; height: auto;
	 max-height: none; object-fit: contain; animation: none !important; transform: none !important;
	}
	body:is(.wiscohana-hero-framing-narrow--preserve-full, .wiscohana-hero-framing--preserve-full:not(.wiscohana-hero-framing-narrow--framed-crop)) .wiscohana-story :is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) .wp-block-cover__background { display: none; }
	body:is(.wiscohana-hero-framing-narrow--preserve-full, .wiscohana-hero-framing--preserve-full:not(.wiscohana-hero-framing-narrow--framed-crop)) .wiscohana-story :is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) .wiscohana-opening-copy {
	 width: min(calc(100% - 2 * clamp(1.25rem, 3.3vw, 3rem)), 72rem);
	 padding-block: clamp(2rem, 5vw, 4rem);
	}
	body:is(.wiscohana-hero-framing-narrow--preserve-full, .wiscohana-hero-framing--preserve-full:not(.wiscohana-hero-framing-narrow--framed-crop)) .wiscohana-story :is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) :is(.wiscohana-feature-title, .wiscohana-opening-copy > p) { color: var(--wiscohana-ink); }
	body:is(.wiscohana-hero-framing-narrow--framed-crop, .wiscohana-hero-framing--framed-crop:not(.wiscohana-hero-framing-narrow--preserve-full)) .wiscohana-story .wp-block-cover:is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) {
	 --wiscohana-opening-height: min(88svh, 140.7vw);
	 --wiscohana-opening-bottom: 1.125rem;
	 --wiscohana-opening-title-size: clamp(2rem, 8.92vw, 3rem);
	 height: auto; min-height: var(--wiscohana-opening-height) !important; padding: 0; align-items: stretch;
	}
	body:is(.wiscohana-hero-framing-narrow--framed-crop, .wiscohana-hero-framing--framed-crop:not(.wiscohana-hero-framing-narrow--preserve-full)) .wiscohana-story :is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) .wp-block-cover__inner-container { min-height: 0; align-items: flex-end; }
	body:is(.wiscohana-hero-framing-narrow--framed-crop, .wiscohana-hero-framing--framed-crop:not(.wiscohana-hero-framing-narrow--preserve-full)) .wiscohana-story :is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) .wiscohana-opening-copy {
	 width: min(calc(100% - 2 * clamp(1.25rem, 3.3vw, 3rem)), 72rem);
	 margin-inline: auto; padding: max(7rem, 104px) 0 var(--wiscohana-opening-bottom);
	}
	body:is(.wiscohana-hero-framing-narrow--framed-crop, .wiscohana-hero-framing--framed-crop:not(.wiscohana-hero-framing-narrow--preserve-full)) .wiscohana-story :is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) .wiscohana-feature-title { font-size: var(--wiscohana-opening-title-size); }
	body:is(.wiscohana-hero-framing-narrow--framed-crop, .wiscohana-hero-framing--framed-crop:not(.wiscohana-hero-framing-narrow--preserve-full)) .wiscohana-story :is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) .wiscohana-opening-copy > p { font-size: clamp(1.125rem, 5.205vw, 1.75rem) !important; }
}

@media (prefers-reduced-motion: reduce) {
	body.wiscohana-blocksy-shell.wiscohana-shell--photographic.wiscohana-enhanced-immersion
		.wiscohana-story > :is(
			.wiscohana-story-introduction--immersive,
			.wiscohana-story-introduction--overlay,
			.wiscohana-feature-opening,
			.wiscohana-immersive-introduction
		),
	.wiscohana-home[data-hero-mode="static"] .wiscohana-home-hero:not(.wiscohana-home-hero--text) {
		view-timeline-name: none;
	}

	body.wiscohana-blocksy-shell.wiscohana-shell--photographic.wiscohana-enhanced-immersion
		.wiscohana-story :is(
			.wiscohana-story-introduction--immersive,
			.wiscohana-story-introduction--overlay,
			.wiscohana-feature-opening,
			.wiscohana-immersive-introduction
		 ) .wp-block-cover__image-background,
	.wiscohana-home[data-hero-mode="static"] .wiscohana-home-hero__media img {
		animation: none;
		transform: none;
		will-change: auto;
	}

}

/* E10 launch default: fixed mobile typography across standard Immersive heroes.
 * Reuse the existing narrow-screen boundary and title tokens. Geometry, framing,
 * focal position and the tablet/desktop typography remain independently owned.
 */
@media (max-width: 40rem) {
	body.wiscohana-blocksy-shell.wiscohana-shell--photographic .wiscohana-story .wp-block-cover:is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) {
		--wiscohana-opening-title-size: 32px;
		--wiscohana-opening-title-leading: 1.08;
	}
	.wiscohana-story :where(.wp-block-cover:is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction)) .wiscohana-feature-title {
		font-size: var(--wiscohana-opening-title-size);
		line-height: var(--wiscohana-opening-title-leading);
		word-break: normal;
		overflow-wrap: normal;
		hyphens: none;
	}
	body.wiscohana-blocksy-shell.wiscohana-shell--photographic .wiscohana-story .wp-block-cover:is(.is-style-wiscohana-story-opening, .wiscohana-immersive-introduction) .wiscohana-opening-copy > p {
		font-size: 18px !important;
		line-height: 1.18;
		word-break: normal;
		overflow-wrap: normal;
		hyphens: none;
	}
}
