/* --------------------------------------------------------------------------
 * GRZ Gaming — immersive adaptive product page (v1.8.2)
 *
 * Product pages alone receive the approved composition: the atmosphere begins
 * behind a transparent header, carries through the hero and purchase cards,
 * and fades into the neutral lower canvas. The product artwork provides color;
 * one original monochrome texture supplies reusable smoke and particle detail.
 * ----------------------------------------------------------------------- */

body.single-product.grz-product-immersive {
	--grz-atmo-header-height: 76px;
	overflow-x: clip;
}

/* The approved product header is one clean row. Optional global promo/utility
 * rows remain available everywhere else and are intentionally suppressed here. */
body.single-product.grz-product-immersive .grz-top-strip,
body.single-product.grz-product-immersive .grz-utility {
	display: none;
}

body.single-product.grz-product-immersive .grz-header,
body.single-product.grz-product-immersive .grz-header__shell,
body.single-product.grz-product-immersive .grz-main-header {
	border: 0;
	background: transparent;
	box-shadow: none;
}

body.single-product.grz-product-immersive.grz-header-sticky .grz-header {
	position: relative;
	top: auto;
}

body.single-product.grz-product-immersive .grz-main-header__inner {
	min-height: var(--grz-atmo-header-height);
}

body.single-product.grz-product-immersive .grz-primary-menu > li > a,
body.single-product.grz-product-immersive .grz-primary-menu > li > a:hover,
body.single-product.grz-product-immersive .grz-primary-menu > li.current-menu-item > a,
body.single-product.grz-product-immersive .grz-primary-menu > li.current-menu-ancestor > a {
	background: transparent;
	box-shadow: none;
	color: rgba(9, 16, 29, .94);
	text-shadow: 0 1px 14px rgba(255, 255, 255, .24);
	transform: none;
}

body.single-product.grz-product-immersive .grz-product-search input {
	border-color: rgba(255, 255, 255, .42);
	background: rgba(var(--grz-atmo-deep-rgb, 11, 28, 53), .24);
	box-shadow: inset 0 0 0 1px rgba(5, 13, 28, .12);
	color: #fff;
	backdrop-filter: blur(12px);
}

body.single-product.grz-product-immersive .grz-product-search input::placeholder {
	color: rgba(255, 255, 255, .76);
}

body.single-product.grz-product-immersive .grz-product-search:focus-within input {
	border-color: rgba(255, 255, 255, .72);
	box-shadow: 0 0 0 3px rgba(255, 255, 255, .11), inset 0 0 0 1px rgba(5, 13, 28, .14);
}

body.single-product.grz-product-immersive .grz-product-search button,
body.single-product.grz-product-immersive .grz-header-actions .grz-icon-button,
body.single-product.grz-product-immersive .grz-header-actions .grz-icon-button.is-authenticated {
	border-color: transparent;
	background: transparent;
	color: #fff;
}

body.single-product.grz-product-immersive .grz-product-search button:hover,
body.single-product.grz-product-immersive .grz-header-actions .grz-icon-button:hover,
body.single-product.grz-product-immersive .grz-header-actions .grz-icon-button:focus-visible,
body.single-product.grz-product-immersive .grz-header-actions .grz-icon-button.is-authenticated:hover,
body.single-product.grz-product-immersive .grz-header-actions .grz-icon-button.is-authenticated:focus-visible {
	border-color: rgba(255, 255, 255, .36);
	background: rgba(255, 255, 255, .12);
	color: #fff;
}

body.single-product.grz-product-immersive .grz-sign-in {
	display: none;
}

body.single-product.grz-product-immersive .grz-cart-count {
	border-color: rgba(var(--grz-atmo-deep-rgb, 11, 28, 53), .8);
}

body.single-product.grz-product-immersive .grz-site-content,
body.single-product.grz-product-immersive .grz-woo-main {
	background: transparent;
}

body.single-product.grz-product-immersive .grz-woo-main {
	overflow: visible;
}

/* Pull both product-derived backdrop layers behind the normal-flow header. */
body.single-product.grz-product-immersive .grz-woo-main::before,
body.single-product.grz-product-immersive .grz-woo-main::after {
	top: calc(-1 * (var(--grz-atmo-header-height) + min(9vw, 112px)));
	height: calc(var(--grz-atmo-height, 860px) + var(--grz-atmo-header-height));
}

body.single-product.grz-product-immersive .grz-woo-main::before {
	filter: blur(var(--grz-atmo-blur, 58px)) saturate(var(--grz-atmo-saturation, 1.12)) brightness(.74);
	-webkit-mask-image: linear-gradient(180deg, #000 0%, #000 50%, rgba(0, 0, 0, .68) 72%, transparent 100%);
	mask-image: linear-gradient(180deg, #000 0%, #000 50%, rgba(0, 0, 0, .68) 72%, transparent 100%);
	opacity: var(--grz-atmo-opacity, .82);
}

body.single-product.grz-product-immersive .grz-woo-main::after {
	height: calc(var(--grz-atmo-height, 860px) + var(--grz-atmo-header-height) + var(--grz-atmo-fade, 360px));
	background:
		radial-gradient(ellipse 54% 58% at 3% 5%, rgba(var(--grz-atmo-accent-rgb, 244, 154, 44), 1), transparent 69%),
		radial-gradient(ellipse 36% 33% at 5% -2%, rgba(255, 246, 220, .18), transparent 72%),
		radial-gradient(ellipse 76% 63% at 96% 4%, rgba(var(--grz-atmo-deep-rgb, 11, 28, 53), .94), transparent 75%),
		linear-gradient(90deg, rgba(var(--grz-atmo-accent-rgb, 244, 154, 44), .48) 0%, rgba(var(--grz-atmo-deep-rgb, 11, 28, 53), .52) 52%, rgba(var(--grz-atmo-deep-rgb, 11, 28, 53), .86) 100%),
		linear-gradient(180deg, rgba(var(--grz-atmo-deep-rgb, 11, 28, 53), .04) 0%, rgba(var(--grz-atmo-deep-rgb, 11, 28, 53), .16) 44%, rgba(var(--grz-atmo-canvas-rgb, 244, 247, 251), .42) 65%, rgba(var(--grz-atmo-canvas-rgb, 244, 247, 251), .9) 83%, var(--grz-atmo-canvas, #f4f7fb) 100%);
	-webkit-mask-image: linear-gradient(180deg, #000 0%, #000 40%, rgba(0, 0, 0, .72) 54%, rgba(0, 0, 0, .18) 70%, transparent 80%);
	mask-image: linear-gradient(180deg, #000 0%, #000 40%, rgba(0, 0, 0, .72) 54%, rgba(0, 0, 0, .18) 70%, transparent 80%);
}

/* Original grayscale texture: screen blending removes its black plate and lets
 * the product-derived accent/deep layers color the smoke naturally. */
body.single-product.grz-product-immersive .grz-tp-shell::before {
	z-index: 0;
	top: calc(-1 * var(--grz-atmo-header-height));
	bottom: auto;
	height: calc(var(--grz-atmo-height, 860px) + var(--grz-atmo-header-height));
	background: url("../images/product-atmosphere-smoke-v1.png") center top / cover no-repeat;
	content: "";
	filter: contrast(1.04);
	-webkit-mask-image: linear-gradient(180deg, #000 0%, #000 54%, rgba(0, 0, 0, .66) 74%, transparent 100%);
	mix-blend-mode: soft-light;
	mask-image: linear-gradient(180deg, #000 0%, #000 54%, rgba(0, 0, 0, .66) 74%, transparent 100%);
	opacity: var(--grz-atmo-texture-opacity, .48);
}

body.single-product.grz-product-immersive .grz-tp-shell::after {
	position: absolute;
	z-index: 0;
	top: calc(-1 * var(--grz-atmo-header-height));
	left: 50%;
	width: 100vw;
	height: calc(var(--grz-atmo-height, 860px) + var(--grz-atmo-header-height));
	background: radial-gradient(ellipse 48% 62% at 0% 5%, rgba(var(--grz-atmo-accent-rgb, 244, 154, 44), .62), transparent 72%);
	content: "";
	-webkit-mask-image: linear-gradient(180deg, #000 0%, #000 54%, rgba(0, 0, 0, .62) 74%, transparent 100%);
	mask-image: linear-gradient(180deg, #000 0%, #000 54%, rgba(0, 0, 0, .62) 74%, transparent 100%);
	pointer-events: none;
	transform: translateX(-50%);
}

/* Reference-matched hero geometry. */
body.single-product.grz-product-immersive .grz-tp-hero,
body.single-product.grz-product-immersive .grz-tp-hero.has-custom-atmosphere {
	margin-bottom: 20px;
	padding: 68px 0 54px;
}

body.single-product.grz-product-immersive .grz-tp-hero__inner {
	grid-template-columns: 150px minmax(0, 1fr);
	gap: 26px;
}

body.single-product.grz-product-immersive .grz-tp-hero__icon {
	width: 150px;
	height: 178px;
	border-color: rgba(255, 255, 255, .78);
	border-radius: 17px;
	box-shadow: 0 20px 48px rgba(3, 10, 24, .38);
}

body.single-product.grz-product-immersive .grz-tp-hero__img {
	border-radius: 14px;
}

body.single-product.grz-product-immersive .grz-tp-hero__title {
	font-size: clamp(30px, 3.1vw, 42px);
	font-weight: 720;
	letter-spacing: -.024em;
	text-shadow: 0 2px 20px rgba(3, 8, 20, .42);
}

body.single-product.grz-product-immersive .grz-tp-hero__excerpt {
	max-width: 720px;
	margin-top: 11px;
	color: rgba(250, 252, 255, .86);
	font-size: 13.5px;
	line-height: 1.58;
}

body.single-product.grz-product-immersive .grz-tp-hero__badges {
	display: grid;
	max-width: 730px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 26px;
	margin-top: 24px;
}

body.single-product.grz-product-immersive .grz-tp-hero__badge,
body.single-product.grz-product-immersive .grz-tp-hero__badge:first-child {
	display: grid;
	grid-template-columns: 28px minmax(0, 1fr);
	align-items: start;
	gap: 9px;
	color: #fff;
}

body.single-product.grz-product-immersive .grz-tp-hero__badge-icon {
	width: 24px;
	height: 24px;
	margin-top: 1px;
	color: rgba(255, 255, 255, .96);
}

body.single-product.grz-product-immersive .grz-tp-hero__badge-copy {
	display: block;
	min-width: 0;
}

body.single-product.grz-product-immersive .grz-tp-hero__badge-copy strong,
body.single-product.grz-product-immersive .grz-tp-hero__badge-copy small {
	display: block;
}

body.single-product.grz-product-immersive .grz-tp-hero__badge-copy strong {
	font-size: 12px;
	font-weight: 760;
	line-height: 1.3;
}

body.single-product.grz-product-immersive .grz-tp-hero__badge-copy small {
	margin-top: 3px;
	color: rgba(245, 249, 255, .72);
	font-size: 10.5px;
	font-weight: 450;
	line-height: 1.42;
}

body.single-product.grz-product-immersive .grz-tp-hero__meta,
body.single-product.grz-product-immersive .grz-tp-hero .grz-favorite-button--product {
	display: none;
}

body.single-product.grz-product-immersive .grz-tp-card,
body.single-product.grz-product-immersive .grz-tp-about,
body.single-product.grz-product-immersive .grz-tp-related {
	border-color: rgba(210, 220, 233, .92);
	background: rgba(255, 255, 255, .975);
	box-shadow: 0 16px 42px rgba(18, 38, 68, .085);
}

@media (max-width: 1120px) {
	body.single-product.grz-product-immersive {
		--grz-atmo-header-height: 58px;
	}

	body.single-product.grz-product-immersive .grz-header__shell {
		box-shadow: none;
	}

	body.single-product.grz-product-immersive .grz-mobile-menu-button {
		color: rgba(9, 16, 29, .94);
	}

	body.single-product.grz-product-immersive .grz-mobile-search {
		border-top-color: rgba(255, 255, 255, .2);
		background: rgba(var(--grz-atmo-deep-rgb, 11, 28, 53), .72);
		backdrop-filter: blur(16px);
	}

	body.single-product.grz-product-immersive .grz-mobile-search input {
		border-color: rgba(255, 255, 255, .34);
		background: rgba(255, 255, 255, .94);
	}
}

@media (max-width: 720px) {
	body.single-product.grz-product-immersive .grz-woo-main::before,
	body.single-product.grz-product-immersive .grz-woo-main::after {
		top: calc(-1 * (var(--grz-atmo-header-height) + 54px));
		height: calc(var(--grz-atmo-mobile-height, 560px) + var(--grz-atmo-header-height));
	}

	body.single-product.grz-product-immersive .grz-woo-main::after {
		height: calc(var(--grz-atmo-mobile-height, 560px) + var(--grz-atmo-header-height) + min(var(--grz-atmo-fade, 360px), 320px));
		background:
			radial-gradient(ellipse 78% 46% at 1% 3%, rgba(var(--grz-atmo-accent-rgb, 244, 154, 44), .82), transparent 70%),
			radial-gradient(ellipse 88% 58% at 98% 4%, rgba(var(--grz-atmo-deep-rgb, 11, 28, 53), .9), transparent 78%),
			linear-gradient(180deg, rgba(var(--grz-atmo-deep-rgb, 11, 28, 53), .12) 0%, rgba(var(--grz-atmo-deep-rgb, 11, 28, 53), .34) 40%, rgba(var(--grz-atmo-canvas-rgb, 244, 247, 251), .8) 74%, var(--grz-atmo-canvas, #f4f7fb) 100%);
	}

	body.single-product.grz-product-immersive .grz-tp-shell::before {
		top: calc(-1 * var(--grz-atmo-header-height));
		height: calc(var(--grz-atmo-mobile-height, 560px) + var(--grz-atmo-header-height));
		background-position: 43% top;
		opacity: min(var(--grz-atmo-texture-opacity, .48), .36);
	}

	body.single-product.grz-product-immersive .grz-tp-shell::after {
		top: calc(-1 * var(--grz-atmo-header-height));
		height: calc(var(--grz-atmo-mobile-height, 560px) + var(--grz-atmo-header-height));
		background: radial-gradient(ellipse 92% 48% at 0% 2%, rgba(var(--grz-atmo-accent-rgb, 244, 154, 44), .48), transparent 74%);
	}

	body.single-product.grz-product-immersive .grz-tp-hero,
	body.single-product.grz-product-immersive .grz-tp-hero.has-custom-atmosphere {
		margin-bottom: 14px;
		padding: 34px 0 30px;
	}

	body.single-product.grz-product-immersive .grz-tp-hero__inner {
		grid-template-columns: 92px minmax(0, 1fr);
		gap: 15px;
	}

	body.single-product.grz-product-immersive .grz-tp-hero__icon {
		width: 92px;
		height: 112px;
		border-radius: 14px;
	}

	body.single-product.grz-product-immersive .grz-tp-hero__title {
		font-size: clamp(22px, 6.5vw, 28px);
	}

	body.single-product.grz-product-immersive .grz-tp-hero__excerpt {
		margin-top: 7px;
		font-size: 11.5px;
		line-height: 1.5;
		-webkit-line-clamp: 3;
	}

	body.single-product.grz-product-immersive .grz-tp-hero__badges {
		display: flex;
		grid-column: 1 / -1;
		flex-wrap: wrap;
		gap: 10px 17px;
		margin-top: 13px;
	}

	body.single-product.grz-product-immersive .grz-tp-hero__badge,
	body.single-product.grz-product-immersive .grz-tp-hero__badge:first-child {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		font-size: 11px;
	}

	body.single-product.grz-product-immersive .grz-tp-hero__badge-icon {
		width: 15px;
		height: 15px;
		margin: 0;
	}

	body.single-product.grz-product-immersive .grz-tp-hero__badge-copy small {
		display: none;
	}
}

@media (prefers-reduced-data: reduce) {
	body.single-product.grz-product-immersive .grz-tp-shell::before {
		display: none;
	}
}
