/*
 * Sacraw quick-return header — mobile/tablet only (<=1024px).
 * 1) Removes backdrop-filter from the FIXED .glass-header: on iOS Safari that property
 *    defeats position:fixed, which is why the header was scrolling away.
 *    NOTE: the theme sets backdrop-filter with an !important inside @layer components,
 *    and a layered !important beats an unlayered one — so this removal MUST also live
 *    in @layer components to win the cascade.
 * 2) Adds hide-on-scroll-down / reveal-on-scroll-up (.qr-hidden, toggled by JS).
 * 3) Pins to top:0 once scrolled (body.qr-scrolled) so the home advisory ribbon's
 *    vacated space doesn't leave a gap.
 * Desktop (>1024px) keeps the original glass header untouched.
 */
@media (max-width: 1024px) {
	@layer components {
		/* Kill backdrop-filter (iOS fixed-positioning bug source); keep a near-opaque
		   brand-cream surface so page content doesn't bleed through without the blur. */
		#site-header.glass-header,
		#site-header.glass-header.scrolled {
			-webkit-backdrop-filter: none !important;
			backdrop-filter: none !important;
			background-color: rgba(247, 245, 241, 0.98) !important;
		}
		/* Preserve the homepage hero's transparent state at the very top. */
		#site-header.glass-header.glass-header--transparent {
			-webkit-backdrop-filter: none !important;
			backdrop-filter: none !important;
			background-color: transparent !important;
		}
	}

	/* transform / top / transition aren't set with a layered !important by the theme,
	   so plain (specificity-winning) rules are enough here. */
	#site-header.glass-header {
		transition: transform .25s ease, background-color .3s ease, box-shadow .3s ease !important;
	}
	#site-header.glass-header:not(.glass-header--transparent) {
		box-shadow: 0 1px 3px rgba(0, 0, 0, .10);
	}
	body.qr-scrolled #site-header.glass-header {
		top: 0 !important;
	}
	#site-header.glass-header.qr-hidden {
		transform: translateY(-115%) !important;
	}
}

@media (max-width: 1024px) and (prefers-reduced-motion: reduce) {
	#site-header.glass-header {
		transition: none !important;
	}
	#site-header.glass-header.qr-hidden {
		transform: none !important;
	}
}