/* ==========================================================================
   Horeca Hut homepage — golden dark editorial pass.
   Unifies the homepage with the shop (SHX) and PDP design system: ink
   canvas, graphite panels, ivory product stages, one gold. Scoped to
   body.hhm-front-page and loaded after homepage-final.css on purpose.
   ========================================================================== */

body.hhm-front-page {
	/* Shared SHX tokens. */
	--hg-ink: #0a0a0c;
	--hg-ink-2: #101013;
	--hg-graphite: #151517;
	--hg-graphite-2: #1b1b1f;
	--hg-ivory: #f5f1e8;
	--hg-ivory-2: #ece6d8;
	--hg-text: #f2efe7;
	--hg-text-2: rgba(242, 239, 231, .64);
	--hg-text-3: rgba(242, 239, 231, .4);
	--hg-line: rgba(242, 239, 231, .09);
	--hg-line-2: rgba(242, 239, 231, .17);
	--hg-gold: #d8b36c;
	--hg-gold-grad: linear-gradient(140deg, #e6c885 0%, #d8b36c 55%, #b98f47 100%);
	--hg-gold-soft: rgba(216, 179, 108, .14);
	--hg-wa: #25d366;
	--hg-ok: #8fc7a4;
	--hg-warn: #e4c584;
	--hg-danger: #de9494;

	/* Re-point the legacy homepage palette at the shared system so the
	   slider, hero and B2B band re-tune without markup changes. */
	--hhm-gold: var(--hg-gold);
	--hhm-gold-soft: #e6c885;
	--hhm-brand: var(--hg-gold);
	--hhm-accent: var(--hg-gold);
	--hhm-brand-dark: #b98f47;
	--hhm-night: var(--hg-ink);
	--hhm-night-2: var(--hg-ink-2);
	--hhm-graphite: var(--hg-graphite);
	--hhm-graphite-2: var(--hg-graphite-2);
	--hhm-dark-line: var(--hg-line);
	--hhm-ivory: var(--hg-ivory);
	--hhm-ivory-2: var(--hg-ivory-2);
	--hhm-dark-text: var(--hg-text);
	--hhm-dark-muted: var(--hg-text-2);

	background: var(--hg-ink);
	color: var(--hg-text);
}

body.hhm-front-page .hhm-site-shell,
body.hhm-front-page .hhm-main {
	background: var(--hg-ink);
	color: var(--hg-text) !important;
}

/* --------------------------------------------------------------------------
   0. Cascade defense — main.css paints every shell heading ink !important
   and Electro's :not()-chained button rules outrank class selectors, so the
   dark surfaces re-assert their own text and control colors.
   -------------------------------------------------------------------------- */

body.hhm-front-page .hhm-balance-heading h2,
body.hhm-front-page .hhm-brand-discovery__intro h2,
body.hhm-front-page .hhm-home-product h3,
body.hhm-front-page .hhm-home-product h3 a,
body.hhm-front-page .hhm-balance-guides h3,
body.hhm-front-page .hhm-balance-guides h3 a,
body.hhm-front-page .hhm-curated-zone > header h3 { color: var(--hg-text) !important; }
body.hhm-front-page .hhm-home-product h3 a:hover,
body.hhm-front-page .hhm-balance-guides h3 a:hover { color: var(--hg-gold) !important; }

body.hhm-front-page .hhm-explorer-controls button,
body.hhm-front-page .hhm-operation-tabs button {
	border: 1px solid var(--hg-line-2) !important;
	background: var(--hg-graphite) !important;
	color: var(--hg-text-2) !important;
}
body.hhm-front-page .hhm-explorer-controls button:hover,
body.hhm-front-page .hhm-operation-tabs button:hover {
	border-color: rgba(216, 179, 108, .5) !important;
	background: var(--hg-graphite-2) !important;
	color: var(--hg-text) !important;
}
body.hhm-front-page .hhm-explorer-controls button.is-active,
body.hhm-front-page .hhm-operation-tabs button.is-active {
	border-color: transparent !important;
	background: var(--hg-gold-grad) !important;
	color: #17130a !important;
}
body.hhm-front-page .hhm-brand-discovery__intro button {
	border: 1px solid var(--hg-line-2) !important;
	background: transparent !important;
	color: var(--hg-gold) !important;
}
body.hhm-front-page .hhm-brand-discovery__intro button:hover {
	border-color: var(--hg-gold) !important;
	color: #ecd6a4 !important;
}
body.hhm-front-page .hhm-balance-heading > p { color: var(--hg-text-2); }
body.hhm-front-page .hhm-balance-kicker { color: var(--hg-gold); }
body.hhm-front-page .hhm-balance-heading--inline > a,
body.hhm-front-page .hhm-explorer-panel__top > a,
body.hhm-front-page .hhm-operation-stage__link { color: var(--hg-gold); }
body.hhm-front-page .hhm-balance-heading--inline > a:hover,
body.hhm-front-page .hhm-explorer-panel__top > a:hover,
body.hhm-front-page .hhm-operation-stage__link:hover { color: #ecd6a4; }

/* --------------------------------------------------------------------------
   1. Trust signals bar (new)
   -------------------------------------------------------------------------- */

body.hhm-front-page .hhm-gold-signals {
	overflow: hidden;
	border-block: 1px solid var(--hg-line);
	background: var(--hg-ink-2);
}
body.hhm-front-page .hhm-gold-signals__track {
	display: flex;
	justify-content: space-between;
	gap: 26px;
	overflow-x: auto;
	padding-block: 17px;
	scrollbar-width: none;
}
body.hhm-front-page .hhm-gold-signals__track::-webkit-scrollbar { display: none; }
body.hhm-front-page .hhm-gold-signal {
	display: flex;
	align-items: center;
	gap: 11px;
	flex: none;
}
body.hhm-front-page .hhm-gold-signal > span {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border: 1px solid rgba(216, 179, 108, .28);
	border-radius: 10px;
	background: var(--hg-gold-soft);
	color: var(--hg-gold);
}
body.hhm-front-page .hhm-gold-signal .hhm-icon { width: 18px; height: 18px; }
body.hhm-front-page .hhm-gold-signal strong {
	display: block;
	color: var(--hg-text);
	font-size: .76rem;
	font-weight: 760;
	letter-spacing: .01em;
}
body.hhm-front-page .hhm-gold-signal small {
	display: block;
	margin-top: 2px;
	color: var(--hg-text-3);
	font-size: .66rem;
}

/* --------------------------------------------------------------------------
   2. Category explorer — ink surface, graphite panel
   -------------------------------------------------------------------------- */

body.hhm-front-page .hhm-catalog-explorer {
	background: var(--hg-ink);
	color: var(--hg-text);
}
body.hhm-front-page .hhm-catalog-explorer .hhm-balance-heading > p { color: var(--hg-text-2); }
body.hhm-front-page .hhm-explorer-controls button {
	border: 1px solid var(--hg-line-2);
	background: var(--hg-graphite);
	color: var(--hg-text-2);
	transition: border-color .16s ease, background .16s ease, color .16s ease;
}
body.hhm-front-page .hhm-explorer-controls button:hover {
	border-color: rgba(216, 179, 108, .5);
	background: var(--hg-graphite-2);
	color: var(--hg-text);
}
body.hhm-front-page .hhm-explorer-controls button.is-active {
	border-color: transparent;
	background: var(--hg-gold-grad);
	color: #17130a;
}
body.hhm-front-page .hhm-explorer-controls button > span {
	background: var(--hg-gold-soft);
	color: var(--hg-gold);
}
body.hhm-front-page .hhm-explorer-controls button.is-active > span {
	background: rgba(10, 10, 12, .18);
	color: #17130a;
}
body.hhm-front-page .hhm-explorer-controls button strong { color: inherit; }
body.hhm-front-page .hhm-explorer-controls button small { color: var(--hg-text-3); }
body.hhm-front-page .hhm-explorer-controls button.is-active small { color: rgba(23, 19, 10, .66); }
body.hhm-front-page .hhm-explorer-panel {
	border-color: var(--hg-line);
	background: var(--hg-graphite);
	box-shadow: 0 22px 60px rgba(0, 0, 0, .38);
}
body.hhm-front-page .hhm-explorer-panel__top span { color: var(--hg-text-3); }
body.hhm-front-page .hhm-explorer-panel__top strong { color: var(--hg-text); }
body.hhm-front-page .hhm-explorer-empty {
	border-color: var(--hg-line-2);
	background: var(--hg-graphite-2);
	color: var(--hg-text);
}
body.hhm-front-page .hhm-explorer-empty > span { background: var(--hg-gold-soft); color: var(--hg-gold); }
body.hhm-front-page .hhm-explorer-empty p { color: var(--hg-text-2); }

/* --------------------------------------------------------------------------
   3. Product cards — the shop card recipe on the homepage
   -------------------------------------------------------------------------- */

body.hhm-front-page .hhm-home-product {
	border: 1px solid var(--hg-line);
	background: var(--hg-graphite);
	color: var(--hg-text);
	box-shadow: none;
}
body.hhm-front-page .hhm-home-product:hover,
body.hhm-front-page .hhm-home-product:focus-within {
	border-color: rgba(216, 179, 108, .45);
	box-shadow: 0 18px 44px rgba(0, 0, 0, .42);
	transform: translateY(-3px);
}
body.hhm-front-page .hhm-home-product__media {
	background:
		radial-gradient(120% 90% at 50% 0%, #faf6ec 0%, var(--hg-ivory) 55%, var(--hg-ivory-2) 100%);
}
body.hhm-front-page .hhm-home-product__media::after { background: rgba(24, 26, 27, .12); }

/* Brand chips: ivory stage for dark artwork, graphite for white artwork. */
body.hhm-front-page .hhm-home-product__identity .hhm-brand-mark {
	border: 1px solid rgba(242, 239, 231, .16);
	background: linear-gradient(180deg, #faf7ef 0%, #f0ebdf 100%);
}
body.hhm-front-page .hhm-home-product__identity .hhm-brand-mark--surface-dark {
	border-color: rgba(242, 239, 231, .2);
	background: linear-gradient(180deg, #26262b 0%, #1a1a1e 100%);
}
body.hhm-front-page .hhm-home-product__identity .hhm-brand-mark__fallback { color: #3d3a33; }
body.hhm-front-page .hhm-home-product__identity .hhm-brand-mark--surface-dark .hhm-brand-mark__fallback { color: var(--hg-text); }
body.hhm-front-page .hhm-home-product__identity > small { color: var(--hg-text-3); }

body.hhm-front-page .hhm-home-product__meta { color: var(--hg-text-3); }
body.hhm-front-page .hhm-home-product__meta small { color: var(--hg-text-3); }
body.hhm-front-page .hhm-home-product h3 { color: var(--hg-text); }
body.hhm-front-page .hhm-home-product h3 a { color: inherit; }
body.hhm-front-page .hhm-home-product h3 a:hover { color: var(--hg-gold); }

body.hhm-front-page .hhm-variable-preview__label { color: var(--hg-text-3); }
body.hhm-front-page .hhm-variable-preview button {
	border-color: var(--hg-line-2);
	background: var(--hg-graphite-2);
	color: var(--hg-text-2);
}
body.hhm-front-page .hhm-variable-preview button:hover {
	border-color: var(--hg-gold);
	background: var(--hg-graphite-2);
	color: var(--hg-text);
}
body.hhm-front-page .hhm-variable-preview button.is-selected {
	border-color: transparent;
	background: var(--hg-gold-grad);
	color: #17130a;
}

body.hhm-front-page .hhm-home-product__price { color: var(--hg-text); }
body.hhm-front-page .hhm-home-product__price :is(.amount, bdi) { color: var(--hg-text); }
body.hhm-front-page .hhm-home-product__price .woocommerce-Price-currencySymbol { color: var(--hg-text-2); }
body.hhm-front-page .hhm-home-product__price-current { color: var(--hg-text); }
body.hhm-front-page .hhm-home-product__price ins { color: var(--hg-text); }
body.hhm-front-page .hhm-home-product__price del { color: var(--hg-text-3); }
body.hhm-front-page .hhm-home-product__price del :is(.amount, bdi) { color: inherit; }
body.hhm-front-page .hhm-home-product__price > small { color: var(--hg-warn); }
body.hhm-front-page .hhm-home-product__price-request { color: var(--hg-text-2); }

body.hhm-front-page .hhm-home-product__availability { color: var(--hg-ok); }
body.hhm-front-page .hhm-home-product__availability > span {
	background: var(--hg-ok);
	box-shadow: 0 0 7px rgba(143, 199, 164, .8);
}
body.hhm-front-page .hhm-home-product.is-out-of-stock .hhm-home-product__availability { color: var(--hg-text-3); }
body.hhm-front-page .hhm-home-product.is-out-of-stock .hhm-home-product__availability > span { background: rgba(242, 239, 231, .35); box-shadow: none; }
body.hhm-front-page .hhm-home-product.is-price-on-request .hhm-home-product__availability { color: var(--hg-warn); }
body.hhm-front-page .hhm-home-product.is-price-on-request .hhm-home-product__availability > span { background: var(--hg-warn); box-shadow: none; }

/* Secondary actions (view / options / request) are quiet outlines; the AJAX
   add-to-cart uses the shop's gold gradient. WhatsApp = official green. */
body.hhm-front-page .hhm-home-product__action {
	border: 1px solid var(--hg-line-2);
	background: transparent;
	color: var(--hg-text);
}
body.hhm-front-page .hhm-home-product__action:hover,
body.hhm-front-page .hhm-home-product__action:focus-visible {
	border-color: var(--hg-gold);
	background: transparent;
	color: var(--hg-gold);
}
body.hhm-front-page .hhm-home-product__action.ajax_add_to_cart {
	border-color: transparent;
	background: var(--hg-gold-grad);
	color: #141416;
}
body.hhm-front-page .hhm-home-product__action.ajax_add_to_cart:hover,
body.hhm-front-page .hhm-home-product__action.ajax_add_to_cart:focus-visible {
	border-color: transparent;
	background: var(--hg-gold-grad);
	color: #141416;
	filter: brightness(1.07);
}
body.hhm-front-page .hhm-home-product__footer .hhm-product-whatsapp,
body.hhm-front-page .hhm-product-whatsapp {
	border: 1px solid transparent;
	background: var(--hg-wa);
	color: #fff;
}
body.hhm-front-page .hhm-home-product__footer .hhm-product-whatsapp:hover,
body.hhm-front-page .hhm-product-whatsapp:hover,
body.hhm-front-page .hhm-product-whatsapp:focus-visible {
	border-color: transparent;
	background: #1fb959;
	color: #fff;
}
body.hhm-front-page .hhm-home-product.is-added .hhm-home-product__action {
	border-color: transparent;
	background: var(--hg-ok);
	color: #10241a;
	filter: none;
}
body.hhm-front-page .hhm-home-product__feedback { color: var(--hg-ok); }

/* Badges float over the ivory stage. */
body.hhm-front-page .hhm-home-product__badge {
	border-color: rgba(27, 31, 33, .1);
	background: rgba(255, 255, 255, .95);
	color: #33383a;
}
body.hhm-front-page .hhm-home-product__badge--sale { border-color: #8f342d; background: #8f342d; color: #fff; }
body.hhm-front-page .hhm-home-product__badge--new { border-color: #17130a; background: #17130a; color: #e6c885; }
body.hhm-front-page .hhm-home-product__badge--low,
body.hhm-front-page .hhm-home-product__badge--request { border-color: #d6bd7d; background: #f1e4bf; color: #604817; }

/* Compact cards: hairline between stage and body. */
body.hhm-front-page :is(.hhm-home-product--compact, .hhm-home-product--horizontal) .hhm-home-product__media { border-right: 1px solid var(--hg-line); }

/* Featured hero card. */
body.hhm-front-page .hhm-home-product--featured {
	border-color: var(--hg-line-2);
	background: var(--hg-graphite);
}
body.hhm-front-page .hhm-home-product--featured .hhm-home-product__media { border-right: 1px solid var(--hg-line); }
body.hhm-front-page .hhm-home-product--featured .hhm-home-product__body { background: var(--hg-graphite); }
body.hhm-front-page .hhm-home-product--featured .hhm-home-product__meta small { color: var(--hg-gold); }
body.hhm-front-page .hhm-home-product--featured .hhm-home-product__price { color: var(--hg-text); }
body.hhm-front-page .hhm-home-product--featured .hhm-product-whatsapp {
	border-color: transparent;
	background: var(--hg-wa);
	color: #fff;
}

/* --------------------------------------------------------------------------
   4. Live offers + Most requested (new shelves)
   -------------------------------------------------------------------------- */

body.hhm-front-page .hhm-gold-offers {
	border-block: 1px solid var(--hg-line);
	background:
		radial-gradient(70% 120% at 85% 0%, rgba(216, 179, 108, .1) 0%, transparent 60%),
		var(--hg-graphite);
}
body.hhm-front-page .hhm-gold-best {
	border-top: 1px solid var(--hg-line);
	background: var(--hg-ink-2);
}

/* --------------------------------------------------------------------------
   5. New arrivals shelf
   -------------------------------------------------------------------------- */

body.hhm-front-page .hhm-new-shelf {
	border-block: 1px solid var(--hg-line);
	background: var(--hg-ink);
}
body.hhm-front-page .hhm-new-shelf .hhm-balance-heading h2 { color: var(--hg-text); }
body.hhm-front-page .hhm-new-shelf .hhm-balance-kicker { color: var(--hg-gold); }
body.hhm-front-page .hhm-new-shelf .hhm-balance-heading--inline > a { color: var(--hg-gold) !important; }
body.hhm-front-page .hhm-new-shelf .hhm-balance-heading--inline > a:hover { color: #ecd6a4 !important; }

/* --------------------------------------------------------------------------
   6. Operation explorer — graphite stage
   -------------------------------------------------------------------------- */

body.hhm-front-page .hhm-operation-explorer {
	background: var(--hg-ink);
	color: var(--hg-text);
}
body.hhm-front-page .hhm-operation-explorer .hhm-balance-heading > p { color: var(--hg-text-2); }
body.hhm-front-page .hhm-operation-tabs button {
	border: 1px solid var(--hg-line-2);
	background: var(--hg-graphite);
	color: var(--hg-text-2);
	transition: border-color .16s ease, background .16s ease, color .16s ease;
}
body.hhm-front-page .hhm-operation-tabs button:hover {
	border-color: rgba(216, 179, 108, .5);
	color: var(--hg-text);
}
body.hhm-front-page .hhm-operation-tabs button.is-active {
	border-color: transparent;
	background: var(--hg-gold-grad);
	color: #17130a;
}
body.hhm-front-page .hhm-operation-tabs button > span:first-child {
	background: var(--hg-gold-soft);
	color: var(--hg-gold);
}
body.hhm-front-page .hhm-operation-tabs button.is-active > span:first-child {
	background: rgba(10, 10, 12, .18);
	color: #17130a;
}
body.hhm-front-page .hhm-operation-tabs small { color: var(--hg-text-3); }
body.hhm-front-page .hhm-operation-tabs button.is-active small { color: rgba(23, 19, 10, .66); }
body.hhm-front-page .hhm-operation-tabs button > svg { color: var(--hg-text-3); }
body.hhm-front-page .hhm-operation-tabs button.is-active > svg { color: #17130a; }
body.hhm-front-page .hhm-operation-stage {
	border-color: var(--hg-line);
	background: var(--hg-graphite);
}
body.hhm-front-page .hhm-operation-stage__top span { color: var(--hg-text-3); }
body.hhm-front-page .hhm-operation-stage__top strong { color: var(--hg-text); }
body.hhm-front-page .hhm-operation-stage__terms a {
	border-color: var(--hg-line-2);
	color: var(--hg-text-2);
}
body.hhm-front-page .hhm-operation-stage__terms a:hover { border-color: var(--hg-gold); color: var(--hg-gold); }

/* --------------------------------------------------------------------------
   7. Brand discovery — ivory logo chips on ink
   -------------------------------------------------------------------------- */

body.hhm-front-page .hhm-brand-discovery {
	border-top: 1px solid var(--hg-line);
	background: var(--hg-ink-2);
	color: var(--hg-text);
}
body.hhm-front-page .hhm-brand-discovery__intro p:last-child { color: var(--hg-text-2); }
body.hhm-front-page .hhm-brand-discovery__intro button {
	border: 1px solid var(--hg-line-2);
	background: transparent;
	color: var(--hg-gold);
	transition: border-color .16s ease, color .16s ease;
}
body.hhm-front-page .hhm-brand-discovery__intro button:hover { border-color: var(--hg-gold); color: #ecd6a4; }
body.hhm-front-page .hhm-brand-featured {
	gap: 10px;
	border: 0;
}
body.hhm-front-page .hhm-brand-featured > a {
	border: 1px solid rgba(242, 239, 231, .14);
	border-radius: 13px;
	background: linear-gradient(180deg, #faf7ef 0%, #f0ebdf 100%);
	transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
body.hhm-front-page .hhm-brand-featured > a:hover {
	border-color: rgba(216, 179, 108, .6);
	background: linear-gradient(180deg, #fdfbf5 0%, #f4efe3 100%);
	box-shadow: 0 12px 30px rgba(0, 0, 0, .35);
	transform: translateY(-2px);
}
body.hhm-front-page .hhm-brand-featured img { filter: none; }
/* The tile itself is the ivory stage — no chip-inside-chip. */
body.hhm-front-page .hhm-brand-featured .hhm-brand-mark {
	border: 0;
	background: transparent;
	box-shadow: none;
}
body.hhm-front-page .hhm-brand-featured .hhm-brand-mark--surface-dark {
	border: 1px solid rgba(242, 239, 231, .2);
	border-radius: 9px;
	background: linear-gradient(180deg, #26262b 0%, #1a1a1e 100%);
	padding-inline: 10px;
}
body.hhm-front-page .hhm-brand-featured strong { color: #2c2a24; }
body.hhm-front-page .hhm-brand-featured span { color: #6f6a5d; }
body.hhm-front-page .hhm-all-brands {
	border-color: var(--hg-line);
	background: var(--hg-graphite);
}
body.hhm-front-page .hhm-all-brands__top span { color: var(--hg-text-3); }
body.hhm-front-page .hhm-all-brands__top strong { color: var(--hg-text); }
body.hhm-front-page .hhm-all-brands__top label {
	border-color: var(--hg-line-2);
	background: var(--hg-graphite-2);
}
body.hhm-front-page .hhm-all-brands__top label svg { color: var(--hg-text-3); }
body.hhm-front-page .hhm-all-brands__top input {
	background: transparent !important;
	color: var(--hg-text) !important;
}
body.hhm-front-page .hhm-all-brands__top input::placeholder { color: var(--hg-text-3); }
body.hhm-front-page .hhm-all-brands__grid { border-color: var(--hg-line); }
body.hhm-front-page .hhm-all-brands__grid a {
	border-color: var(--hg-line);
	background: var(--hg-graphite);
	color: var(--hg-text-2);
}
body.hhm-front-page .hhm-all-brands__grid strong { color: var(--hg-text-2); }
body.hhm-front-page .hhm-all-brands__grid span { color: var(--hg-text-3); }
body.hhm-front-page .hhm-all-brands__grid a:hover { background: var(--hg-graphite-2); color: var(--hg-gold); }
body.hhm-front-page .hhm-all-brands__grid a:hover strong { color: var(--hg-gold); }
body.hhm-front-page .hhm-all-brands__empty { color: var(--hg-text-2); }

/* --------------------------------------------------------------------------
   8. Curated zones — graphite panels
   -------------------------------------------------------------------------- */

body.hhm-front-page .hhm-curated-zones {
	border-top: 1px solid var(--hg-line);
	background: var(--hg-ink);
	color: var(--hg-text);
}
body.hhm-front-page .hhm-curated-zones .hhm-balance-heading > p { color: var(--hg-text-2); }
body.hhm-front-page .hhm-curated-zone {
	border: 1px solid var(--hg-line);
	background: var(--hg-graphite);
}
body.hhm-front-page .hhm-curated-zone--warm {
	background:
		radial-gradient(80% 100% at 100% 0%, rgba(216, 179, 108, .08) 0%, transparent 55%),
		var(--hg-graphite);
}
body.hhm-front-page .hhm-curated-zone > header > span {
	background: var(--hg-gold-soft);
	color: var(--hg-gold);
}
body.hhm-front-page .hhm-curated-zone > header small { color: var(--hg-text-3); }
body.hhm-front-page .hhm-curated-zone > header h3 { color: var(--hg-text); }
body.hhm-front-page .hhm-curated-zone > header > a { color: var(--hg-gold); }
body.hhm-front-page .hhm-curated-zone > header > a:hover { color: #ecd6a4; }
body.hhm-front-page .hhm-curated-zone .hhm-home-product { background: var(--hg-graphite-2); }

/* --------------------------------------------------------------------------
   9. Store in numbers (new)
   -------------------------------------------------------------------------- */

body.hhm-front-page .hhm-gold-stats {
	border-block: 1px solid var(--hg-line);
	background:
		radial-gradient(60% 140% at 50% 0%, rgba(216, 179, 108, .12) 0%, transparent 65%),
		var(--hg-ink-2);
}
body.hhm-front-page .hhm-gold-stats__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	padding-block: 44px;
}
body.hhm-front-page .hhm-gold-stats__grid > div {
	padding-inline: 30px;
	border-left: 1px solid var(--hg-line);
}
body.hhm-front-page .hhm-gold-stats__grid > div:first-child { padding-left: 0; border-left: 0; }
body.hhm-front-page .hhm-gold-stats__grid strong {
	display: block;
	background: var(--hg-gold-grad);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	font-size: clamp(2rem, 3.4vw, 2.9rem);
	font-weight: 740;
	font-variant-numeric: tabular-nums;
	letter-spacing: -.03em;
	line-height: 1.05;
}
body.hhm-front-page .hhm-gold-stats__grid span {
	display: block;
	margin-top: 7px;
	color: var(--hg-text-2);
	font-size: .78rem;
}

/* --------------------------------------------------------------------------
   10. B2B, guides, support, footer polish
   -------------------------------------------------------------------------- */

body.hhm-front-page .hhm-balance-b2b { background: var(--hg-ink); }
body.hhm-front-page .hhm-balance-b2b__shell {
	border-color: var(--hg-line-2);
	background:
		radial-gradient(70% 120% at 100% 0%, rgba(216, 179, 108, .09) 0%, transparent 55%),
		linear-gradient(120deg, var(--hg-graphite-2) 0%, var(--hg-graphite) 70%);
}
body.hhm-front-page .hhm-balance-b2b__steps span { border-color: var(--hg-line); color: var(--hg-text-2); }
body.hhm-front-page .hhm-balance-b2b__steps strong { color: var(--hg-gold); }
body.hhm-front-page .hhm-balance-button--gold { background: var(--hg-gold-grad); color: #17130a; }
body.hhm-front-page .hhm-balance-button--gold:hover { background: var(--hg-gold-grad); filter: brightness(1.07); }

body.hhm-front-page .hhm-balance-guides {
	border-top: 1px solid var(--hg-line);
	background: var(--hg-ink-2);
	color: var(--hg-text);
}
body.hhm-front-page .hhm-balance-guides .hhm-balance-heading > a { color: var(--hg-gold); }
body.hhm-front-page .hhm-balance-guides article {
	border-color: var(--hg-line);
	background: var(--hg-graphite);
	transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}
body.hhm-front-page .hhm-balance-guides article:hover {
	border-color: rgba(216, 179, 108, .4);
	box-shadow: 0 16px 40px rgba(0, 0, 0, .4);
	transform: translateY(-2px);
}
body.hhm-front-page .hhm-balance-guide__media { background: var(--hg-ink-2); }
body.hhm-front-page .hhm-balance-guide__media > span { color: var(--hg-text-3); }
body.hhm-front-page .hhm-balance-guides time { color: var(--hg-gold); }
body.hhm-front-page .hhm-balance-guides h3 { color: var(--hg-text); }
body.hhm-front-page .hhm-balance-guides h3 a { color: inherit; }
body.hhm-front-page .hhm-balance-guides h3 a:hover { color: var(--hg-gold); }
body.hhm-front-page .hhm-balance-guides article p { color: var(--hg-text-2); }

body.hhm-front-page .hhm-balance-support {
	border-top: 1px solid var(--hg-line);
	background: var(--hg-ink);
}
body.hhm-front-page .hhm-balance-support__layout > div:last-child { color: var(--hg-text-2); }
body.hhm-front-page .hhm-balance-support nav a {
	border-color: var(--hg-line-2);
	color: var(--hg-text-2);
}
body.hhm-front-page .hhm-balance-support nav a:hover { border-color: var(--hg-gold); color: var(--hg-gold); }

body.hhm-front-page .hhm-footer { border-top: 1px solid var(--hg-line); background: #070708; }

/* --------------------------------------------------------------------------
   11. Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 1024px) {
	body.hhm-front-page .hhm-gold-stats__grid { grid-template-columns: repeat(2, 1fr); gap: 26px 0; padding-block: 36px; }
	body.hhm-front-page .hhm-gold-stats__grid > div:nth-child(odd) { padding-left: 0; border-left: 0; }
}

@media (max-width: 768px) {
	body.hhm-front-page .hhm-gold-signals__track { justify-content: flex-start; gap: 20px; padding-block: 13px; }
	body.hhm-front-page .hhm-gold-stats__grid strong { font-size: clamp(1.7rem, 8vw, 2.2rem); }
	body.hhm-front-page .hhm-gold-stats__grid span { font-size: .72rem; }
}

@media (max-width: 480px) {
	body.hhm-front-page .hhm-gold-stats__grid { padding-block: 30px; }
	body.hhm-front-page .hhm-gold-stats__grid > div { padding-inline: 16px; }
	/* The 480px container leaves 12px per side; the bleed-out shelves must
	   match it exactly or the page gains a 2px horizontal scroll. */
	body.hhm-front-page .hhm-product-shelf,
	body.hhm-front-page .hhm-curated-zones__grid,
	body.hhm-front-page .hhm-balance-guides__grid {
		margin-inline: -12px;
		padding-inline: 12px;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.hhm-front-page .hhm-brand-featured > a,
	body.hhm-front-page .hhm-balance-guides article,
	body.hhm-front-page .hhm-explorer-controls button,
	body.hhm-front-page .hhm-operation-tabs button { transition: none; }
}