.gw-header {
	--gw-header-top: 0px;
	--gw-header-z: 1000;
	--gw-header-blur: 12px;
	--gw-header-duration: 250ms;
	--gw-header-bg: #fff;
	--gw-header-bg-rgb: 255, 255, 255;
	--gw-header-bg-opacity: .82;
	--gw-header-border: #d9d9d9;
	position: sticky;
	top: var(--gw-header-top);
	z-index: var(--gw-header-z);
	transition: transform var(--gw-header-duration) ease, box-shadow var(--gw-header-duration) ease;
	will-change: transform;
}

/*
 * A sticky element is constrained by its parent. In block themes the header
 * Group normally sits inside a short template-part wrapper, so the front-end
 * script promotes positioning to this shell while leaving appearance on the
 * editable Group block.
 */
.gw-header-shell {
	--gw-header-height: 100px;
	position: sticky;
	top: var(--gw-header-top);
	z-index: var(--gw-header-z);
	transition: top var(--gw-header-duration) ease;
	will-change: top;
}

.gw-header-shell--fixed { position: fixed; left: 0; right: 0; width: 100%; }

.gw-header-shell > .gw-header {
	position: relative;
	top: auto;
	z-index: auto;
	transition-property: box-shadow;
	will-change: auto;
}

.gw-header--fixed {
	position: fixed;
	left: 0;
	right: 0;
	width: 100%;
}

.gw-header--bg-transparent { background-color: transparent !important; }
.gw-header--bg-solid { background-color: var(--gw-header-bg) !important; }
.gw-header--bg-translucent {
	position: relative;
	isolation: isolate;
	background-color: transparent !important;
}
.gw-header--bg-translucent::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background-color: rgba(var(--gw-header-bg-rgb), var(--gw-header-bg-opacity));
	-webkit-backdrop-filter: blur(var(--gw-header-blur));
	backdrop-filter: blur(var(--gw-header-blur));
}

.gw-header--border { border-bottom: 1px solid var(--gw-header-border); }
.gw-header--shadow { box-shadow: 0 8px 24px rgb(0 0 0 / 12%); }
.gw-header.is-gw-hidden { transform: translateY(calc(-100% - var(--gw-header-top) - 2px)); }
.gw-header-shell.is-gw-hidden {
	top: calc(var(--gw-header-top) - var(--gw-header-height) - 2px);
	transform: none;
}

@media (min-width: 1025px) {
	.gw-header--off-desktop { position: relative; top: auto; transform: none !important; }
}
@media (min-width: 601px) and (max-width: 1024px) {
	.gw-header--off-tablet { position: relative; top: auto; transform: none !important; }
}
@media (max-width: 600px) {
	.gw-header--off-mobile { position: relative; top: auto; transform: none !important; }
}

@media (prefers-reduced-motion: reduce) {
	.gw-header, .gw-header-shell { transition-duration: 0ms; }
}
