// ============================================================
// Z-index — source of truth
// ------------------------------------------------------------
// Named layers. Never invent a one-off z-index in a block:
// add a token here, then use var(--z-…).
// Higher = closer to the user.
//
// Page (root stacking) — never drop --z-site-main to auto:
// that reveals the underlay menu.
//   1     --z-underlay-menu          menu panel, behind the page
//   2     --z-site-main              [data-main] covers the menu
//   100   --z-underlay-nav-overlay   dim layer while the menu is open
//   100   --z-page-transition        Barba overlapping-parallax overlay (CSS default)
//   300   --z-underlay-header        fixed logo + Menu
//   1000  --z-showreel-overlay       pop-in dim (element itself)
//   1001  --z-showreel-player        pop-in video, above the dim
//   1050  --z-modal                  Osmo basic modal group
//   1100  --z-cta-draft              fixed Draft button
//
// Overlay + player stay inside .site-main (keep at 2 or the menu shows).
// When open, banner __inner goes to z-index: auto so the player (1001)
// can sit above the lightbox (1000). Do not raise .site-main.
//
// Banner (inside .block-video-banner)
//   0     --z-banner-bg
//   1     --z-banner-media-overlay
//   2     --z-banner-content
//
// Showreel local (inside the lightbox / card, not vs. the page)
//   0     --z-showreel-cover
//   1     --z-showreel-dark / --z-showreel-media / --z-showreel-bunny
//   2     --z-showreel-click / --z-showreel-play
// ============================================================

:root {
	// Page / underlay nav
	--z-underlay-menu: 1;
	--z-site-main: 2;
	--z-underlay-nav-overlay: 100;
	--z-page-transition: 100;
	--z-underlay-header: 300;

	// Video banner (inside a section)
	--z-banner-bg: 0;
	--z-banner-media-overlay: 1;
	--z-banner-content: 2;

	// Mini Showreel pop-in (position:fixed, above the header)
	--z-showreel-overlay: 1000;
	--z-showreel-player: 1001;
	--z-modal: 1050;
	--z-cta-draft: 1100;

	// Mini Showreel local stacking
	--z-showreel-cover: 0;
	--z-showreel-dark: 1;
	--z-showreel-media: 1;
	--z-showreel-bunny: 1;
	--z-showreel-click: 2;
	--z-showreel-play: 2;

	// Dev
	--z-grid-overlay: 9999;
}
