/* Site-wide homepage header */
header.wp-block-template-part {
	position: relative;
	z-index: 1000;
	width: 100%;
	padding: 18px 24px 0;
	background: transparent !important;
	box-sizing: border-box;
}

.starbox-floating-header {
	width: min(100%, 1180px);
	min-height: 78px;
	margin: 0 auto !important;
	padding: 10px 28px !important;
	background: #e4b5a3 !important;
	border-radius: 18px;
	box-shadow: 0 18px 45px rgba(67, 43, 35, .22), 0 5px 14px rgba(67, 43, 35, .12);
	box-sizing: border-box;
	overflow: visible !important;
}

.starbox-header-row {
	display: grid !important;
	position: relative;
	width: 100% !important;
	max-width: none !important;
	min-height: 58px;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
	column-gap: 10px !important;
	align-items: center !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
}

.starbox-header-row > .wp-block-site-logo { grid-column: 1; justify-self: start; margin: 0 !important; }
.starbox-header-row > .wp-block-navigation { position: absolute; top: 50%; left: 50%; width: auto !important; margin: 0 !important; transform: translate(-50%, -50%); }
.starbox-header-row > .wp-block-woocommerce-customer-account { grid-column: 2; justify-self: end; margin: 0 !important; }
.starbox-header-row > .wp-block-woocommerce-mini-cart { grid-column: 3; justify-self: end; margin: 0 !important; }
.starbox-header-row > .starbox-header-logo { grid-column: 1; justify-self: start; }
.starbox-header-row > .starbox-header-nav { grid-column: 2; justify-self: center; }
.starbox-header-row > .starbox-header-actions { grid-column: 3; justify-self: end; }
.starbox-header-row .wp-block-site-logo img { display: block; width: auto; max-width: 180px; max-height: 58px; object-fit: contain; }
.starbox-header-row .wp-block-navigation__container { display: flex !important; flex-flow: row nowrap !important; align-items: center !important; justify-content: center !important; gap: clamp(14px, 1.8vw, 26px) !important; }

/* Header navigation */
header .wp-block-navigation .wp-block-navigation-item__content,
header .wp-block-navigation .wp-block-navigation-item__label,
header .wp-block-navigation a {
	color: #fff;
}

header .wp-block-navigation .wp-block-navigation-item__content:hover,
header .wp-block-navigation .wp-block-navigation-item__content:focus-visible,
header .wp-block-navigation a:hover,
header .wp-block-navigation a:focus-visible {
	color: #fff;
}

.starbox-header-row .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
	position: relative;
	padding: 10px 0 !important;
	font-size: 15px;
	font-weight: 500;
	white-space: nowrap !important;
	text-decoration: none !important;
}

.starbox-header-row .wp-block-navigation__submenu-container {
	min-width: 210px !important;
	margin-top: 6px !important;
	padding: 7px !important;
	background: #e4b5a3 !important;
	border: 1px solid rgba(255, 255, 255, .25) !important;
	border-radius: 12px;
	box-shadow: 0 16px 35px rgba(67, 43, 35, .22);
}

.starbox-header-row .wp-block-woocommerce-customer-account a,
.starbox-header-row .wc-block-mini-cart__button {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 40px !important;
	height: 40px !important;
	min-width: 40px !important;
	margin: 0 !important;
	padding: 7px !important;
	color: #fff !important;
	background: transparent !important;
	border: 0 !important;
	border-radius: 9px !important;
}

@media (max-width: 782px) {
	header.wp-block-template-part { padding: 10px 12px 0; }
	.starbox-floating-header { min-height: 68px; padding: 7px 12px !important; border-radius: 16px; }
	.starbox-header-row { min-height: 54px !important; grid-template-columns: minmax(52px, 1fr) auto auto minmax(52px, 1fr) !important; column-gap: 8px !important; }
	.starbox-header-row > .wp-block-site-logo { grid-column: 1; grid-row: 1; }
	.starbox-header-row .wp-block-site-logo img { width: 52px !important; height: 52px !important; }
	.starbox-header-row > .wp-block-woocommerce-customer-account { grid-column: 2; grid-row: 1; }
	.starbox-header-row > .wp-block-woocommerce-mini-cart { grid-column: 3; grid-row: 1; }
	.starbox-header-row > .wp-block-navigation { position: relative; top: auto; left: auto; grid-column: 4; grid-row: 1; justify-self: end; transform: none; }
	.starbox-header-row > .starbox-header-logo { grid-column: 1; grid-row: 1; }
	.starbox-header-row > .starbox-header-nav { grid-column: 4; grid-row: 1; justify-self: end; }
	.starbox-header-row > .starbox-header-actions { grid-column: 2 / 4; grid-row: 1; justify-self: center; }
	.starbox-header-row .wp-block-navigation__responsive-container-open { display: flex !important; align-items: center !important; justify-content: center !important; width: 40px !important; height: 40px !important; min-width: 40px !important; margin: 0 !important; padding: 7px !important; color: #fff !important; background: transparent !important; border: 0 !important; border-radius: 9px !important; }
	.starbox-header-row .wp-block-navigation__responsive-container.is-menu-open { margin: 12px !important; padding: 22px !important; color: #fff !important; background: #e4b5a3 !important; border-radius: 16px !important; box-shadow: 0 20px 45px rgba(67, 43, 35, .28) !important; }
	.starbox-header-row .is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 48px !important; }
	.starbox-header-row .is-menu-open .wp-block-navigation__container { align-items: flex-start !important; gap: 4px !important; }
	.starbox-header-row .is-menu-open .wp-block-navigation-item__content { width: 100%; padding: 10px 0 !important; color: #fff !important; font-size: 18px !important; }
	.starbox-header-row .is-menu-open .wp-block-navigation__submenu-container { width: 100% !important; min-width: 0 !important; margin: 0 !important; padding-left: 18px !important; background: transparent !important; border: 0 !important; box-shadow: none !important; }
}

/* Organic image with a second blob behind it. Add starbox-blob to an Image block. */
.starbox-blob {
	position: relative;
	isolation: isolate;
}

.starbox-blob::before {
	position: absolute;
	z-index: -1;
	top: 4%;
	right: -4%;
	bottom: -5%;
	left: 4%;
	background: #e4b5a3;
	border-radius: 57% 43% 61% 39% / 42% 58% 42% 58%;
	content: "";
	transform: rotate(3deg);
}

.starbox-blob img,
img.starbox-blob {
	display: block;
	border-radius: 44% 56% 39% 61% / 55% 42% 58% 45%;
}

img.starbox-blob {
	background: #e4b5a3;
	box-shadow: 14px 16px 0 #e4b5a3;
}

/* Scroll reveal */
.starbox-fade {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 1100ms ease, transform 1100ms ease;
	will-change: opacity, transform;
}

.starbox-fade.starbox-fade-from-left {
	transform: translateX(-42px);
}

.starbox-fade.starbox-fade-from-right {
	transform: translateX(42px);
}

.starbox-fade.starbox-fade-from-top {
	transform: translateY(-42px);
}

.starbox-fade.starbox-fade-from-bottom {
	transform: translateY(42px);
}

.starbox-fade.is-visible {
	opacity: 1;
	transform: translateY(0);
	will-change: auto;
}

@media (prefers-reduced-motion: reduce) {
	.starbox-fade,
	.starbox-fade.is-visible {
		opacity: 1;
		transform: none;
		transition: none;
		will-change: auto;
	}
}

/* Advent / seasonal snowfall */
.starbox-snow-layer {
	position: fixed;
	z-index: 2147483000;
	inset: 0;
	width: 100vw;
	height: 100vh;
	height: 100dvh;
	overflow: hidden;
	pointer-events: none;
}

.starbox-snowflake {
	position: absolute;
	top: -10vh;
	left: var(--starbox-snow-left, 50%);
	color: rgba(255, 255, 255, .99);
	font-size: var(--starbox-snow-size, 18px);
	line-height: 1;
	text-shadow:
		0 0 2px rgba(255, 255, 255, .98),
		0 0 7px rgba(255, 255, 255, .90),
		0 1px 4px rgba(67, 43, 35, .42),
		0 2px 9px rgba(67, 43, 35, .24);
	filter: drop-shadow(0 1px 1px rgba(67, 43, 35, .20));
	opacity: var(--starbox-snow-opacity, .95);
	animation: starbox-snow-fall var(--starbox-snow-duration, 10s) linear var(--starbox-snow-delay, 0s) infinite;
	will-change: transform;
}

@keyframes starbox-snow-fall {
	0% { transform: translate3d(0, -10vh, 0) rotate(0deg); }
	50% { transform: translate3d(var(--starbox-snow-drift, 25px), 50vh, 0) rotate(180deg); }
	100% { transform: translate3d(calc(var(--starbox-snow-drift, 25px) * -0.45), 115vh, 0) rotate(360deg); }
}

@media (max-width: 782px) {
	.starbox-snow-layer {
		z-index: 2147483000;
	}

	.starbox-snowflake {
		color: #fff;
		text-shadow:
			0 0 3px rgba(255, 255, 255, 1),
			0 0 9px rgba(255, 255, 255, .98),
			0 1px 4px rgba(67, 43, 35, .55),
			0 2px 10px rgba(67, 43, 35, .35);
		filter: drop-shadow(0 1px 2px rgba(67, 43, 35, .30));
	}

	.starbox-snowflake:nth-child(n+27) { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	/* Keep seasonal snow visible, but make the movement gentler instead of hiding it entirely. */
	.starbox-snowflake {
		animation-duration: 22s !important;
	}
}
