/* Let the shared Blocksy header breathe on wide non-product pages. The
   product layout owns its own header spacing and stays isolated below. */
/* Keep one dark-gold header across every public page, matching the body
   palette. The logo sits on a light plate because the wordmark artwork is
   dark and would otherwise vanish into the band. */
body #header > div[data-device="desktop"] > div[data-row="top"],
body #header > div[data-device="mobile"] > div[data-row="top"] {
	display: none !important;
}

html body.wenmeng-wholesale-product #header {
	display: block !important;
}

/* ---------- Dark-gold header skin ---------- */
body #header,
html body.wenmeng-wholesale-product #header {
	background: #1c1917 !important;
	border-bottom: 1px solid #44403c;
}

body #header > div[data-device="desktop"] [data-row="middle"],
body #header > div[data-device="mobile"] [data-row="middle"],
body #header > div[data-device="desktop"] [data-row="middle"] > .ct-container,
body #header .ct-sticky-container {
	background: #1c1917 !important;
}



body #header nav a,
body #header .ct-header-nav a,
body #header #primary-menu > li > a,
body #header #primary-menu > li > a .ct-sub-menu-parent {
	color: #faf7f2 !important;
}

body #header nav a:hover,
body #header #primary-menu > li > a:hover,
body #header #primary-menu > li.current-menu-item > a,
body #header #primary-menu > li.current-menu-ancestor > a {
	color: #d97706 !important;
}

body #header .ct-header-text,
body #header .ct-header-account > a,
body #header .ct-header-cart > a,
body #header .ct-header-search > a {
	color: #faf7f2 !important;
}

body #header svg,
body #header .ct-icon {
	fill: currentColor;
}

/* Dropdown panels keep a dark surface so the light items stay readable. */
body #header #primary-menu ul.sub-menu,
body #header #primary-menu li > ul {
	background: #1c1917 !important;
	border: 1px solid #44403c;
}

body #header #primary-menu ul.sub-menu a {
	color: #faf7f2 !important;
}

body #header #primary-menu ul.sub-menu a:hover {
	color: #d97706 !important;
	background: rgba(217, 119, 6, .1);
}

/* Mobile drawer and toggle */
body #header .ct-toggle,
body #header .mobile-menu-toggle,
body #header button {
	color: #faf7f2 !important;
	background: transparent !important;
	border-color: #44403c !important;
}

html body.wenmeng-wholesale-product .wenmeng-stitch-header {
	display: none !important;
}

@media (min-width: 690px) {
	body #header .site-logo-container,
	body #header .site-logo-container .custom-logo-link {
		width: auto !important;
		max-width: none !important;
		height: auto !important;
	}

	body #header .site-logo-container .custom-logo,
	body #header .site-logo-container img {
		width: auto !important;
		max-width: none !important;
		height: 40px !important;
		max-height: 40px !important;
	}

	body #header > div[data-device="desktop"] > .ct-sticky-container,
	body #header > div[data-device="desktop"] [data-row="middle"],
	body #header > div[data-device="desktop"] [data-row="middle"] > .ct-container {
		height: 138px !important;
		min-height: 138px !important;
	}

	html body.wenmeng-wholesale-product #header,
	html body.wenmeng-wholesale-product #header .ct-sticky-container {
		height: 138px !important;
		min-height: 138px !important;
	}

	html body.wenmeng-wholesale-product #header > div[data-device="desktop"],
	html body.wenmeng-wholesale-product #header > div[data-device="desktop"] > .ct-sticky-container {
		display: block !important;
	}

	html body.wenmeng-wholesale-product #header > div[data-device="mobile"] {
		display: none !important;
	}
}

@media (max-width: 689px) {
	html body.wenmeng-wholesale-product #header,
	html body.wenmeng-wholesale-product #header .ct-sticky-container,
	html body.wenmeng-wholesale-product #header [data-row="middle"],
	html body.wenmeng-wholesale-product #header [data-row="middle"] > .ct-container {
		height: 70px !important;
		min-height: 70px !important;
	}
}

/* Product pages must use the same Blocksy footer as every other public page.
   The product-layout plugin keeps a legacy Stitch shell in the DOM; hide that
   shell and restore the shared footer so only one six-module footer is visible. */
html body.wenmeng-wholesale-product #footer {
	display: block !important;
	visibility: visible !important;
}

html body.wenmeng-wholesale-product .wenmeng-stitch-footer {
	display: none !important;
}

@media (min-width: 690px) {
	body:not(.wenmeng-wholesale-product) #header > div[data-device="desktop"] [data-row] > .ct-container {
		width: calc(100% - clamp(48px, 10vw, 200px)) !important;
		max-width: none !important;
	}
}

/* Keep the public Blocksy header in normal document flow. Blocksy's sticky
   script toggles data-sticky values and inline transforms while scrolling;
   these overrides intentionally neutralize that behavior without touching
   navigation markup or the mobile menu. */
html body #header [data-sticky],
html body #header [data-sticky*="yes"],
html body #header [data-sticky*="fixed"] {
	position: static !important;
	top: auto !important;
	left: auto !important;
	right: auto !important;
	bottom: auto !important;
	transform: none !important;
}

/* Shared support modules sit above the existing footer rows. */
.wenmeng-footer-assurance {
	border-top: 1px solid #44403c;
	background: #1c1917;
	color: #faf7f2;
	font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.wenmeng-footer-assurance-inner {
	display: grid;
	width: min(1232px, calc(100vw - 48px));
	margin: 0 auto;
	padding: 42px 0 36px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(48px, 10vw, 150px);
}

.wenmeng-footer-assurance-column h2 {
	margin: 0 0 28px;
	font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 28px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0;
}

.wenmeng-footer-assurance-column ul {
	display: grid;
	gap: 18px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.wenmeng-footer-assurance-column li,
.wenmeng-footer-assurance-column a {
	color: #a8a29e;
	font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 17px;
	font-weight: 400;
	line-height: 1.45;
	text-decoration: none;
}

.wenmeng-footer-assurance-column a:hover,
.wenmeng-footer-assurance-column a:focus-visible {
	color: #d97706;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* On wide screens, fold the two shared modules into the existing footer grid
   so the full footer stays on one row instead of creating a second band. */
@media (min-width: 1200px) {
	body #footer [data-row="top"] > .ct-container {
		display: grid !important;
		grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
		column-gap: clamp(24px, 3vw, 64px) !important;
		align-items: start;
	}

	body #footer [data-row="top"] > .ct-container > .wenmeng-footer-assurance,
	body #footer [data-row="top"] > .ct-container > .wenmeng-footer-assurance > .wenmeng-footer-assurance-inner {
		display: contents !important;
	}

	/* The flattened wrapper has no box of its own, so the browser parks its
	   children on a second grid row. Pin each shared module to its own column
	   on row 1 so the branded footer keeps a single band. */
	body #footer [data-row="top"] > .ct-container > .wenmeng-footer-assurance > .wenmeng-footer-assurance-inner > .wenmeng-footer-assurance-column {
		grid-row: 1 !important;
		align-self: start;
	}

	body #footer [data-row="top"] > .ct-container > .wenmeng-footer-assurance > .wenmeng-footer-assurance-inner > .wenmeng-footer-assurance-column:nth-child(1) {
		grid-column: 5 !important;
	}

	body #footer [data-row="top"] > .ct-container > .wenmeng-footer-assurance > .wenmeng-footer-assurance-inner > .wenmeng-footer-assurance-column:nth-child(2) {
		grid-column: 6 !important;
	}

	body #footer [data-row="top"] > .ct-container .wenmeng-footer-assurance-column {
		min-width: 0;
	}

	body #footer [data-row="top"] > .ct-container .wenmeng-footer-assurance-column h2 {
		margin-bottom: 18px;
		font-size: 16px;
		line-height: 1.25;
	}

	body #footer [data-row="top"] > .ct-container .wenmeng-footer-assurance-column ul {
		gap: 10px;
	}

	body #footer [data-row="top"] > .ct-container .wenmeng-footer-assurance-column li,
	body #footer [data-row="top"] > .ct-container .wenmeng-footer-assurance-column a {
		font-size: 13px;
		line-height: 1.45;
	}

	/* Product pages render a separate footer shell. Flatten its shared
	   assurance block and footer inner so it follows the same one-row rule. */
	body .wenmeng-stitch-footer {
		display: grid !important;
		width: 100% !important;
		box-sizing: border-box;
		grid-template-columns: repeat(5, minmax(0, 1fr));
		column-gap: clamp(24px, 3vw, 64px);
		align-items: start;
		padding: 34px max(24px, 5vw) !important;
	}

	body .wenmeng-stitch-footer > .wenmeng-footer-assurance,
	body .wenmeng-stitch-footer > .wenmeng-footer-assurance > .wenmeng-footer-assurance-inner,
	body .wenmeng-stitch-footer > .wenmeng-stitch-footer-inner {
		display: contents !important;
	}

	body .wenmeng-stitch-footer .wenmeng-footer-assurance-column {
		min-width: 0;
	}

	body .wenmeng-stitch-footer .wenmeng-footer-assurance-column h2 {
		margin-bottom: 18px;
		font-size: 18px;
		line-height: 1.25;
	}

	body .wenmeng-stitch-footer .wenmeng-footer-assurance-column ul {
		gap: 10px;
	}

	body .wenmeng-stitch-footer .wenmeng-footer-assurance-column li,
	body .wenmeng-stitch-footer .wenmeng-footer-assurance-column a {
		font-size: 13px;
		line-height: 1.45;
	}

	body .wenmeng-stitch-footer .wenmeng-stitch-footer-brand,
	body .wenmeng-stitch-footer nav,
	body .wenmeng-stitch-footer p {
		min-width: 0;
		align-self: center;
	}

	body .wenmeng-stitch-footer nav {
		justify-content: flex-start;
		flex-wrap: wrap;
		gap: 8px 16px;
	}

	body .wenmeng-stitch-footer p {
		text-align: left;
	}
}

/* Compact global footer: keep the existing Blocksy links and content owners. */
/* The Blocksy footer shell keeps its own light background; darken the whole
   shell so the shared modules and the brand row read as one dark band. */
html body #footer,
html body #footer > .ct-container {
	background: #1c1917 !important;
	border-top-color: #44403c;
}

/* Scope strictly to the footer rows. A bare `#footer a` selector used to
   reach the sticky navigation dropdown and turned its items dark-on-dark. */
html body #footer [data-row="top"] .stk-block-heading__text,
html body #footer [data-row="top"] .stk-block-text__text,
html body #footer [data-row="top"] .wenmeng-footer-assurance-column h2,
html body #footer [data-row="top"] .wenmeng-footer-assurance-column h2 *,
html body #footer [data-row="top"] .wenmeng-footer-assurance-column li,
html body #footer [data-row="top"] .wenmeng-footer-assurance-column a,
html body #footer [data-row="bottom"],
html body #footer [data-row="bottom"] p,
html body #footer [data-row="bottom"] a,
html body #footer .ct-footer-copyright {
	color: #a8a29e !important;
}

html body #footer [data-row="top"] .wenmeng-footer-assurance-column a:hover,
html body #footer [data-row="bottom"] a:hover {
	color: #d97706 !important;
}

body #footer [data-row="top"] {
	padding-top: 18px !important;
	padding-bottom: 14px !important;
}

body #footer [data-row="top"] .ct-container {
	padding-top: 14px !important;
	padding-bottom: 12px !important;
}

body #footer [data-row="top"] .stk-block-heading__text {
	font-size: 16px !important;
	line-height: 1.25 !important;
}

body #footer [data-row="top"] .stk-block-text__text {
	font-size: 13px !important;
	line-height: 1.45 !important;
}

body #footer [data-row="top"] .stk-block-heading,
body #footer [data-row="top"] .stk-block-text {
	margin-bottom: 8px !important;
}

body #footer [data-row="middle"] {
	min-height: 0 !important;
	padding-top: 8px !important;
	padding-bottom: 8px !important;
}

body #footer [data-row="middle"] .ct-container {
	padding-top: 6px !important;
	padding-bottom: 6px !important;
}

body #footer [data-row="middle"] figure {
	min-height: 0 !important;
	margin: 0 !important;
}

body #footer [data-row="middle"] figure::after {
	display: none !important;
	content: none !important;
}

body #footer [data-row="middle"] .stk-img-wrapper,
body #footer [data-row="middle"] .stk-img {
	display: block !important;
	width: auto !important;
	height: 34px !important;
}

body #footer [data-row="middle"] img,
body .wenmeng-site-footer-logo {
	display: block !important;
	width: auto !important;
	height: 34px !important;
	object-fit: contain !important;
	margin: 0 auto !important;
}

body #footer [data-row="bottom"] {
	min-height: 0 !important;
	padding-top: 7px !important;
	padding-bottom: 7px !important;
}

body #footer [data-row="bottom"] .ct-container {
	padding-top: 6px !important;
	padding-bottom: 6px !important;
}

/* The homepage plugin has its own scoped footer rules; keep the global
   treatment authoritative there as well. */
body.wenmeng-homepage #footer [data-row="top"] {
	padding-top: 18px !important;
	padding-bottom: 14px !important;
}

body.wenmeng-homepage #footer [data-row="top"] .ct-container {
	padding-top: 14px !important;
	padding-bottom: 12px !important;
}

body.wenmeng-homepage #footer [data-row="middle"] {
	min-height: 0 !important;
	padding-top: 8px !important;
	padding-bottom: 8px !important;
}

body.wenmeng-homepage #footer [data-row="middle"] .ct-container {
	padding-top: 6px !important;
	padding-bottom: 6px !important;
}

body.wenmeng-homepage #footer [data-row="middle"] .stk-img-wrapper,
body.wenmeng-homepage #footer [data-row="middle"] .stk-img,
body.wenmeng-homepage #footer [data-row="middle"] img {
	display: block !important;
	width: auto !important;
	height: 34px !important;
}

body.wenmeng-homepage #footer [data-row="bottom"] {
	min-height: 0 !important;
	padding-top: 7px !important;
	padding-bottom: 7px !important;
}

body.wenmeng-homepage #footer [data-row="bottom"] .ct-container {
	padding-top: 6px !important;
	padding-bottom: 6px !important;
}

body .wenmeng-stitch-footer {
	border-top: 1px solid #44403c;
	background: #1c1917;
}

body .wenmeng-stitch-footer-inner {
	min-height: 96px !important;
	padding: 18px 0 !important;
}

body .wenmeng-stitch-footer-brand {
	line-height: 0 !important;
}

body .wenmeng-stitch-footer-brand img {
	display: block;
	width: auto;
	height: 32px;
	object-fit: contain;
}

/* The wordmark is now a transparent cream-on-dark SVG, so the light plate
   that the old dark-on-white PNG needed is removed here as well. */
html body #footer [data-row="middle"] figure,
html body #footer [data-row="middle"] .stk-img-wrapper,
body .wenmeng-stitch-footer-brand {
	display: inline-flex;
	justify-content: center;
	border-radius: 0;
	background: transparent;
	padding: 0;
}

body .wenmeng-stitch-footer-brand {
	width: fit-content;
	margin: 0 auto;
}

body .wenmeng-stitch-footer .wenmeng-footer-assurance {
	width: 100%;
}

@media (max-width: 689px) {
	.wenmeng-footer-assurance-inner {
		width: calc(100vw - 40px);
		padding: 32px 0 28px;
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.wenmeng-footer-assurance-column h2 {
		margin-bottom: 18px;
		font-size: 24px;
	}

	.wenmeng-footer-assurance-column ul {
		gap: 12px;
	}

	.wenmeng-footer-assurance-column li,
	.wenmeng-footer-assurance-column a {
		font-size: 16px;
	}

	body #footer [data-row="top"] .ct-container {
		padding-top: 18px !important;
		padding-bottom: 14px !important;
	}

	body #footer [data-row="top"] .stk-block-heading__text {
		font-size: 15px !important;
	}

	body #footer [data-row="top"] .stk-block-text__text {
		font-size: 13px !important;
		line-height: 1.45 !important;
	}

	body #footer [data-row="middle"] .stk-img-wrapper,
	body #footer [data-row="middle"] .stk-img,
	body #footer [data-row="middle"] img {
		width: 150px !important;
		height: 60px !important;
	}

	body .wenmeng-stitch-footer-inner {
		width: calc(100vw - 32px) !important;
		grid-template-columns: 1fr !important;
		gap: 12px !important;
		padding: 16px 0 !important;
	}

	body .wenmeng-stitch-footer nav {
		flex-wrap: wrap;
		justify-content: flex-start;
		gap: 8px 16px;
	}

	body .wenmeng-stitch-footer p {
		text-align: left !important;
	}
}


/* ------------------------------------------------------------------
   Brand mark on the dark-gold header.

   The wordmark is now a transparent SVG (assets/wenmeng-logo.svg) drawn in
   the site cream with a copper rule underneath, so the light plate that the
   old white-background PNG needed is gone. Height is set, width is left to
   auto so the 6.5:1 wordmark keeps its proportions.
   ------------------------------------------------------------------ */
html body #header > div[data-device="desktop"] .site-logo-container,
html body #header > div[data-device="mobile"] .site-logo-container {
	width: auto !important;
	max-width: none !important;
	height: auto !important;
	background: transparent !important;
}

html body #header > div[data-device="desktop"] .site-logo-container img,
html body #header > div[data-device="desktop"] .custom-logo,
html body #header > div[data-device="mobile"] .site-logo-container img,
html body #header > div[data-device="mobile"] .custom-logo {
	width: auto !important;
	max-width: none !important;
	height: 40px !important;
	max-height: 40px !important;
	object-fit: contain;
	background: transparent !important;
	padding: 0 !important;
	border-radius: 0 !important;
	box-sizing: border-box;
}

@media (max-width: 689px) {
	html body #header > div[data-device="mobile"] .site-logo-container img,
	html body #header > div[data-device="mobile"] .custom-logo {
		width: auto !important;
		max-width: none !important;
		height: 26px !important;
		max-height: 26px !important;
	}
}
