/* mU Greens — hero scroll scrub
 * The poster is the LCP element and is visible until the video can draw the
 * same first frame. Both fill the same box, so nothing shifts on the swap. */
.hero__scrub {
	position: relative;
	overflow: hidden;
	border-radius: var(--radius-lg, 12px);
	/* Exactly the hero's own ground (--surface-soil). The clip is rendered on this, so
	   its backdrop is the page colour and nothing else. */
	background: var(--surface-soil, #181810);
}
.hero__scrub-poster,
.hero__scrub-video {
	display: block;
	inline-size: 100%;
	block-size: auto;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	/* The footage's near-black is a touch browner than the hero (edge pixels measure
	   about 25,22,14 against the hero's 24,24,16) and drifts frame to frame, so a
	   box shows around it. `lighten` keeps the brighter of footage and backdrop per
	   channel: every pixel at or below the hero colour becomes exactly the hero
	   colour, and the tray, leaves and highlights are untouched. It works on the
	   poster and the video, so it also covers any MP4 colour-range shift. */
	mix-blend-mode: lighten;
}
.hero__scrub-video {
	position: absolute;
	inset: 0;
	block-size: 100%;
	opacity: 0;
	pointer-events: none;
}
.hero__scrub.is-scrubbing .hero__scrub-video {
	opacity: 1;
}
.hero__scrub.is-scrubbing .hero__scrub-poster {
	visibility: hidden;
}
@media ( prefers-reduced-motion: reduce ) {
	.hero__scrub-video { display: none; }
	.hero__scrub.is-scrubbing .hero__scrub-poster { visibility: visible; }
}

/* Mobile: the hero ran to 1.12 screens, so the button was never visible with the
   headline. Cap the clip's height and letterbox it rather than crop — the clip's
   own background matches the hero, so the letterbox is invisible, and the
   separated layers are never clipped. */
/* Both tiers are cropped to 720x960 (3:4), rows 160-1120 of the source, so the tray base is in and
   the canopy is not cut off at the top of the frame at the end of the scrub. The container's ratio matches the files exactly, so there
   is no letterbox to hide and nothing is cropped by object-fit. */
