/**
 * Mobile drawer parity — when JS swaps light → site-header--drawer-home,
 * keep dual-logo markup rendering like the home white logo.
 */

@media (max-width: 899px) {
	.site-header-sticky.is-menu-open .site-header.site-header--drawer-home {
		position: relative;
		z-index: 1002;
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
		justify-content: space-between !important;
		grid-template-columns: none !important;
		width: 100% !important;
		max-width: none !important;
		min-height: 0 !important;
		height: auto !important;
		margin: 0 !important;
		padding-top: max(0.85rem, env(safe-area-inset-top, 0px)) !important;
		padding-bottom: 0.85rem !important;
		padding-left: max(env(safe-area-inset-left, 0px), var(--site-mobile-gutter, 16px)) !important;
		padding-right: max(env(safe-area-inset-right, 0px), var(--site-mobile-gutter, 16px)) !important;
		gap: clamp(0.75rem, 3vw, 1.25rem) !important;
		border-radius: 0 !important;
		border: 0 !important;
		background: linear-gradient(
			180deg,
			rgb(var(--rwl-sticky-pill-glass, 99 120 126) / 0.92) 0%,
			rgb(var(--rwl-sticky-pill-glass, 99 120 126) / 0.78) 100%
		) !important;
		box-shadow: none !important;
		backdrop-filter: none !important;
		-webkit-backdrop-filter: none !important;
	}

	.site-header-sticky.is-menu-open .site-header--drawer-home .site-header__brand {
		display: flex !important;
		align-items: center !important;
		position: relative !important;
		line-height: 0 !important;
		z-index: 1002 !important;
	}

	.site-header-sticky.is-menu-open .site-header--drawer-home .site-header__brand img.site-header__brand-logo--hero {
		position: absolute !important;
		left: 0 !important;
		top: 50% !important;
		transform: translateY(-50%) !important;
		opacity: 0 !important;
		pointer-events: none !important;
		width: auto !important;
		height: clamp(62px, 19vw, 88px) !important;
		max-width: min(280px, 70vw) !important;
	}

	.site-header-sticky.is-menu-open .site-header--drawer-home .site-header__brand img.site-header__brand-logo--sticky {
		position: relative !important;
		left: auto !important;
		top: auto !important;
		transform: none !important;
		opacity: 1 !important;
		pointer-events: auto !important;
		display: block !important;
		width: auto !important;
		height: clamp(62px, 19vw, 88px) !important;
		max-width: min(280px, 70vw) !important;
	}

	.site-header-sticky.is-menu-open .site-header--drawer-home .site-header__tools {
		display: flex !important;
		align-items: center !important;
		z-index: 1002 !important;
	}

	.site-header-sticky.is-menu-open .site-header--drawer-home .site-header__menu-btn {
		display: inline-flex !important;
		border-color: rgb(255 255 255 / 0.32) !important;
		background: rgb(255 255 255 / 0.11) !important;
		box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.2) !important;
		color: #fff !important;
	}

	.site-header-sticky.is-menu-open .site-header__menu-icon-burger {
		opacity: 0 !important;
	}

	.site-header-sticky.is-menu-open .site-header__menu-icon-close {
		opacity: 1 !important;
	}

	/*
	  Exact home drawer surface — must beat page CSS that zeros light-nav backgrounds.
	  Same stops as site-nav-sticky.css open drawer.
	*/
	.site-header-sticky.is-menu-open .site-header__nav,
	.ds2-page .site-header-sticky.is-menu-open .site-header__nav,
	.ds2-page .site-header-sticky.is-menu-open .site-header .site-header__nav {
		display: flex !important;
		position: fixed !important;
		inset: 0 !important;
		z-index: 1001 !important;
		flex-direction: column !important;
		align-items: stretch !important;
		justify-content: flex-start !important;
		text-align: left !important;
		gap: 0 !important;
		width: 100% !important;
		max-width: none !important;
		margin: 0 !important;
		padding-top: calc(4.85rem + env(safe-area-inset-top, 0px)) !important;
		padding-right: max(env(safe-area-inset-right, 0px), var(--site-mobile-gutter, 16px)) !important;
		padding-bottom: max(1.25rem, env(safe-area-inset-bottom, 0px)) !important;
		padding-left: max(env(safe-area-inset-left, 0px), var(--site-mobile-gutter, 16px)) !important;
		overflow-x: hidden !important;
		overflow-y: auto !important;
		background-color: #161a1f !important;
		background-image:
			radial-gradient(ellipse 90% 55% at 100% 0%, rgb(0 115 255 / 0.12), transparent 52%),
			radial-gradient(ellipse 70% 45% at 0% 100%, rgb(5 200 50 / 0.08), transparent 50%),
			linear-gradient(188deg, rgb(34 40 48) 0%, rgb(22 26 31) 45%, rgb(14 17 21) 100%) !important;
		box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.06) !important;
		backdrop-filter: none !important;
		-webkit-backdrop-filter: none !important;
		opacity: 1 !important;
	}

	.site-header-sticky.is-menu-open .site-header__nav .nav-dropdown__trigger,
	.site-header-sticky.is-menu-open .site-header__nav > .nav-link-plain,
	.ds2-page .site-header-sticky.is-menu-open .site-header__nav .nav-dropdown__trigger,
	.ds2-page .site-header-sticky.is-menu-open .site-header__nav > .nav-link-plain {
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		text-align: left !important;
		width: 100% !important;
		color: #f8fafc !important;
	}

	.site-header-sticky.is-menu-open .site-header__nav-utilities,
	.ds2-page .site-header-sticky.is-menu-open .site-header__nav-utilities {
		display: flex !important;
		visibility: visible !important;
		opacity: 1 !important;
	}
}
