/* ==========================================================================
   KC Redesign — Direction 1 "Corner-Store Premium"
   Tokens first; every component keys off them. Scope: additive overrides on
   Savoy; no layout re-architecture. Kill switch removes this file entirely.
   ========================================================================== */

/* ==========================================================================
   0. TOKENS — the three-layer system from docs/brand-kit.html v2.3
   --------------------------------------------------------------------------
   LAYER 1 primitive : raw values, named for what they are. A component must
                       never reference these directly.
   LAYER 2 semantic  : purpose aliases. The only layer that would change for a
                       theme variant.
   LAYER 3 component : the only tokens component CSS is allowed to name.

   The discipline is the point: when a component reaches past its layer, one
   colour change stops being one edit. (I broke this rule myself in the kit's
   first draft — the strain chips reached into layer 1 — hence --strain-* below.)
   ========================================================================== */

:root {
	/* ---------- LAYER 1 · primitive ---------- */
	--kc-cream-50:   #FFFBF2;
	--kc-cream-100:  #F0EDE2;
	--kc-ink-900:    #1F1A17;
	--kc-white:      #FFFFFF;
	--kc-amber-400:  #FFC93C;
	--kc-pine-700:   #1E5B3C;
	--kc-pine-300:   #6FA383;
	--kc-tomato-600: #D9482B;
	--kc-indigo-700: #3B3F73;
	--kc-ochre-600:  #B5702A;

	--kc-space-1: 4px;  --kc-space-2: 8px;  --kc-space-3: 12px;
	--kc-space-4: 16px; --kc-space-5: 24px; --kc-space-6: 32px;
	--kc-space-7: 48px; --kc-space-8: 64px;

	--kc-radius-sm: 2px; --kc-radius-md: 4px; --kc-radius-lg: 12px;

	--kc-font-display: 'Gazella', Georgia, serif;
	--kc-font-body:    'Poppins', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
	--kc-font-data:    ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, monospace;

	/* ---------- LAYER 2 · semantic ---------- */
	--surface:        var(--kc-cream-50);
	--surface-sunken: var(--kc-cream-100);
	--surface-raised: var(--kc-white);
	--text:           var(--kc-ink-900);
	--text-muted:     rgba(31, 26, 23, .70);
	--text-faint:     rgba(31, 26, 23, .45);
	--border:         rgba(31, 26, 23, .12);
	--border-strong:  rgba(31, 26, 23, .28);
	--action:         var(--kc-amber-400);
	--on-action:      var(--kc-ink-900);
	--trust:          var(--kc-pine-700);
	--on-trust:       var(--kc-cream-50);
	--urgent:         var(--kc-tomato-600);
	--strain-indica:  var(--kc-indigo-700);
	--strain-sativa:  var(--kc-ochre-600);
	--strain-hybrid:  var(--kc-pine-700);

	/* ---------- LAYER 3 · component ---------- */
	--btn-primary-bg:     var(--action);
	--btn-primary-text:   var(--on-action);
	--btn-primary-border: var(--text);
	--btn-primary-shadow: 3px 3px 0 var(--text);
	--btn-min-height:     48px;

	--card-bg:      var(--surface-raised);
	--card-border:  var(--border);
	--card-radius:  var(--kc-radius-md);
	--card-shot-bg: var(--surface-sunken);

	--tier-bg-selected:     var(--action);
	--tier-border-selected: var(--text);
	--tier-border-idle:     var(--border);

	--chip-indica-bg: var(--strain-indica);
	--chip-sativa-bg: var(--strain-sativa);
	--chip-hybrid-bg: var(--strain-hybrid);

	--field-bg:      var(--surface-raised);
	--field-border:  var(--border-strong);
	--field-radius:  var(--kc-radius-md);
	--field-height:  48px;

	--panel-bg:      var(--surface);
	--panel-shadow:  0 0 40px rgba(31, 26, 23, .18);

	--price-font: var(--kc-font-data);
	--label-font: var(--kc-font-data);

	--measure: 64ch;
	--gutter:  clamp(16px, 5vw, 32px);

	/* ---------- Back-compat aliases ----------
	   The 1,600 lines written before the kit existed name these. They are kept
	   pointing at the semantic layer rather than rewritten in place: a blind
	   find-and-replace across live CSS is exactly how you break three things
	   you did not know were related. New CSS uses the layer-3 names. */
	--kc-paper:  var(--surface);
	--kc-ink:    var(--text);
	--kc-yellow: var(--action);
	--kc-pine:   var(--trust);
	--kc-tomato: var(--urgent);
	--kc-ink-10: var(--border);
	--kc-ink-60: var(--text-muted);
	/* Was a flat 8px. The kit's radius scale has no 8 — cards and controls are
	   4px, only large panels are 12px. Every one of the 14 existing call sites
	   is a card or a control, so this alias resolves to md. Panels name
	   --kc-radius-lg directly. */
	--kc-radius: var(--kc-radius-md);
	/* Was 4px 4px 0. The kit specifies 3px 3px 0 and the pressed state depends
	   on the exact offset (translate matches the shadow), so this is not
	   cosmetic drift — it keeps press feedback aligned. */
	--kc-shadow: var(--btn-primary-shadow);
}

/* --------------------------------------------------------------------------
   1. Ground + type contrast (the "no grey text on money elements" rule)
   -------------------------------------------------------------------------- */

body.kc-rd {
	background: var(--kc-paper);
	color: var(--kc-ink);
	font-size: 15px;
}

body.kc-rd #nm-header,
body.kc-rd .nm-header { background: var(--kc-paper); }

/* Product titles + prices: ink, weighted — never grey */
body.kc-rd ul.nm-products li.product h3,
body.kc-rd ul.nm-products li.product h3 a,
body.kc-rd ul.nm-products li.product a.nm-shop-loop-title-link,
body.kc-rd ul.nm-products li.product .nm-shop-loop-title,
body.kc-rd ul.nm-products li.product .woocommerce-loop-product__title {
	color: var(--kc-ink);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
}

body.kc-rd ul.nm-products li.product .price {
	color: var(--kc-ink);
	font-size: 17px;
	font-weight: 600;
}
body.kc-rd ul.nm-products li.product .price del {
	color: var(--kc-ink-60);
	font-weight: 400;
	font-size: 14px;
}
body.kc-rd ul.nm-products li.product .price ins { text-decoration: none; color: var(--kc-tomato); }

/* Cards: flat paper card, hairline ink border */
body.kc-rd ul.nm-products li.product .nm-shop-loop-product-wrap {
	background: #fff;
	border: 1px solid var(--kc-ink-10);
	border-radius: var(--kc-radius);
	padding: 10px 12px 14px;
	transition: border-color .15s ease, transform .15s ease;
}
body.kc-rd ul.nm-products li.product .nm-shop-loop-product-wrap:hover {
	border-color: var(--kc-ink);
	transform: translateY(-2px);
}

/* PDP body copy: readable, left-aligned (kills justify rivers on mobile) */
body.kc-rd .nm-product-summary p,
body.kc-rd .kc-pdp-desc p,
body.kc-rd .woocommerce-product-details__short-description p {
	text-align: left !important;
	font-size: 15px;
	line-height: 1.65;
	color: var(--kc-ink);
}

body.kc-rd .nm-product-summary .price {
	color: var(--kc-ink);
	font-weight: 700;
	font-size: 24px;
}
body.kc-rd .nm-product-summary .price del { color: var(--kc-ink-60); font-weight: 400; font-size: 17px; }
body.kc-rd .nm-product-summary .price ins { text-decoration: none; color: var(--kc-tomato); }

/* Announcement bar -> pine */
body.kc-rd .nm-top-bar,
body.kc-rd #nm-top-bar {
	background: var(--kc-pine);
}
body.kc-rd .nm-top-bar,
body.kc-rd .nm-top-bar p,
body.kc-rd .nm-top-bar a,
body.kc-rd #nm-top-bar p { color: #FFFBF2 !important; }

/* --------------------------------------------------------------------------
   2. Buttons: ONE primary spec (yellow + ink border + hard shadow),
      one secondary spec (ink outline). Scoped to money CTAs only.
   -------------------------------------------------------------------------- */

body.kc-rd .single_add_to_cart_button,
body.kc-rd .kc-sticky-btn,
body.kc-rd #place_order,
body.kc-rd .nm-cart-panel .button.checkout,
body.kc-rd .woocommerce-mini-cart__buttons .button.checkout,
body.kc-rd ul.nm-products li.product .button,
body.kc-rd .kc-ba-add.add_to_cart_button {
	background: var(--kc-yellow) !important;
	color: var(--kc-ink) !important;
	border: 2px solid var(--kc-ink) !important;
	border-radius: var(--kc-radius) !important;
	box-shadow: var(--kc-shadow);
	font-weight: 700;
	text-transform: none;
	transition: transform .12s ease, box-shadow .12s ease;
}
body.kc-rd .single_add_to_cart_button:hover,
body.kc-rd .kc-sticky-btn:hover,
body.kc-rd #place_order:hover,
body.kc-rd .nm-cart-panel .button.checkout:hover,
body.kc-rd ul.nm-products li.product .button:hover {
	transform: translate(3px, 3px); /* seats the 3px hard shadow exactly */
	box-shadow: 0 0 0 var(--kc-ink);
	background: var(--kc-yellow) !important;
}

body.kc-rd .kc-btn-secondary,
body.kc-rd .woocommerce-mini-cart__buttons .button:not(.checkout) {
	background: transparent !important;
	color: var(--kc-ink) !important;
	border: 2px solid var(--kc-ink) !important;
	border-radius: var(--kc-radius) !important;
	box-shadow: none;
	font-weight: 600;
}

/* --------------------------------------------------------------------------
   3. Weight pills (PDP)
   -------------------------------------------------------------------------- */

/* Native select stays functional but invisible; pills drive it */
body.kc-rd .kc-native-variation-select { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.kc-weight-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 6px 0 4px;
}
.kc-weight-pill {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	min-width: 86px;
	padding: 10px 14px;
	background: #fff;
	border: 2px solid var(--kc-ink-10);
	border-radius: var(--kc-radius);
	cursor: pointer;
	font-family: inherit;
	line-height: 1.2;
	transition: border-color .12s ease, background .12s ease;
}
.kc-weight-pill:hover { border-color: var(--kc-ink); }
.kc-weight-pill.kc-active {
	border-color: var(--kc-ink);
	background: var(--kc-yellow);
	box-shadow: 2px 2px 0 var(--kc-ink);
}
.kc-pill-weight { font-weight: 700; font-size: 15px; color: var(--kc-ink); }
.kc-pill-price  { font-size: 13px; font-weight: 600; color: var(--kc-ink); }
/* Pricing-plugin wrappers force their own colors — pin regular prices to ink,
   discounted (<ins>) to tomato, struck (<del>) to muted.
   NOTE the deliberately heavy selectors: the inherited child-theme style.css
   paints prices #e92929 with (0,5,1)+!important rules; these must out-rank it. */
body.kc-rd .product .nm-product-summary-inner-col .kc-weight-pill .price,
body.kc-rd .product .nm-product-summary-inner-col .kc-weight-pill .price span.woocommerce-Price-amount.amount,
body.kc-rd .product .nm-product-summary-inner-col .kc-weight-pill .price span.woocommerce-Price-amount.amount bdi,
body.kc-rd .product #nm-variations-form .kc-weight-pill .price .woocommerce-Price-amount.amount,
body.kc-rd .product #nm-variations-form .kc-weight-pill .price .woocommerce-Price-amount.amount bdi,
.kc-pill-price .price,
.kc-pill-price .amount,
.kc-pill-price bdi { color: var(--kc-ink) !important; font-size: 13px !important; }
body.kc-rd .product .nm-product-summary-inner-col .kc-weight-pill .price del,
body.kc-rd .product .nm-product-summary-inner-col .kc-weight-pill .price del .amount,
.kc-pill-price del,
.kc-pill-price del .amount { color: var(--kc-ink-60) !important; margin-right: 3px; font-weight: 400; }
body.kc-rd .product .nm-product-summary-inner-col .kc-weight-pill .price del + ins,
body.kc-rd .product .nm-product-summary-inner-col .kc-weight-pill .price del + ins .amount,
.kc-pill-price del + ins,
.kc-pill-price del + ins .amount { text-decoration: none; color: var(--kc-tomato) !important; }

/* Pills already show the live price — Woo's separate variation-price block is
   redundant noise right under them. */
body.kc-rd form.variations_form:has(.kc-weight-pills) .woocommerce-variation-price { display: none; }

/* Quantity stepper: bigger tap targets, boxed */
body.kc-rd form.cart .quantity {
	border: 2px solid var(--kc-ink-10);
	border-radius: var(--kc-radius);
	padding: 6px 10px;
	background: #fff;
}
.kc-pill-pergram { font-size: 11px; color: var(--kc-ink-60); }
.kc-pill-oos { opacity: .4; cursor: not-allowed; text-decoration: line-through; }

/* --------------------------------------------------------------------------
   4. Collapsible PDP description (content stays in DOM = SEO safe)
   -------------------------------------------------------------------------- */

.kc-pdp-desc { margin-top: 18px; border-top: 1px solid var(--kc-ink-10); padding-top: 14px; }
.kc-pdp-desc .kc-pdp-desc-inner {
	max-height: 7.5em;
	overflow: hidden;
	position: relative;
}
.kc-pdp-desc.kc-open .kc-pdp-desc-inner { max-height: none; }
.kc-pdp-desc:not(.kc-open) .kc-pdp-desc-inner::after {
	content: "";
	position: absolute; left: 0; right: 0; bottom: 0; height: 2.2em;
	background: linear-gradient(rgba(255,255,255,0), #fff);
}
.kc-pdp-desc-toggle {
	background: none; border: none; padding: 6px 0 0;
	color: var(--kc-pine); font-weight: 700; cursor: pointer; font-size: 14px;
}

/* --------------------------------------------------------------------------
   5. Sticky mobile ATC bar
   -------------------------------------------------------------------------- */

.kc-sticky-atc {
	position: fixed;
	left: 0; right: 0; bottom: 0;
	z-index: 9998;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
	background: var(--kc-paper);
	border-top: 2px solid var(--kc-ink);
	transform: translateY(110%);
	transition: transform .2s ease;
}
.kc-sticky-atc.kc-visible { transform: translateY(0); }
.kc-sticky-info { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.kc-sticky-name {
	font-weight: 600; font-size: 13px; color: var(--kc-ink);
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.kc-sticky-price,
body.kc-rd .kc-sticky-atc .kc-sticky-price .price,
body.kc-rd .kc-sticky-atc .kc-sticky-price .amount,
body.kc-rd .kc-sticky-atc .kc-sticky-price bdi { font-weight: 700; font-size: 15px; color: var(--kc-ink) !important; }
.kc-sticky-price del,
body.kc-rd .kc-sticky-atc .kc-sticky-price del .amount { color: var(--kc-ink-60) !important; font-weight: 400; }
.kc-sticky-price del + ins,
body.kc-rd .kc-sticky-atc .kc-sticky-price del + ins .amount { text-decoration: none; color: var(--kc-tomato) !important; }
.kc-sticky-btn { padding: 12px 22px; white-space: nowrap; }
@media (min-width: 769px) { .kc-sticky-atc { display: none; } }

/* While the sticky bar is up, lift chat bubbles clear of the CTA */
body.kc-atc-shown #ht-ctc-chat,
body.kc-atc-shown .wa__btn_popup,
body.kc-atc-shown [class*="whatsapp"][class*="btn"],
body.kc-atc-shown [id*="whatsapp"],
body.kc-atc-shown .joinchat__button,
body.kc-atc-shown [class*="wa-chat"],
body.kc-atc-shown [class*="floating-wpp"] {
	bottom: 92px !important;
	transition: bottom .2s ease;
}

/* Long description sections below the summary: never justified */
body.kc-rd.single-product .entry-content p,
body.kc-rd.single-product [class*="description"] p,
body.kc-rd.single-product .woocommerce-Tabs-panel p,
body.kc-rd.single-product #tab-description p { text-align: left !important; }

/* --------------------------------------------------------------------------
   6. Side cart: threshold bar + checkout-first buttons
   -------------------------------------------------------------------------- */

/* .kc-threshold* (the single-bar free-shipping meter) died when gift-tiers
   replaced it with the .kc-ladder milestone strip in 30/60 partials —
   verified zero hits in rendered HTML 2026-08-23. Deleted, not layered.
   Legacy "Choose a Free Gift" picker hidden below: the owner's four-tier
   auto-add ladder supersedes it, and left visible it double-gifts and
   surfaces a mushroom product on the money path (both call sites). */
body.kc-rd .gift_block_custom-wrapper { display: none; }

/* --------------------------------------------------------------------------
   7. Enclosed checkout
   -------------------------------------------------------------------------- */

/* Hide navigation chrome; logo stays as the single escape hatch */
body.kc-enclosed-checkout .nm-main-menu,
body.kc-enclosed-checkout #nm-main-menu,
body.kc-enclosed-checkout .nm-menu,
body.kc-enclosed-checkout .nm-header-menu,
body.kc-enclosed-checkout .nm-mobile-menu-button,
body.kc-enclosed-checkout .nm-menu-search-button,
body.kc-enclosed-checkout .nm-menu-account,
body.kc-enclosed-checkout #nm-footer,
body.kc-enclosed-checkout .nm-footer,
body.kc-enclosed-checkout [class*="fast-weed-delivery-cities-list"],
body.kc-enclosed-checkout #nm-footer .nm-footer-widgets,
body.kc-enclosed-checkout .nm-footer-widgets,
body.kc-enclosed-checkout #nm-footer-bar,
body.kc-enclosed-checkout .nm-footer-bar { display: none !important; }

.kc-checkout-footline {
	display: flex; justify-content: center; gap: 28px;
	padding: 22px 0 30px;
	font-size: 13px;
}
.kc-checkout-footline a { color: var(--kc-ink-60); text-decoration: none; }
.kc-checkout-footline a:hover { color: var(--kc-ink); }

/* Payment methods as radio cards */
body.kc-rd .wc_payment_methods { display: flex; flex-direction: column; gap: 10px; }
body.kc-rd .wc_payment_method {
	border: 2px solid var(--kc-ink-10);
	border-radius: var(--kc-radius);
	padding: 14px 16px !important;
	background: #fff;
	transition: border-color .12s ease;
}
body.kc-rd .wc_payment_method:has(input:checked) {
	border-color: var(--kc-ink);
	background: var(--kc-paper);
	box-shadow: 2px 2px 0 var(--kc-ink);
}
body.kc-rd .wc_payment_method > label {
	font-weight: 700 !important;
	color: var(--kc-ink) !important;
	cursor: pointer;
}
.kc-pay-explain { font-size: 13px; line-height: 1.55; color: var(--kc-ink); }
.kc-pay-explain ol, .kc-pay-explain ul { margin: 6px 0 0 20px; padding: 0; }
.kc-pay-explain ol { list-style: decimal !important; }
.kc-pay-explain ul { list-style: disc !important; }
.kc-pay-explain li { margin-bottom: 3px; display: list-item !important; border: 0 !important; padding: 2px 0 !important; }
.kc-pay-fee { color: var(--kc-tomato); font-weight: 600; margin-bottom: 6px; }

.kc-trust-line {
	font-size: 12px;
	color: var(--kc-ink-60);
	margin: 10px 0 8px;
	text-align: center;
}

/* --------------------------------------------------------------------------
   8. e-Transfer instruction panel (thank-you / view-order)
   -------------------------------------------------------------------------- */

.kc-emt-panel {
	border: 2px solid var(--kc-ink);
	border-radius: var(--kc-radius);
	background: #fff;
	box-shadow: var(--kc-shadow);
	padding: 20px 22px;
	margin: 0 0 26px;
}
.kc-emt-panel h3 { margin: 0 0 10px; color: var(--kc-ink); }
.kc-emt-panel ol { margin: 0 0 10px 18px; padding: 0; }
.kc-emt-panel li { margin-bottom: 7px; font-size: 14px; }
.kc-emt-status { font-size: 13px; color: var(--kc-pine); margin: 0; }
.kc-copy-btn {
	margin-left: 6px;
	font-size: 11px;
	padding: 2px 8px;
	border: 1px solid var(--kc-ink);
	border-radius: 5px;
	background: var(--kc-paper);
	cursor: pointer;
}
.kc-copy-btn.kc-copied { background: var(--kc-pine); color: #fff; }

/* --------------------------------------------------------------------------
   9. My Account — Buy again grid
   -------------------------------------------------------------------------- */

.kc-buy-again { margin-bottom: 34px; }
.kc-buy-again h3 { margin-bottom: 14px; }
.kc-buy-again-grid {
	list-style: none;
	margin: 0; padding: 0;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
}
@media (max-width: 900px) { .kc-buy-again-grid { grid-template-columns: repeat(2, 1fr); } }
.kc-buy-again-grid li {
	background: #fff;
	border: 1px solid var(--kc-ink-10);
	border-radius: var(--kc-radius);
	padding: 10px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.kc-ba-thumb img { border-radius: 6px; width: 100%; height: auto; }
.kc-ba-title { font-size: 13px; font-weight: 600; color: var(--kc-ink); line-height: 1.3; }
.kc-ba-price { font-size: 14px; font-weight: 700; color: var(--kc-ink); }
.kc-ba-price del { color: var(--kc-ink-60); font-weight: 400; }
.kc-ba-price ins { text-decoration: none; color: var(--kc-tomato); }
.kc-ba-add { margin-top: auto; text-align: center; font-size: 13px !important; padding: 9px 10px !important; }

/* --------------------------------------------------------------------------
   10. Effects row on PDP -> chips
   -------------------------------------------------------------------------- */

body.kc-rd .nm-product-summary .jwa-effects a,
body.kc-rd .nm-product-summary [class*="effect"] a {
	display: inline-block;
	padding: 4px 12px;
	margin: 0 6px 6px 0;
	border: 1px solid var(--kc-ink-10);
	border-radius: 999px;
	background: #fff;
	color: var(--kc-ink);
	font-size: 13px;
	text-decoration: none;
}
body.kc-rd .nm-product-summary [class*="effect"] a:hover { border-color: var(--kc-pine); color: var(--kc-pine); }

/* --------------------------------------------------------------------------
   11. Category page header (Group B, presentation only)
   -------------------------------------------------------------------------- */

body.kc-rd #nm-shop .breadcrumbs {
	color: var(--kc-ink-60);
	font-size: 12px;
	letter-spacing: .05em;
	text-transform: uppercase;
}
body.kc-rd #nm-shop .breadcrumbs a { color: var(--kc-ink-60); }
body.kc-rd #nm-shop .breadcrumbs a:hover { color: var(--kc-ink); }

body.kc-rd #nm-shop h1.title {
	color: var(--kc-ink);
	position: relative;
	padding-bottom: 16px;
	margin-bottom: 18px;
}
body.kc-rd #nm-shop h1.title::after {
	content: "";
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 0;
	width: 56px;
	height: 6px;
	border-radius: 999px;
	background: var(--kc-yellow);
	box-shadow: 2px 2px 0 var(--kc-ink);
}

/* --------------------------------------------------------------------------
   12. Shop sidebar: business-first tree, readable hierarchy
   -------------------------------------------------------------------------- */

@media (min-width: 992px) {
	body.kc-rd #nm-shop-sidebar > .nm-shop-sidebar {
		position: sticky;
		top: 96px;
	}
}

body.kc-rd #nm-shop-sidebar .widget-title,
body.kc-rd #nm-shop-sidebar h3 {
	color: var(--kc-ink);
	font-weight: 700;
}

body.kc-rd #nm-shop-sidebar .product-categories { list-style: none; }

/* Top-level categories */
body.kc-rd #nm-shop-sidebar .product-categories > li > a {
	display: block;
	padding: 7px 0;
	color: var(--kc-ink);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
}
body.kc-rd #nm-shop-sidebar .product-categories > li > a:hover { color: var(--kc-pine); }

/* Subcategories: indented rail */
body.kc-rd #nm-shop-sidebar .product-categories .children {
	list-style: none;
	margin: 2px 0 6px 4px;
	padding-left: 12px;
	border-left: 2px solid var(--kc-ink-10);
}
body.kc-rd #nm-shop-sidebar .product-categories .children li a {
	display: block;
	padding: 5px 0;
	color: var(--kc-ink-60);
	font-size: 13px;
	font-weight: 400;
}
body.kc-rd #nm-shop-sidebar .product-categories .children li a:hover { color: var(--kc-ink); }

/* Current category: pine marker */
body.kc-rd #nm-shop-sidebar .product-categories li.current-cat > a,
body.kc-rd #nm-shop-sidebar .product-categories li.current-cat-ancestor > a {
	color: var(--kc-pine);
	font-weight: 700;
}
body.kc-rd #nm-shop-sidebar .product-categories .children li.current-cat {
	margin-left: -14px;
	padding-left: 10px;
	border-left: 4px solid var(--kc-pine);
}

/* --------------------------------------------------------------------------
   13. Out-of-stock cards: visible but honestly stated
   -------------------------------------------------------------------------- */

body.kc-rd ul.nm-products li.product.outofstock .nm-shop-loop-thumbnail {
	position: relative;
	opacity: .6;
	filter: grayscale(30%);
}
body.kc-rd ul.nm-products li.product.outofstock .nm-shop-loop-thumbnail::after {
	content: "Out of stock";
	position: absolute;
	top: 8px;
	right: 8px;
	background: var(--kc-ink);
	color: var(--kc-paper);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .03em;
	padding: 3px 9px;
	border-radius: 5px;
	opacity: 1;
}
body.kc-rd ul.nm-products li.product.outofstock .price { opacity: .7; }
/* Savoy injects its own centered "Out of stock" via translation styles on
   the thumbnail link — it lands on top of the category label. Ours (above,
   top-right) is the only one that should render. */
body.kc-rd ul.nm-products li.product.outofstock .nm-shop-loop-thumbnail > a::after {
	content: none !important;
}

/* --------------------------------------------------------------------------
   14. FiboSearch skin (Direction 1)
   -------------------------------------------------------------------------- */

.dgwt-wcas-search-wrapp .dgwt-wcas-search-input {
	border: 2px solid var(--kc-ink) !important;
	border-radius: var(--kc-radius) 0 0 var(--kc-radius) !important;
	background: #fff !important;
	color: var(--kc-ink) !important;
	font-size: 16px !important;
	box-shadow: none !important;
}
.dgwt-wcas-search-wrapp .dgwt-wcas-search-submit {
	background: var(--kc-yellow) !important;
	color: var(--kc-ink) !important;
	border: 2px solid var(--kc-ink) !important;
	border-left: 0 !important;
	border-radius: 0 var(--kc-radius) var(--kc-radius) 0 !important;
}
.dgwt-wcas-suggestions-wrapp,
.dgwt-wcas-details-wrapp {
	border: 2px solid var(--kc-ink) !important;
	border-radius: var(--kc-radius) !important;
	box-shadow: var(--kc-shadow) !important;
}
.dgwt-wcas-suggestion:hover,
.dgwt-wcas-suggestion.dgwt-wcas-suggestion-selected { background: var(--kc-paper) !important; }
.dgwt-wcas-sp { color: var(--kc-ink) !important; font-weight: 700; }

/* Persistent header search bar (OCS pattern) */
.kc-fibo-header {
	display: inline-block;
	vertical-align: middle;
	width: 280px;
	margin: 0 14px;
}
.kc-fibo-header .dgwt-wcas-search-wrapp { max-width: 100%; margin: 0; }
.kc-fibo-header .dgwt-wcas-search-input { height: 42px !important; padding: 0 14px !important; }
.kc-fibo-header .dgwt-wcas-search-submit { min-width: 46px !important; }
@media (max-width: 1200px) { .kc-fibo-header { width: 210px; } }

/* Mobile: two-row header — icons on row 1, full-width search on row 2.
   (Squeezing the bar into the icon row overlaps the cart button.) */
@media (max-width: 991px) {
	body.kc-rd #nm-right-menu-ul { flex-wrap: wrap !important; row-gap: 6px; }
	/* Only the li that actually holds the search bar drops to its own row —
	   there are TWO .nm-menu-account items (sign-in + search); moving both
	   pushes the cart off-screen. */
	body.kc-rd #nm-right-menu-ul > li:has(.kc-fibo-header) {
		order: 99;
		flex: 0 0 100%;
		width: 100%;
		gap: 10px;
	}
	/* Savoy centres the mobile logo absolutely — keep row-1 icons pinned right
	   so nothing lands underneath it. */
	body.kc-rd #nm-right-menu-ul > li.nm-menu-cart { margin-left: auto; }
	body.kc-rd #nm-right-menu-ul > li.nm-menu-offscreen { margin-left: 14px; }

	body.kc-rd .kc-fibo-header {
		flex: 1 1 auto;
		width: auto;
		margin: 0 0 6px;
	}
	body.kc-rd .kc-fibo-header .dgwt-wcas-search-input { display: block; height: 40px !important; }
}

/* Header row: keep logo / nav / icons+search on ONE line */
body.kc-rd .nm-header-col { flex-wrap: nowrap !important; }
body.kc-rd .nm-header-col .nm-main-menu { flex: 1 1 auto; min-width: 0; }
body.kc-rd .nm-header-col .nm-main-menu > ul { justify-content: center; }
body.kc-rd .nm-header-col nav.nm-right-menu { flex: 0 0 auto; float: none !important; }
body.kc-rd #nm-right-menu-ul { display: flex !important; align-items: center; flex-wrap: nowrap; }
body.kc-rd #nm-right-menu-ul > li { display: inline-flex !important; align-items: center; float: none !important; }
body.kc-rd li.nm-menu-account { gap: 10px; white-space: nowrap; }
body.kc-rd .kc-fibo-header { width: 230px; margin: 0 0 0 6px; display: inline-block; }
body.kc-rd .kc-fibo-header .dgwt-wcas-search-input { height: 38px !important; font-size: 14px !important; display: block; }

/* --------------------------------------------------------------------------
   15. Card buy UI: weight pills + add on category cards
   -------------------------------------------------------------------------- */

.kc-card-buy { margin-top: 10px; }
.kc-card-pills { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.kc-card-pill {
	flex: 1 1 calc(25% - 6px);
	min-width: 58px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1px;
	padding: 6px 4px;
	background: #fff;
	border: 2px solid var(--kc-ink-10);
	border-radius: 6px;
	cursor: pointer;
	font-family: inherit;
	line-height: 1.2;
	transition: border-color .12s ease, background .12s ease;
}
.kc-card-pill span { font-weight: 700; font-size: 12px; color: var(--kc-ink); }
.kc-card-pill small { font-size: 11px; color: var(--kc-ink-60); }
.kc-card-pill:hover { border-color: var(--kc-ink); }
.kc-card-pill.kc-active { border-color: var(--kc-ink); background: var(--kc-yellow); }
.kc-card-pill.kc-active small { color: var(--kc-ink); }
.kc-card-pill.kc-pill-oos { opacity: .35; cursor: not-allowed; }
.kc-card-add {
	display: block;
	width: 100%;
	text-align: center;
	padding: 10px 12px !important;
	font-size: 13px !important;
	cursor: pointer;
}
.kc-card-add.kc-loading { opacity: .6; pointer-events: none; }
.kc-card-buy-simple .add_to_cart_button { display: block; width: 100%; text-align: center; padding: 10px 12px !important; font-size: 13px !important; }

/* Strain-type chip on thumbnails */
.kc-type-chip {
	position: absolute;
	bottom: 8px;
	left: 8px;
	z-index: 2;
	padding: 3px 10px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .03em;
	color: #FFFBF2;
}
.kc-type-indica { background: #4A4E8F; }
.kc-type-sativa { background: #C97B2D; }
.kc-type-hybrid { background: var(--kc-pine); }
body.kc-rd .nm-shop-loop-thumbnail { position: relative; }

/* --------------------------------------------------------------------------
   16. Quick filter chips above the grid
   -------------------------------------------------------------------------- */

/* Mobile only: on desktop the left rail is the category navigation and these
   chips would repeat it verbatim. */
.kc-quick-chips {
	display: none;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 22px;
	justify-content: center;
}
@media (max-width: 991px) {
	.kc-quick-chips {
		display: flex;
		flex-wrap: nowrap;
		overflow-x: auto;
		justify-content: flex-start;
		scroll-snap-type: x proximity;
		-webkit-overflow-scrolling: touch;
		padding-bottom: 4px;
		margin-bottom: 16px;
	}
	.kc-quick-chips::-webkit-scrollbar { display: none; }
	/* pills were renamed .kc-chip -> .kc-tier, whose base rule sets
	   flex:1 1 0 (equal-width buy chips) — that shrinks these nav pills and
	   clips their labels. Outrank it: nav pills size to their text. */
	body.kc-rd .kc-quick-chips > a,
	body.kc-rd .kc-quick-chips > .kc-tier {
		flex: 0 0 auto !important;
		white-space: nowrap;
		scroll-snap-align: start;
		/* the .kc-tier base sizes in em for the buy card; out here that
		   collapses to ~3px pads — restate a real pill + tap target */
		flex-direction: row;
		padding: 9px 14px !important;
		min-height: 40px;
		font-size: 13px;
		gap: 5px;
	}
}
.kc-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 16px;
	border: 2px solid var(--kc-ink-10);
	border-radius: 999px;
	background: #fff;
	color: var(--kc-ink);
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	transition: border-color .12s ease;
}
.kc-chip span { font-size: 11px; color: var(--kc-ink-60); font-weight: 400; }
.kc-chip:hover { border-color: var(--kc-ink); color: var(--kc-ink); }
.kc-chip-active { background: var(--kc-ink); color: var(--kc-paper) !important; border-color: var(--kc-ink); }
.kc-chip-active span { color: rgba(255, 251, 242, .7); }

/* --------------------------------------------------------------------------
   17. PDP weight tiers: Chronic Guru upgrade (duration + badge)
   -------------------------------------------------------------------------- */

.kc-weight-pills { width: 100%; }
.kc-weight-pill { position: relative; flex: 1 1 calc(50% - 8px); min-width: 150px; align-items: flex-start; text-align: left; padding: 12px 14px; }
.kc-pill-duration { font-size: 11px; color: var(--kc-ink-60); font-weight: 400; }
.kc-weight-pill.kc-active .kc-pill-duration { color: var(--kc-ink); }
.kc-pill-badge {
	position: absolute;
	top: -9px;
	right: 10px;
	background: var(--kc-pine);
	color: #FFFBF2;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	padding: 2px 8px;
	border-radius: 999px;
}
@media (max-width: 480px) { .kc-weight-pill { flex-basis: 100%; } }

/* Savoy hides .nm-shop-loop-actions (hover-only layout) — the card buy UI
   must be permanently in flow. */
body.kc-rd ul.nm-products li.product .nm-shop-loop-actions {
	display: block !important;
	position: static !important;
	opacity: 1 !important;
	transform: none !important;
	margin-top: 8px;
	width: 100%;
}
body.kc-rd ul.nm-products li.product .nm-shop-loop-price-button { flex-wrap: wrap; }

/* ==========================================================================
   18. Category navigation — designed component (replaces the stock widget)
   ========================================================================== */

/* Kill the old widget chrome entirely */
body.kc-rd #nm-shop-widgets-ul > li.widget_product_categories,
body.kc-rd #nm-shop-widgets-ul > li.widget_product_tag_cloud { display: none !important; }
body.kc-rd #nm-shop-sidebar .nm-shop-widget-scroll { max-height: none !important; }

.kc-catnav {
	background: #fff;
	border: 1px solid var(--kc-ink-10);
	border-radius: 14px;
	padding: 6px;
	margin-bottom: 22px;
	font-size: 14px;
}

.kc-catnav-head {
	padding: 12px 12px 8px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--kc-ink-60);
}

.kc-catnav-all {
	display: block;
	padding: 9px 12px;
	margin: 0 0 4px;
	border-radius: 9px;
	color: var(--kc-ink);
	font-weight: 600;
	text-decoration: none;
	transition: background .12s ease;
}
.kc-catnav-all:hover { background: var(--kc-paper); color: var(--kc-ink); }
.kc-catnav-all.kc-on { background: var(--kc-ink); color: var(--kc-paper) !important; }

.kc-catnav-list,
.kc-catnav-sub { list-style: none; margin: 0; padding: 0; }

/* --- top-level row --- */
.kc-catnav-row {
	display: flex;
	align-items: stretch;
	border-radius: 9px;
	transition: background .12s ease;
}
.kc-catnav-row:hover { background: var(--kc-paper); }

.kc-catnav-link {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 10px 6px 10px 12px;
	color: var(--kc-ink);
	text-decoration: none;
	line-height: 1.25;
}
.kc-catnav-name { font-weight: 600; }

/* count badge */
.kc-catnav-count {
	flex: 0 0 auto;
	min-width: 22px;
	padding: 1px 7px;
	border-radius: 999px;
	background: var(--kc-ink-10);
	color: var(--kc-ink-60);
	font-size: 11px;
	font-weight: 600;
	text-align: center;
	font-variant-numeric: tabular-nums;
}

/* current top-level */
.kc-catnav-row.kc-on { background: var(--kc-ink); }
.kc-catnav-row.kc-on .kc-catnav-link { color: var(--kc-paper); }
.kc-catnav-row.kc-on .kc-catnav-count { background: rgba(255, 251, 242, .22); color: var(--kc-paper); }
.kc-catnav-row.kc-on .kc-catnav-toggle { color: var(--kc-paper); }

/* open branch (ancestor of current) */
.kc-catnav-item.kc-open > .kc-catnav-row .kc-catnav-name { color: var(--kc-pine); }
.kc-catnav-item.kc-open > .kc-catnav-row.kc-on .kc-catnav-name { color: var(--kc-paper); }

/* --- chevron toggle --- */
.kc-catnav-toggle {
	flex: 0 0 auto;
	width: 38px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: none;
	border: 0;
	border-radius: 9px;
	color: var(--kc-ink-60);
	cursor: pointer;
	padding: 0;
}
.kc-catnav-toggle svg { width: 11px; height: auto; transition: transform .2s ease; }
.kc-catnav-item.kc-open > .kc-catnav-row .kc-catnav-toggle svg { transform: rotate(180deg); }
.kc-catnav-toggle:focus-visible { outline: 2px solid var(--kc-pine); outline-offset: -2px; }

/* --- subcategories (accordion) --- */
/* max-height rather than grid 0fr: with multiple <li> children only the
   FIRST grid row collapses, so 0fr leaves the rest of the list visible. */
.kc-catnav-sub {
	max-height: 0;
	overflow: hidden;
	margin-left: 12px;
	border-left: 2px solid transparent;
	transition: max-height .25s ease, border-color .25s ease;
}
.kc-catnav-item.kc-open > .kc-catnav-sub {
	max-height: 720px;
	padding: 2px 0 8px;
	border-left-color: var(--kc-ink-10);
}

.kc-catnav-sublink {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 7px 10px 7px 14px;
	margin-left: -2px;
	border-left: 2px solid transparent;
	color: rgba(31, 26, 23, .78);
	font-size: 13px;
	text-decoration: none;
	transition: color .12s ease, border-color .12s ease, background .12s ease;
}
.kc-catnav-sublink:hover {
	color: var(--kc-ink);
	border-left-color: var(--kc-ink-10);
	background: var(--kc-paper);
}
.kc-catnav-sublink.kc-on {
	color: var(--kc-pine);
	font-weight: 700;
	border-left-color: var(--kc-pine);
	background: rgba(30, 91, 60, .07);
	border-radius: 0 7px 7px 0;
}
.kc-catnav-sublink.kc-on .kc-catnav-count { background: rgba(30, 91, 60, .14); color: var(--kc-pine); }

/* Desktop: keep it in view while scrolling the grid */
@media (min-width: 992px) {
	.kc-catnav { position: sticky; top: 96px; max-height: calc(100vh - 120px); overflow-y: auto; }
	.kc-catnav::-webkit-scrollbar { width: 6px; }
	.kc-catnav::-webkit-scrollbar-thumb { background: var(--kc-ink-10); border-radius: 999px; }
}

/* Mobile: the quick-chip row above the grid is the navigation — the rail
   would just be a wall of links again. */
@media (max-width: 991px) {
	body.kc-rd #nm-shop-sidebar { display: none !important; }
}

/* Specificity armour: Savoy's `.archive .nm-shop li a` (0,2,2) paints every
   sidebar link #acacac. These rules must out-rank it. */
body.kc-rd .kc-catnav-li { list-style: none; }
body.kc-rd .kc-catnav .kc-catnav-all { color: var(--kc-ink); }
body.kc-rd .kc-catnav .kc-catnav-all:hover { color: var(--kc-ink); }
body.kc-rd .kc-catnav .kc-catnav-all.kc-on { color: var(--kc-paper); }
body.kc-rd .kc-catnav .kc-catnav-link { color: var(--kc-ink); }
body.kc-rd .kc-catnav .kc-catnav-row.kc-on .kc-catnav-link { color: var(--kc-paper); }
body.kc-rd .kc-catnav .kc-catnav-item.kc-open > .kc-catnav-row .kc-catnav-name { color: var(--kc-pine); }
body.kc-rd .kc-catnav .kc-catnav-item.kc-open > .kc-catnav-row.kc-on .kc-catnav-name { color: var(--kc-paper); }
body.kc-rd .kc-catnav .kc-catnav-sublink { color: rgba(31, 26, 23, .78); }
body.kc-rd .kc-catnav .kc-catnav-sublink:hover { color: var(--kc-ink); }
body.kc-rd .kc-catnav .kc-catnav-sublink.kc-on { color: var(--kc-pine); }
body.kc-rd .kc-catnav .kc-catnav-count { color: var(--kc-ink-60); }
body.kc-rd .kc-catnav .kc-catnav-row.kc-on .kc-catnav-count { color: var(--kc-paper); }
body.kc-rd .kc-catnav .kc-catnav-sublink.kc-on .kc-catnav-count { color: var(--kc-pine); }

/* ==========================================================================
   19. PDP design pass — hierarchy, tabs, long-form typography
   ========================================================================== */

/* --- 19.1 Buy box hierarchy -------------------------------------------- */

/* The product name is the page. 26px lost to a 24px "Effect:" heading. */
body.kc-rd.single-product .nm-product-summary h1.product_title,
body.kc-rd.single-product .summary h1,
body.kc-rd.single-product h1.entry-title {
	font-size: 38px;
	line-height: 1.08;
	letter-spacing: -0.015em;
	color: var(--kc-ink);
	margin-bottom: 10px;
}
@media (max-width: 768px) {
	body.kc-rd.single-product .nm-product-summary h1.product_title,
	body.kc-rd.single-product .summary h1,
	body.kc-rd.single-product h1.entry-title { font-size: 28px; }
}

/* "Effect:" was an h2 competing with the title — demote to a field label. */
body.kc-rd .jwa-term-list-wrap { margin: 0 0 16px; }
body.kc-rd .jwa-term-list-wrap h2.effect-oldh3,
body.kc-rd .jwa-term-list-wrap h2,
body.kc-rd .jwa-term-list-wrap h3 {
	font-family: inherit;
	font-size: 11px !important;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--kc-ink-60);
	margin: 0 0 8px;
	line-height: 1.2;
}

/* Effects as chips (real class is .jwa-term-list, not .jwa-effects) */
body.kc-rd .jwa-term-list {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	list-style: none;
	margin: 0;
	padding: 0;
}
body.kc-rd .jwa-term-list li { margin: 0; padding: 0; list-style: none; }
body.kc-rd .jwa-term-list li::after { content: none; }
body.kc-rd .jwa-term-list li a {
	display: inline-block;
	padding: 5px 13px;
	border: 1px solid var(--kc-ink-10);
	border-radius: 999px;
	background: #fff;
	color: var(--kc-ink) !important;
	font-size: 13px;
	font-weight: 500;
	text-decoration: none;
	transition: border-color .12s ease, background .12s ease;
}
body.kc-rd .jwa-term-list li a:hover {
	border-color: var(--kc-pine);
	background: rgba(30, 91, 60, .06);
	color: var(--kc-pine) !important;
}

/* "Weight" label matches the Effect label */
body.kc-rd form.cart .variations label,
body.kc-rd form.cart .variations th.label label {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--kc-ink-60);
}

/* Gallery: a 683px square of mostly white pushed the buy box down */
@media (min-width: 992px) {
	body.kc-rd.single-product .woocommerce-product-gallery img,
	body.kc-rd.single-product .nm-product-images img {
		max-height: 520px;
		width: auto;
		margin: 0 auto;
		object-fit: contain;
	}
}

/* --- 19.2 Tab navigation ------------------------------------------------ */

body.kc-rd .custom-product-tabs__titles {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
	justify-content: center;
	border-bottom: 2px solid var(--kc-ink-10);
	margin-bottom: 28px;
	padding-bottom: 0;
}
body.kc-rd .custom-product-tabs__title {
	position: relative;
	padding: 12px 20px;
	color: var(--kc-ink-60) !important;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none !important;
	border-bottom: 3px solid transparent;
	margin-bottom: -2px;
	transition: color .12s ease, border-color .12s ease;
}
body.kc-rd .custom-product-tabs__title:hover { color: var(--kc-ink) !important; }
body.kc-rd .custom-product-tabs__title.active,
body.kc-rd .custom-product-tabs__title.is-active,
body.kc-rd .custom-product-tabs__title[class*="active"] {
	color: var(--kc-ink) !important;
	border-bottom-color: var(--kc-yellow);
}

/* --- 19.3 Long-form description: give it a document hierarchy ----------- */

body.kc-rd .custom-product-tab-info,
body.kc-rd [class*="custom-product-tab-"] {
	max-width: 72ch;
	margin-left: auto;
	margin-right: auto;
}

/* The 48px "Information" title duplicates the tab label above it. */
body.kc-rd .custom-product-tab-title {
	font-size: 13px !important;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--kc-ink-60);
	text-align: left;
	margin: 0 0 20px;
}

/* Every heading in the body was 18px — same as paragraphs. */
body.kc-rd .custom-product-tab-info h2 {
	font-size: 24px !important;
	line-height: 1.25;
	font-weight: 700;
	color: var(--kc-ink);
	margin: 34px 0 12px;
	letter-spacing: -0.01em;
}
body.kc-rd .custom-product-tab-info h3 {
	font-size: 17px !important;
	line-height: 1.35;
	font-weight: 700;
	color: var(--kc-ink);
	margin: 24px 0 8px;
}
body.kc-rd .custom-product-tab-info h4 {
	font-size: 15px !important;
	font-weight: 700;
	color: var(--kc-ink);
	margin: 18px 0 6px;
}
body.kc-rd .custom-product-tab-info p {
	font-size: 15px;
	line-height: 1.7;
	color: rgba(31, 26, 23, .86);
	margin: 0 0 14px;
	text-align: left;
}
body.kc-rd .custom-product-tab-info strong { font-weight: 700; color: var(--kc-ink); }
body.kc-rd .custom-product-tab-info a { color: var(--kc-pine); text-decoration: underline; text-underline-offset: 2px; }
body.kc-rd .custom-product-tab-info a:hover { color: var(--kc-ink); }
body.kc-rd .custom-product-tab-info hr {
	border: 0;
	border-top: 1px solid var(--kc-ink-10);
	margin: 28px 0;
}

/* The two real tables (price list + strain specs) were unstyled */
body.kc-rd .custom-product-tab-info table {
	width: 100%;
	border-collapse: collapse;
	margin: 8px 0 22px;
	font-size: 14px;
	background: #fff;
	border: 1px solid var(--kc-ink-10);
	border-radius: 10px;
	overflow: hidden;
}
body.kc-rd .custom-product-tab-info table td,
body.kc-rd .custom-product-tab-info table th {
	padding: 10px 14px;
	border-bottom: 1px solid var(--kc-ink-10);
	text-align: left;
	vertical-align: top;
	line-height: 1.45;
}
body.kc-rd .custom-product-tab-info table tr:last-child td,
body.kc-rd .custom-product-tab-info table tr:last-child th { border-bottom: 0; }
body.kc-rd .custom-product-tab-info table tr:nth-child(even) td { background: rgba(31, 26, 23, .025); }
/* First column reads as the label, second as the value */
body.kc-rd .custom-product-tab-info table td:first-child,
body.kc-rd .custom-product-tab-info table th:first-child {
	width: 38%;
	font-weight: 600;
	color: var(--kc-ink);
}
body.kc-rd .custom-product-tab-info table td:last-child {
	color: rgba(31, 26, 23, .86);
	font-variant-numeric: tabular-nums;
}

/* --- 19.4 Collapse the 4000px wall (content stays in the DOM) ----------- */

body.kc-rd .kc-longdesc {
	position: relative;
	max-height: 760px;
	overflow: hidden;
}
body.kc-rd .kc-longdesc::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 140px;
	background: linear-gradient(rgba(255, 251, 242, 0), var(--kc-paper));
	pointer-events: none;
}
body.kc-rd .kc-longdesc.kc-open { max-height: none; }
body.kc-rd .kc-longdesc.kc-open::after { display: none; }

.kc-longdesc-toggle {
	display: block;
	margin: 18px auto 40px;
	padding: 11px 26px;
	background: transparent;
	border: 2px solid var(--kc-ink);
	border-radius: var(--kc-radius);
	color: var(--kc-ink);
	font-family: inherit;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
	transition: background .12s ease;
}
.kc-longdesc-toggle:hover { background: var(--kc-yellow); }

/* --- 19.5 Gallery: centre the image, pin the category badge ------------- */

body.kc-rd.single-product .woocommerce-product-gallery,
body.kc-rd.single-product .woocommerce-product-gallery__wrapper,
body.kc-rd.single-product .nm-product-images { position: relative; }

@media (min-width: 992px) {
	/* The image was left-aligned in a 698px column, stranding ~180px of white. */
	body.kc-rd.single-product .woocommerce-product-gallery img,
	body.kc-rd.single-product .nm-product-images img {
		display: block;
		margin-left: auto;
		margin-right: auto;
	}
}

/* The category label sat at the right edge of the gallery in dead space —
   pin it to the image's top-left like a normal product badge. */
body.kc-rd.single-product .woocommerce-product-gallery .label-category,
body.kc-rd.single-product .nm-product-images .label-category {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 3;
	margin: 0;
}

/* --- 19.6 Delivery/trust strip under the buy box ------------------------ */

body.kc-rd.single-product .nm-product-summary [class*="info-block"],
body.kc-rd.single-product .jwa-info-block {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 14px;
	align-items: start;
	padding-top: 18px;
	border-top: 1px solid var(--kc-ink-10);
	margin-top: 4px;
}
body.kc-rd.single-product .jwa-info-block > * { min-width: 0; }
body.kc-rd.single-product .jwa-info-block p,
body.kc-rd.single-product [class*="info-block"] p {
	font-size: 12.5px;
	line-height: 1.4;
	color: rgba(31, 26, 23, .8);
	margin: 0;
}
@media (max-width: 600px) {
	body.kc-rd.single-product .jwa-info-block,
	body.kc-rd.single-product [class*="info-block"] { grid-template-columns: 1fr; gap: 10px; }
}

/* The tab panel content is raw text nodes + inline elements, not <p> blocks —
   so paragraph-level rules never applied. Type is set on the container. */
body.kc-rd .custom-product-tab-info,
body.kc-rd [class*="custom-product-tab-"] {
	text-align: left !important;
	font-size: 15px;
	line-height: 1.75;
	color: rgba(31, 26, 23, .86);
}
body.kc-rd .custom-product-tab-info h2,
body.kc-rd .custom-product-tab-info h3,
body.kc-rd .custom-product-tab-info h4,
body.kc-rd .custom-product-tab-info table,
body.kc-rd .custom-product-tab-info td,
body.kc-rd .custom-product-tab-info th { text-align: left !important; }

/* Bare <strong> lines act as sub-headings in this content — give them air. */
body.kc-rd .custom-product-tab-info > strong {
	display: block;
	margin: 18px 0 6px;
	font-size: 15px;
	color: var(--kc-ink);
}

/* Active tab (class set by kc-redesign.js — the theme sets none) */
body.kc-rd .custom-product-tabs__title.kc-tab-on {
	color: var(--kc-ink) !important;
	border-bottom-color: var(--kc-yellow);
}

/* Display face is for >=24px only — this 13px eyebrow must use the body font. */
body.kc-rd .custom-product-tab-title {
	font-family: "Poppins", system-ui, sans-serif !important;
}

/* --- 19.7 Primary CTA consistency across breakpoints ------------------- */
/* The child theme repaints the main CTAs green (#6FCF97) inside its mobile
   media queries at (0,4,0)+!important — so desktop was yellow and mobile
   green. These selectors are (0,5,1)+ so one primary spec wins everywhere. */
body.kc-rd .nm-variable-add-to-cart-button.single_add_to_cart_button.button.alt,
body.kc-rd.woocommerce-checkout #place_order,
body.kc-rd.woocommerce-checkout #place_order:hover,
body.kc-rd.woocommerce-cart .checkout-button.button.alt.wc-forward,
body.kc-rd .custom-realted-products-button,
body.kc-rd.single-product .jwa-submit {
	background: var(--kc-yellow) !important;
	color: var(--kc-ink) !important;
	border: 2px solid var(--kc-ink) !important;
	box-shadow: var(--kc-shadow);
}
body.kc-rd .nm-variable-add-to-cart-button.single_add_to_cart_button.button.alt:hover,
body.kc-rd.woocommerce-cart .checkout-button.button.alt.wc-forward:hover {
	transform: translate(3px, 3px); /* seats the 3px hard shadow exactly */
	box-shadow: 0 0 0 var(--kc-ink);
}

/* ==========================================================================
   20. PDP density pass — fewer data points per tile, tighter rhythm
   ========================================================================== */

/* The weight selector sat inside the theme's bordered <table> shell — a card
   around a card. Strip it; the tiles carry their own edges. */
body.kc-rd form.cart .variations,
body.kc-rd form.cart table.variations,
body.kc-rd form.cart table.variations tbody,
body.kc-rd form.cart table.variations tr,
body.kc-rd form.cart table.variations td,
body.kc-rd form.cart table.variations th {
	display: block;
	width: 100%;
	border: 0 !important;
	background: none !important;
	padding: 0 !important;
	margin: 0;
}
body.kc-rd form.cart .variations .reset_variations { display: none !important; }

/* One row, equal columns — 4 sizes became 3 when eighths were retired. */
body.kc-rd .kc-weight-pills {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 8px;
	margin: 8px 0 0;
}
body.kc-rd .kc-weight-pill {
	flex: none;
	min-width: 0;
	align-items: flex-start;
	text-align: left;
	gap: 1px;
	padding: 11px 12px;
}
body.kc-rd .kc-pill-weight { font-size: 14px; }
body.kc-rd .kc-pill-price,
body.kc-rd .product .nm-product-summary-inner-col .kc-weight-pill .price,
body.kc-rd .product .nm-product-summary-inner-col .kc-weight-pill .price span.woocommerce-Price-amount.amount,
body.kc-rd .product .nm-product-summary-inner-col .kc-weight-pill .price span.woocommerce-Price-amount.amount bdi {
	font-size: 16px !important;
	font-weight: 700;
}
body.kc-rd .kc-pill-pergram { font-size: 11px; }
body.kc-rd .kc-pill-badge { top: -8px; right: 8px; font-size: 9px; padding: 2px 7px; }

/* The duration copy that used to sit in all four tiles */
.kc-tier-note {
	margin: 8px 0 0;
	font-size: 12.5px;
	color: var(--kc-ink-60);
	min-height: 1.2em;
}

/* Consistent vertical rhythm down the buy column: the blocks were spread
   far apart while their contents were cramped. */
body.kc-rd .nm-product-summary .jwa-term-list-wrap { margin-bottom: 18px; }
body.kc-rd form.cart { margin-top: 18px; }
body.kc-rd form.cart .quantity,
body.kc-rd form.cart .single_add_to_cart_button { margin-top: 16px; }
body.kc-rd .kc-pdp-desc { margin-top: 22px; padding-top: 18px; }

@media (max-width: 480px) {
	body.kc-rd .kc-weight-pills { gap: 6px; }
	body.kc-rd .kc-weight-pill { padding: 10px 8px; }
	body.kc-rd .kc-pill-weight { font-size: 13px; }
	body.kc-rd .kc-pill-price,
	body.kc-rd .product .nm-product-summary-inner-col .kc-weight-pill .price span.woocommerce-Price-amount.amount { font-size: 15px !important; }
}

/* Mobile: a full-width square photo ate the entire first screen, pushing the
   title and buy box below the fold. Cap it so the price is reachable. */
@media (max-width: 991px) {
	body.kc-rd.single-product .woocommerce-product-gallery img,
	body.kc-rd.single-product .nm-product-images img {
		max-height: 42vh;
		width: auto;
		max-width: 100%;
		margin: 0 auto;
		display: block;
		object-fit: contain;
	}
	body.kc-rd.single-product .woocommerce-product-gallery,
	body.kc-rd.single-product .nm-product-images { margin-bottom: 6px; }
	body.kc-rd.single-product .nm-product-summary { padding-top: 0; }
}

/* ==========================================================================
   21. Top bar — single-line marquee, and reclaiming the header's height
   ========================================================================== */

:root { --kc-marquee-h: 34px; }

/* The old WPBakery block: position:fixed, 74px, wrapped to two lines. */
body.kc-rd #header-top-bar-green-text { display: none !important; }

.kc-marquee {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 11112;              /* one above the block it replaces */
	height: var(--kc-marquee-h);
	display: flex;
	align-items: center;
	overflow: hidden;
	background: var(--kc-pine);
	color: #FFFBF2;
	white-space: nowrap;
}
/* The marquee's live rules now live in assets/parts/42-marquee.css: the old
   two-pass / translateX(-50%) loop only stayed seamless while one pass was
   wider than the viewport, which no desktop width satisfied. Deleted rather
   than left underneath — the partial already wins without !important, and a
   dead layer under a live one is exactly how the last three of these came
   back. --kc-marquee-h above is still live and must stay. */

/* Header sits directly under the marquee (was offset 73px for the old bar) */
body.kc-rd #nm-header { top: var(--kc-marquee-h) !important; }

/* Savoy already reserves space for its fixed header with .nm-header-placeholder,
   but that placeholder never accounted for the fixed announcement bar stacked
   above it — which is why the hero was cropped on phones. kc-redesign.js sets
   the placeholder to the REAL chrome height (marquee + header) instead; adding
   page padding on top of the placeholder would double-count on desktop. */
body.kc-rd .nm-header-placeholder {
	min-height: var(--kc-chrome-h, 0px) !important;
}
/* 2026-08-29 owner:header 与 hero 之间的白缝。前任 main.css/style.css 把
   #nm-header-placeholder 的 height 写死(120/130/136px !important),JS 实测的
   min-height 压不住显式 height —— 桌面多 11px、手机多 28px 全是白缝。
   id 选择器(1,1,1)压过前任的 (1,0,0),height 交还 auto,由 --kc-chrome-h 主导;
   fallback 取两端实测值防 no-JS 首帧塌陷(desktop 109 / ≤579px 102,2026-08-29 量)。 */
body.kc-rd #nm-header-placeholder {
	height: auto !important;
	min-height: var(--kc-chrome-h, 109px) !important;
}
@media (max-width: 579px) {
	body.kc-rd #nm-header-placeholder { min-height: var(--kc-chrome-h, 102px) !important; }
}

/* --------------------------------------------------------------------------
   22. Search field — 70px of chrome around a 40px input
   -------------------------------------------------------------------------- */

body.kc-rd .kc-fibo-header .dgwt-wcas-search-wrapp {
	height: auto !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
}
body.kc-rd .kc-fibo-header .dgwt-wcas-search-form,
body.kc-rd .kc-fibo-header .dgwt-wcas-search-icon-arrow { margin: 0 !important; }
body.kc-rd .kc-fibo-header .dgwt-wcas-search-input {
	height: 40px !important;
	min-height: 0 !important;
	padding: 0 14px !important;
	font-size: 15px !important;
}
body.kc-rd .kc-fibo-header .dgwt-wcas-preloader,
body.kc-rd .kc-fibo-header .dgwt-wcas-voice-search { height: 40px !important; }

@media (max-width: 991px) {
	/* row 2 of the header: just the field, no dead space above or below */
	body.kc-rd #nm-right-menu-ul > li:has(.kc-fibo-header) {
		padding: 0 !important;
		margin: 0 !important;
		min-height: 0;
	}
	body.kc-rd .kc-fibo-header { margin: 2px 0 8px !important; }
	body.kc-rd #nm-header { padding-top: 6px !important; padding-bottom: 4px !important; }

	/* The hamburger was clipping against the viewport edge (6px clearance). */
	body.kc-rd nav.nm-right-menu { padding-right: 4px; }
	body.kc-rd #nm-right-menu-ul > li.nm-menu-offscreen { margin-left: 12px; padding-right: 2px; }
	body.kc-rd #nm-right-menu-ul > li.nm-menu-cart { margin-left: auto; }
}

/* FiboSearch's mobile wrapper adds 16px top+bottom around a 40px field —
   that was 32 of the 72px the search row occupied. */
body.kc-rd .kc-fibo-header .js-dgwt-wcas-enable-mobile-form,
body.kc-rd .kc-fibo-header .dgwt-wcas-search-wrapp > div { padding-top: 0 !important; padding-bottom: 0 !important; }

/* ==========================================================================
   20. Display-face discipline — where Gazella is and is not allowed
   --------------------------------------------------------------------------
   Gazella is the brand's only display face: a single-weight 70s fat face.
   Owner's rule, 2026-08-15: "只应该用在大字体上,产品标题不应该用这个字体,
   这个字体应该就是用来做 branding 的地方."

   Three tests. A place must pass ALL THREE to keep Gazella:
     1. >= 28px rendered.  A fat face at 14-24px is what reads cheap.
     2. Brand surface.     Marketing chrome — never the shelf, never an
                           instrument the customer operates to buy.
     3. Not a product name. A strain name is data, not voice.

   The child theme applies Gazella in 27 places; 7 of them fail a test and are
   reverted to the body face here. Everything else is deliberately untouched.
   Nothing below changes copy, markup or size — face only. Reverts with the
   kill switch.
   ========================================================================== */

/* --- 20.1 Product names: never the display face ------------------------- */
/* Fails test 3. Also the single loudest instance on the site — 48px of fat
   face on "Pink Kush AAAA Indica" fights the photo instead of naming it.
   Originals: h1.product_title.entry-title (0,2,1) and div. equivalent. */
body.kc-rd h1.product_title.entry-title,
body.kc-rd div.product_title.entry-title {
	font-family: var(--kc-font-body) !important;
	font-weight: 600;
	font-size: 30px;
	letter-spacing: -0.01em;
	line-height: 1.2;
}
@media (min-width: 768px) {
	body.kc-rd h1.product_title.entry-title,
	body.kc-rd div.product_title.entry-title { font-size: 34px; }
}

/* --- 20.2 Strain/category chips: 14px, fails test 1 --------------------- */
/* These sit on the product card and under the PDP title. A fat face at 14px
   with 0.07em tracking is the exact "looks cheap" symptom. */
body.kc-rd .products .nm-shop-loop-product-wrap div.label-category span,
body.kc-rd.single-product div.label-category span {
	font-family: var(--kc-font-body) !important;
	font-weight: 600;
	font-size: 11px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* --- 20.3 Controls: no button gets the display face, ever --------------- */
/* Fails test 2 (an instrument, not voice) and, in every measured case, test 1
   as well. I first kept Gazella on the homepage promo CTAs ("See All", "Our
   Menu") on the theory that they are marketing rather than instruments — the
   stylesheet declares them 28px. Measured on staging they render at *16px*:
   a later rule wins and the declared size is fiction. 16px fat face is the
   precise thing that reads cheap, so the exception was deleted. Simpler rule,
   and it can't rot: a control never carries the brand face. */
body.kc-rd .nm-simple-add-to-cart-button.single_add_to_cart_button.button.alt,
body.kc-rd .nm-variable-add-to-cart-button.single_add_to_cart_button.button.alt,
body.kc-rd.single-product .jwa-submit,
body.kc-rd.single-product .custom-product-tab-reviews.tab #submit,
body.kc-rd.single-product .custom-realted-products-button,
body.kc-rd .nm-infload-controls.button-mode .nm-infload-btn,
body.kc-rd .bannerheader-right-button .nm_btn_title,
body.kc-rd .new-arrivals-class .nm_btn_title,
body.kc-rd .king-deals-products .nm_btn_title,
body.kc-rd .how-to-order-home .nm_btn_title,
body.kc-rd .product .home-product .nm_btn_align_center .nm_btn_title,
body.kc-rd .subscribe .wpcf7-form-control.has-spinner.wpcf7-submit {
	font-family: var(--kc-font-body) !important;
	font-weight: 700;
	letter-spacing: 0.04em;
}
/* Sizes only where the theme left them at fat-face proportions. */
body.kc-rd .nm-simple-add-to-cart-button.single_add_to_cart_button.button.alt,
body.kc-rd .nm-variable-add-to-cart-button.single_add_to_cart_button.button.alt,
body.kc-rd.single-product .jwa-submit,
body.kc-rd.single-product .custom-product-tab-reviews.tab #submit,
body.kc-rd.single-product .custom-realted-products-button,
body.kc-rd .nm-infload-controls.button-mode .nm-infload-btn,
body.kc-rd .subscribe .wpcf7-form-control.has-spinner.wpcf7-submit {
	font-size: 16px;
}

/* --- 20.4 Footer nav links: 22px, fails test 1 -------------------------- */
body.kc-rd .footer-bakery-column strong a {
	font-family: var(--kc-font-body) !important;
	font-weight: 600;
	font-size: 15px;
	letter-spacing: 0.02em;
}

/* --- 20.5 Floor guard -------------------------------------------------- */
/* Anything that later inherits the display face inside the shopping surface
   gets caught here rather than shipping. Card titles, prices, quantity
   fields, tier pills, the side cart and checkout are all instruments. */
body.kc-rd ul.nm-products li.product h3,
body.kc-rd ul.nm-products li.product .price,
body.kc-rd .kc-tier-pill,
body.kc-rd .kc-card-weight,
body.kc-rd.woocommerce-checkout form.checkout label,
body.kc-rd.woocommerce-checkout form.checkout input,
body.kc-rd .nm-cart-panel .nm-cart-panel-product-title {
	font-family: var(--kc-font-body) !important;
}

/* --- 20.6 Mobile header: undo the legacy positional nudges -------------- */
/* Not a type rule, but found while auditing §20 on a 375px viewport.
   The child theme pins position:relative + right:47px on the cart and
   right:-24px on the hamburger — leftovers from the pre-redesign header.
   margin-left:auto now places the cart correctly, and the 47px nudge then
   drags it back on top of the absolutely-centred logo (logo 119-246px,
   cart landed at 233px). Zero the offsets; the margins do the work. */
@media (max-width: 991px) {
	body.kc-rd #nm-right-menu-ul > li.nm-menu-cart,
	body.kc-rd #nm-right-menu-ul > li.nm-menu-offscreen {
		right: 0 !important;
		left: auto !important;
	}
}

/* ==========================================================================
   21. SHELF SPEC — locked 2026-08-15 (docs/shelf-mockups.html v16)
   --------------------------------------------------------------------------
   Price once big + $/g; gram-only chips; quiet preselect, pine on the
   customer's own tap; single-size collapse ($90/28G fused); P4 one-line buy
   on the PDP. Loads after §1–§20, so equal-specificity rules here win the
   ties against the older pill styling above — that is intentional.
   ========================================================================== */

/* --- 21.1 The one price line ------------------------------------------- */
body.kc-rd .kc-pline {
	display: flex;
	align-items: baseline;
	gap: var(--kc-space-2);
}
body.kc-rd .kc-pline .kc-pline-price,
body.kc-rd .kc-pline .kc-pline-price .amount,
body.kc-rd .kc-pline .kc-pline-price bdi {
	font-family: var(--price-font);
	font-size: 18px;
	font-weight: 600;
	letter-spacing: -.02em;
	color: var(--text) !important; /* money is never grey; beats theme washes */
}
body.kc-rd .kc-pline .kc-pline-price del,
body.kc-rd .kc-pline .kc-pline-price del .amount {
	color: var(--text-muted) !important;
	font-size: 13px;
	font-weight: 400;
}
body.kc-rd .kc-pline .kc-pline-price ins { text-decoration: none; }
body.kc-rd .kc-pline .kc-pline-price i {
	/* the fused /28G on single-size products */
	font-style: normal;
	font-size: 13px;
	font-weight: 600;
	color: var(--text-muted);
}
body.kc-rd .kc-pline .kc-pline-pergram {
	font-family: var(--price-font);
	font-size: 10px;
	color: var(--text-muted);
	margin-left: auto;
}
/* PDP: one size larger */
body.kc-rd .summary .kc-pline .kc-pline-price,
body.kc-rd .summary .kc-pline .kc-pline-price .amount,
body.kc-rd .summary .kc-pline .kc-pline-price bdi { font-size: 21px; }
body.kc-rd .summary .kc-pline .kc-pline-pergram { font-size: 11px; }
body.kc-rd .summary .kc-pline .kc-pline-price i { font-size: 14px; }

/* (rules moved to §22 — the first version of this hid the price INSIDE the
   pline too, because Woo's own price_html carries <span class="price">.) */

/* --- 21.2 Slot label ---------------------------------------------------- */
body.kc-rd .kc-sizelab {
	font-family: var(--label-font);
	font-size: 9px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--text-faint);
	margin: var(--kc-space-2) 0 5px;
}

/* --- 21.3 Gram chips (PDP) --------------------------------------------- */
/* The old three-line pill (weight/price/$g) is replaced by a weight-only
   chip; these override the §"pills" block above on equal specificity. */
body.kc-rd .kc-weight-pills {
	display: flex;
	gap: 5px;
	margin: 0;
}
body.kc-rd .kc-weight-pill {
	flex: 1 1 0;
	min-width: 0;
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 var(--kc-space-1);
	border: 1px solid var(--border);
	border-radius: var(--kc-radius-md);
	background: var(--surface-raised);
	font-family: var(--price-font);
	font-size: 12px;
	font-weight: 600;
	color: var(--text-muted);
	cursor: pointer;
	touch-action: manipulation;
}
body.kc-rd .kc-weight-pill:hover { border-color: var(--text); color: var(--text); }
/* current (system or user) — quiet */
body.kc-rd .kc-weight-pill.kc-active {
	border: 1.5px solid var(--text);
	background: var(--surface-raised);
	color: var(--text);
	font-weight: 700;
	box-shadow: none;
}
/* the customer's own tap — brand pine @45%, full-pine border */
body.kc-rd .kc-weight-pill.kc-active.kc-picked {
	border-color: var(--trust);
	background: #9AB5A7;
	color: var(--text);
}
body.kc-rd .kc-weight-pill.kc-pill-oos {
	opacity: .45;
	text-decoration: line-through;
	cursor: default;
}
body.kc-rd .kc-weight-pill:focus-visible { outline: 2px solid var(--trust); outline-offset: 2px; }

/* --- 21.4 P4 one-line buy (PDP) ----------------------------------------- */
/* (§21.4 layout superseded by §22, which owns the whole buy-box layout.) */
/* Quantity moves to the cart (side cart has full steppers); the buy row is
   chips + Add, exactly the locked mock. Hidden, not removed — the form still
   posts qty=1. */
/* (qty-hide retired 2026-08-16 — the PDP must have a stepper, PCD playbook §1.4) */
/* The adopted button leaves .woocommerce-variation-add-to-cart empty-ish;
   collapse leftover spacing so the row sits tight. */
body.kc-rd form.cart:has(.kc-buyrow) .single_variation_wrap { margin: 0; }

/* --- 21.5 Card chips + Add --------------------------------------------- */
body.kc-rd .kc-card-pills { display: flex; gap: 4px; margin: 6px 0 8px; flex-wrap: nowrap; }
body.kc-rd .kc-card-pill {
	flex: 1 1 0;
	min-width: 0;
	min-height: 36px;
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 2px;
	border: 1px solid var(--border);
	border-radius: var(--kc-radius-md);
	background: var(--surface-raised);
	font-family: var(--price-font);
	font-size: 11px;
	font-weight: 600;
	color: var(--text-muted);
	cursor: pointer;
	touch-action: manipulation;
}
body.kc-rd .kc-card-pill::after { content: ""; position: absolute; inset: -4px; } /* 44px hit */
body.kc-rd .kc-card-pill span,
body.kc-rd .kc-card-pill small { all: unset; } /* legacy sub-spans, if cached markup */
body.kc-rd .kc-card-pill.kc-active {
	border: 1.5px solid var(--text);
	color: var(--text);
	font-weight: 700;
}
body.kc-rd .kc-card-pill.kc-active.kc-picked {
	border-color: var(--trust);
	background: #9AB5A7;
}
body.kc-rd .kc-card-pill:focus-visible { outline: 2px solid var(--trust); outline-offset: 2px; }

body.kc-rd .kc-card-add,
body.kc-rd button.kc-card-add.button {
	width: 100%;
	min-height: 36px;
	position: relative;
	margin-top: 2px;
	background: var(--btn-primary-bg) !important;
	color: var(--btn-primary-text) !important;
	border: 1.5px solid var(--btn-primary-border) !important;
	border-radius: var(--kc-radius-md) !important;
	box-shadow: 2px 2px 0 var(--btn-primary-border);
	font-size: 13px !important;
	font-weight: 600;
	touch-action: manipulation;
}
body.kc-rd .kc-card-add::after { content: ""; position: absolute; inset: -4px 0; } /* 44px hit */

/* ==========================================================================
   22. PDP BUY BOX — OWNS ITS LAYOUT (rewrite, 2026-08-16)
   --------------------------------------------------------------------------
   The first attempt nudged Savoy's structure and broke on phones, because the
   whole buy zone lives inside WooCommerce's <table class="variations"> — a
   real table, and mobile table layout crushed the chips and overflowed the
   button. This section flattens that structure and lays the zone out itself.
   Owner authorised the rewrite ("不要在原本的系统上打补丁").
   ========================================================================== */

/* --- 22.1 Flatten the variations table --------------------------------- */
body.kc-rd form.cart table.variations,
body.kc-rd form.cart table.variations tbody,
body.kc-rd form.cart table.variations tr,
body.kc-rd form.cart table.variations td.value {
	display: block;
	width: 100%;
	border: 0;
	padding: 0;
	margin: 0;
}
/* "Weight" th/td label and the reset link: the sizelab replaces both. */
body.kc-rd form.cart table.variations td.label,
body.kc-rd form.cart table.variations th.label,
body.kc-rd form.cart .reset_variations { display: none !important; }
body.kc-rd form.cart .single_variation_wrap { display: block; margin: 0; }

/* --- 22.2 The buy row, sized so it cannot overflow ---------------------- */
body.kc-rd .kc-buyrow {
	display: flex;
	gap: 6px;
	align-items: stretch;
	width: 100%;
	max-width: 440px; /* full column width reads sloppy on desktop */
}
body.kc-rd .kc-buyrow .kc-weight-pills { flex: 1 1 auto; min-width: 0; }
body.kc-rd .kc-buyrow .single_add_to_cart_button,
body.kc-rd .kc-buyrow .nm-variable-add-to-cart-button.single_add_to_cart_button.button.alt {
	flex: 0 1 auto;
	width: auto !important;
	max-width: 46%;
	min-height: 44px;
	margin: 0 !important;
	padding: 0 18px !important;
	font-size: 14px !important;
	white-space: nowrap;
}
body.kc-rd form.cart:has(.kc-buyrow) .kc-pline,
body.kc-rd form.cart:has(.kc-sizelab) .kc-pline { max-width: 440px; }

/* --- 22.3 Price visibility, done right this time ------------------------ */
/* Woo's price_html carries <span class="price">, so never blanket-hide
   ".price" anywhere a pline lives. Hide the THEME's price containers. */
body.kc-rd ul.nm-products li.product:has(.kc-pline) .nm-shop-loop-price { display: none; }
body.kc-rd .product .nm-product-summary-inner-col-1 .price { display: none; }
body.kc-rd form.variations_form .woocommerce-variation-price { display: none; }
/* pline's own price fragments must never be washed by theme price rules */
body.kc-rd .kc-pline .price,
body.kc-rd .kc-pline .price .amount,
body.kc-rd .kc-pline .price bdi {
	display: inline !important;
	font-family: var(--price-font) !important;
	font-size: inherit !important;
	font-weight: inherit !important;
	color: var(--text) !important;
}

/* --- 22.4 Buy zone first, effects after --------------------------------- */
/* The jwa effect pills sat between the title and the price and pushed the
   price below the fold on phones. Column order: form (price/chips/Add) first,
   effects after, everything else follows. */
body.kc-rd .nm-product-summary-inner-col-2 { display: flex; flex-direction: column; }
body.kc-rd .nm-product-summary-inner-col-2 > * { order: 2; }
body.kc-rd .nm-product-summary-inner-col-2 > form.cart,
body.kc-rd .nm-product-summary-inner-col-2 > .variations_form { order: 1; }
body.kc-rd .nm-product-summary-inner-col-2 > .jwa-term-list-wrap { order: 3; margin: 16px 0 0; }

/* --- 22.4b Card pline must FIT a 150px card ----------------------------- */
/* "$120.00" + "/28G" + "$4.29/g" clipped at 18px. Sized to the narrowest
   two-column card: 15px price, 11px fused weight, 9px $/g, nothing wraps. */
body.kc-rd ul.nm-products li.product .kc-pline { gap: 4px; min-width: 0; }
body.kc-rd ul.nm-products li.product .kc-pline .kc-pline-price,
body.kc-rd ul.nm-products li.product .kc-pline .kc-pline-price .amount,
body.kc-rd ul.nm-products li.product .kc-pline .kc-pline-price bdi { font-size: 13px !important; }
body.kc-rd ul.nm-products li.product .kc-pline .kc-pline-price i { font-size: 10px; }
body.kc-rd ul.nm-products li.product .kc-pline .kc-pline-pergram {
	font-size: 9px;
	flex: 0 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* --- 22.5 Effects, compact ---------------------------------------------- */
body.kc-rd .jwa-term-list-wrap .effect-oldh3 {
	font-family: var(--label-font);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--text-faint);
	margin: 0 0 6px;
}
body.kc-rd .jwa-term-list { display: flex; flex-wrap: wrap; gap: 5px; margin: 0; padding: 0; list-style: none; }
body.kc-rd .jwa-term-list li { margin: 0; }
body.kc-rd .jwa-term-list li a {
	display: inline-block;
	font-size: 12px;
	line-height: 1.2;
	padding: 5px 11px;
	border: 1px solid var(--border);
	border-radius: 999px;
	color: var(--text-muted);
}

/* ==========================================================================
   23. THE BUY COMPONENT — one CSS, em-scaled, two sizes
   --------------------------------------------------------------------------
   Per docs/PLAYBOOK_product_card_PCD专项.md (nativenic lead, 2026-08-16):
   every dimension in em; the card runs the component at 12px, the PDP at
   16px — same code, two scales, so the three surfaces can never drift apart.
   Fixed slot heights keep every card's CTA on the same baseline (§1.1).
   ========================================================================== */

body.kc-rd .kc-buy { font-size: 12px; display: flex; flex-direction: column; }
/* the buy component IS the price display — the theme's line above it goes */
body.kc-rd ul.nm-products li.product:has(.kc-buy) .nm-shop-loop-price { display: none; }
body.kc-rd .summary .kc-tiers,
body.kc-rd form.cart .kc-tiers,
body.kc-rd .summary .kc-sizelab { font-size: 16px; }

/* --- 23.1 Fixed slots: title 2 lines, chips row, hint line --------------- */
body.kc-rd ul.nm-products li.product .nm-shop-loop-title,
body.kc-rd ul.nm-products li.product h3 {
	min-height: 2.7em; /* two lines at 1.35 — one-line titles keep the grid */
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
body.kc-rd .kc-tiers {
	display: flex;
	gap: 0.42em;
	min-height: 4.1em; /* the slot exists even on simple products */
}
body.kc-rd .kc-tiers-empty { visibility: hidden; }
body.kc-rd .kc-save {
	font-size: 0.83em;
	line-height: 1.3;
	min-height: 1.35em; /* reserved — never collapses (§3) */
	color: var(--text-muted);
	margin: 0.35em 0 0.55em;
}

/* --- 23.2 The chip: weight up, live price under, ★ on best $/g ---------- */
body.kc-rd .kc-tier {
	flex: 1 1 0;
	min-width: 0;
	min-height: 4.1em;
	position: relative;
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.1em;
	padding: 0.3em 0.2em;
	border: 1px solid var(--border);
	border-radius: var(--kc-radius-md);
	background: var(--surface-raised);
	font-family: inherit;
	cursor: pointer;
	touch-action: manipulation;
}
body.kc-rd .kc-tier::after { content: ""; position: absolute; inset: -3px; }
body.kc-rd .kc-tier .kc-tier-w {
	font-size: 0.79em;
	font-weight: 600;
	letter-spacing: .08em;
	color: var(--text-muted);
}
/* Price is sans-bold, NOT mono — five visual languages on a 240px card was
   the "插在一起" feel; the receipt font goes first (§1.5). */
body.kc-rd .kc-tier .kc-tier-p {
	font-size: 1em;
	font-weight: 700;
	color: var(--text);
	white-space: nowrap;
}
body.kc-rd .kc-tier .kc-tier-star {
	position: absolute;
	top: 0.25em; right: 0.35em;
	font-size: 0.7em;
	color: var(--trust);
	line-height: 1;
}
body.kc-rd .kc-tier.kc-on {
	border: 1.5px solid var(--text);
}
body.kc-rd .kc-tier.kc-on.kc-picked {
	border-color: var(--trust);
	background: #9AB5A7;
}
body.kc-rd .kc-tier.kc-on.kc-picked .kc-tier-w { color: var(--text); }
body.kc-rd .kc-tier.kc-tier-oos { opacity: .45; cursor: default; }
body.kc-rd .kc-tier.kc-tier-oos .kc-tier-p { text-decoration: line-through; }
body.kc-rd .kc-tier.kc-tier-solo { cursor: default; }
body.kc-rd .kc-tier:focus-visible { outline: 2px solid var(--trust); outline-offset: 2px; }

/* --- 23.3 CTA: full row, live total, one hard shadow on the card -------- */
body.kc-rd .kc-cta,
body.kc-rd button.kc-cta.kc-card-add.button {
	width: 100%;
	min-height: 3.4em;
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.3em;
	background: var(--btn-primary-bg) !important;
	color: var(--btn-primary-text) !important;
	border: 1.5px solid var(--btn-primary-border) !important;
	border-radius: var(--kc-radius-md) !important;
	box-shadow: 2px 2px 0 var(--btn-primary-border);
	font-family: inherit;
	font-size: 1.08em !important;
	font-weight: 700;
	white-space: nowrap;
	flex-wrap: nowrap;
	touch-action: manipulation;
}
body.kc-rd .kc-cta::after { content: ""; position: absolute; inset: -3px 0; }
body.kc-rd .kc-cta .kc-cta-price { font-weight: 700; }

/* PDP CTA: Woo's own button, restyled to the same rule — full width, total on
   the button, own row (never inside the chip row). */
body.kc-rd form.cart .single_add_to_cart_button {
	width: 100% !important;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	margin-top: 8px !important;
}

/* --- 23.4 PDP quantity: back, compact, before the CTA ------------------- */
body.kc-rd form.cart .quantity {
	display: inline-flex !important;
	align-items: center;
	gap: 2px;
	margin: 6px 0 0;
}
body.kc-rd form.cart .quantity .qty {
	width: 3.4em;
	min-height: 44px;
	text-align: center;
	border: 1px solid var(--border-strong);
	border-radius: var(--kc-radius-md);
	font-size: 16px; /* iOS zoom floor */
}

/* --- 23.5 Images: square, no fixed px, cannot be invisible --------------- */
/* main.css pins .nm-shop-loop-thumbnail img { height: 290/208.5/248px } from
   the previous developer — the 188x350 grey bars. aspect-ratio owns the box;
   the opacity failsafe means a broken lazyload class can grey a card but
   never blank it. */
body.kc-rd ul.nm-products li.product .nm-shop-loop-thumbnail {
	aspect-ratio: 1 / 1;
	height: auto !important;
	overflow: hidden;
	background: var(--card-shot-bg);
}
body.kc-rd ul.nm-products li.product .nm-shop-loop-thumbnail img {
	width: 100% !important;
	height: 100% !important;
	object-fit: contain;
	transition: none !important;
}
/* 2026-08-27:上面那条原本还有 `opacity: 1 !important`。它的本意是"lazyload 类失效
   也不能让卡片变空",但它把 Savoy 的 hover 图一起点亮了 —— .nm-shop-hover-image 是
   absolute 且 DOM 靠后,于是**卡片显示的永远是图库第 1 张,不是首图**;手机没有 hover,
   等于移动端永远看不到首图。全站 40 个有图库的产品都中招(product-hero-image.md §5)。
   拆开写:兜底只给主图,hover 图交还 Savoy 自己的 0→1。 */
body.kc-rd ul.nm-products li.product .nm-shop-loop-thumbnail img:not(.nm-shop-hover-image) {
	opacity: 1 !important;
}
body.kc-rd ul.nm-products li.product .nm-shop-loop-thumbnail img.nm-shop-hover-image {
	opacity: 0 !important;
	transition: opacity .3s ease !important;
}
body.kc-rd ul.nm-products li.product .nm-shop-loop-thumbnail a:hover img.nm-shop-hover-image,
body.kc-rd ul.nm-products li.product:hover .nm-shop-loop-thumbnail img.nm-shop-hover-image {
	opacity: 1 !important;
}

/* --- 23.7 Price lives ONCE ---------------------------------------------- */
/* Simple cards: the save slot carries the price (they have no chip). */
body.kc-rd .kc-save.kc-save-price {
	font-size: 1.16em;
	font-weight: 700;
	color: var(--text);
}
/* Grids with zero tier chips anywhere (Edibles): the reserved rows are void —
   collapse them. Mixed grids keep the CTA baseline reserve. */
body.kc-rd ul.nm-products.kc-solo-grid .kc-tiers-empty { display: none; }
@media (max-width: 520px) {
	body.kc-rd ul.nm-products.kc-solo-grid .kc-buy-card .kc-tiers,
	body.kc-rd ul.nm-products.kc-solo-grid .kc-buy-card .kc-tiers-empty { min-height: 0; }
}

/* ==========================================================================
   24. PDP CAGE — the page stops stretching with the monitor (2026-08-16)
   --------------------------------------------------------------------------
   Owner: "屏幕拉多宽整个东西就走多宽". Savoy lets the showcase span the full
   viewport; on wide monitors the summary column becomes a prairie. Cage the
   whole product area and give each column a sane measure.
   ========================================================================== */
body.kc-rd.single-product .nm-single-product-showcase,
body.kc-rd.single-product .nm-single-product-summary-row {
	max-width: 1240px;
	margin-left: auto !important;
	margin-right: auto !important;
}
body.kc-rd.single-product .summary.entry-summary {
	max-width: 560px; /* the buy column reads as a column, not a prairie */
}
body.kc-rd.single-product .summary .kc-tiers { max-width: 460px; }
body.kc-rd.single-product form.cart .single_add_to_cart_button { max-width: 460px; }
body.kc-rd.single-product .summary .kc-pline { max-width: 460px; }
/* tighten the dead band between summary blocks */
body.kc-rd.single-product .summary > * { margin-bottom: 14px; }
body.kc-rd.single-product .nm-single-product-menu { max-width: 1240px; margin: 0 auto; }

/* ==========================================================================
   25. WALKTHROUGH FIXES — round 1 (2026-08-16, REVIEW_staging_design_walkthrough)
   ========================================================================== */

/* --- 25.1 [G1] magnifier sat on the input text --------------------------- */
body.kc-rd .kc-fibo-header .dgwt-wcas-search-input { padding-left: 44px !important; }

/* --- 25.2 Mobile cards: un-clip the CTA ---------------------------------- */
/* Savoy equalises card heights with JS that measures BEFORE our webfonts and
   em-based buy block settle — every stacked card got a too-small fixed height
   and overflow swallowed the button (owner's screenshot: a 20px yellow rim).
   Heights are ours now; the theme's frozen numbers are void. */
body.kc-rd ul.nm-products li.product,
body.kc-rd ul.nm-products li.product .nm-shop-loop-product-wrap,
body.kc-rd ul.nm-products li.product .nm-shop-loop-details,
body.kc-rd ul.nm-products li.product .nm-shop-loop-price-button,
body.kc-rd ul.nm-products li.product .nm-shop-loop-actions {
	height: auto !important;
	max-height: none !important;
	overflow: visible !important;
}

/* --- 25.4 [G2] WhatsApp ball (click-to-chat #ht-ctc-chat) ---------------- */
#ht-ctc-chat { z-index: 998 !important; } /* under our sticky ATC + drawer */
@media (max-width: 768px) {
	#ht-ctc-chat .ht_ctc_padding { padding: 10px !important; box-shadow: 0 0 6px rgba(0,0,0,.3) !important; }
	#ht-ctc-chat svg { width: 26px !important; height: 26px !important; }
}
body.kc-drawer-open #ht-ctc-chat { display: none !important; }
body.kc-atc-shown #ht-ctc-chat { bottom: 78px !important; } /* clear the sticky bar */

/* ==========================================================================
   26. MOBILE CARD = THE APPROVED MOCKUP (2026-08-16, owner)
   --------------------------------------------------------------------------
   Desktop keeps the expert card (priced two-line chips in one row — owner:
   "电脑端没问题了"). Mobile returns to the v16 mockup the owner approved:
   one big price line, weight-only chips in a single row, full-width Add.
   Loads after §23/§25, so these override the stacked-row experiment.
   ========================================================================== */

/* pline inside cards: hidden on desktop when chips are present (they carry
   prices there); simple cards keep it as their price. */
body.kc-rd .kc-buy-card .kc-pline { display: flex; align-items: baseline; gap: 0.4em; }
body.kc-rd .kc-buy-card .kc-pline .kc-pline-price {
	font-family: inherit; font-size: 1.34em; font-weight: 700; color: var(--text);
}
body.kc-rd .kc-buy-card .kc-pline .kc-pline-price i {
	font-style: normal; font-size: 0.75em; font-weight: 600; color: var(--text-muted);
}
body.kc-rd .kc-buy-card .kc-pline .kc-pline-pergram {
	font-size: 0.78em; color: var(--text-muted); margin-left: auto;
}
@media (min-width: 521px) {
	body.kc-rd .kc-buy-card:has(.kc-tier:not(.kc-tier-link)) .kc-pline,
	body.kc-rd .kc-buy-card:has(.kc-btn-secondary) .kc-pline { display: none; }
}
/* Choose options = same size as Add to cart, always. The theme's a.button
   padding (12px 26px) makes the link 4px taller than the <button> — force
   the button's own padding so both render 44px. */
body.kc-rd a.kc-cta-link,
body.kc-rd a.kc-cta.kc-cta-link.button {
	width: 100% !important;
	display: inline-flex !important;
	box-sizing: border-box;
	padding: 10px 12px !important;
	/* the WIG tap-target rule pins links to min-height 48px; the card's
	   <button> CTA renders 44.1px (3.4em) — match it exactly */
	min-height: 3.4em !important;
	white-space: nowrap !important; /* phone: never wrap to two lines */
}

@media (max-width: 520px) {
	/* Mockup look, expert baseline. Equal height comes from STRUCTURE, not a
	   guessed number: solo/simple cards keep the 36px chip-row slot, invisible.
	   Every card = pline + chip row + Add, so CTAs share the baseline. */
	body.kc-rd .kc-buy-card { min-height: 0; }
	body.kc-rd .kc-buy-card .kc-cta { margin-top: 0.4em; }
	/* chips: one quiet row of weight labels, exactly the mockup */
	body.kc-rd .kc-buy-card .kc-tiers {
		flex-direction: row;
		gap: 4px;
		min-height: 0;
		margin: 0.4em 0 0;
	}
	body.kc-rd .kc-buy-card .kc-tier {
		flex: 1 1 0;
		flex-direction: row;
		justify-content: center;
		min-height: 36px;
		padding: 0 2px;
	}
	body.kc-rd .kc-buy-card .kc-tier .kc-tier-p,
	body.kc-rd .kc-buy-card .kc-tier .kc-tier-star { display: none; }
	body.kc-rd .kc-buy-card .kc-tier .kc-tier-w { font-size: 11px; letter-spacing: .06em; }
	/* solo cards: the 28G chip SHOWS (owner 2026-08-16) — selected state,
	   not switchable; the fused /28G on the price line hides so the weight
	   is said once. */
	body.kc-rd .kc-buy-card:has(.kc-tier-solo) .kc-pline-price i { display: none; }
	body.kc-rd .kc-buy-card .kc-tiers-empty {
		display: flex;
		visibility: hidden;
		min-height: 36px;
		margin: 0.4em 0 0;
	}
	body.kc-rd ul.nm-products.kc-solo-grid .kc-buy-card .kc-tiers-empty,
	body.kc-rd ul.nm-products.kc-solo-grid .kc-buy-card .kc-tiers { display: none; }
	/* $/g lives on the price line here */
	body.kc-rd .kc-buy-card .kc-save { display: none; }

	/* --- rhythm (measured, not guessed): img 10 / title 8 / pline 6 / chips 8 / cta,
	   card bottom 12. Before: chips touched the CTA (0px) while the card kept a
	   31px void under the button. --- */
	/* Title: tighter leading so the 2-line reserve is 36px, not 41 — and the
	   price steps up to anchor the middle of the card. */
	body.kc-rd ul.nm-products li.product .nm-shop-loop-title { min-height: 36.8px; }
	body.kc-rd ul.nm-products li.product .nm-shop-loop-title,
	body.kc-rd ul.nm-products li.product .nm-shop-loop-title .woocommerce-loop-product__title,
	body.kc-rd ul.nm-products li.product .nm-shop-loop-title a {
		font-size: 16px !important;
		line-height: 1.15 !important;
	}
	body.kc-rd .kc-buy-card .kc-pline .kc-pline-price { font-size: 1.55em; letter-spacing: -.01em; }
	body.kc-rd .kc-buy-card .kc-pline .kc-pline-pergram { font-size: 0.85em; }
	body.kc-rd ul.nm-products li.product .nm-shop-loop-details { margin-top: 10px !important; min-height: 0 !important; }
	body.kc-rd ul.nm-products li.product .nm-shop-loop-price-button { margin-top: 8px !important; }
	body.kc-rd ul.nm-products li.product .nm-shop-loop-actions { margin-top: 0 !important; }
	body.kc-rd .kc-buy-card .kc-tiers { margin-top: 6px; }
	body.kc-rd .kc-buy-card .kc-cta { margin-top: 8px !important; }
	body.kc-rd ul.nm-products li.product .nm-shop-loop-product-wrap { padding-bottom: 12px !important; }
	body.kc-rd ul.nm-products li.product { padding-bottom: 0 !important; margin-bottom: 14px !important; }
}


/* --- 26.x link-tier (many-option cards) + PDP chip wrap ------------------ */
body.kc-rd .kc-tier-link {
	flex-direction: row !important;
	text-decoration: none;
	color: var(--text-muted);
}
body.kc-rd .kc-tier-link:hover { border-color: var(--text); color: var(--text); }
body.kc-rd .kc-cta-link { text-align: center; text-decoration: none !important; }
/* PDP: many options wrap into rows instead of crushing one line */
body.kc-rd form.cart .kc-weight-pills { flex-wrap: wrap; }
body.kc-rd form.cart .kc-weight-pills .kc-weight-pill { flex: 1 1 30%; min-width: 92px; }
body.kc-rd .kc-pline-price .kc-from {
	font-style: normal;
	font-size: 0.62em;
	font-weight: 600;
	color: var(--text-muted);
	letter-spacing: .04em;
}

/* --- 26.y Quiet chips, SQUARE (owner 2026-08-17: 方的,不要圆的) ---------- */
body.kc-rd .kc-tier,
body.kc-rd .kc-weight-pill.kc-tier {
	border-radius: var(--kc-radius-md);
	border-color: var(--border);
}
body.kc-rd .kc-tier.kc-on { border-width: 1.5px; }
body.kc-rd .kc-tier-link { border-radius: var(--kc-radius-md); }

/* the % badge — real, from the configured rule; visible on BOTH viewports */
body.kc-rd .kc-tier-off {
	position: absolute;
	top: -7px;
	right: -4px;
	font-size: 9px;
	font-weight: 700;
	line-height: 1;
	padding: 2px 4px;
	border-radius: 3px;
	background: var(--trust);
	color: var(--on-trust);
	letter-spacing: .02em;
}
@media (max-width: 520px) {
	body.kc-rd .kc-buy-card .kc-tier .kc-tier-off { display: block; } /* survives the price-hide rule */
}

/* link-mode cards: the pline IS their only price — never hide it */

/* ==========================================================================
   27. PDP DOSSIER (owner pick 2026-08-17: V1 layout + fused fact strip/bar)
   ========================================================================== */

/* --- 27.1 Fact strip + THC bar (one fused element) ----------------------- */
body.kc-rd.single-product .kc-facts {
	display: flex;
	max-width: 460px;
	border: 1px solid var(--border);
	border-radius: var(--kc-radius-md);
	background: var(--surface-raised);
	overflow: hidden;
	margin: 0 0 12px;
	text-align: center;
}
body.kc-rd.single-product .kc-facts.kc-facts-hasbar {
	border-radius: var(--kc-radius-md) var(--kc-radius-md) 0 0;
	margin-bottom: 0;
}
body.kc-rd.single-product .kc-fact { flex: 1 1 0; min-width: 0; padding: 8px 4px; }
body.kc-rd.single-product .kc-fact + .kc-fact { border-left: 1px solid var(--border); }
body.kc-rd.single-product .kc-fact i {
	display: block;
	font-style: normal;
	font-size: 9.5px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--text-faint);
	margin-bottom: 1px;
}
body.kc-rd.single-product .kc-fact b { font-size: 13px; font-weight: 700; color: var(--text); }
body.kc-rd.single-product .kc-fact-strain b { color: var(--trust); }
body.kc-rd.single-product .kc-facts-bar {
	max-width: 460px;
	border: 1px solid var(--border);
	border-top: 0;
	border-radius: 0 0 var(--kc-radius-md) var(--kc-radius-md);
	background: var(--surface-raised);
	padding: 9px 11px;
	margin: 0 0 12px;
}
body.kc-rd.single-product .kc-bar-track {
	display: block;
	height: 6px;
	background: var(--surface-sunken);
	border-radius: 3px;
	overflow: hidden;
}
body.kc-rd.single-product .kc-bar-track i { display: block; height: 100%; background: var(--trust); border-radius: 3px; }

/* --- 27.2 Trust grid under the CTA --------------------------------------- */
body.kc-rd.single-product .kc-trust {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	max-width: 460px;
	border: 1px solid var(--border);
	border-radius: var(--kc-radius-md);
	background: var(--surface-raised);
	overflow: hidden;
	margin: 14px 0 0;
}
body.kc-rd.single-product .kc-trust > div {
	padding: 10px 6px;
	text-align: center;
	font-size: 11px;
	line-height: 1.45;
	color: var(--text-muted);
}
body.kc-rd.single-product .kc-trust > div + div { border-left: 1px solid var(--border); }
body.kc-rd.single-product .kc-trust b { display: block; color: var(--text); font-size: 11.5px; }
body.kc-rd.single-product .kc-trust-i { display: block; font-size: 15px; margin-bottom: 2px; }

/* --- 27.3 Accordion group ------------------------------------------------ */
body.kc-rd.single-product .kc-acc { max-width: 460px; border-top: 1px solid var(--border); margin-top: 18px; }
body.kc-rd.single-product .kc-acc-head {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 13px 2px;
	border: 0;
	border-bottom: 1px solid var(--border);
	background: none;
	font-family: inherit;
	font-weight: 700;
	font-size: 13.5px;
	color: var(--text);
	cursor: pointer;
	text-align: left;
}
body.kc-rd.single-product .kc-acc-head span { color: var(--text-faint); font-size: 16px; line-height: 1; }
body.kc-rd.single-product .kc-acc-body {
	display: none;
	font-size: 13px;
	line-height: 1.65;
	color: var(--text-muted);
	padding: 10px 2px 14px;
	border-bottom: 1px solid var(--border);
}
body.kc-rd.single-product .kc-acc-body.kc-acc-open { display: block; }
/* description block loses its stand-alone framing inside the accordion */
body.kc-rd.single-product .kc-acc .kc-pdp-desc { margin: 0; }

/* --- 27.4 Effect tags: quiet text pills (P6), relocated by JS ------------ */
body.kc-rd.single-product .kc-acc .jwa-term-list-wrap .effect-oldh3 { display: none; }
body.kc-rd.single-product .kc-acc .jwa-term-list {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
}
body.kc-rd.single-product .kc-acc .jwa-term-list li { margin: 0; }
body.kc-rd.single-product .kc-acc .jwa-term-list li a {
	display: inline-block;
	/* the theme's 18px content sizing and pill styling outrank us without
	   !important — these ARE the P6 quiet pills, so pin them down */
	font-size: 11.5px !important;
	color: var(--text-muted) !important;
	background: var(--surface-sunken) !important;
	border-radius: 3px !important;
	padding: 4px 10px !important;
	border: 0 !important;
	line-height: 1.4 !important;
}
/* until the JS moves it, the original Effect block above the form stays out
   of the eye-line (content remains in DOM) */
body.kc-rd.single-product .summary > .nm-product-summary-inner-col .jwa-term-list-wrap:not(.kc-moved) { display: none; }

/* --- 27.5 Quantity stepper: −/+ instead of the media-play triangles (S6) - */
body.kc-rd.single-product .nm-qty-minus,
body.kc-rd.single-product .nm-qty-plus { transform: none !important; }
/* geometric SVG marks — text glyphs sit on font metrics and never optically
   align with a digit; a masked rect is exactly centered by flex */
body.kc-rd.single-product .nm-qty-minus::before,
body.kc-rd.single-product .nm-qty-plus::before {
	content: "" !important;
	display: block;
	width: 15px;
	height: 15px;
	background: currentColor;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
}
body.kc-rd.single-product .nm-qty-minus::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='2' y='7.15' width='12' height='1.7' rx='.85'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='2' y='7.15' width='12' height='1.7' rx='.85'/%3E%3C/svg%3E");
}
body.kc-rd.single-product .nm-qty-plus::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='2' y='7.15' width='12' height='1.7' rx='.85'/%3E%3Crect x='7.15' y='2' width='1.7' height='12' rx='.85'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='2' y='7.15' width='12' height='1.7' rx='.85'/%3E%3Crect x='7.15' y='2' width='1.7' height='12' rx='.85'/%3E%3C/svg%3E");
}
/* the digit's ink correction: the glyph's ink rides 2.5px above the SVG
   marks' optical center (measured from rendered pixels, not boxes) */
body.kc-rd.single-product .nm-quantity-wrap .quantity input.qty { transform: translateY(2.5px); }

/* --- 27.6 Verify-round fixes (2026-08-17 adversarial pass) --------------- */
/* stray bare price span after the H1 (col-1, outside p.price) — the $35 it
   shows is the retired 3.5g tier. Hide until the emitter is traced. */
body.kc-rd.single-product .nm-product-summary-inner-col-1 > .woocommerce-Price-amount,
body.kc-rd.single-product .nm-product-summary-inner-col-1 > span.amount { display: none !important; }
/* Woo stock badge leaking on the inherited simple.php template */
body.kc-rd.single-product .summary p.stock { display: none !important; }
/* the inherited simple.php prints its own price block inside the form */
body.kc-rd.single-product form.cart.kcd-test .single_variation { display: none !important; }
/* our simple-product price line (sale strike preserved) */
body.kc-rd.single-product .kc-pline-simple { margin: 0 0 12px; }
body.kc-rd.single-product .kc-pline-simple del { color: var(--text-faint); font-size: .62em; font-weight: 400; margin-right: 6px; }
body.kc-rd.single-product .kc-pline-simple ins { text-decoration: none; }
/* preselect ring must be legible (was hairline-grey = invisible) */
body.kc-rd.single-product .kc-tier.kc-on { border: 1.5px solid var(--text) !important; }
/* solo chip: compact, no duplicate price (pline already fuses $/28G) */
body.kc-rd.single-product .kc-weight-pill.kc-tier-solo {
	flex: 0 0 auto !important;
	width: auto !important;
	min-width: 110px;
	max-width: 150px;
	padding-left: 18px;
	padding-right: 18px;
}
body.kc-rd.single-product .kc-weight-pill.kc-tier-solo .kc-tier-p { display: none; }
/* strip cells + chips:真 center, no bottom-heavy dead band */
body.kc-rd.single-product .kc-fact { display: flex; flex-direction: column; justify-content: center; }
body.kc-rd.single-product .kc-weight-pill { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; }
/* one hairline between accordion head and body, not two */
body.kc-rd.single-product .kc-acc .kc-pdp-desc { margin: 0; border-top: 0; padding-top: 4px; }
/* $/g shares the price baseline */
body.kc-rd.single-product .summary .kc-pline { align-items: baseline; }
/* trust icons: inline SVGs sized here */
body.kc-rd.single-product .kc-trust-i svg { width: 18px; height: 18px; display: inline-block; color: var(--text-muted); }

/* --- 27.7 Compact buy controls (owner 2026-08-17: spacing 太多,要 compact) - */
/* stepper: tight box, no theme chrome, the &nbsp; gaps killed via font-size:0 */
body.kc-rd.single-product .nm-quantity-wrap {
	padding: 0 !important;
	margin: 0 !important;
	border: 0 !important;
	box-shadow: none !important;
	background: none !important;
	width: auto !important;
}
body.kc-rd.single-product .nm-quantity-wrap label { display: none !important; }
body.kc-rd.single-product .nm-quantity-wrap .quantity {
	display: inline-flex !important;
	align-items: center;
	height: 46px;
	border: 0;
	background: none;
	font-size: 0; /* eats the literal &nbsp; text nodes between the controls */
	margin: 0 !important;
	padding: 0 !important;
}
body.kc-rd.single-product .nm-qty-minus,
body.kc-rd.single-product .nm-qty-plus {
	width: 38px;
	height: 100% !important;
	margin: 0 !important;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	color: var(--text-muted);
	border-radius: 50%;
}
body.kc-rd.single-product .nm-qty-minus:hover,
body.kc-rd.single-product .nm-qty-plus:hover { color: var(--text); background: var(--surface-sunken); }
body.kc-rd.single-product .nm-quantity-wrap .quantity input.qty {
	width: 38px !important;
	height: 46px !important;
	line-height: 46px !important;
	align-self: center;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	text-align: center;
	font-size: 17px;
	font-weight: 700;
	background: none;
}
/* qty + Add to cart share one row — the approved mockup layout */
body.kc-rd.single-product form.cart .variations_button,
body.kc-rd.single-product form.cart .woocommerce-variation-add-to-cart {
	display: flex !important;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 10px;
}
/* the tiered-pricing plugin's container rides in this row and steals width —
   park it (and the theme's .clear) on its own full row above the controls */
body.kc-rd.single-product form.cart .woocommerce-variation-add-to-cart > .tpt__tiered-pricing,
body.kc-rd.single-product form.cart .variations_button > .tpt__tiered-pricing {
	flex: 0 0 100%;
	order: -1;
}
body.kc-rd.single-product form.cart .variations_button > .clear { display: none; }
/* our facts/price render inside this container on simple products — they are
   header rows, never row-mates of the qty/CTA controls */
body.kc-rd.single-product form.cart .variations_button > .kc-facts,
body.kc-rd.single-product form.cart .variations_button > .kc-facts-bar,
body.kc-rd.single-product form.cart .variations_button > .kc-pline {
	flex: 0 0 100%;
	order: -1;
}
body.kc-rd.single-product form.cart .single_add_to_cart_button {
	flex: 1;
	margin: 0 !important;
	max-width: none;
}
/* chips: shorter, tighter — same info, less real estate */
body.kc-rd.single-product .kc-weight-pill { min-height: 3.1em; padding: 0.3em 0.2em; gap: 0.05em; }
body.kc-rd.single-product .kc-weight-pill .kc-tier-w {
	font-size: 0.98em;
	font-weight: 700;
	letter-spacing: .02em;
	color: var(--text);
}
body.kc-rd.single-product .kc-weight-pill .kc-tier-p { font-size: 0.8em; font-weight: 600; color: var(--text-muted); }
body.kc-rd.single-product .summary .kc-tiers { gap: 8px; }
body.kc-rd.single-product .kc-weight-pill.kc-tier-solo { min-height: 3.1em; }

/* --- 27.8 One typeface + quiet mobile facts (owner's friend, 2026-08-17) - */
/* The PDP mixed the mono data-font (price, $/g, CHOOSE A SIZE) with Poppins.
   Remap the component tokens for this surface only — category cards keep
   their separately-approved look. tabular-nums preserves digit alignment. */
body.kc-rd.single-product {
	--price-font: var(--kc-font-body);
	--label-font: var(--kc-font-body);
}
body.kc-rd.single-product .summary .kc-pline-price { font-weight: 700; font-variant-numeric: tabular-nums; }
body.kc-rd.single-product .summary .kc-pline-pergram { font-variant-numeric: tabular-nums; }
body.kc-rd.single-product .kc-sizelab {
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .08em;
	color: var(--text-muted);
}
body.kc-rd.single-product .kc-sticky-price { font-family: var(--kc-font-body); font-variant-numeric: tabular-nums; }
body.kc-rd.single-product .nm-quantity-wrap .quantity input.qty { font-family: var(--kc-font-body); }

/* The fact strip reads as text, not a boxed card — BOTH viewports (owner
   2026-08-17: 桌面也一样,方框太多焦点散). The buy box keeps one visual
   lead (price + CTA); the facts recede to reference material. */
body.kc-rd.single-product .kc-facts,
body.kc-rd.single-product .kc-facts.kc-facts-hasbar {
	border: 0;
	background: none;
	border-radius: 0;
	overflow: visible;
	margin: 0 0 4px;
}
body.kc-rd.single-product .kc-fact { padding: 2px 4px; }
body.kc-rd.single-product .kc-fact + .kc-fact { border-left: 1px solid var(--border); }
body.kc-rd.single-product .kc-fact i { font-size: 8.5px; }
body.kc-rd.single-product .kc-fact b { font-size: 12px; font-weight: 600; color: var(--text-muted); }
body.kc-rd.single-product .kc-fact-strain b { color: var(--text-muted); }
body.kc-rd.single-product .kc-facts-bar {
	border: 0;
	background: none;
	padding: 2px 4px 0;
	margin: 0 0 10px;
}

/* --- 27.9 Trust grid relocated under Description (owner 2026-08-17) ------ */
body.kc-rd.single-product .kc-trust-line {
	font-size: 11.5px;
	color: var(--text-muted);
	margin: 10px 0 0;
	text-align: center;
	flex: 0 0 100%; /* it renders inside the qty/CTA flex row's container */
}
body.kc-rd.single-product .kc-acc .kc-trust { margin: 0 0 16px; max-width: none; }

/* the theme's own 3-icon USP block duplicates (and contradicts) the trust
   grid — 6 USPs total was the owner's complaint. Ours carries the message. */
body.kc-rd.single-product .info-block-wrap { display: none !important; }

/* --- 27.10 Cannabinoid profile tiles (rollingreleaf reference) ----------- */
body.kc-rd.single-product .kc-cannabinoids {
	max-width: 1240px;
	margin: 34px auto 0;
	padding: 0 20px;
}
body.kc-rd.single-product .kc-cannabinoids h2 {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--text-muted);
	margin: 0 0 12px;
}
body.kc-rd.single-product .kc-cann-grid { display: flex; flex-wrap: wrap; gap: 10px; }
body.kc-rd.single-product .kc-cann-tile {
	flex: 0 0 auto;
	min-width: 108px;
	padding: 14px 16px;
	text-align: center;
	background: var(--surface-raised);
	border: 1px solid var(--border);
	border-radius: var(--kc-radius-md);
}
body.kc-rd.single-product .kc-cann-tile b {
	display: block;
	font-size: 17px;
	font-weight: 700;
	color: var(--trust);
	font-variant-numeric: tabular-nums;
}
body.kc-rd.single-product .kc-cann-tile i {
	display: block;
	font-style: normal;
	font-size: 9.5px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--text-faint);
	margin-top: 3px;
}
body.kc-rd.single-product .kc-cann-note { font-size: 11px; color: var(--text-faint); margin: 10px 0 0; }
@media (max-width: 520px) {
	body.kc-rd.single-product .kc-cann-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
	body.kc-rd.single-product .kc-cann-tile { min-width: 0; padding: 12px 8px; }
}

/* --- 27.11 IA de-clutter round (owner 2026-08-17) ------------------------ */
/* the custom tab's ALL-CAPS "INFORMATION" banner label says nothing */
body.kc-rd.single-product .custom-product-tab-info > .custom-product-tab-title { display: none !important; }

/* --- flatten the legacy 4-tab bar into one scroll flow ------------------- */
/* titles row (Information / Reviews / Related Products / Delivery Area) out */
body.kc-rd.single-product .custom-product-tabs__titles { display: none !important; }
/* reviews join the flow as a normal section */
body.kc-rd.single-product .custom-product-tab-reviews {
	display: block !important;
	opacity: 1 !important;
	margin-top: 38px;
}
body.kc-rd.single-product .custom-product-tab-reviews > .custom-product-tab-title {
	font-size: 22px;
	margin-bottom: 14px;
}
/* related-products pane duplicates the upsell row; delivery-area pane is SEO
   reference — both stay non-rendered exactly as the tab system left them */
body.kc-rd.single-product .custom-product-tab-relatedprod,
body.kc-rd.single-product .custom-product-tab-delivery { display: none !important; }

/* stepper digit: number inputs reserve spinner space, pushing the digit off
   center — kill the native spinners (our −/+ do that job) */
body.kc-rd.single-product .nm-quantity-wrap .quantity input.qty {
	-webkit-appearance: none;
	-moz-appearance: textfield;
	appearance: textfield;
}
body.kc-rd.single-product .nm-quantity-wrap .quantity input.qty::-webkit-inner-spin-button,
body.kc-rd.single-product .nm-quantity-wrap .quantity input.qty::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* one-size products: the price already says it all ($120.00/28G fused) —
   no label, no lone pseudo-selector */
body.kc-rd.single-product .kc-tiers:has(.kc-tier-solo) { display: none !important; }
body.kc-rd.single-product td.value:has(.kc-tier-solo) .kc-sizelab,
body.kc-rd.single-product div:has(> .kc-tiers .kc-tier-solo) .kc-sizelab { display: none !important; }
body.kc-rd.single-product .kc-pline-price i {
	font-style: normal;
	font-size: .55em;
	font-weight: 600;
	color: var(--text-muted);
	margin-left: 2px;
}

/* cannabinoids inline inside the article container */
body.kc-rd.single-product .kc-cann-inline { max-width: none; margin: 0 0 26px; padding: 0; }
body.kc-rd.single-product .kc-cann-inline .kc-cann-h {
	font-size: 12px !important;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--text-muted);
	margin: 0 0 10px !important;
	text-align: left;
}
body.kc-rd.single-product .kc-cann-inline .kc-cann-tile { padding: 11px 14px; min-width: 92px; }

/* trust band between article and recommendations */
body.kc-rd.single-product .kc-trust-band {
	max-width: 760px;
	margin: 34px auto 6px;
}
@media (max-width: 520px) {
	body.kc-rd.single-product .kc-trust-band { margin: 24px 16px 0; }
}

/* fused one-size unit, sibling of the price so JS price syncs never eat it */
body.kc-rd.single-product .kc-pline-unit,
body.kc-rd.single-product .kc-pline-unit i {
	font-style: normal;
	font-size: 15px;
	font-weight: 600;
	color: var(--text-muted);
	margin-left: 2px;
	align-self: baseline;
}

/* ==========================================================================
   28. D2 BENTO DESCRIPTION ZONE (owner pick 2026-08-19)
   ========================================================================== */
body.kc-rd.single-product .kc-bento { margin: 10px auto 34px; max-width: 1080px; padding: 0 20px; }
body.kc-rd.single-product .kc-eyebrow {
	display: inline-block;
	font-size: 10px !important;
	line-height: 1.4 !important;
	letter-spacing: .22em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--trust);
	background: rgba(30, 91, 60, .08);
	border-radius: 999px;
	padding: 5px 12px !important;
	margin: 0 0 12px;
}
body.kc-rd.single-product .kc-eyebrow-dark { background: rgba(255, 251, 242, .14); color: var(--kc-cream-50); }
body.kc-rd.single-product .kc-bt-title {
	font-family: var(--kc-font-display);
	font-size: 32px;
	line-height: 1.1;
	margin: 0;
	color: var(--text);
}
body.kc-rd.single-product .kc-bt-bar { width: 44px; height: 4px; background: var(--action); border-radius: 2px; margin: 10px 0 0; }
body.kc-rd.single-product .kc-bt-grid {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	gap: 16px;
	margin-top: 28px;
}
body.kc-rd.single-product .kc-sp4  { grid-column: span 4; }
body.kc-rd.single-product .kc-sp5  { grid-column: span 5; }
body.kc-rd.single-product .kc-sp6  { grid-column: span 6; }
body.kc-rd.single-product .kc-sp7  { grid-column: span 7; }
body.kc-rd.single-product .kc-sp8  { grid-column: span 8; }
body.kc-rd.single-product .kc-sp12 { grid-column: span 12; }

/* hero card: the zone's only hard shadow */
body.kc-rd.single-product .kc-bt-card.kc-bt-hero {
	background: var(--surface-raised);
	border: 1.5px solid var(--text);
	border-radius: 10px;
	box-shadow: 4px 4px 0 var(--text);
	padding: 28px 32px;
}
body.kc-rd.single-product .kc-bt-about p {
	font-size: 15px;
	line-height: 1.85;
	margin: 0 0 12px;
	color: var(--text);
}
body.kc-rd.single-product .kc-bt-about p:last-child { margin-bottom: 0; }
body.kc-rd.single-product .kc-bt-about p:empty { display: none; }
/* drop cap, gated: PHP adds .kc-bt-about-cap only when the excerpt starts
   with a letter (owner 2026-08-20: 首字母要大) */
body.kc-rd.single-product .kc-bt-about-cap p:first-of-type::first-letter {
	font-family: var(--kc-font-display);
	font-size: 2.9em;
	float: left;
	line-height: .82;
	padding: 4px 9px 0 0;
}

/* tray + inner card (double-bezel) */
body.kc-rd.single-product .kc-bt-tray { background: var(--surface-sunken); border-radius: 10px; padding: 8px; }
body.kc-rd.single-product .kc-bt-card-in {
	background: var(--surface-raised);
	border: 1px solid var(--border);
	border-radius: 7px;
	height: 100%;
	padding: 20px 22px;
}
body.kc-rd.single-product .kc-bt-cannrows { display: grid; gap: 9px; }
body.kc-rd.single-product .kc-bt-cannrow {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	border-bottom: 1px solid var(--border);
	padding-bottom: 7px;
}
body.kc-rd.single-product .kc-bt-cannrow:last-child { border-bottom: 0; padding-bottom: 0; }
body.kc-rd.single-product .kc-bt-cannrow i {
	font-style: normal;
	font-size: 10px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--text-faint);
}
body.kc-rd.single-product .kc-bt-cannrow b {
	font-size: 19px;
	font-weight: 700;
	color: var(--trust);
	font-variant-numeric: tabular-nums;
}
body.kc-rd.single-product .kc-bt-pill {
	display: inline-flex;
	font-size: 12px;
	color: var(--text);
	background: var(--surface-sunken);
	border-radius: 999px;
	padding: 6px 14px;
	margin: 0 6px 8px 0;
	font-weight: 500;
}
body.kc-rd.single-product .kc-bt-pill-fl { background: rgba(255, 201, 60, .22); }

/* pine card — the zone's one dark moment */
body.kc-rd.single-product .kc-bt-pine {
	background: var(--trust);
	border-radius: 10px;
	padding: 22px 24px;
	color: var(--kc-cream-50);
}
body.kc-rd.single-product .kc-bt-pine-h {
	/* 20px is under the 28px display-font floor — body face, bold, instead */
	font-family: var(--kc-font-body);
	font-weight: 700;
	font-size: 19px;
	line-height: 1.3;
	margin: 0 0 6px;
	color: #fff;
}
body.kc-rd.single-product .kc-bt-pine-p { font-size: 12.5px; line-height: 1.65; margin: 0; color: rgba(255, 251, 242, .8); }

/* FAQ card reuses the accordion behaviour, unbound from buy-box sizing */
body.kc-rd.single-product .kc-bt-acc { max-width: none; border-top: 0; margin-top: 2px; }
body.kc-rd.single-product .kc-bt-acc .kc-acc-head { font-size: 14px; padding: 12px 2px; }
body.kc-rd.single-product .kc-bt-acc .kc-acc-head:last-of-type { border-bottom: 0; }
body.kc-rd.single-product .kc-bt-acc .kc-acc-body { font-size: 13px; }

body.kc-rd.single-product .kc-bt-revcol { display: grid; gap: 12px; align-content: start; }
body.kc-rd.single-product .kc-bt-rev {
	background: var(--surface-raised);
	border: 1px solid var(--border);
	border-radius: 7px;
	padding: 16px 18px;
	font-size: 13px;
	line-height: 1.65;
	color: var(--text-muted);
}
body.kc-rd.single-product .kc-bt-rev b { color: var(--text); }
body.kc-rd.single-product .kc-bt-stars { color: var(--action); font-size: 12px; letter-spacing: 2px; }

/* entry motion: gentle fade-up, transform/opacity only */
@media (prefers-reduced-motion: no-preference) {
	body.kc-rd.single-product .kc-bt-grid > * {
		opacity: 0;
		transform: translateY(14px);
		transition: opacity .7s cubic-bezier(.32,.72,0,1), transform .7s cubic-bezier(.32,.72,0,1);
	}
	body.kc-rd.single-product .kc-bt-grid > .kc-bt-seen { opacity: 1; transform: none; }
}

/* mobile: single column stack */
@media (max-width: 768px) {
	body.kc-rd.single-product .kc-bt-grid { grid-template-columns: 1fr; gap: 14px; }
	body.kc-rd.single-product .kc-sp4, body.kc-rd.single-product .kc-sp5,
	body.kc-rd.single-product .kc-sp6, body.kc-rd.single-product .kc-sp7,
	body.kc-rd.single-product .kc-sp8, body.kc-rd.single-product .kc-sp12 { grid-column: span 1; }
	body.kc-rd.single-product .kc-bt-title { font-size: 28px; }
	body.kc-rd.single-product .kc-bt-card.kc-bt-hero { padding: 20px 20px; box-shadow: 3px 3px 0 var(--text); }
}

/* --- 28.2 v2 polish (owner 2026-08-19: 还差点意思) ----------------------- */
/* more air above the zone; bigger section voice */
body.kc-rd.single-product .kc-bento { margin-top: 26px; }
body.kc-rd.single-product .kc-bt-title { font-size: 38px; }

/* hero = media card: text + product photo */
body.kc-rd.single-product .kc-bt-hero-grid {
	display: grid;
	grid-template-columns: 1fr 190px;
	gap: 26px;
	align-items: center;
}
body.kc-rd.single-product .kc-bt-hero-img {
	background: var(--surface-sunken);
	border-radius: 8px;
	padding: 10px;
}
body.kc-rd.single-product .kc-bt-hero-img img {
	width: 100%;
	aspect-ratio: 1/1;
	object-fit: contain;
	display: block;
	border-radius: 5px;
	background: var(--surface-raised);
}
@media (max-width: 768px) {
	body.kc-rd.single-product .kc-bt-hero-grid { grid-template-columns: 1fr; }
	body.kc-rd.single-product .kc-bt-hero-img { display: none; } /* gallery sits right above on mobile */
	body.kc-rd.single-product .kc-bt-title { font-size: 29px; }
}

/* cannabinoid rows: value + relative micro-bar */
body.kc-rd.single-product .kc-bt-canntop { display: flex; justify-content: space-between; align-items: baseline; }
body.kc-rd.single-product .kc-bt-cannrow { display: block; border-bottom: 0; padding-bottom: 0; }
body.kc-rd.single-product .kc-bt-canntrack {
	display: block;
	height: 4px;
	background: var(--surface-sunken);
	border-radius: 2px;
	overflow: hidden;
	margin-top: 5px;
}
body.kc-rd.single-product .kc-bt-canntrack em { display: block; height: 100%; background: var(--trust); border-radius: 2px; }
body.kc-rd.single-product .kc-bt-cannrows { gap: 13px; }

/* pills: fuller presence, card content vertically balanced */
body.kc-rd.single-product .kc-bt-card-in { display: flex; flex-direction: column; align-items: flex-start; }
body.kc-rd.single-product .kc-bt-card-in > * { width: 100%; }
body.kc-rd.single-product .kc-bt-card-in > .kc-eyebrow { width: auto; }
body.kc-rd.single-product .kc-bt-card-in > div:last-child { margin-top: auto; margin-bottom: auto; }
body.kc-rd.single-product .kc-bt-pill { font-size: 13px; padding: 8px 16px; margin: 0 7px 9px 0; }

/* pine zones chips */
body.kc-rd.single-product .kc-bt-zones { margin: 2px 0 10px; }
body.kc-rd.single-product .kc-bt-zones span {
	display: inline-block;
	font-size: 11px;
	font-weight: 600;
	color: var(--kc-cream-50);
	border: 1px solid rgba(255, 251, 242, .35);
	border-radius: 999px;
	padding: 3px 10px;
	margin: 0 5px 6px 0;
}

/* WhatsApp chat card (renders when the product has no reviews yet) */
body.kc-rd.single-product .kc-bt-chat-h { font-size: 17px; font-weight: 700; margin: 0 0 6px; color: var(--text); }
body.kc-rd.single-product .kc-bt-chat-p { font-size: 13px; line-height: 1.65; color: var(--text-muted); margin: 0 0 16px; }
body.kc-rd.single-product .kc-bt-chat-btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	align-self: flex-start;
	background: var(--btn-primary-bg);
	color: var(--btn-primary-text);
	border: 1.5px solid var(--btn-primary-border);
	border-radius: 999px;
	box-shadow: 2px 2px 0 var(--btn-primary-border);
	font-family: inherit;
	font-size: 13.5px;
	font-weight: 700;
	padding: 9px 9px 9px 18px;
	cursor: pointer;
	transition: transform .35s cubic-bezier(.32,.72,0,1);
}
body.kc-rd.single-product .kc-bt-chat-btn:active { transform: scale(.97); }
body.kc-rd.single-product .kc-bt-chat-ic {
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: rgba(31, 26, 23, .1);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	transition: transform .35s cubic-bezier(.32,.72,0,1);
}
body.kc-rd.single-product .kc-bt-chat-btn:hover .kc-bt-chat-ic { transform: translateX(2px); }

/* card hover life: lift, transform-only */
@media (hover: hover) {
	body.kc-rd.single-product .kc-bt-grid > * { transition: opacity .7s cubic-bezier(.32,.72,0,1), transform .45s cubic-bezier(.32,.72,0,1); }
	body.kc-rd.single-product .kc-bt-grid > .kc-bt-seen:hover { transform: translateY(-3px); }
}

/* --- 27.12 Buy column tail (owner 2026-08-20: shipping 下面太空旷) -------- */
/* the effects echo line */
body.kc-rd.single-product .kc-fx-line {
	font-size: 12.5px;
	color: var(--text-muted);
	margin: 14px 0 0;
}
body.kc-rd.single-product .kc-fx-line i {
	font-style: normal;
	font-size: 10px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--text-faint);
	margin-right: 10px;
	font-weight: 600;
}
/* desktop: the buy column follows the scroll while the gallery runs long.
   .nm-page-wrap's overflow:hidden made ITSELF the sticky viewport (sticky
   never engaged) — open it up and swallow the theme's 15px offscreen-menu
   overhang with overflow-x:clip on body (clip, unlike hidden, does NOT
   create a scroll container, so sticky keeps working). */
@media (min-width: 769px) {
	html:has(body.kc-rd.single-product) { overflow-x: clip; }
	body.kc-rd.single-product { overflow-x: clip; }
	body.kc-rd.single-product .nm-page-wrap { overflow: visible; }
	/* the two columns share this float row — flex it so the buy column
	   stretches to the gallery's height and sticky gets real runway */
	body.kc-rd.single-product .nm-single-product-summary-row { display: flex; align-items: stretch; }
	body.kc-rd.single-product .nm-single-product-summary-row > * { float: none !important; }
	body.kc-rd.single-product .nm-single-product-summary-col { height: auto; }
	body.kc-rd.single-product .summary.entry-summary {
		position: sticky;
		top: 96px;
	}
	/* portrait/oversize shots stop inflating the whole showcase row */
	body.kc-rd.single-product .woocommerce-product-gallery img {
		max-height: 500px;
		width: auto;
		max-width: 100%;
		object-fit: contain;
		margin: 0 auto;
	}
}
/* the zone follows the showcase sooner */
body.kc-rd.single-product .kc-bento { margin-top: 8px; }

/* --- 27.13 Feels like = Option C stretch pills (owner 2026-08-20) -------- */
body.kc-rd.single-product .kc-fx-wrap { margin: 16px 0 0; }
body.kc-rd.single-product .kc-fx-lab {
	font-size: 10px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--text-faint);
	font-weight: 600;
	margin: 0 0 10px;
}
body.kc-rd.single-product .kc-fx-grid { display: flex; flex-wrap: wrap; gap: 8px; }
body.kc-rd.single-product .kc-fx-pill {
	flex: 1 1 calc(50% - 8px);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background: var(--surface-sunken);
	border-radius: 999px;
	padding: 11px 8px;
	font-size: 13px;
	font-weight: 600;
	color: var(--text);
	white-space: nowrap;
}
body.kc-rd.single-product .kc-fx-row1 .kc-fx-pill { flex: 1 1 0; }
body.kc-rd.single-product .kc-fx-pill svg,
body.kc-rd.single-product .kc-bt-pill-ic svg {
	width: 17px;
	height: 17px;
	stroke: var(--trust);
	fill: none;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
	flex: 0 0 auto;
}
body.kc-rd.single-product .kc-bt-pill-ic { display: inline-flex; align-items: center; gap: 7px; }
/* the old text line is superseded */
body.kc-rd.single-product .kc-fx-line { display: none; }

/* ==========================================================================
   29. HOMEPAGE v2 (owner 2026-08-20: H3 hero × H2 bento, rotating banner)
   ========================================================================== */
/* the theme row floats its column and never clears it on the plain page
   template — the row collapses to 0 and the newsletter section floods up
   underneath. flow-root restores containment. */
body.home .nm-page-wrap-inner > .nm-row-full,
body.home .nm-row-full { display: flow-root; }
body.home .kc-home { margin: 0 -20px; } /* bleed out of the entry padding */
body.home .kc-home .kc-eyebrow {
	display: inline-block;
	font-size: 10px !important;
	line-height: 1.4 !important;
	letter-spacing: .22em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--trust);
	background: rgba(30,91,60,.08);
	border-radius: 999px;
	padding: 5px 12px !important;
	margin: 0 0 14px;
}
body.home .kc-home .kc-eyebrow-dark { background: rgba(255,251,242,.14); color: var(--kc-cream-50); }
body.home .kc-hbtn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--btn-primary-bg);
	color: var(--btn-primary-text) !important;
	border: 1.5px solid var(--btn-primary-border);
	border-radius: var(--kc-radius-md);
	box-shadow: 2px 2px 0 var(--btn-primary-border);
	font-weight: 700;
	font-size: 14px;
	padding: 12px 26px;
	transition: transform .35s cubic-bezier(.32,.72,0,1);
}
body.home .kc-hbtn:hover { transform: translateY(-2px); }
body.home .kc-hbtn-ghost { background: rgba(255,251,242,.08); color: var(--text) !important; border-color: var(--border-strong); box-shadow: none; font-weight: 600; }

/* --- 29.1 rotating hero ------------------------------------------------- */
body.home .kc-hero { position: relative; }
body.home .kc-hero-track {
	display: flex;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}
body.home .kc-hero-track::-webkit-scrollbar { display: none; }
body.home .kc-hero-slide { flex: 0 0 100%; scroll-snap-align: start; }
body.home .kc-hero-light { background: var(--surface); }
body.home .kc-hero-dark { background: var(--trust); color: var(--kc-cream-50); }
body.home .kc-hero-in {
	max-width: 1160px;
	margin: 0 auto;
	padding: 54px 40px 64px;
	display: grid;
	grid-template-columns: 1.1fr .9fr;
	gap: 40px;
	align-items: center;
}
body.home .kc-hero-h {
	font-family: var(--kc-font-display);
	font-size: 50px;
	line-height: 1.05;
	margin: 0;
	color: var(--text);
}
body.home .kc-hero-dark .kc-hero-h { color: #fff; }
body.home .kc-hero-h em { font-style: normal; color: var(--trust); }
body.home .kc-hero-dark .kc-hero-h em { color: var(--action); }
body.home .kc-hero-p { font-size: 15px; line-height: 1.7; color: var(--text-muted); margin: 16px 0 0; max-width: 46ch; }
body.home .kc-hero-dark .kc-hero-p { color: rgba(255,251,242,.78); }
body.home .kc-hero-ctas { display: flex; gap: 10px; margin-top: 24px; }
body.home .kc-hero-art { position: relative; height: 320px; }
/* .kc-hero-card* 已于 2026-08-27 删除:owner 拍板 hero 走 V2(生产原图做底),
   那两张 1 OZ 产品卡连同 inc-home.php 里的取图 PHP 一起退役,全站零引用。
   (hero-v2-verify.md 认定为死层;orchestrator 统一清除,不叠 !important。) */
body.home .kc-hero-art-parcel { display: flex; align-items: center; justify-content: center; color: rgba(255,251,242,.78); }
body.home .kc-hero-art-parcel svg { width: 300px; height: 300px; }
/* .kc-hero-dots is fully owned by assets/parts/29-home-hero.css §29b now
   (the 9px dots were a 9px tap target sitting on top of a CTA on phones).
   Deleted, not left as a dead layer. */

/* --- 29.2 USP strip ----------------------------------------------------- */
body.home .kc-hm-usp-wrap { max-width: 1160px; margin: -24px auto 0; padding: 0 40px; position: relative; z-index: 2; }
body.home .kc-hm-usp {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	border: 1px solid var(--border);
	border-radius: var(--kc-radius-md);
	background: var(--surface-raised);
	overflow: hidden;
	box-shadow: 0 8px 22px rgba(31,26,23,.08);
}
body.home .kc-hm-usp > div { padding: 12px 8px; text-align: center; font-size: 11.5px; line-height: 1.45; color: rgba(31,26,23,.62); }
body.home .kc-hm-usp > div + div { border-left: 1px solid var(--border); }
body.home .kc-hm-usp b { display: block; color: var(--text); font-size: 12.5px; }

/* --- 29.3 strain of the week -------------------------------------------- */
body.home .kc-sotw { background: var(--trust); margin-top: 40px; }
body.home .kc-sotw-in {
	max-width: 1160px;
	margin: 0 auto;
	padding: 36px 40px;
	display: grid;
	grid-template-columns: 250px 1fr auto;
	gap: 34px;
	align-items: center;
	color: var(--kc-cream-50);
}
body.home .kc-sotw-img { background: var(--surface-raised); border-radius: 8px; padding: 12px; align-self: center; }
body.home .kc-sotw-img img { width: 100%; aspect-ratio: 1/1; object-fit: contain; display: block; }
body.home .kc-sotw-h { font-family: var(--kc-font-display); font-size: 30px; margin: 0 0 12px; color: #fff; }
body.home .kc-sotw-stats { display: flex; gap: 36px; }
body.home .kc-sotw-stats b { display: block; font-family: var(--kc-font-body); font-size: 25px; color: #fff; font-weight: 700; font-variant-numeric: tabular-nums; }
body.home .kc-sotw-stats b .woocommerce-Price-amount { font-family: inherit; }
body.home .kc-sotw-stats i { font-style: normal; font-size: 9px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,251,242,.6); }

/* --- 29.4 category bento ------------------------------------------------ */
body.home .kc-hm-cats { max-width: 1160px; margin: 0 auto; padding: 40px 40px 6px; }
/* L3 (owner 2026-08-21): Flower pillar | 2x2 middle | pine pillar —
   two heavy columns hugging the light middle. */
body.home .kc-hm-grid {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr .95fr;
	grid-template-rows: 162px 162px;
	gap: 14px;
}
body.home .kc-hm-tile {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--surface-raised);
	border: 1px solid var(--border-strong);
	border-radius: 10px;
	overflow: hidden;
	padding: 16px;
	grid-column: span 1;
	transition: transform .4s cubic-bezier(.32,.72,0,1);
}
body.home .kc-hm-tile:hover { transform: translateY(-3px); }
/* OCS structure × owner's unified-sage tile art (2026-08-21): the images
   carry their own matched background — bleed them edge to edge, label
   stays top-left on a cream tag. */
body.home .kc-hm-tile img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	/* contain, never crop — the tile background is matched to the image's
	   own backdrop server-side, so the letterbox is invisible */
	object-fit: contain;
}
body.home .kc-hm-tile .kc-hm-tile-t,
body.home .kc-hm-tile .kc-hm-tile-s { position: relative; z-index: 2; }
/* labels blend into the artwork (owner 2026-08-21): no chip, no box — the
   word simply sits on the image's own empty backdrop, OCS-style. */
body.home .kc-hm-tile:not(.kc-hm-tile-pine) .kc-hm-tile-t {
	align-self: flex-start;
	background: none;
	border: 0;
	padding: 0;
	margin: 0;
	color: var(--text);
	letter-spacing: -.015em;
}
body.home .kc-hm-tile:not(.kc-hm-tile-pine) .kc-hm-tile-s {
	align-self: flex-start;
	background: none;
	border: 0;
	padding: 0;
	margin: 3px 0 0;
	color: rgba(31, 26, 23, .62);
	font-size: 12.5px;
}
body.home .kc-hm-tile-t { font-family: var(--kc-font-body); font-weight: 700; font-size: 18px; color: var(--text); letter-spacing: -.01em; }
body.home .kc-hm-tile-s { font-size: 12px; color: var(--text-muted); margin-top: 2px; }
body.home .kc-hm-tile-hero {
	grid-column: 1;
	grid-row: 1 / 3;
	border: 1.5px solid var(--text);
	box-shadow: 4px 4px 0 var(--text);
}

body.home .kc-hm-tile-hero .kc-hm-tile-t { font-size: 24px; }
body.home .kc-hm-tile-pine {
	grid-column: 4;
	grid-row: 1;
	background: var(--trust);
	border-color: var(--trust);
	/* centred block — restated here because this rule follows the style
	   block above (same specificity, later wins) */
	justify-content: center;
	align-items: center;
}
/* Accessories sits under the deal card — right column is now two stacked
   halves, the two-pillar composition holds. */
body.home .kc-hm-tile-acc { grid-column: 4; grid-row: 2; }
/* deal tile, final (owner 2026-08-21): brand pine, C structure — label +
   sub + underlined CTA — and the whole block CENTRED, not corner-hugging. */
body.home .kc-hm-tile-pine {
	justify-content: center;
	align-items: center;
	text-align: center;
	padding: 12px 14px; /* the block owns the card; less dead margin */
}
body.home .kc-hm-tile-pine .kc-hm-tile-t {
	color: #fff;
	font-size: 23px;
	font-weight: 800;
	letter-spacing: -.02em;
	line-height: 1.15;
	margin: 0;
	align-self: center;
}
body.home .kc-hm-tile-pine .kc-hm-tile-s {
	color: rgba(255,251,242,.76);
	font-size: 14px;
	margin: 5px 0 0;
	align-self: center;
}
body.home .kc-hm-tile-cta {
	margin-top: 12px;
	font-size: 13.5px;
	font-weight: 700;
	color: var(--kc-cream-50);
	border-bottom: 1.5px solid var(--kc-cream-50);
	padding-bottom: 1px;
	align-self: center;
	transition: transform .35s cubic-bezier(.32,.72,0,1);
}
body.home .kc-hm-tile-pine:hover .kc-hm-tile-cta { transform: translateX(2px); }

/* --- 29.5 picks + how -------------------------------------------------- */
body.home .kc-hm-picks { max-width: 1160px; margin: 0 auto; padding: 34px 40px 0; }
body.home .kc-hm-sechead { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 16px; }
body.home .kc-hm-sechead h2 { font-family: var(--kc-font-display); font-size: 28px; margin: 0; color: var(--text); }
body.home .kc-hm-sechead a { font-size: 13px; font-weight: 600; color: var(--trust); }
body.home .kc-hm-how { max-width: 1160px; margin: 0 auto; padding: 34px 40px 46px; }
body.home .kc-hm-how-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
body.home .kc-hm-how .kc-bt-card-in { text-align: center; font-size: 12.5px; color: var(--text-muted); align-items: center; }
body.home .kc-hm-how .kc-bt-card-in b { display: block; color: var(--text); font-size: 14px; margin-bottom: 4px; }
body.home .kc-hm-how .kc-bt-tray { background: var(--surface-sunken); border-radius: 10px; padding: 8px; }
body.home .kc-hm-how .kc-bt-card-in { background: var(--surface-raised); border: 1px solid var(--border); border-radius: 7px; padding: 18px; display: block; height: 100%; }

/* mobile */
@media (max-width: 768px) {
	body.home .kc-home { margin: 0 -15px; }
	body.home .kc-hero-in { grid-template-columns: 1fr; padding: 32px 24px 44px; gap: 18px; }
	body.home .kc-hero-h { font-size: 31px; }
	/* 2026-08-27:曾试着把这条移交给 29-home-hero.css,结果手机端两张 1 OZ 产品卡
	   立刻露出来、hero 从 368px 涨到 706px —— 已还原。hero V2 的底图请用自己的
	   元素/类名(不要复用 .kc-hero-art),这条对它就是无害的。 */
	body.home .kc-hero-art { display: none; }
	body.home .kc-hm-usp-wrap { padding: 0 16px; margin-top: -16px; }
	body.home .kc-sotw-in { grid-template-columns: 96px 1fr; gap: 16px; padding: 24px 18px; }
	body.home .kc-sotw-in > .kc-hbtn { grid-column: 1 / -1; justify-self: start; }
	body.home .kc-sotw-h { font-size: 20px; }
	body.home .kc-sotw-stats b { font-size: 20px; }
	body.home .kc-hm-cats { padding: 24px 16px 0; }
	body.home .kc-hm-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
	body.home .kc-hm-tile { grid-column: span 1 !important; min-height: 150px; padding: 12px; }
	/* L3 on phones: the pillars lie down — Flower banner, 2x2 middle,
	   pine banner. Same hierarchy, stacked. */
	/* rows size to content — a fixed 150px row made the 212px hero spill
	   over the tiles below it (owner: 手机摆盘歪了) */
	body.home .kc-hm-grid { grid-template-rows: none; grid-auto-rows: auto; }
	body.home .kc-hm-tile-hero {
		grid-column: 1 / -1 !important;
		grid-row: auto !important;
		min-height: 173px; /* owner: 再缩 10% — 192 -> 173 */
		height: auto;
	}
	/* the bud reads small inside a wide banner — let it fill the frame
	   (owner 2026-08-21), still short of edge-to-edge */
	body.home .kc-hm-tile-hero img {
		/* contain, not cover: cover was eating the top and bottom of the bud
		   (owner 2026-08-21 —「上下都被吃掉了」). The tile background is the
		   image's own backdrop colour, so the side margins are invisible. */
		object-fit: contain;
		object-position: center;
	}
	/* Gear + deal close the block as a PAIR, same as the rows above them
	   (owner 2026-08-21) — no more two full-width strips */
	body.home .kc-hm-tile-pine {
		grid-column: span 1 !important;
		grid-row: auto !important;
		min-height: 150px;
		height: auto;
		justify-content: center;
		padding: 10px;
		order: 9;
	}
	body.home .kc-hm-tile-pine .kc-hm-tile-t { font-size: 17px; }
	body.home .kc-hm-tile-pine .kc-hm-tile-s { font-size: 12px; margin-top: 3px; }
	body.home .kc-hm-tile-cta { font-size: 12px; margin-top: 9px; }
	body.home .kc-hm-tile-acc { grid-column: span 1 !important; grid-row: auto !important; order: 8; }
	
	
	body.home .kc-hm-picks, body.home .kc-hm-how { padding-left: 16px; padding-right: 16px; }
	body.home .kc-hm-how-grid { grid-template-columns: 1fr; }
}

/* reCAPTCHA v3 badge stacked under the WhatsApp ball = corner debris.
   Hidden per Google's allowance; required attribution is injected as text
   beside the newsletter form (kc-redesign.js). */
.grecaptcha-badge { visibility: hidden !important; }
/* cart count clipped at the viewport edge (theme pins the li flush right) */
body.kc-rd li.nm-menu-cart { padding-right: 22px; }
/* newsletter band: join the design system (font >=28px display, square input) */
#kcnl h2 { font-family: var(--kc-font-display) !important; }
#kcnl input[type="email"], #kcnl input[type="text"] { border-radius: var(--kc-radius-md) !important; height: 52px; }
#kcnl button, #kcnl input[type="submit"] { height: 52px; border-radius: var(--kc-radius-md) !important; }
/* mobile: keep card borders off the viewport edge */
@media (max-width: 768px) {
	body.home .kc-hm-picks, body.home .kc-hm-how { padding-left: 18px; padding-right: 18px; }
	body.home .kc-hm-cats { padding-left: 26px; padding-right: 26px; } /* the block itself narrows */
	/* long strain labels (HYBRID/INDICA/SATIVA) must not spill their chips */
	body.kc-rd .kc-buy-card .kc-tier .kc-tier-w { font-size: 10px; letter-spacing: .01em; max-width: 100%; overflow: hidden; }
}

/* MUSHROOMS entry points hidden site-wide (category cut per §4.2 — the real
   removal is the 301 retirement project; this stops NEW traffic now).
   menu item 11235 = header nav "Mushrooms"; mega-menu psilocybin column and
   footer widget links matched by href. */
body.kc-rd .menu-item-11235,
body.kc-rd a[href*="/product-category/mushrooms"],
body.kc-rd li:has(> a[href*="/product-category/mushrooms"]) { display: none !important; }