/* =============================================================================
   Footwear Kadence Child ? brand.css
   Design System (UI Kit) + brand patterns on Kadence.
   Token ? Component ? Woo/Kadence bridge ? Page.
   Plain CSS, no build step.
   ============================================================================= */

/* === UIK: Foundations / Fonts ============================================== */
@font-face {
	font-family: "Inter";
	src: url("../fonts/Inter-Variable.woff2") format("woff2-variations");
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
	/* Latin, Latin-1, Latin-ext, Cyrillic, Cyrillic-ext, ?/?/??. */
	unicode-range: U+0000-00FF, U+0100-024F, U+0259, U+1E00-1EFF, U+2000-206F, U+20A0-20BF, U+2116, U+0400-045F, U+0490-0491, U+04B0-04B1;
}

@font-face {
	font-family: "Inter Fallback";
	src: local("Segoe UI"), local("Arial");
	ascent-override: 90%;
	descent-override: 22.43%;
	line-gap-override: 0%;
	size-adjust: 107%;
}

/* Display: Manrope (Latin + Cyrillic) ? brand headlines / hero. */
@font-face {
	font-family: "Manrope";
	src: url("../fonts/Manrope-Variable-Latin.woff2") format("woff2-variations");
	font-weight: 200 800;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20A0-20BF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Manrope";
	src: url("../fonts/Manrope-Variable-Cyrillic.woff2") format("woff2-variations");
	font-weight: 200 800;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* === UIK: Foundations / Tokens ============================================= */
:root {
	/* Neutral scale (cool-tinted, hue ~245). */
	--fwk-neutral-0: oklch(100% 0 0);
	--fwk-neutral-50: oklch(98.5% 0.004 240);
	--fwk-neutral-100: oklch(96.5% 0.006 240);
	--fwk-neutral-200: oklch(92% 0.008 240);
	--fwk-neutral-300: oklch(85% 0.01 242);
	--fwk-neutral-400: oklch(70% 0.014 245);
	--fwk-neutral-500: oklch(58% 0.015 245);
	--fwk-neutral-600: oklch(48% 0.015 248);
	--fwk-neutral-700: oklch(38% 0.015 250);
	--fwk-neutral-900: oklch(24% 0.015 252);
	--fwk-neutral-950: oklch(16% 0.012 252);

	/* Sky / lagoon (summer sea + clouds, hue ~220?233). */
	--fwk-sky-100: oklch(96% 0.025 233);
	--fwk-sky-200: oklch(91% 0.045 233);
	--fwk-sky-300: oklch(83% 0.075 232);
	--fwk-sky-400: oklch(74% 0.105 232);
	--fwk-sky-500: oklch(64% 0.125 233);
	--fwk-sky-600: oklch(52% 0.125 228);
	--fwk-sky-700: oklch(43% 0.11 230);
	--fwk-sky-800: oklch(35% 0.09 232);

	/* Soft sun (sale only ? not CTA; hue ~78, not red). */
	--fwk-sun-500: oklch(62% 0.13 78);
	--fwk-sun-600: oklch(54% 0.125 75);

	/* Soft mint (legacy search focus; prefer --fwk-green-* for brand). */
	--fwk-mint-200: oklch(94% 0.03 155);
	--fwk-mint-300: oklch(88% 0.045 155);
	--fwk-mint-400: oklch(78% 0.07 155);

	/* Crocs green brand scale (lime-leaning, hue ~140; not semantic success). */
	--fwk-green-100: oklch(96% 0.05 140);
	--fwk-green-200: oklch(92% 0.09 140);
	--fwk-green-300: oklch(84% 0.14 140);
	--fwk-green-400: oklch(74% 0.18 138);
	--fwk-green-500: oklch(62% 0.19 136);
	--fwk-green-600: oklch(52% 0.16 136);
	--fwk-green-700: oklch(42% 0.13 138);

	/* Legacy coral aliases ? sky (keep old names from breaking). */
	--fwk-coral-400: var(--fwk-sky-400);
	--fwk-coral-500: var(--fwk-sky-600);
	--fwk-coral-600: var(--fwk-sky-700);
	--fwk-coral-700: var(--fwk-sky-800);

	/* Semantic aliases. */
	--fwk-color-bg: var(--fwk-neutral-50);
	--fwk-color-surface: var(--fwk-neutral-0);
	--fwk-color-sunken: var(--fwk-neutral-100);
	--fwk-color-text: var(--fwk-neutral-900);
	--fwk-color-muted: var(--fwk-neutral-600);
	--fwk-color-disabled: var(--fwk-neutral-400);
	/* Dividers / hairlines ? stepped up so controls are not white-on-white. */
	--fwk-color-border: var(--fwk-neutral-300);
	--fwk-color-border-strong: var(--fwk-neutral-400);
	/* Interactive outline controls (ghost CTA, chips, selects) ? ~3:1 on surface. */
	--fwk-color-control-border: color-mix(in oklch, var(--fwk-color-text) 22%, var(--fwk-color-surface));
	/* Slightly deeper than sunken so outline controls read on white surface. */
	--fwk-color-control-fill: transparent;
	/* Color Law: Accent = sky (links / focus only — never primary fill). */
	--fwk-color-accent: var(--fwk-sky-600);
	--fwk-color-accent-soft: var(--fwk-sky-100);
	--fwk-color-cta: var(--fwk-sky-600);
	--fwk-color-cta-hover: var(--fwk-sky-700);
	--fwk-color-cta-active: var(--fwk-sky-800);
	--fwk-color-on-cta: oklch(99% 0 0);
	/* Color Law: Action = near-black ink; hover/active = Crocs green (Selected). */
	--fwk-button-ink: var(--fwk-neutral-950);
	--fwk-button-ink-hover: var(--fwk-color-selected);
	--fwk-button-ink-active: var(--fwk-green-700);
	/* Color Law: Selected / brand = Crocs green (chips, sizes, filters, U1 hover). */
	--fwk-color-brand: var(--fwk-green-500);
	--fwk-color-brand-soft: var(--fwk-green-100);
	--fwk-color-selected: var(--fwk-green-600);
	--fwk-color-selected-soft: var(--fwk-green-100);
	--fwk-color-on-selected: oklch(99% 0 0);
	/* U2 secondary = outline on surface (never same fill as primary). */
	--fwk-color-secondary-bg: var(--fwk-color-surface);
	--fwk-color-secondary-bg-hover: var(--fwk-color-selected-soft);
	--fwk-color-secondary-border: var(--fwk-color-control-border);
	--fwk-color-secondary-border-hover: var(--fwk-color-selected);
	--fwk-color-secondary-text: var(--fwk-neutral-900);
	--fwk-color-sale: var(--fwk-sun-600);
	--fwk-color-focus: var(--fwk-sky-600);
	--fwk-color-danger: oklch(48% 0.14 25);
	--fwk-color-danger-soft: oklch(96% 0.02 25);
	--fwk-color-success: oklch(48% 0.12 155);
	/* U14 Feedback: soft pair for success (matches danger-soft / accent-soft). */
	--fwk-color-success-soft: oklch(96% 0.03 155);

	/* Typography ? UI (Inter) + display (Manrope) roles. */
	--fwk-font: "Inter", "Inter Fallback", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--fwk-font-display: "Manrope", "Inter", "Inter Fallback", system-ui, "Segoe UI", Arial, sans-serif;
	--fwk-font-numeric: var(--fwk-font);

	/* Type roles (UX-0). */
	--fwk-type-display: 700  var(--fwk-text-4xl) / 1.1 var(--fwk-font-display);
	--fwk-type-title: 700 var(--fwk-text-2xl) / 1.15 var(--fwk-font-display);
	--fwk-type-body: 400 var(--fwk-text-base) / 1.55 var(--fwk-font);
	--fwk-type-meta: 500 var(--fwk-text-sm) / 1.4 var(--fwk-font);

	--fwk-text-xs: clamp(0.69rem, 0.66rem + 0.15vw, 0.75rem);
	--fwk-text-sm: clamp(0.81rem, 0.78rem + 0.15vw, 0.875rem);
	--fwk-text-base: clamp(1rem, 0.97rem + 0.15vw, 1.0625rem);
	--fwk-text-lg: clamp(1.125rem, 1.05rem + 0.35vw, 1.25rem);
	--fwk-text-xl: clamp(1.25rem, 1.1rem + 0.7vw, 1.563rem);
	--fwk-text-2xl: clamp(1.5rem, 1.2rem + 1.2vw, 1.953rem);
	--fwk-text-3xl: clamp(1.875rem, 1.4rem + 2vw, 2.441rem);
	--fwk-text-4xl: clamp(2.25rem, 1.6rem + 3vw, 3.4rem);

	/* Spacing (4px / 8px rhythm). */
	--fwk-space-1: 0.25rem;
	--fwk-space-2: 0.5rem;
	--fwk-space-3: 0.75rem;
	--fwk-space-4: 1rem;
	--fwk-space-5: 1.25rem;
	--fwk-space-6: 1.5rem;
	--fwk-space-8: 2rem;
	--fwk-space-10: 2.5rem;
	--fwk-space-12: 3rem;
	--fwk-space-16: 4rem;
	--fwk-space-20: 5rem;
	/* Shared vertical rhythm for page sections (home / PLP bands). */
	--fwk-section-y: clamp(2.5rem, 1.5rem + 4vw, 5rem);

	/* Layout / shape. */
	--fwk-container-max: 1280px;
	--fwk-container-pad: clamp(1rem, 0.5rem + 2vw, 2rem);
	/*
	 * Product-card planes (bestsellers / related / PLP grids).
	 * LAW: always full-bleed pure white — never paint only .fwk-container.
	 * Soft top fade blends from adjacent sky/wash into --fwk-plane-products.
	 */
	--fwk-plane-products: var(--fwk-color-surface);
	--fwk-plane-products-fade: linear-gradient(
		180deg,
		color-mix(in oklch, var(--fwk-sky-100) 55%, transparent) 0%,
		var(--fwk-plane-products) 4.5rem
	);
	/*
	 * Benefits / Croslite proof plane (Home).
	 * LAW: sky bridge between hero and product plane — NOT a green slab.
	 * Brand green stays on ink (eyebrow / stats), never as section fill.
	 * Ends at --fwk-plane-products so bestsellers can continue seamless white.
	 */
	--fwk-plane-benefits: var(--fwk-color-surface);
	--fwk-plane-benefits-wash: linear-gradient(
		180deg,
		color-mix(in oklch, var(--fwk-sky-100) 78%, var(--fwk-color-bg)) 0%,
		color-mix(in oklch, var(--fwk-sky-100) 32%, var(--fwk-plane-benefits)) 22%,
		var(--fwk-plane-benefits) 48%,
		var(--fwk-plane-benefits) 82%,
		var(--fwk-plane-products) 100%
	);
	/*
	 * Inline inset for full-bleed planes (benefits / related / product grids).
	 * Must match Kadence site-container ≈1.5rem on mobile so copy aligns with
	 * accordion / header — never lean on bare --fwk-container-pad (1rem) alone.
	 */
	--fwk-plane-inline: max(
		var(--fwk-space-6),
		var(--fwk-header-gutter, 1.25rem),
		calc((100vw - 72rem) / 2 + var(--fwk-space-5))
	);
	/* Catalog card media ? honest packshot (PLP / related / bestsellers). */
	--fwk-card-media-ratio: 4 / 3;
	/* PDP packshot ? slightly taller than landscape PLP; fits footwear packshots + thumbs. */
	--fwk-pdp-media-ratio: 4 / 3;
	--fwk-pdp-thumb-ratio: 3 / 2;
	/* Cart / mini-cart thumbs: landscape packshots (~600×312 ≈ 2:1), not 1:1 crop. */
	--fwk-cart-media-ratio: 5 / 3;
	--fwk-cart-media-w: 5.5rem;
	--fwk-size-cell-min: 2.75rem;
	--fwk-size-cell-max: 3.5rem;

	/* Minimal modern shape ? Atlassian-like 2?12px. */
	--fwk-radius-xs: 0.125rem; /* 2px ? fine details */
	--fwk-radius-sm: 0.25rem; /* 4px ? badges, tags, chips */
	--fwk-radius: 0.375rem; /* 6px ? default / buttons / inputs */
	--fwk-radius-md: 0.5rem; /* 8px ? panels, small cards */
	--fwk-radius-lg: 0.5rem; /* 8px ? product card, tiles */
	--fwk-radius-xl: 0.75rem; /* 12px ? drawers, modals, sheets */
	--fwk-radius-control: 0.375rem; /* alias = base */
	--fwk-radius-pill: 9999px;

	--fwk-shadow-sm: 0 1px 2px oklch(55% 0.04 245 / 0.06);
	--fwk-shadow-md: 0 4px 14px oklch(55% 0.05 245 / 0.08);
	--fwk-shadow-lg: 0 12px 32px oklch(50% 0.06 245 / 0.1);
	/* Product card hover — soft lift with slight brand tint. */
	--fwk-shadow-card-hover: 0 8px 24px oklch(45% 0.04 140 / 0.08), 0 2px 6px oklch(45% 0.03 245 / 0.05);
	/* Floating bottom dock. */
	--fwk-bottom-dock-height: 3.5rem;
	--fwk-bottom-dock-offset: calc(var(--fwk-bottom-dock-height) + env(safe-area-inset-bottom, 0px) + 0.75rem);
	--fwk-shadow-dock: 0 4px 24px oklch(40% 0.04 245 / 0.12), 0 1px 3px oklch(40% 0.02 245 / 0.06);

	--fwk-duration-press: 80ms;   /* :active press feedback */
	--fwk-duration-fast: 120ms;   /* tooltips, micro */
	--fwk-duration: 200ms;        /* buttons, chips, fields */
	--fwk-duration-slow: 350ms;   /* modals, panels, reveal */
	--fwk-ease: cubic-bezier(0.4, 0, 0.2, 1);
	--fwk-ease-out: cubic-bezier(0, 0, 0.2, 1);
	--fwk-ease-spring: cubic-bezier(0.34, 1.4, 0.64, 1);

	--fwk-grid-min: 12.5rem;
	--fwk-grid-gap: clamp(1rem, 0.5rem + 1.5vw, 1.75rem);
	--fwk-card-pad: var(--fwk-space-4);
	--fwk-card-title-lines: 2;
	--fwk-card-title-lh: 1.4;

	/* Z-index: sticky < dock < dropdown < drawer < modal < toast. */
	--fwk-z-base: 1;
	--fwk-z-sticky: 100;
	--fwk-z-dock: 150;
	--fwk-z-dropdown: 200;
	--fwk-z-drawer: 300;
	--fwk-z-modal: 400;
	--fwk-z-toast: 500;

	/* Focus ring (shared). */
	--fwk-focus-ring: 0 0 0 2px var(--fwk-color-surface), 0 0 0 4px var(--fwk-color-focus);
}

/* -----------------------------------------------------------------------------
   2. Map the brand onto Kadence ? palette + fonts
   We set the overrides on `html body` (specificity 0,0,2) so they win over
   Kadence's `:root` definitions for the body and every descendant, regardless
   of stylesheet load order ? no !important, no fighting.
   Kadence palette roles: 1 primary/links+buttons, 2 hover, 3 darkest/headings,
   4 body text, 5 muted, 6 light text/strong border, 7 light bg/border,
   8 page bg, 9 content surface (white).
   -------------------------------------------------------------------------- */
html body {
	--global-palette1: var(--fwk-sky-600);
	--global-palette2: var(--fwk-sky-700);
	--global-palette3: var(--fwk-neutral-900);
	--global-palette4: var(--fwk-neutral-700);
	--global-palette5: var(--fwk-neutral-600);
	--global-palette6: var(--fwk-neutral-400);
	--global-palette7: var(--fwk-neutral-200);
	--global-palette8: var(--fwk-neutral-50);
	--global-palette9: var(--fwk-neutral-0);

	/* Link + button colors derive from palette1/2 in Kadence; pin them too. */
	--global-palette-highlight: var(--fwk-sky-600);
	--global-palette-highlight-alt: var(--fwk-sky-700);
	--global-palette-highlight-alt2: var(--fwk-sky-800);
	/* Color Law: Action buttons via Kadence palette (not Accent sky). */
	--global-palette-btn-bg: var(--fwk-button-ink);
	--global-palette-btn-bg-hover: var(--fwk-button-ink-hover);

	/* Base font ? Inter UI; headings ? Manrope display. */
	--global-body-font-family: var(--fwk-font);
	--global-heading-font-family: var(--fwk-font-display);
}

/* Main content plane ? white so packshot cards don't sit on gray page bg. */
#inner-wrap {
	background: var(--fwk-color-surface);
}

/* Headings keep the brand's tighter rhythm + display face. */
.fwk-section h2,
.fwk-hero__title,
.fwk-section__head h2,
.fwk-modal__title,
.entry-hero .entry-header .entry-title,
.product_title.entry-title,
.woocommerce-products-header__title,
.fwk-archive-header__title {
	font-family: var(--fwk-font-display);
	letter-spacing: -0.02em;
	text-wrap: balance;
}

.fwk-hero__title {
	font: var(--fwk-type-display);
	font-family: var(--fwk-font-display);
	font-weight: 700;
}

.fwk-section__head h2 {
	font-family: var(--fwk-font-display);
}

/* Ukrainian / Russian typographic niceties for our blocks. */
html[lang^="uk"] .fwk-section p,
html[lang^="ru"] .fwk-section p {
	hyphens: auto;
	hyphenate-limit-chars: 6 4 4;
}

/* -----------------------------------------------------------------------------
   3. Shared helpers (scoped to brand blocks)
   -------------------------------------------------------------------------- */
.fwk-container {
	width: 100%;
	max-width: var(--fwk-container-max);
	margin-inline: auto;
	padding-inline: var(--fwk-container-pad);
}

.fwk-section {
	padding-block: var(--fwk-section-y);
}

.fwk-section__head {
	display: flex;
	flex-direction: column;
	gap: var(--fwk-space-2);
	margin-block-end: var(--fwk-space-8);
	text-align: center;
	align-items: center;
}

.fwk-section__head h2 {
	font-size: var(--fwk-text-2xl);
	font-weight: 700;
	line-height: 1.15;
	color: var(--fwk-color-text);
	margin: 0;
}

.fwk-section__lead {
	color: var(--fwk-color-muted);
	font-size: var(--fwk-text-lg);
	max-width: 60ch;
	margin: 0;
}

/* === UIK: Plain button (F.plain / anti-theme bleed) ========================
   Non-CTA <button> base. Beats Kadence/global --palette-btn-bg on all states.
   Compose with components (U17 trigger, filters text-btn, …). Never solid CTA.
   -------------------------------------------------------------------------- */
button.fwk-btn-plain,
button.fwk-btn-plain:hover,
button.fwk-btn-plain:focus,
button.fwk-btn-plain:active,
button.fwk-btn-plain:focus-visible {
	appearance: none;
	-webkit-appearance: none;
	margin: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	background-color: transparent;
	box-shadow: none;
	color: inherit;
	transform: none;
	text-decoration: none;
	cursor: pointer;
}

button.fwk-btn-plain:focus {
	outline: none;
}

button.fwk-btn-plain:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
	border-radius: var(--fwk-radius-sm);
}

button.fwk-btn-plain:disabled,
button.fwk-btn-plain[aria-disabled="true"] {
	opacity: 0.45;
	cursor: not-allowed;
	pointer-events: none;
	background: transparent;
	box-shadow: none;
}

/* Styleguide mock hover (no real :hover in static demos). */
button.fwk-btn-plain.is-hover {
	background: transparent;
	box-shadow: none;
}

/* === UIK: Button ===========================================================
   Color Law 2026-07-24:
   U1 primary   = Action ink fill; hover/active = Selected green (ATC, checkout, Apply)
   U2 secondary = outline on surface — peer actions (View cart, secondary CTAs)
   U3 ghost     = hairline outline — quiet actions (Reset, Browse)
   States: default → hover → focus-visible → active/pressed → disabled → loading
   Hover = deepen same role; focus-visible = ring only (no sky hue jump).
   Never mix hover box-shadow with focus-ring; never paint U2 as U1 fill.
   -------------------------------------------------------------------------- */
.fwk-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--fwk-space-2);
	min-height: 44px;
	padding: var(--fwk-space-3) var(--fwk-space-6);
	border: 1px solid transparent;
	border-radius: var(--fwk-radius-control);
	background: var(--fwk-button-ink);
	color: var(--fwk-color-on-cta);
	font-weight: 600;
	font-size: var(--fwk-text-sm);
	line-height: 1;
	text-decoration: none;
	cursor: pointer;
	position: relative;
	isolation: isolate;
	transition:
		background-color var(--fwk-duration) var(--fwk-ease),
		transform var(--fwk-duration-press) var(--fwk-ease-out),
		box-shadow var(--fwk-duration) var(--fwk-ease),
		border-color var(--fwk-duration) var(--fwk-ease),
		color var(--fwk-duration) var(--fwk-ease),
		opacity var(--fwk-duration) var(--fwk-ease);
}

/* Hover ? visual affordance only (no focus ring). Refs: primary hovers green. */
.fwk-button:hover {
	background: var(--fwk-button-ink-hover);
	color: var(--fwk-color-on-cta);
	text-decoration: none;
	box-shadow: var(--fwk-shadow-sm);
}

/* Keyboard focus ? ring wins over hover shadow. */
.fwk-button:focus-visible {
	outline: none;
	background: var(--fwk-button-ink-hover);
	color: var(--fwk-color-on-cta);
	text-decoration: none;
	box-shadow: var(--fwk-focus-ring);
}

.fwk-button:active:not(:disabled):not([aria-disabled="true"]):not(.is-loading) {
	transform: scale(0.97);
	background: var(--fwk-button-ink-active);
	box-shadow: none;
}

.fwk-button--sm {
	min-height: 36px;
	padding: var(--fwk-space-2) var(--fwk-space-4);
	font-size: var(--fwk-text-xs);
	gap: var(--fwk-space-1);
}

.fwk-button--lg {
	min-height: 52px;
	padding: var(--fwk-space-4) var(--fwk-space-10);
	font-size: var(--fwk-text-base);
}

/* U2 Secondary ? outline; must never equal primary fill. */
.fwk-button--secondary {
	background: var(--fwk-color-secondary-bg);
	color: var(--fwk-color-secondary-text);
	border-color: var(--fwk-color-secondary-border);
	box-shadow: none;
}

.fwk-button--secondary:hover {
	background: var(--fwk-color-selected-soft);
	color: var(--fwk-color-selected);
	border-color: var(--fwk-color-selected);
	box-shadow: none;
}

.fwk-button--secondary:focus-visible {
	background: var(--fwk-color-selected-soft);
	color: var(--fwk-color-selected);
	border-color: var(--fwk-color-selected);
	box-shadow: var(--fwk-focus-ring);
}

.fwk-button--secondary:active:not(:disabled):not([aria-disabled="true"]):not(.is-loading) {
	background: var(--fwk-green-200);
	color: var(--fwk-button-ink-active);
	border-color: var(--fwk-button-ink-active);
	transform: scale(0.97);
}

/* U3 Ghost — hairline outline, no grey fill plate. */
.fwk-button--ghost {
	background: transparent;
	color: var(--fwk-color-text);
	border-color: var(--fwk-color-control-border);
	box-shadow: none;
}

.fwk-button--ghost:hover {
	background: transparent;
	color: var(--fwk-color-text);
	border-color: var(--fwk-color-selected);
	box-shadow: none;
}

.fwk-button--ghost:focus-visible {
	background: transparent;
	color: var(--fwk-color-text);
	border-color: var(--fwk-color-selected);
	box-shadow: var(--fwk-focus-ring);
}

.fwk-button--ghost:active:not(:disabled):not([aria-disabled="true"]):not(.is-loading) {
	background: var(--fwk-color-selected-soft);
	border-color: var(--fwk-color-selected);
	transform: scale(0.97);
}

.fwk-button:disabled,
.fwk-button[aria-disabled="true"] {
	opacity: 0.55;
	pointer-events: none;
	cursor: not-allowed;
	box-shadow: none;
	transform: none;
}

.fwk-button.is-loading {
	pointer-events: none;
	cursor: wait;
	color: transparent !important;
	box-shadow: none;
	transform: none;
}

.fwk-button.is-loading::after {
	content: "";
	position: absolute;
	inset: 50% auto auto 50%;
	width: 1.1em;
	height: 1.1em;
	margin: -0.55em 0 0 -0.55em;
	border: 2px solid color-mix(in oklch, var(--fwk-color-on-cta) 35%, transparent);
	border-top-color: var(--fwk-color-on-cta);
	border-radius: 50%;
	animation: fwk-spin 0.7s linear infinite;
}

.fwk-button--secondary.is-loading::after,
.fwk-button--ghost.is-loading::after {
	border-color: color-mix(in oklch, var(--fwk-color-text) 25%, transparent);
	border-top-color: var(--fwk-color-text);
}

.fwk-button svg {
	width: 1.1em;
	height: 1.1em;
	flex-shrink: 0;
}

@keyframes fwk-spin {
	to { transform: rotate(360deg); }
}

/* === UIK: Link ============================================================= */
.fwk-link {
	color: var(--fwk-color-accent);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
	transition: color var(--fwk-duration) var(--fwk-ease), box-shadow var(--fwk-duration) var(--fwk-ease);
}

.fwk-link:hover {
	color: var(--fwk-color-cta-hover);
}

.fwk-link:focus-visible {
	outline: none;
	border-radius: 2px;
	color: var(--fwk-color-cta-hover);
	box-shadow: var(--fwk-focus-ring);
}

.fwk-link:active {
	color: var(--fwk-color-cta-active);
}

/* P3.5 ? brand / site-title keyboard focus (was outline:none without ring). */
.site-branding a.brand:focus-visible,
.site-branding .brand:focus-visible,
.site-title a:focus-visible,
.site-branding .site-title a:focus-visible,
#mobile-header .site-branding a:focus-visible {
	outline: none;
	border-radius: var(--fwk-radius-control);
	box-shadow: var(--fwk-focus-ring);
}

.fwk-link[aria-disabled="true"],
.fwk-link.is-disabled {
	color: var(--fwk-color-disabled);
	pointer-events: none;
	text-decoration: none;
}

/* === UIK: Icon button ====================================================== */
.fwk-icon-button,
.header-cart-button,
.search-toggle-open,
.menu-toggle-open,
#mobile-toggle.menu-toggle-open {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: var(--fwk-space-2);
	border-radius: var(--fwk-radius-control);
	border: 1px solid transparent;
	background: transparent;
	color: var(--fwk-color-text);
	cursor: pointer;
	transition:
		background-color var(--fwk-duration) var(--fwk-ease),
		border-color var(--fwk-duration) var(--fwk-ease),
		color var(--fwk-duration) var(--fwk-ease),
		transform var(--fwk-duration-press) var(--fwk-ease-out);
}

.fwk-icon-button:hover,
.header-cart-button:hover,
.search-toggle-open:hover,
.menu-toggle-open:hover,
#mobile-toggle.menu-toggle-open:hover {
	background: var(--fwk-color-selected-soft);
	border-color: transparent;
	color: var(--fwk-color-selected);
}

.fwk-icon-button:focus-visible,
.header-cart-button:focus-visible,
.search-toggle-open:focus-visible,
.menu-toggle-open:focus-visible,
#mobile-toggle.menu-toggle-open:focus-visible {
	outline: none;
	background: var(--fwk-color-selected-soft);
	border-color: transparent;
	color: var(--fwk-color-selected);
	box-shadow: var(--fwk-focus-ring);
}

.fwk-icon-button:active:not(:disabled):not([aria-disabled="true"]),
.header-cart-button:active,
.search-toggle-open:active,
.menu-toggle-open:active,
#mobile-toggle.menu-toggle-open:active {
	transform: scale(0.94);
	background: var(--fwk-color-brand-soft);
}

.fwk-icon-button:disabled,
.fwk-icon-button[aria-disabled="true"] {
	opacity: 0.45;
	pointer-events: none;
	cursor: not-allowed;
}

/* === UIK: Badge ============================================================ */
.fwk-badge {
	display: inline-flex;
	align-items: center;
	min-height: 1.5rem;
	padding: 0.2rem var(--fwk-space-3);
	border-radius: var(--fwk-radius-pill);
	font-size: var(--fwk-text-xs);
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.02em;
	white-space: nowrap;
	font-variant-numeric: tabular-nums lining-nums;
}

.fwk-badge--sale { background: var(--fwk-color-sale); color: var(--fwk-color-on-cta); }
.fwk-badge--pct { background: var(--fwk-color-sale); color: var(--fwk-color-on-cta); }
.fwk-badge--out { background: var(--fwk-neutral-200); color: var(--fwk-neutral-700); }
.fwk-badge--new { background: var(--fwk-color-brand-soft); color: var(--fwk-color-selected); }
.fwk-badge--gift {
	background: color-mix(in oklch, var(--fwk-color-brand-soft) 80%, var(--fwk-color-surface));
	color: var(--fwk-color-selected);
	font-weight: 600;
}

/* Prices ? tabular nums everywhere brand/WC show money. */
.woocommerce .price,
.woocommerce .amount,
.woocommerce-Price-amount,
.fwk-price {
	font-variant-numeric: tabular-nums lining-nums;
	font-family: var(--fwk-font-numeric);
}

/* === UIK: Field ============================================================ */
.fwk-field,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-page form .form-row input.input-text,
.woocommerce-page form .form-row textarea,
.woocommerce-page form .form-row select {
	width: 100%;
	min-height: 44px;
	padding: var(--fwk-space-3) var(--fwk-space-4);
	border: 1px solid var(--fwk-color-control-border);
	border-radius: var(--fwk-radius-sm);
	background: var(--fwk-color-surface);
	color: var(--fwk-color-text);
	font: inherit;
	font-size: var(--fwk-text-sm);
	line-height: 1.4;
	transition: border-color var(--fwk-duration) var(--fwk-ease), box-shadow var(--fwk-duration) var(--fwk-ease), background-color var(--fwk-duration) var(--fwk-ease);
}

.fwk-field:focus,
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
	outline: none;
	border-color: var(--fwk-color-focus);
	box-shadow: var(--fwk-focus-ring);
}

.fwk-field:disabled,
.woocommerce form .form-row input.input-text:disabled,
.woocommerce form .form-row select:disabled {
	opacity: 0.55;
	cursor: not-allowed;
	background: var(--fwk-color-sunken);
}

.fwk-field.is-error,
.fwk-field[aria-invalid="true"],
.woocommerce form .form-row.woocommerce-invalid .fwk-field,
.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid select,
.woocommerce form .form-row.woocommerce-invalid textarea {
	/* U14 spirit: danger ink border only — no pink/traffic-light fill. */
	border-color: var(--fwk-color-danger);
	background: var(--fwk-color-surface);
}

.fwk-field.is-error:focus,
.fwk-field[aria-invalid="true"]:focus,
.woocommerce form .form-row.woocommerce-invalid input.input-text:focus {
	border-color: var(--fwk-color-danger);
	box-shadow: 0 0 0 2px var(--fwk-color-surface), 0 0 0 4px var(--fwk-color-danger);
}

.fwk-field-error {
	margin-block-start: var(--fwk-space-1);
	font-size: var(--fwk-text-xs);
	font-weight: 600;
	color: var(--fwk-color-danger);
}

.fwk-label,
.woocommerce form .form-row label {
	display: block;
	margin-block-end: var(--fwk-space-2);
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	color: var(--fwk-color-text);
}

.fwk-field-hint,
.woocommerce form .form-row .description {
	margin-block-start: var(--fwk-space-1);
	font-size: var(--fwk-text-xs);
	color: var(--fwk-color-muted);
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* === UX-1: Hero v2 ? full-bleed brand-first ================================= */
.fwk-front {
	margin-block-start: 0;
}

/* Full-bleed brand plane. 100vw + breakout can exceed clientWidth by scrollbar
   gutter ? html/body overflow-x: clip prevents horizontal scroll. */
.fwk-hero--v2 {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	width: 100vw;
	max-width: 100vw;
	margin-inline: calc(50% - 50vw);
	margin-block-end: 0;
	border-radius: 0;
	min-height: min(88vh, 44rem);
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: flex-start;
	background:
		radial-gradient(90% 70% at 72% 18%, rgba(54, 163, 225, 0.5) 0%, transparent 55%),
		radial-gradient(70% 60% at 12% 78%, rgba(226, 245, 255, 0.85) 0%, transparent 50%),
		linear-gradient(180deg, #8bd7ff 0%, #c8ebff 42%, var(--fwk-color-bg, #f8fafd) 88%);
}

.fwk-hero__plane {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	overflow: hidden;
}

/* Full-bleed sky wash (Figma Cloud bg). */
.fwk-hero__cloud-bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
	/* Soft atmosphere — dense overlay reads as haze over title/product. */
	opacity: 0.7;
	pointer-events: none;
	user-select: none;
}

/* Decorative sky PNGs + ambient drift (Figma cloud-animate-* / Frame 5). */
.fwk-hero__deco {
	position: absolute;
	max-width: none;
	pointer-events: none;
	user-select: none;
	opacity: 0.85;
	animation: none;
}

.fwk-hero__deco--sky-a {
	display: none;
}

.fwk-hero__deco--a {
	width: clamp(8rem, 22vw, 14rem);
	height: auto;
	top: 2%;
	right: -4%;
	left: auto;
	opacity: 0.4;
	animation-duration: 22s;
	animation-delay: -4s;
}

.fwk-hero__deco--b {
	/* Keep ambient fluff away from H1 column. */
	width: clamp(6rem, 14vw, 10rem);
	height: auto;
	top: auto;
	bottom: 12%;
	left: auto;
	right: 52%;
	opacity: 0.28;
	animation-duration: 16s;
	animation-delay: -7s;
}

.fwk-hero__deco--c {
	width: clamp(9rem, 26vw, 16rem);
	height: auto;
	bottom: 18%;
	right: -14%;
	opacity: 0.38;
	animation-duration: 20s;
	animation-direction: reverse;
}

.fwk-hero__deco--pano {
	width: clamp(12rem, 34vw, 20rem);
	height: auto;
	top: -4%;
	left: auto;
	right: -6%;
	opacity: 0.26;
	animation-duration: 120s;
	animation-timing-function: linear;
}

.fwk-hero__drift {
	position: absolute;
	inset-inline: -20%;
	/* Keep drift in upper sky — not behind H1. */
	top: 0.15rem;
	height: clamp(3.5rem, 8vw, 5.5rem);
	display: flex;
	align-items: center;
	gap: clamp(8rem, 40vw, 28rem);
	animation: none;
	will-change: auto;
	z-index: 1;
	/* Soften over copy column (Figma sky is wash, not hard stickers on title). */
	-webkit-mask-image: linear-gradient(90deg, transparent 0%, transparent 38%, #000 55%, #000 100%);
	mask-image: linear-gradient(90deg, transparent 0%, transparent 38%, #000 55%, #000 100%);
}

.fwk-hero__drift-cloud {
	flex: 0 0 auto;
	width: clamp(7rem, 18vw, 12rem);
	height: auto;
	opacity: 0.42;
}

@keyframes fwk-cloud-drift {
	0% { transform: translate3d(0, 0, 0); }
	100% { transform: translate3d(-35%, 0, 0); }
}

/* Desktop-first: content | visual. Mobile stacks visual above via order. */
.fwk-hero--v2 .fwk-hero__inner {
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1.1fr);
	gap: var(--fwk-space-10);
	align-items: center;
	width: 100%;
	padding-block: clamp(3.5rem, 2rem + 5vw, 6rem) clamp(1.25rem, 1rem + 2vw, 2.5rem);
}

/* Overlay header floats over hero sky — clear content by header height (5rem = 80px). */
body.fwk-header-overlay .fwk-hero--v2 .fwk-hero__inner {
	padding-block-start: calc(var(--fwk-header-height) + clamp(3.5rem, 2rem + 5vw, 6rem));
}

/* Figma 1:1480 — hero content type (desktop targets + fluid 375–1280). */
.fwk-hero--v2 .fwk-hero__content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: clamp(0.75rem, 0.55rem + 0.7vw, 1.1rem);
	/* Use full text column (was 34rem) so brand fits one line; grid keeps visual put. */
	max-width: 100%;
	min-width: 0;
	text-align: start;
	overflow: visible;
}

.fwk-hero--v2 .fwk-hero__title {
	display: flex;
	flex-direction: column;
	gap: clamp(0.35rem, 0.25rem + 0.35vw, 0.45rem);
	margin: 0;
	width: 100%;
	font-family: var(--fwk-font-display);
	font-weight: 800;
	line-height: 1.02;
	letter-spacing: -0.03em;
	color: var(--fwk-color-text);
	text-align: start;
	text-wrap: unset;
}

.fwk-hero__brand {
	/* −2pt vs Figma 62px desktop target (operator tweak). */
	font-size: calc(clamp(1.875rem, 1.05rem + 4.2vw, 3.875rem) - 2pt);
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: 1.25;
	text-transform: uppercase;
	color: #1a2026;
}

/* Desktop split layout: brand stays one line without shifting the visual column. */
@media (min-width: 56.25em) {
	.fwk-hero__brand {
		white-space: nowrap;
	}
}

.fwk-hero--v2 .fwk-hero__accent {
	display: block;
	font-family: var(--fwk-font);
	/* −2pt vs Figma 33px desktop target (operator tweak). */
	font-size: calc(clamp(1rem, 0.7rem + 1.7vw, 2.0625rem) - 2pt);
	font-weight: 700;
	letter-spacing: clamp(0.08em, 0.06em + 0.55vw, 0.24em);
	text-transform: uppercase;
	color: #004161;
	text-shadow: 0 1px 0 oklch(100% 0 0 / 0.28);
}

.fwk-hero--v2 .fwk-hero__subtitle {
	font-size: clamp(0.9375rem, 0.85rem + 0.5vw, 1.25rem);
	color: #575f66;
	max-width: 30rem;
	margin: 0;
	line-height: 1.5;
	text-align: start;
}

.fwk-hero--v2 .fwk-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--fwk-space-3);
	align-items: center;
	justify-content: flex-start;
	margin-block-start: clamp(0.35rem, 0.25rem + 0.5vw, 0.75rem);
}

.fwk-hero__cta {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-family: var(--fwk-font-body, inherit);
	font-size: clamp(1.05rem, 0.85rem + 0.65vw, 1.375rem);
	font-weight: 600;
	color: var(--fwk-color-text);
	text-decoration: none;
	line-height: 1.2;
	transition: color var(--fwk-duration) var(--fwk-ease);
}

.fwk-hero__cta:hover,
.fwk-hero__cta:focus-visible {
	color: var(--fwk-color-text);
	text-decoration: none;
}

.fwk-hero__cta:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
	border-radius: 4px;
}

/*
 * Hero CTA arrow — kinetic nudge (2026).
 * Always-visible affordance; compositor-only motion (no width/margin).
 * Rest: short shaft + soft opacity. Hover: shaft draws out + tip nudges R.
 */
.fwk-hero__cta-icon {
	display: block;
	flex: 0 0 auto;
	width: 1.35em;
	height: auto;
	overflow: visible;
	color: var(--fwk-color-brand);
	transform: translateX(0);
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1);
}

.fwk-hero__cta-shaft,
.fwk-hero__cta-head {
	transition:
		transform 360ms cubic-bezier(0.22, 1, 0.36, 1),
		opacity var(--fwk-duration) var(--fwk-ease-out);
}

.fwk-hero__cta-shaft {
	transform-box: fill-box;
	transform-origin: left center;
	transform: scaleX(0.42);
	opacity: 0.45;
}

.fwk-hero__cta-head {
	transform-box: fill-box;
	transform-origin: center;
	transform: translateX(-0.15em);
	opacity: 0.85;
}

.fwk-hero__cta:hover .fwk-hero__cta-icon,
.fwk-hero__cta:focus-visible .fwk-hero__cta-icon {
	transform: translateX(0.28em);
}

.fwk-hero__cta:hover .fwk-hero__cta-shaft,
.fwk-hero__cta:focus-visible .fwk-hero__cta-shaft {
	transform: scaleX(1);
	opacity: 1;
}

.fwk-hero__cta:hover .fwk-hero__cta-head,
.fwk-hero__cta:focus-visible .fwk-hero__cta-head {
	transform: translateX(0);
	opacity: 1;
}

.fwk-hero__cta:active .fwk-hero__cta-icon {
	transform: translateX(0.4em);
	transition-duration: var(--fwk-duration-press);
}

/* Touch: full arrow — no hover affordance to discover. */
@media (hover: none), (pointer: coarse) {
	.fwk-hero__cta-icon {
		transform: none;
	}

	.fwk-hero__cta-shaft {
		transform: scaleX(1);
		opacity: 1;
	}

	.fwk-hero__cta-head {
		transform: none;
		opacity: 1;
	}
}

@media (prefers-reduced-motion: reduce) {
	.fwk-hero__cta-icon,
	.fwk-hero__cta-shaft,
	.fwk-hero__cta-head {
		transition: none;
		transform: none;
	}

	.fwk-hero__cta-shaft {
		transform: scaleX(1);
		opacity: 1;
	}

	.fwk-hero__cta-head {
		opacity: 1;
	}
}

/* Hero category cutouts (float on plane + glass pill). */
.fwk-hero--with-cats {
	padding-block-end: clamp(1.25rem, 1rem + 2vw, 2.25rem);
}

.fwk-hero--with-cats .fwk-hero__inner {
	flex: 1 1 auto;
}

.fwk-hero__cats-wash {
	position: absolute;
	inset-inline: 0;
	inset-block-end: 0;
	height: min(42%, 18rem);
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(
		180deg,
		transparent 0%,
		oklch(100% 0 0 / 0.18) 42%,
		oklch(100% 0 0 / 0.45) 100%
	);
}

.fwk-hero__cats {
	position: relative;
	z-index: 3;
	display: block;
	width: min(100%, var(--fwk-container-max));
	margin-inline: auto;
	margin-block-start: 40px;
	padding-inline: var(--fwk-container-pad);
}

.fwk-hero__cats-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(0.5rem, 0.25rem + 1.2vw, 1.25rem);
	align-items: end;
}

.fwk-hero-cat__link {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.35rem;
	text-decoration: none;
	color: inherit;
	min-width: 0;
}

.fwk-hero-cat__link:hover,
.fwk-hero-cat__link:focus-visible {
	text-decoration: none;
}

.fwk-hero-cat__link:focus-visible {
	outline: none;
}

.fwk-hero-cat__link:focus-visible .fwk-hero-cat__pill {
	box-shadow: var(--fwk-focus-ring);
}

.fwk-hero-cat__media {
	display: grid;
	place-items: end center;
	width: 100%;
	min-height: clamp(4.5rem, 3rem + 8vw, 8.5rem);
	filter: drop-shadow(0 10px 18px oklch(45% 0.04 250 / 0.22));
	transition: transform var(--fwk-duration) var(--fwk-ease);
}

.fwk-hero-cat__link:hover .fwk-hero-cat__media,
.fwk-hero-cat__link:focus-visible .fwk-hero-cat__media {
	transform: translateY(-4px) scale(1.03);
}

.fwk-hero-cat__img {
	display: block;
	width: auto;
	max-width: 100%;
	height: clamp(4.25rem, 2.75rem + 8vw, 8rem);
	object-fit: contain;
	object-position: bottom center;
}

.fwk-hero-cat--kids .fwk-hero-cat__media {
	min-height: clamp(3.75rem, 2.5rem + 6.5vw, 7rem);
}

.fwk-hero-cat--kids .fwk-hero-cat__img {
	height: clamp(3.5rem, 2.25rem + 6.5vw, 6.5rem);
}

.fwk-hero-cat__pill {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2.5rem;
	padding: 0.45rem 0.9rem;
	border-radius: var(--fwk-radius-md);
	background: oklch(100% 0 0 / 0.72);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border: 1px solid oklch(100% 0 0 / 0.55);
	box-shadow: 0 4px 16px oklch(35% 0.03 250 / 0.12);
	font-family: var(--fwk-font-display);
	font-size: clamp(0.8rem, 0.72rem + 0.35vw, 0.95rem);
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--fwk-color-text);
	line-height: 1.2;
	text-align: center;
	max-width: 100%;
}

/* Cloud sandwich + product slider (Figma Frame 4 / bg_cloud_slider). */
.fwk-hero--v2 .fwk-hero__visual {
	position: relative;
	display: grid;
	place-items: center;
	justify-self: end;
	width: 100%;
	max-width: 48rem;
	min-height: clamp(14rem, 9rem + 20vw, 26rem);
	/* Keep vertical fluff; clip only sideways so clouds don't cover H1. */
	overflow-x: clip;
	overflow-y: visible;
}

.fwk-hero-cloudstack {
	position: relative;
	width: 100%;
	aspect-ratio: 852 / 396;
	max-width: 100%;
	overflow: visible;
}

.fwk-hero-cloudstack__bg,
.fwk-hero-cloudstack__front {
	position: absolute;
	pointer-events: none;
	z-index: 1;
	animation: none;
}

/* Legacy single-image sandwich (fallback assets). */
.fwk-hero-cloudstack:not(.fwk-hero-cloudstack--figma) .fwk-hero-cloudstack__bg {
	top: 22%;
	left: -4%;
	width: 108%;
	z-index: 1;
	opacity: 0.7;
}

.fwk-hero-cloudstack:not(.fwk-hero-cloudstack--figma) .fwk-hero-cloudstack__front {
	bottom: -16%;
	left: 9%;
	width: 82%;
	z-index: 3;
	opacity: 0.9;
	animation-duration: 13s;
	animation-direction: reverse;
}

.fwk-hero-cloudstack:not(.fwk-hero-cloudstack--figma) .fwk-hero-cloudstack__bg img,
.fwk-hero-cloudstack:not(.fwk-hero-cloudstack--figma) .fwk-hero-cloudstack__front img {
	display: block;
	width: 100%;
	height: auto;
}

/* Figma Frame 4: dual mirrored cloud_PNG112147 pieces, no CSS mask.
 * Canvas 852×396 — pieces positioned absolute to cloudstack. */
.fwk-hero-cloudstack--figma .fwk-hero-cloudstack__bg,
.fwk-hero-cloudstack--figma .fwk-hero-cloudstack__front {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	bottom: auto;
	opacity: 1;
}

.fwk-hero-cloudstack--figma .fwk-hero-cloudstack__bg {
	z-index: 1;
}

.fwk-hero-cloudstack--figma .fwk-hero-cloudstack__front {
	z-index: 3;
	animation-duration: 13s;
	animation-direction: reverse;
}

.fwk-hero-cloudstack__piece {
	position: absolute;
	display: block;
	width: 51.86%;
	height: auto;
	max-width: none;
	pointer-events: none;
	user-select: none;
}

/* bg_cloud_slider: top≈28–31%, opacity 0.70 */
.fwk-hero-cloudstack__piece--bg-a {
	left: 51.8%;
	top: 28.3%;
	opacity: 0.7;
}

.fwk-hero-cloudstack__piece--bg-b {
	left: -3.6%;
	top: 31%;
	opacity: 0.7;
	transform: scaleX(-1);
}

/* front_cloud_slider: top≈43.5%, full opacity — covers sole */
.fwk-hero-cloudstack__piece--front-a {
	left: 10.3%;
	top: 43.5%;
	width: 51.86%;
	opacity: 1;
	transform: scaleX(-1);
}

.fwk-hero-cloudstack__piece--front-b {
	left: 39.1%;
	top: 43.5%;
	width: 51.86%;
	opacity: 1;
}

.fwk-hero-slider {
	position: absolute;
	/* Figma 1:1493: 589×347 @ left 151, top -48 in 852×396 nest */
	inset: -12.11% 13.13% 24.58% 17.72%;
	z-index: 2;
	display: grid;
	place-items: end center;
}

.fwk-hero-slider__slide {
	grid-area: 1 / 1;
	position: relative;
	display: grid;
	place-items: end center;
	width: 100%;
	height: 100%;
	min-height: 0;
	opacity: 0;
	transform: translate3d(0, 10px, 0) scale(0.97);
	transition:
		opacity 0.85s var(--fwk-ease),
		transform 0.85s var(--fwk-ease);
	pointer-events: none;
	text-decoration: none;
}

.fwk-hero-slider__slide.is-active {
	opacity: 1;
	transform: translate3d(0, 0, 0) scale(1);
	pointer-events: auto;
	z-index: 1;
}

.fwk-hero-slider__slide.is-leaving {
	opacity: 0;
	transform: translate3d(0, -8px, 0) scale(1.02);
	pointer-events: none;
	z-index: 0;
}

.fwk-hero-slider__slide img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	max-height: 100%;
	object-fit: contain;
	object-position: center bottom;
	background: transparent;
	transform: translateY(-30px);
	filter:
		drop-shadow(0 14px 18px oklch(52% 0.07 245 / 0.22))
		drop-shadow(0 4px 10px oklch(55% 0.05 245 / 0.12));
}

/* Legacy portrait modifier — wide slides ignore shrink; keep for old caches. */
.fwk-hero-slider__slide--portrait img {
	max-width: none;
	width: 100%;
	height: 100%;
	position: static;
	left: auto;
	bottom: auto;
	translate: none;
}

@media (min-width: 56.25em) {
	.fwk-hero-slider__slide img {
		width: 100%;
	}
}

/* Fallback: product on single pedestal. */
.fwk-hero-stage {
	position: relative;
	display: grid;
	justify-items: center;
	align-items: end;
	width: 100%;
	max-width: 100%;
	padding-block: 0.5rem 0;
}

.fwk-hero--v2 .fwk-hero__product {
	position: relative;
	z-index: 2;
	display: block;
	width: min(92%, 28rem);
	height: auto;
	aspect-ratio: auto;
	object-fit: contain;
	object-position: center bottom;
	background: transparent;
	filter:
		drop-shadow(0 18px 22px oklch(52% 0.07 245 / 0.2))
		drop-shadow(0 4px 10px oklch(55% 0.05 245 / 0.12));
	animation: none;
	margin-block-end: -12%;
}

.fwk-hero__cloud-pedestal {
	position: relative;
	z-index: 1;
	display: block;
	width: min(110%, 34rem);
	max-width: none;
	height: auto;
	pointer-events: none;
	user-select: none;
	animation: none;
}

.fwk-hero__product-placeholder {
	position: relative;
	z-index: 2;
	width: min(70%, 22rem);
	aspect-ratio: 1 / 1;
	margin-block-end: -12%;
	border-radius: 42% 58% 56% 44% / 50% 46% 54% 50%;
	background: linear-gradient(150deg, var(--fwk-sky-300), var(--fwk-sky-100));
	box-shadow: inset 0 -10px 30px oklch(100% 0 0 / 0.6), 0 24px 40px oklch(55% 0.08 245 / 0.18);
	animation: none;
}

/* Mobile: visual above content, centered copy, cats 2×2. */
@media (max-width: 56.24em) {
	.fwk-hero--v2 {
		min-height: auto;
	}

	.fwk-hero--v2 .fwk-hero__inner {
		grid-template-columns: 1fr;
		justify-items: center;
		text-align: center;
		gap: clamp(1rem, 0.65rem + 1.8vw, 1.65rem);
		padding-block: clamp(1.75rem, 1.1rem + 2.5vw, 2.75rem) clamp(0.5rem, 0.35rem + 1vw, 1rem);
	}

	body.fwk-header-overlay .fwk-hero--v2 .fwk-hero__inner {
		padding-block-start: calc(var(--fwk-header-height) + clamp(1.75rem, 1.1rem + 2.5vw, 2.75rem));
	}

	.fwk-hero-cloudstack {
		max-width: 100%;
		aspect-ratio: 852 / 420;
	}

	.fwk-hero-cloudstack:not(.fwk-hero-cloudstack--figma) .fwk-hero-cloudstack__bg {
		top: 18%;
		left: 0;
		width: 100%;
		opacity: 0.55;
	}

	.fwk-hero-cloudstack:not(.fwk-hero-cloudstack--figma) .fwk-hero-cloudstack__front {
		bottom: -10%;
		left: 11%;
		width: 78%;
		opacity: 0.82;
	}

	.fwk-hero-cloudstack--figma .fwk-hero-cloudstack__bg,
	.fwk-hero-cloudstack--figma .fwk-hero-cloudstack__front {
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}

	.fwk-hero-slider {
		/* Taller nest vs desktop Figma; keep sole on front cloud */
		inset: -6% 10% 28% 14%;
		place-items: end center;
	}

	.fwk-hero--v2 .fwk-hero__visual {
		order: -1;
		justify-self: center;
		max-width: min(96%, 26rem);
		min-height: clamp(12rem, 8rem + 18vw, 18rem);
		overflow-x: clip;
		overflow-y: visible;
	}

	.fwk-hero__deco--a,
	.fwk-hero__deco--c,
	.fwk-hero__deco--pano {
		opacity: 0.22;
		width: clamp(7rem, 38vw, 12rem);
	}

	.fwk-hero__deco--b {
		opacity: 0.28;
	}

	.fwk-hero--v2 .fwk-hero__content {
		align-items: center;
		text-align: center;
		max-width: 34rem;
		width: 100%;
		gap: clamp(0.75rem, 0.5rem + 1vw, 1.15rem);
		/* Keep H1 clear of any residual stack overflow. */
		position: relative;
		z-index: 2;
	}

	.fwk-hero--v2 .fwk-hero__title,
	.fwk-hero--v2 .fwk-hero__subtitle {
		text-align: center;
	}

	.fwk-hero--v2 .fwk-hero__actions {
		justify-content: center;
	}

	.fwk-hero--v2 .fwk-hero__product {
		width: min(82%, 16rem);
		margin-block-end: -12%;
	}

	.fwk-hero__cloud-pedestal {
		width: min(112%, 22rem);
	}
}

@media (max-width: 40em) {
	.fwk-hero--with-cats {
		min-height: auto;
		padding-block-end: var(--fwk-space-3);
	}

	.fwk-hero__cats {
		padding-inline: var(--fwk-container-pad);
	}

	.fwk-hero__cats-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--fwk-space-2) var(--fwk-space-3);
		row-gap: var(--fwk-space-4);
	}

	.fwk-hero-cat__media {
		min-height: 4.75rem;
	}

	.fwk-hero-cat__img {
		height: 4.5rem;
	}

	.fwk-hero-cat--kids .fwk-hero-cat__media {
		min-height: 4rem;
	}

	.fwk-hero-cat--kids .fwk-hero-cat__img {
		height: 3.75rem;
	}
}

@keyframes fwk-float {
	0%, 100% { transform: translate3d(0, 0, 0); }
	50% { transform: translate3d(0, -10px, 0); }
}

@keyframes fwk-bob {
	0%, 100% { transform: translate3d(0, 0, 0) rotate(-1deg); }
	50% { transform: translate3d(0, -14px, 0) rotate(1deg); }
}

/* === UIK: Chip ============================================================= */
.fwk-chip {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: var(--fwk-space-2) var(--fwk-space-4);
	border-radius: var(--fwk-radius-control);
	background: transparent;
	border: 1px solid var(--fwk-color-control-border);
	color: var(--fwk-color-text);
	font-size: var(--fwk-text-sm);
	font-weight: 500;
	text-decoration: none;
	cursor: pointer;
	transition:
		background-color var(--fwk-duration) var(--fwk-ease),
		border-color var(--fwk-duration) var(--fwk-ease),
		color var(--fwk-duration) var(--fwk-ease),
		transform var(--fwk-duration-press) var(--fwk-ease-out),
		box-shadow var(--fwk-duration) var(--fwk-ease);
}

.fwk-chip:hover {
	background: var(--fwk-color-selected-soft);
	border-color: var(--fwk-color-selected);
	color: var(--fwk-color-selected);
	text-decoration: none;
	transform: none;
}

.fwk-chip:focus-visible {
	outline: none;
	background: var(--fwk-color-selected-soft);
	border-color: var(--fwk-color-accent);
	color: var(--fwk-color-accent);
	text-decoration: none;
	box-shadow: var(--fwk-focus-ring);
	transform: none;
}

.fwk-chip:active:not(:disabled):not([aria-disabled="true"]) {
	transform: scale(0.97);
}

.fwk-chip.is-selected,
.fwk-chip[aria-pressed="true"],
.fwk-chip[aria-current="page"] {
	background: var(--fwk-color-selected);
	border-color: var(--fwk-color-selected);
	color: var(--fwk-color-on-selected);
	transform: none;
}

.fwk-chip.is-selected:hover,
.fwk-chip[aria-pressed="true"]:hover,
.fwk-chip[aria-current="page"]:hover {
	background: var(--fwk-green-700);
	border-color: var(--fwk-green-700);
	color: var(--fwk-color-on-selected);
}

.fwk-chip:disabled,
.fwk-chip[aria-disabled="true"],
.fwk-chip.is-disabled {
	opacity: 0.45;
	pointer-events: none;
	cursor: not-allowed;
	transform: none;
}

/* === UX-1: Home Croslite proof band ======================================== */
/*
 * Full-bleed sky bridge (F.plane-benefits) — same breakout as hero / products.
 * Brand green = ink only (eyebrow / stats). No green section fill.
 */
.fwk-plane--benefits,
.fwk-benefits--home {
	position: relative;
	isolation: isolate;
	width: 100vw;
	max-width: 100vw;
	margin-inline: calc(50% - 50vw);
	box-sizing: border-box;
	padding-block: var(--fwk-section-y);
	border-block: 0;
	background: var(--fwk-plane-benefits-wash);
}

.fwk-benefits--home > .fwk-container,
.fwk-plane--benefits > .fwk-container {
	position: relative;
	z-index: 1;
}

/*
 * Continuous product plane: after benefits wash ends on white, do not
 * re-introduce sky fade (avoids blue → green → blue sandwich).
 */
.fwk-plane--benefits + .fwk-plane--products,
.fwk-benefits--home + .fwk-bestsellers {
	background: var(--fwk-plane-products);
}

.fwk-benefits__layout {
	display: grid;
	gap: var(--fwk-space-10);
	align-items: start;
}

@media (min-width: 56.25em) {
	.fwk-benefits__layout {
		grid-template-columns: minmax(14rem, 0.85fr) minmax(0, 1.5fr);
		gap: clamp(2.5rem, 2rem + 3vw, 4.5rem);
		align-items: start;
	}
}

.fwk-benefits__intro {
	display: grid;
	gap: var(--fwk-space-3);
	max-width: 22rem;
}

.fwk-benefits--home .fwk-benefits__eyebrow {
	margin: 0;
	font-size: var(--fwk-text-xs);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fwk-color-selected);
}

.fwk-benefits--home .fwk-benefits__intro h2 {
	margin: 0;
	font-family: var(--fwk-font-display);
	font-size: clamp(1.75rem, 1.35rem + 1.6vw, 2.5rem);
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -0.03em;
	color: var(--fwk-color-text);
	text-wrap: balance;
}

.fwk-benefits__lead {
	margin: 0;
	font-size: var(--fwk-text-base);
	line-height: 1.5;
	color: var(--fwk-color-muted);
	max-width: 32ch;
}

.fwk-benefits--home .fwk-benefits__proof {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: var(--fwk-space-6);
	grid-template-columns: 1fr;
}

@media (min-width: 40em) {
	.fwk-benefits--home .fwk-benefits__proof {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 0;
	}
}

.fwk-benefits--home .fwk-benefits__proof-item {
	display: grid;
	gap: var(--fwk-space-2);
	padding: 0;
	background: transparent;
	border: 0;
	align-content: start;
}

@media (min-width: 40em) {
	.fwk-benefits--home .fwk-benefits__proof-item {
		padding-inline: var(--fwk-space-5);
		border-inline-start: 0;
	}

	.fwk-benefits--home .fwk-benefits__proof-item:first-child {
		padding-inline-start: 0;
	}

	.fwk-benefits--home .fwk-benefits__proof-item:last-child {
		padding-inline-end: 0;
	}
}

.fwk-benefits--home .fwk-benefits__stat {
	font-family: var(--fwk-font-display);
	font-size: clamp(1.65rem, 1.25rem + 1.4vw, 2.125rem);
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1.05;
	color: var(--fwk-color-selected);
	text-wrap: balance;
}

.fwk-benefits--home .fwk-benefits__proof-title {
	font-family: var(--fwk-font-display);
	font-size: var(--fwk-text-base);
	font-weight: 700;
	color: var(--fwk-color-text);
	margin: 0;
}

.fwk-benefits--home .fwk-benefits__proof-text {
	margin: 0;
	font-size: var(--fwk-text-sm);
	line-height: 1.45;
	color: var(--fwk-color-muted);
	max-width: 28ch;
}

/* Shared benefits grid (legacy icon cards — unused on PDP after --pdp proof). */
.fwk-benefits__grid {
	display: grid;
	gap: var(--fwk-grid-gap);
	grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
}

.fwk-benefit__icon {
	display: grid;
	place-items: center;
	width: 3rem;
	height: 3rem;
	border-radius: var(--fwk-radius);
	background: var(--fwk-color-accent-soft);
	color: var(--fwk-color-accent);
}

.fwk-benefit__icon svg { width: 1.5rem; height: 1.5rem; }

/* === UX-1: H9 home trust strip ============================================= */
.fwk-home-trust {
	padding-block: var(--fwk-space-8);
	background: var(--fwk-color-bg);
}

.fwk-home-trust__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: var(--fwk-space-4);
	grid-template-columns: 1fr 1fr;
}

@media (min-width: 56.25em) {
	.fwk-home-trust__list {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: var(--fwk-space-6);
	}
}

.fwk-home-trust__item {
	display: flex;
	align-items: center;
	gap: var(--fwk-space-3);
	min-height: 44px;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	color: var(--fwk-color-text);
}

.fwk-home-trust__item svg {
	flex: 0 0 auto;
	color: var(--fwk-color-accent);
}

/* === UX-1: Category tiles (photo-led) ====================================== */
/* UX-T4: fixed 2x3 / 3x2 for 6 tiles ? never auto-fill (was 5+1 orphan Sale). */
.fwk-cats__grid {
	display: grid;
	gap: var(--fwk-grid-gap);
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* Odd last tile (e.g. Sale alone) spans full row ? no half-width orphan. */
.fwk-cats__grid > :last-child:nth-child(odd) {
	grid-column: 1 / -1;
}

@media (min-width: 48em) {
	.fwk-cats__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	/* 3-col: only span when alone on last row (3n+1). */
	.fwk-cats__grid > :last-child:nth-child(odd) {
		grid-column: auto;
	}

	.fwk-cats__grid > :last-child:nth-child(3n + 1) {
		grid-column: 1 / -1;
	}
}

.fwk-cat-tile {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 14rem;
	padding: var(--fwk-space-6);
	border-radius: var(--fwk-radius-lg);
	overflow: hidden;
	isolation: isolate;
	background: linear-gradient(160deg, var(--fwk-sky-200), var(--fwk-sky-100));
	color: var(--fwk-color-text);
	border: 1px solid var(--fwk-color-border);
	text-decoration: none;
	transition: transform var(--fwk-duration) var(--fwk-ease), box-shadow var(--fwk-duration) var(--fwk-ease);
}

.fwk-cat-tile:hover,
.fwk-cat-tile:focus-visible {
	transform: translateY(-2px);
	box-shadow: var(--fwk-shadow-md);
	text-decoration: none;
}

.fwk-cat-tile:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring), var(--fwk-shadow-md);
}

.fwk-cat-tile:hover .fwk-cat-tile__img,
.fwk-cat-tile:focus-visible .fwk-cat-tile__img {
	transform: none;
}

.fwk-cat-tile__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	z-index: 0;
	transition: transform var(--fwk-duration-slow) var(--fwk-ease);
}

.fwk-cat-tile--has-img::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, oklch(20% 0.02 250 / 0.08) 25%, oklch(20% 0.02 250 / 0.72) 100%);
	pointer-events: none;
}

.fwk-cat-tile__label {
	position: relative;
	z-index: 2;
	font-family: var(--fwk-font-display);
	font-size: var(--fwk-text-xl);
	font-weight: 700;
	letter-spacing: -0.01em;
}

.fwk-cat-tile--has-img .fwk-cat-tile__label,
.fwk-cat-tile:has(.fwk-cat-tile__img) .fwk-cat-tile__label {
	color: var(--fwk-neutral-0);
	text-shadow: 0 1px 12px oklch(20% 0.02 250 / 0.55);
}

/* === UX-1: Section reveal (W2) ============================================= */
/* P0: content visible by default (progressive enhancement). JS may still add motion. */
.fwk-reveal {
	opacity: 1;
	transform: none;
	transition:
		opacity var(--fwk-duration-slow) var(--fwk-ease-out),
		transform var(--fwk-duration-slow) var(--fwk-ease-out);
}

.fwk-reveal.is-visible,
.fwk-reveal--hero.is-visible {
	opacity: 1;
	transform: translate3d(0, 0, 0);
}

.fwk-reveal--hero {
	transition-duration: 700ms;
}

@media (prefers-reduced-motion: reduce) {
	.fwk-reveal,
	.fwk-reveal--hero {
		opacity: 1;
		transform: none;
		transition: none;
	}

	.fwk-hero__product,
	.fwk-hero__product-placeholder,
	.fwk-hero__cloud-pedestal,
	.fwk-hero__deco,
	.fwk-hero__drift,
	.fwk-hero-cloudstack__bg,
	.fwk-hero-cloudstack__front {
		animation: none !important;
	}

	.fwk-hero-slider__slide {
		transition: none !important;
	}
}

/* -----------------------------------------------------------------------------
   8. Product plane + Bestsellers (Figma U10) — same .fwk-product-card as PLP
   -------------------------------------------------------------------------- */

/*
 * SSOT LAW — product-card planes are FULL-BLEED pure white.
 * Never paint background only on .fwk-container (leaves tinted gutters).
 * Breakout matches .fwk-hero--v2; content stays in .fwk-container inside.
 * Anti-VD-6: do NOT reintroduce sunken/neutral wash under packshots.
 */
.fwk-plane--products,
.fwk-bestsellers,
.woocommerce section.related.products,
.woocommerce section.up-sells.products,
.woocommerce section.upsells.products,
.woocommerce section.cross-sells.products {
	position: relative;
	isolation: isolate;
	width: 100vw;
	max-width: 100vw;
	margin-inline: calc(50% - 50vw);
	background:
		var(--fwk-plane-products-fade),
		var(--fwk-plane-products);
	box-sizing: border-box;
}

.fwk-bestsellers {
	border-block-start: 0;
}

.fwk-bestsellers > .fwk-container,
.fwk-plane--products > .fwk-container {
	position: relative;
	z-index: 1;
}

.fwk-bestsellers .fwk-section__head {
	max-width: 40rem;
	margin-inline: auto;
}

.fwk-bestsellers .fwk-section__head h2 {
	font-size: clamp(1.35rem, 1.1rem + 1vw, 1.75rem);
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

/* Override shared auto-fill: Figma desktop = 5 columns. */
.fwk-bestsellers ul.products {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: var(--fwk-grid-gap);
	align-items: stretch;
}

.fwk-bestsellers__more {
	display: flex;
	justify-content: center;
	margin-block-start: var(--fwk-space-8);
}

@media (max-width: 60em) {
	.fwk-bestsellers ul.products {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 40em) {
	.fwk-bestsellers ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--fwk-space-4);
	}
}

/* -----------------------------------------------------------------------------
   9. Size-chart trigger ? bare text control (no chrome / frame)
   Hover/focus: color deepen + icon reveal. Never reuse --fwk-color-cta for hover
   when default already uses --fwk-color-accent (same token = sky-600).
   Candidate next: compose with .fwk-btn-plain (F.plain) — keep local reset for now.
   -------------------------------------------------------------------------- */
/* Quiet secondary text-link (compose with .fwk-btn-plain). Accent only on hover/focus. */
.fwk-sizechart-trigger,
button.fwk-btn-plain.fwk-sizechart-trigger,
.woocommerce button.fwk-sizechart-trigger,
.woocommerce .fwk-sizechart-trigger {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	gap: var(--fwk-space-2);
	margin: 0;
	padding: 0;
	min-height: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	color: var(--fwk-color-muted);
	font-family: inherit;
	font-size: var(--fwk-text-sm);
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: 0;
	text-align: start;
	text-decoration: underline;
	text-underline-offset: 0.18em;
	text-decoration-thickness: 1px;
	text-decoration-color: color-mix(in oklch, var(--fwk-color-muted) 40%, transparent);
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	transition: color var(--fwk-duration) var(--fwk-ease), text-decoration-color var(--fwk-duration) var(--fwk-ease);
}

.fwk-sizechart-trigger__icon {
	display: block;
	flex: 0 0 auto;
	width: 1em;
	height: 1em;
	opacity: 0.7;
	pointer-events: none;
}

.fwk-sizechart-trigger:hover,
.fwk-sizechart-trigger:focus-visible,
button.fwk-btn-plain.fwk-sizechart-trigger:hover,
button.fwk-btn-plain.fwk-sizechart-trigger:focus-visible,
.woocommerce button.fwk-sizechart-trigger:hover,
.woocommerce button.fwk-sizechart-trigger:focus-visible {
	background: transparent;
	border-color: transparent;
	color: var(--fwk-color-accent);
	text-decoration: underline;
	text-decoration-color: var(--fwk-color-accent);
	transform: none;
}

.fwk-sizechart-trigger:hover,
button.fwk-btn-plain.fwk-sizechart-trigger:hover,
.woocommerce button.fwk-sizechart-trigger:hover {
	box-shadow: none;
}

.fwk-sizechart-trigger:hover .fwk-sizechart-trigger__icon,
.fwk-sizechart-trigger:focus-visible .fwk-sizechart-trigger__icon {
	opacity: 1;
}

.fwk-sizechart-trigger:active,
button.fwk-btn-plain.fwk-sizechart-trigger:active,
.woocommerce button.fwk-sizechart-trigger:active {
	background: transparent;
	border-color: transparent;
	box-shadow: none;
	color: var(--fwk-color-cta-active);
	transform: none;
}

.fwk-sizechart-trigger:focus-visible,
button.fwk-btn-plain.fwk-sizechart-trigger:focus-visible,
.woocommerce button.fwk-sizechart-trigger:focus-visible {
	outline: none;
	border-radius: var(--fwk-radius-xs);
	box-shadow: var(--fwk-focus-ring);
}

@media (prefers-reduced-motion: reduce) {
	.fwk-sizechart-trigger,
	.fwk-sizechart-trigger__icon {
		transition: none;
	}
}

/* === UIK: Modal ============================================================ */
.fwk-modal {
	position: fixed;
	inset: 0;
	z-index: var(--fwk-z-modal);
	display: none;
	align-items: center;
	justify-content: center;
	padding: var(--fwk-space-4);
}

.fwk-modal.is-open { display: flex; }

.fwk-modal__backdrop {
	position: absolute;
	inset: 0;
	background: oklch(25% 0.03 250 / 0.45);
	backdrop-filter: blur(2px);
	animation: fwk-fade var(--fwk-duration) var(--fwk-ease-out);
}

.fwk-modal__dialog {
	position: relative;
	z-index: 1;
	width: min(40rem, 100%);
	max-height: min(85dvh, 48rem);
	overflow: auto;
	overscroll-behavior: contain;
	background: var(--fwk-color-surface);
	border-radius: var(--fwk-radius-xl);
	box-shadow: var(--fwk-shadow-lg);
	padding: clamp(1.5rem, 1rem + 2vw, 2.5rem);
	animation: fwk-pop var(--fwk-duration-slow) var(--fwk-ease-spring);
}

.fwk-modal__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-4);
	margin-block-end: var(--fwk-space-5);
}

.fwk-modal__title {
	font-size: var(--fwk-text-xl);
	font-weight: 700;
	color: var(--fwk-color-text);
	margin: 0;
}

/* Modal close = U11 dismiss (not primary CTA). Reset Kadence/WC button padding.
   Candidate next: compose with .fwk-btn-plain (F.plain) under U11. */
.fwk-modal__close.fwk-icon-button,
button.fwk-modal__close {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 44px;
	height: 44px;
	min-width: 44px;
	min-height: 44px;
	margin: 0;
	padding: 0;
	border: 1px solid var(--fwk-color-border);
	border-radius: var(--fwk-radius-control);
	background: transparent;
	color: var(--fwk-color-text);
	line-height: 0;
	font-size: 0;
	appearance: none;
	-webkit-appearance: none;
	box-shadow: none;
	cursor: pointer;
}

.fwk-modal__close.fwk-icon-button:hover,
.fwk-modal__close.fwk-icon-button:focus-visible,
button.fwk-modal__close:hover,
button.fwk-modal__close:focus-visible {
	background: var(--fwk-color-sunken);
	border-color: var(--fwk-color-border-strong);
	color: var(--fwk-color-accent);
	box-shadow: none;
}

.fwk-modal__close.fwk-icon-button:focus-visible,
button.fwk-modal__close:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
}

.fwk-modal__close svg {
	display: block;
	width: 20px;
	height: 20px;
	flex: 0 0 auto;
	pointer-events: none;
}

.fwk-modal__tabs {
	display: flex;
	gap: var(--fwk-space-2);
	margin-block-end: var(--fwk-space-4);
	padding: var(--fwk-space-1);
	border-radius: var(--fwk-radius-md);
	background: var(--fwk-color-sunken);
}

.fwk-modal__tab {
	flex: 1 1 auto;
	min-height: 40px;
	padding: var(--fwk-space-2) var(--fwk-space-4);
	border: 0;
	border-radius: var(--fwk-radius-control);
	background: transparent;
	color: var(--fwk-color-muted);
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	cursor: pointer;
}

.fwk-modal__tab.is-active,
.fwk-modal__tab[aria-selected="true"] {
	background: var(--fwk-color-surface);
	color: var(--fwk-color-text);
	box-shadow: var(--fwk-shadow-sm);
}

.fwk-modal__tab:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
}

.fwk-modal__footer {
	display: grid;
	margin-block-start: var(--fwk-space-5);
	padding-block-start: var(--fwk-space-4);
	border-top: 1px solid var(--fwk-color-border);
}

.fwk-modal__footer .fwk-button {
	width: 100%;
}

.fwk-modal__footer .fwk-button:disabled {
	opacity: 0.45;
}

.fwk-size-table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--fwk-text-sm);
	font-variant-numeric: tabular-nums lining-nums;
}

.fwk-size-table caption {
	text-align: start;
	font-weight: 600;
	color: var(--fwk-color-text);
	margin-block: var(--fwk-space-4) var(--fwk-space-2);
}

.fwk-size-table th,
.fwk-size-table td {
	padding: var(--fwk-space-2) var(--fwk-space-3);
	text-align: start;
	border-bottom: 1px solid var(--fwk-color-border);
}

.fwk-size-table thead th {
	font-weight: 600;
	color: var(--fwk-color-muted);
	background: var(--fwk-color-sunken);
	position: sticky;
	top: 0;
}

.fwk-size-table tbody tr:hover { background: var(--fwk-color-accent-soft); }

.fwk-modal__note {
	margin-top: var(--fwk-space-4);
	color: var(--fwk-color-muted);
	font-size: var(--fwk-text-xs);
}

.fwk-modal__note--us {
	margin-top: var(--fwk-space-2);
}

@keyframes fwk-fade {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes fwk-pop {
	from { opacity: 0; transform: translateY(12px) scale(0.97); }
	to { opacity: 1; transform: translateY(0) scale(1); }
}

/* -----------------------------------------------------------------------------
   11. Reduced motion & high contrast
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	.fwk-hero__product,
	.fwk-hero__product-placeholder,
	.fwk-hero__cloud-pedestal,
	.fwk-hero__deco,
	.fwk-hero__drift,
	.fwk-hero-cloudstack__bg,
	.fwk-hero-cloudstack__front {
		animation: none;
	}

	.fwk-hero-slider__slide {
		transition: none;
	}
}

@media (prefers-contrast: more) {
	:root {
		--fwk-color-muted: var(--fwk-neutral-700);
		--fwk-color-border: var(--fwk-neutral-400);
		--fwk-color-border-strong: var(--fwk-neutral-500);
		--fwk-color-control-border: color-mix(in oklch, var(--fwk-color-text) 40%, var(--fwk-color-surface));
	}
}

/* -----------------------------------------------------------------------------
   12. WooCommerce ? buttons, product cards, single product, related
   Kadence Customizer (WooCommerce ? Product Archive) ? recommended:
   - Product archive style: action-visible
   - Button style: button
   - Align buttons to bottom: on
   - Image hover: none (or secondary swap ? CSS below handles swap slot)
   -------------------------------------------------------------------------- */

/* === UIK: Woo bridge — U1 primary / U2 secondary matrix ====================
   Color Law: Default WC `.button` = U2 outline (Update cart, Apply coupon, View cart).
   `.button.alt` + ATC + checkout + place order = U1 Action ink (not Accent sky).
   -------------------------------------------------------------------------- */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--fwk-space-2);
	min-height: 44px;
	padding: var(--fwk-space-3) var(--fwk-space-6);
	border: 1px solid var(--fwk-color-secondary-border);
	border-radius: var(--fwk-radius-control);
	background: var(--fwk-color-secondary-bg);
	color: var(--fwk-color-secondary-text);
	font-weight: 600;
	font-size: var(--fwk-text-sm);
	line-height: 1;
	cursor: pointer;
	text-decoration: none;
	box-shadow: none;
	transition:
		background-color var(--fwk-duration) var(--fwk-ease),
		box-shadow var(--fwk-duration) var(--fwk-ease),
		transform var(--fwk-duration-press) var(--fwk-ease-out),
		border-color var(--fwk-duration) var(--fwk-ease),
		color var(--fwk-duration) var(--fwk-ease);
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce .button:hover {
	background: var(--fwk-color-selected-soft);
	color: var(--fwk-color-selected);
	border-color: var(--fwk-color-selected);
	box-shadow: none;
	text-decoration: none;
}

.woocommerce a.button:focus-visible,
.woocommerce button.button:focus-visible,
.woocommerce input.button:focus-visible,
.woocommerce .button:focus-visible {
	outline: none;
	background: var(--fwk-color-selected-soft);
	color: var(--fwk-color-selected);
	border-color: var(--fwk-color-selected);
	box-shadow: var(--fwk-focus-ring);
}

.woocommerce a.button:active,
.woocommerce button.button:active,
.woocommerce input.button:active,
.woocommerce .button:active {
	transform: scale(0.97);
	background: var(--fwk-green-200);
	color: var(--fwk-button-ink-active);
	border-color: var(--fwk-button-ink-active);
	box-shadow: none;
}

/* U1 primary CTAs */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce .button.alt,
.woocommerce .single_add_to_cart_button,
.woocommerce .checkout-button,
.woocommerce #place_order,
.woocommerce #respond input#submit.alt {
	background: var(--fwk-button-ink);
	color: var(--fwk-color-on-cta);
	border-color: transparent;
}

.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce .button.alt:hover,
.woocommerce .single_add_to_cart_button:hover,
.woocommerce .checkout-button:hover,
.woocommerce #place_order:hover {
	background: var(--fwk-button-ink-hover);
	color: var(--fwk-color-on-cta);
	border-color: transparent;
	box-shadow: var(--fwk-shadow-sm);
}

.woocommerce a.button.alt:focus-visible,
.woocommerce button.button.alt:focus-visible,
.woocommerce input.button.alt:focus-visible,
.woocommerce .button.alt:focus-visible,
.woocommerce .single_add_to_cart_button:focus-visible,
.woocommerce .checkout-button:focus-visible,
.woocommerce #place_order:focus-visible {
	outline: none;
	background: var(--fwk-button-ink-hover);
	color: var(--fwk-color-on-cta);
	border-color: transparent;
	box-shadow: var(--fwk-focus-ring);
}

.woocommerce a.button.alt:active,
.woocommerce button.button.alt:active,
.woocommerce input.button.alt:active,
.woocommerce .button.alt:active,
.woocommerce .single_add_to_cart_button:active,
.woocommerce .checkout-button:active,
.woocommerce #place_order:active {
	transform: scale(0.97);
	background: var(--fwk-button-ink-active);
	color: var(--fwk-color-on-cta);
	box-shadow: none;
}

.woocommerce a.button:disabled,
.woocommerce button.button:disabled,
.woocommerce input.button:disabled,
.woocommerce .button.disabled,
.woocommerce .button:disabled {
	opacity: 0.55;
	pointer-events: none;
	cursor: not-allowed;
	box-shadow: none;
	transform: none;
}

/* Product grid ? catalog, related, cross-sell, upsells, bestsellers, search. */
.woocommerce ul.products,
.woocommerce-page ul.products,
section.related.products ul.products,
section.upsells ul.products,
section.cross-sells ul.products,
.fwk-bestsellers ul.products {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(var(--fwk-grid-min), 1fr));
	gap: var(--fwk-grid-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}

.woocommerce ul.products::before,
.woocommerce ul.products::after,
section.related.products ul.products::before,
section.related.products ul.products::after,
section.upsells ul.products::before,
section.upsells ul.products::after,
section.cross-sells ul.products::before,
section.cross-sells ul.products::after,
.fwk-bestsellers ul.products::before,
.fwk-bestsellers ul.products::after {
	content: none;
	display: none;
}

/* CF-2 atom ? same card on shop / related / bestsellers / search. */
ul.products li.product.fwk-product-card {
	width: auto !important;
	margin: 0 !important;
	float: none !important;
	clear: none !important;
	display: flex;
	flex-direction: column;
	height: 100%;
	container-type: inline-size;
	position: relative;
	/* Fully transparent ? no surface plate, no card shadow. */
	background: transparent !important; /* beat Kadence .content-bg */
	border: 1px solid transparent;
	border-radius: var(--fwk-radius-lg);
	box-shadow: none;
	overflow: visible !important;
	padding: 0;
	isolation: isolate;
}

ul.products li.product.fwk-product-card::after {
	content: none;
	display: none;
}

/* Keyboard focus on card links/CTA — not when only wishlist toggle is focused. */
ul.products li.product.fwk-product-card:focus-within:not(:has([data-fwk-wishlist-toggle]:focus)) {
	box-shadow: var(--fwk-focus-ring);
}

/* Image slot — contain packshot, fully transparent (no wash plate). */
ul.products li.product.fwk-product-card .woocommerce-loop-image-link {
	position: relative;
	display: block;
	flex: 0 0 auto;
	z-index: 2;
	overflow: hidden;
	border-radius: var(--fwk-radius-lg) var(--fwk-radius-lg) 0 0;
	aspect-ratio: var(--fwk-card-media-ratio);
	min-height: clamp(6.5rem, 18vw, 9rem);
	background: transparent;
	box-shadow: none;
}

/*
 * LAW: never put a wash/plate under packshot media.
 * JPG white-bg + transparent PNG share the product plane (--fwk-plane-products).
 * Anti-VD-6 / anti-sunken underlay — do not reintroduce neutral-50/sunken here.
 */
ul.products li.product.fwk-product-card .woocommerce-loop-image-link,
body.single-product.woocommerce div.product .woocommerce-product-gallery__image,
.woocommerce-product-gallery .flex-control-thumbs li {
	background: transparent !important;
}

ul.products li.product.fwk-product-card .woocommerce-loop-image-link img,
body.single-product.woocommerce div.product .woocommerce-product-gallery__image img,
.woocommerce-product-gallery .flex-control-thumbs li img {
	background: transparent !important;
}

/* Related (PDP): same honest ratio + contain. */
body.single-product section.related.products ul.products li.product.fwk-product-card .woocommerce-loop-image-link,
body.single-product section.upsells ul.products li.product.fwk-product-card .woocommerce-loop-image-link {
	aspect-ratio: var(--fwk-card-media-ratio);
	min-height: clamp(7.5rem, 16vw, 10rem);
}

ul.products li.product.fwk-product-card .woocommerce-loop-image-link.is-broken {
	display: flex;
	align-items: center;
	justify-content: center;
}

ul.products li.product.fwk-product-card .woocommerce-loop-image-link.is-broken::after {
	content: attr(data-fwk-broken-label);
	font-size: var(--fwk-text-xs);
	color: var(--fwk-color-muted);
	text-align: center;
	padding: var(--fwk-space-3);
}

ul.products li.product.fwk-product-card .woocommerce-loop-image-link.is-broken img {
	display: none;
}

ul.products li.product.fwk-product-card .woocommerce-loop-image-link img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	background: transparent;
	margin: 0;
	/* Inset zoom: start slightly small, grow into the slot — no edge clip, no overlap. */
	transform: scale(0.92);
	transition:
		opacity var(--fwk-duration) var(--fwk-ease),
		transform var(--fwk-duration) var(--fwk-ease);
}

/* Hover / scroll-hover: image grows to fill slot — no plate wash, no shadow, no overflow spill. */
@media (hover: hover) and (pointer: fine) {
	ul.products li.product.fwk-product-card:hover .woocommerce-loop-image-link img {
		transform: scale(1);
	}
}

ul.products li.product.fwk-product-card.is-scroll-hover .woocommerce-loop-image-link img {
	transform: scale(1);
}

/* Kadence secondary image on hover — keep slot stable + crossfade + same inset zoom. */
ul.products li.product.fwk-product-card .woocommerce-loop-image-link img.secondary-product-image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	margin: 0;
	opacity: 0;
	transform: scale(0.92);
	transition:
		opacity var(--fwk-duration) var(--fwk-ease),
		transform var(--fwk-duration) var(--fwk-ease);
}

ul.products li.product.fwk-product-card .woocommerce-loop-image-link.product-has-hover-image:hover > img:not(.secondary-product-image),
ul.products li.product.fwk-product-card.is-scroll-hover .woocommerce-loop-image-link.product-has-hover-image > img:not(.secondary-product-image) {
	opacity: 0;
}

ul.products li.product.fwk-product-card .woocommerce-loop-image-link.product-has-hover-image:hover > img.secondary-product-image,
ul.products li.product.fwk-product-card.is-scroll-hover .woocommerce-loop-image-link.product-has-hover-image > img.secondary-product-image {
	opacity: 1;
}

/* Brand badges (rendered by fwk_render_loop_badge in inc/product.php). */
.fwk-loop-badges {
	position: absolute;
	top: var(--fwk-space-3);
	left: var(--fwk-space-3);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--fwk-space-2);
	z-index: 2;
	pointer-events: none;
}

/* M6 — wishlist heart (sibling of image link, not inside <a>). */
.fwk-wishlist-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--fwk-space-2);
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--fwk-color-text);
	cursor: pointer;
	font: inherit;
	line-height: 1;
	-webkit-tap-highlight-color: transparent;
}

.fwk-wishlist-toggle:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
	border-radius: var(--fwk-radius-pill);
}

.fwk-wishlist-toggle__icon {
	display: block;
	flex: 0 0 auto;
	width: 1.125rem;
	height: 1.125rem;
}

.fwk-wishlist-toggle__outline {
	transition: opacity var(--fwk-duration-fast) var(--fwk-ease);
}

.fwk-wishlist-toggle__fill {
	opacity: 0;
	transform: scale(0.82);
	transform-origin: center;
	transition:
		opacity var(--fwk-duration) var(--fwk-ease),
		transform var(--fwk-duration) var(--fwk-ease-spring);
}

/* Active fill = heart red (not brand green / sale sun). */
.fwk-wishlist-toggle.is-active {
	color: oklch(55% 0.22 25);
}

.fwk-wishlist-toggle.is-active .fwk-wishlist-toggle__outline {
	opacity: 0;
}

.fwk-wishlist-toggle.is-active .fwk-wishlist-toggle__fill {
	opacity: 1;
	transform: scale(1);
}

/*
 * Card control: frosted disc over packshot (M6 / Pack P1-B).
 * Align inset with .fwk-loop-badges (space-3); stay clear of left badges.
 */
.fwk-wishlist-toggle--card {
	position: absolute;
	top: var(--fwk-space-3);
	right: var(--fwk-space-3);
	z-index: 4;
	width: 2.5rem;
	height: 2.5rem;
	border: 0;
	border-radius: var(--fwk-radius-pill);
	background: color-mix(in oklch, var(--fwk-color-surface) 92%, transparent);
	background-color: color-mix(in oklch, var(--fwk-color-surface) 92%, transparent);
	box-shadow: none;
	outline: none;
	-webkit-appearance: none;
	appearance: none;
	color: var(--fwk-color-text);
	opacity: 0.45;
	transition:
		opacity var(--fwk-duration-fast) var(--fwk-ease),
		color var(--fwk-duration-fast) var(--fwk-ease),
		background-color var(--fwk-duration-fast) var(--fwk-ease);
}

.fwk-wishlist-toggle--card .fwk-wishlist-toggle__icon {
	width: 1.25rem;
	height: 1.25rem;
	transition: transform var(--fwk-duration-fast) var(--fwk-ease);
}

.fwk-wishlist-toggle--card:hover,
.fwk-wishlist-toggle--card:focus-visible {
	opacity: 1;
	color: oklch(55% 0.22 25);
	background: color-mix(in oklch, var(--fwk-color-surface) 96%, transparent);
	background-color: color-mix(in oklch, var(--fwk-color-surface) 96%, transparent);
}

.fwk-wishlist-toggle--card:hover .fwk-wishlist-toggle__icon,
.fwk-wishlist-toggle--card:focus-visible .fwk-wishlist-toggle__icon {
	transform: scale(1.15);
}

.fwk-wishlist-toggle--card:active .fwk-wishlist-toggle__icon {
	transform: scale(1.05);
}

.fwk-wishlist-toggle--card.is-active {
	opacity: 1;
	color: oklch(55% 0.22 25);
}

.fwk-wishlist-toggle--card.is-active:hover .fwk-wishlist-toggle__icon,
.fwk-wishlist-toggle--card.is-active:focus-visible .fwk-wishlist-toggle__icon {
	transform: scale(1.15);
}

.fwk-wishlist-toggle--card .fwk-wishlist-toggle__text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.fwk-wishlist-pdp {
	margin: var(--fwk-space-3) 0 var(--fwk-space-4);
}

.fwk-wishlist-toggle--pdp {
	min-height: 2.75rem;
	padding: 0.35rem 0.15rem;
	color: var(--fwk-color-muted);
	text-decoration: underline;
	text-underline-offset: 0.2em;
	text-decoration-thickness: 1px;
}

.fwk-wishlist-toggle--pdp:hover {
	color: var(--fwk-color-text);
}

.fwk-wishlist-toggle--pdp.is-active {
	color: oklch(55% 0.22 25);
	text-decoration: none;
}

.fwk-wishlist-toggle--pdp .fwk-wishlist-toggle__text {
	font-size: var(--fwk-text-sm);
	font-weight: 600;
}

.fwk-wishlist-toggle--pdp .fwk-wishlist-toggle__icon {
	width: 1.25rem;
	height: 1.25rem;
}

@media (prefers-reduced-motion: reduce) {
	.fwk-wishlist-toggle__fill,
	.fwk-wishlist-toggle__outline,
	.fwk-wishlist-toggle--card,
	.fwk-wishlist-toggle--card .fwk-wishlist-toggle__icon {
		transition: none;
	}

	.fwk-wishlist-toggle--card:hover .fwk-wishlist-toggle__icon,
	.fwk-wishlist-toggle--card:focus-visible .fwk-wishlist-toggle__icon,
	.fwk-wishlist-toggle--card:active .fwk-wishlist-toggle__icon,
	.fwk-wishlist-toggle--card.is-active:hover .fwk-wishlist-toggle__icon,
	.fwk-wishlist-toggle--card.is-active:focus-visible .fwk-wishlist-toggle__icon {
		transform: none;
	}
}

/* Header wishlist (injected beside cart wrap). */
.fwk-wishlist-header {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	min-width: 44px;
	min-height: 44px;
	margin: 0;
	color: #3c434a;
	text-decoration: none;
	border-radius: 6px;
	background: transparent;
}

.fwk-wishlist-header:hover,
.fwk-wishlist-header:focus-visible {
	color: var(--fwk-color-text);
}

.fwk-wishlist-header:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
}

.fwk-wishlist-header__icon {
	display: flex;
	line-height: 0;
}

.fwk-wishlist-header__badge,
.fwk-more-sheet__badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.15rem;
	min-height: 1.15rem;
	padding: 0 0.3em;
	border-radius: var(--fwk-radius-pill);
	background: var(--fwk-button-ink);
	color: var(--fwk-color-on-cta);
	font-size: var(--fwk-text-xs);
	font-weight: 700;
	font-variant-numeric: tabular-nums lining-nums;
	line-height: 1;
}

.fwk-wishlist-header__badge {
	position: absolute;
	top: 0.15rem;
	right: 0.1rem;
}

.fwk-wishlist-header__badge[hidden],
.fwk-more-sheet__badge[hidden] {
	display: none !important;
}

.fwk-more-sheet__link[data-fwk-wishlist-nav] {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-3);
}

/* /vybrane/ page shell — hide Kadence page title (shortcode owns H1). */
.fwk-wishlist-page .entry-hero,
.fwk-wishlist-page .entry-header.page-title,
.fwk-wishlist-page h1.entry-title {
	display: none !important;
}

/* Kadence .entry-content-wrap pads 2rem — stacks on --fwk-header-content-gap. */
.fwk-wishlist-page .entry-content-wrap {
	padding-block-start: 0;
}

.fwk-wishlist {
	max-width: var(--fwk-content-max, 72rem);
	margin: 0 auto;
	/* Top gap comes from --fwk-header-content-gap on #primary — don't double. */
	padding: 0 var(--fwk-space-4) var(--fwk-space-10);
}

.fwk-wishlist__head {
	margin-bottom: var(--fwk-space-6);
}

.fwk-wishlist__title {
	margin: 0 0 var(--fwk-space-2);
	font-size: var(--fwk-text-2xl, 1.75rem);
	font-weight: 700;
	line-height: 1.2;
}

.fwk-wishlist__note {
	margin: 0;
	color: var(--fwk-color-muted);
	font-size: var(--fwk-text-sm);
}

.fwk-wishlist__empty {
	padding: var(--fwk-space-8) 0;
	text-align: center;
}

.fwk-wishlist__empty-title {
	margin: 0 0 var(--fwk-space-2);
	font-size: var(--fwk-text-xl);
	font-weight: 700;
}

.fwk-wishlist__empty-text {
	margin: 0 auto var(--fwk-space-5);
	max-width: 28rem;
	color: var(--fwk-color-muted);
}

.fwk-wishlist__empty-cta {
	margin: 0;
}

.fwk-wishlist__loading {
	padding: var(--fwk-space-8) 0;
	text-align: center;
	color: var(--fwk-color-muted);
}

.fwk-wishlist__grid[hidden],
.fwk-wishlist__empty[hidden],
.fwk-wishlist__loading[hidden] {
	display: none !important;
}

ul.products li.product.fwk-product-card.outofstock .woocommerce-loop-image-link img {
	opacity: 0.72;
}

/*
 * Body + CTA ? under the media slot (never over the packshot).
 * Beat Kadence: .content-bg #fff + margin .5em inset + translateY(-2rem).
 */
ul.products li.product.fwk-product-card .product-details.entry-content-wrap,
ul.products li.product.fwk-product-card .entry-content-wrap,
ul.products li.product.fwk-product-card .product-details.content-bg,
.woocommerce ul.products.woo-archive-action-on-hover li.product.fwk-product-card .entry-content-wrap,
.woocommerce ul.products.woo-archive-action-on-hover li.product.fwk-product-card:hover .entry-content-wrap,
.woocommerce ul.products.woo-archive-action-on-hover li.product.fwk-product-card:focus-within .entry-content-wrap {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	gap: var(--fwk-space-2);
	position: relative;
	z-index: 0;
	padding: var(--fwk-space-3) var(--fwk-card-pad) var(--fwk-space-2);
	margin: 0 !important;
	border-radius: 0;
	box-shadow: none !important;
	background: transparent !important;
	transform: none !important;
	transition: none;
}

ul.products li.product.fwk-product-card .product-excerpt {
	display: none;
}

ul.products li.product.fwk-product-card .star-rating {
	display: none !important;
}

ul.products li.product.fwk-product-card .woocommerce-loop-product__title {
	font-size: var(--fwk-text-lg);
	font-weight: 600;
	line-height: var(--fwk-card-title-lh);
	padding: 0;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: var(--fwk-card-title-lines);
	line-clamp: var(--fwk-card-title-lines);
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: calc(var(--fwk-card-title-lines) * var(--fwk-card-title-lh) * 1em);
}

ul.products li.product.fwk-product-card .woocommerce-loop-product__title a {
	color: var(--fwk-color-text);
	text-decoration: none;
}

ul.products li.product.fwk-product-card .woocommerce-loop-product__title a:hover {
	color: var(--fwk-color-accent);
}

/* Premium P1 VD-1 ? colour line (always visible @375). */
ul.products li.product.fwk-product-card .fwk-card-color {
	margin: 0;
	padding: 0;
	font-size: var(--fwk-text-sm);
	font-weight: 500;
	line-height: 1.3;
	color: var(--fwk-color-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Price hierarchy ? sale coral + muted regular, tabular nums. */
ul.products li.product.fwk-product-card .price {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: var(--fwk-space-2);
	padding: 0;
	margin: 0;
	margin-top: auto;
	color: var(--fwk-color-text);
	font-size: var(--fwk-text-lg);
	font-weight: 600;
	font-variant-numeric: tabular-nums lining-nums;
	letter-spacing: -0.01em;
}

ul.products li.product.fwk-product-card .price del {
	order: 2;
	color: var(--fwk-color-muted);
	font-weight: 400;
	font-size: var(--fwk-text-sm);
	opacity: 0.9;
}

ul.products li.product.fwk-product-card .price ins {
	order: 1;
	color: var(--fwk-color-sale);
	text-decoration: none;
	font-weight: 700;
}

ul.products li.product.fwk-product-card .fwk-card-sizes {
	margin: 0;
	padding: 0;
	font-size: var(--fwk-text-sm);
	font-weight: 500;
	line-height: 1.3;
	color: var(--fwk-neutral-700);
	font-variant-numeric: tabular-nums;
}

/* CTA row — reserved slot (CLS-safe); wrap itself always present, not Kadence overlay. */
ul.products li.product.fwk-product-card .product-action-wrap,
.woocommerce ul.products.woo-archive-action-on-hover li.product.fwk-product-card .product-action-wrap,
.woocommerce ul.products.woo-archive-action-on-hover li.product.fwk-product-card:hover .product-action-wrap,
.woocommerce ul.products.woo-archive-action-on-hover li.product.fwk-product-card:focus-within .product-action-wrap {
	margin: 0;
	margin-top: 0;
	padding: 0 0 var(--fwk-card-pad);
	width: 100%;
	min-height: calc(2.5rem + var(--fwk-card-pad));
	position: static !important;
	bottom: auto !important;
	left: auto;
	right: auto;
	opacity: 1 !important;
	transition: none;
}

ul.products li.product.fwk-product-card .button {
	margin: 0;
	width: auto;
	max-width: 100%;
}

/*
 * U10 Card CTA — text-link + Figma arrow-long-right.
 * Motion (desktop): wrapper visibility-only; label rise+fade; arrow L→R stagger 70ms.
 * Touch / ≤40em: final state, no entrance. Never display:none / height:0 (reserved slot).
 */
ul.products li.product.fwk-product-card .product-action-wrap .button:not(.kb-button),
ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	flex-wrap: nowrap;
	gap: 0;
	width: auto;
	max-width: 100%;
	min-height: 2.5rem;
	padding: var(--fwk-space-2) 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--fwk-color-text);
	font-weight: 600;
	font-size: var(--fwk-text-sm);
	line-height: 1.2;
	white-space: nowrap;
	text-decoration: none;
	text-transform: none;
	box-shadow: none;
	transition: color var(--fwk-duration) var(--fwk-ease);
}

ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta__label {
	display: inline-block;
	white-space: nowrap;
	opacity: 1;
	transform: none;
	transition:
		opacity 320ms var(--fwk-ease-out),
		transform 320ms var(--fwk-ease-out);
}

ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 1.5rem; /* 24px */
	height: 0.6875rem; /* 11px */
	margin-inline-start: var(--fwk-space-2);
	overflow: hidden;
	opacity: 1;
	transform: none;
	color: var(--fwk-color-accent);
	transition:
		opacity 320ms var(--fwk-ease-out),
		transform 320ms var(--fwk-ease-out),
		width 320ms var(--fwk-ease-out),
		margin-inline-start 320ms var(--fwk-ease-out);
	transition-delay: 0ms;
}

ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta__icon svg {
	display: block;
	width: 1.5rem; /* 24px */
	height: 0.6875rem; /* 11px */
	flex-shrink: 0;
	min-width: 1.5rem;
	stroke: currentColor;
}

ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta--outline,
ul.products li.product.fwk-product-card .product-action-wrap .button.fwk-card-cta--outline,
ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta--text,
ul.products li.product.fwk-product-card .product-action-wrap .button.fwk-card-cta--text {
	background: transparent;
	border: 0;
	color: var(--fwk-color-text);
}

ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta--ghost,
ul.products li.product.fwk-product-card .product-action-wrap .button.fwk-card-cta--ghost {
	color: var(--fwk-color-muted);
	font-weight: 500;
	border: 0;
}

/* Desktop: staged reveal — label rise, then arrow slides L→R. */
@media (hover: hover) and (pointer: fine) {
	ul.products li.product.fwk-product-card .product-action-wrap .button:not(.kb-button),
	ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta {
		visibility: hidden;
		pointer-events: none;
	}

	ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta__label {
		opacity: 0;
		transform: translateY(0.4rem);
	}

	ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta__icon {
		opacity: 0;
		transform: translateX(-0.75rem);
		width: 0;
		margin-inline-start: 0;
		transition-delay: 0ms;
	}

	ul.products li.product.fwk-product-card:hover .product-action-wrap .button:not(.kb-button),
	ul.products li.product.fwk-product-card:hover .product-action-wrap .fwk-card-cta,
	ul.products li.product.fwk-product-card:focus-within .product-action-wrap .button:not(.kb-button),
	ul.products li.product.fwk-product-card:focus-within .product-action-wrap .fwk-card-cta {
		visibility: visible;
		pointer-events: auto;
	}

	ul.products li.product.fwk-product-card:hover .product-action-wrap .fwk-card-cta__label,
	ul.products li.product.fwk-product-card:focus-within .product-action-wrap .fwk-card-cta__label {
		opacity: 1;
		transform: translateY(0);
	}

	ul.products li.product.fwk-product-card:hover .product-action-wrap .fwk-card-cta__icon,
	ul.products li.product.fwk-product-card:focus-within .product-action-wrap .fwk-card-cta__icon {
		opacity: 1;
		transform: translateX(0);
		width: 1.5rem;
		margin-inline-start: var(--fwk-space-2);
		transition-delay: 70ms;
	}

	ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta:focus-visible,
	ul.products li.product.fwk-product-card .product-action-wrap .button:not(.kb-button):focus-visible {
		background: transparent;
		box-shadow: var(--fwk-focus-ring);
		border-radius: var(--fwk-radius);
	}

	ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta:hover,
	ul.products li.product.fwk-product-card .product-action-wrap .button:not(.kb-button):hover,
	ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta--ghost:hover,
	ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta--ghost:focus-visible {
		background: transparent;
		color: var(--fwk-color-text);
		box-shadow: none;
	}

	ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta--ghost:hover,
	ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta--ghost:focus-visible {
		color: var(--fwk-color-muted);
	}
}

/*
 * Touch / coarse / narrow: CTA hidden by default (same as desktop).
 * Reveal via .is-scroll-hover (JS center-band) or :focus-within (a11y).
 * No IntersectionObserver fallback: brand.js leaves CTA visible.
 */
@media (hover: none), (pointer: coarse), (max-width: 40em) {
	ul.products li.product.fwk-product-card .product-action-wrap .button:not(.kb-button),
	ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta {
		visibility: hidden;
		pointer-events: none;
	}

	ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta__label {
		opacity: 0;
		transform: translateY(0.4rem);
	}

	ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta__icon {
		opacity: 0;
		transform: translateX(-0.75rem);
		width: 0;
		margin-inline-start: 0;
		transition-delay: 0ms;
	}

	ul.products li.product.fwk-product-card.is-scroll-hover .product-action-wrap .button:not(.kb-button),
	ul.products li.product.fwk-product-card.is-scroll-hover .product-action-wrap .fwk-card-cta,
	ul.products li.product.fwk-product-card:focus-within .product-action-wrap .button:not(.kb-button),
	ul.products li.product.fwk-product-card:focus-within .product-action-wrap .fwk-card-cta {
		visibility: visible;
		pointer-events: auto;
	}

	ul.products li.product.fwk-product-card.is-scroll-hover .product-action-wrap .fwk-card-cta__label,
	ul.products li.product.fwk-product-card:focus-within .product-action-wrap .fwk-card-cta__label {
		opacity: 1;
		transform: translateY(0);
	}

	ul.products li.product.fwk-product-card.is-scroll-hover .product-action-wrap .fwk-card-cta__icon,
	ul.products li.product.fwk-product-card:focus-within .product-action-wrap .fwk-card-cta__icon {
		opacity: 1;
		transform: translateX(0);
		width: 1.5rem;
		margin-inline-start: var(--fwk-space-2);
		transition-delay: 70ms;
	}

	/* Graceful degrade when JS marks body (no IntersectionObserver). */
	body.fwk-no-card-scroll-hover ul.products li.product.fwk-product-card .product-action-wrap .button:not(.kb-button),
	body.fwk-no-card-scroll-hover ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta {
		visibility: visible;
		pointer-events: auto;
	}

	body.fwk-no-card-scroll-hover ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta__label,
	body.fwk-no-card-scroll-hover ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta__icon {
		opacity: 1;
		transform: none;
		transition: none;
	}

	body.fwk-no-card-scroll-hover ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta__icon {
		width: 1.5rem;
		margin-inline-start: var(--fwk-space-2);
	}
}

ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta:active {
	transform: scale(0.98);
	background: transparent;
}

@media (prefers-reduced-motion: reduce) {
	ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta,
	ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta__label,
	ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta__icon {
		transition: none !important;
		transition-delay: 0ms !important;
	}

	ul.products li.product.fwk-product-card .woocommerce-loop-image-link img {
		transform: none;
		transition: opacity var(--fwk-duration) var(--fwk-ease);
	}

	ul.products li.product.fwk-product-card:hover .woocommerce-loop-image-link img,
	ul.products li.product.fwk-product-card.is-scroll-hover .woocommerce-loop-image-link img {
		transform: none;
	}
}

ul.products li.product.fwk-product-card .added_to_cart {
	display: block;
	margin-block-start: var(--fwk-space-2);
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	text-align: center;
}

/* Hide default WC sale flash (custom fwk-loop-badges used instead). */
ul.products li.product.fwk-product-card .onsale {
	display: none;
}

@container (max-width: 14rem) {
	ul.products li.product.fwk-product-card {
		--fwk-card-pad: var(--fwk-space-3);
	}
}

/* Related / upsells / cross-sells ? CF-2 section shell (T3-C). */
section.related.products,
section.up-sells.upsells,
section.upsells,
.cross-sells {
	margin-block: var(--fwk-space-12);
	padding-block: var(--fwk-space-8);
}

/* PDP: related → footer clearance = 80px (white plane under cards). */
body.single-product.woocommerce section.related.products,
body.single-product.woocommerce section.up-sells.upsells,
body.single-product.woocommerce section.upsells {
	margin-block-end: 0;
	padding-block-end: 80px;
}

/*
 * Sticky ATC clearance lives on body.fwk-has-sticky-atc { padding-bottom },
 * not inside related (that created a white hole before the footer).
 */

section.related.products > h2,
section.up-sells.upsells > h2,
section.upsells > h2,
.cross-sells > h2 {
	font-family: var(--fwk-font-display);
	font-size: var(--fwk-text-2xl);
	font-weight: 700;
	letter-spacing: -0.02em;
	margin-block-end: var(--fwk-space-8);
}

/* Related — infinite slow marquee (PDP «Більше товарів»). */
.woocommerce section.related.products {
	--fwk-related-card-w: clamp(11.5rem, 22vw, 14.5rem);
	--fwk-related-marquee-duration: 55s;
	padding-inline: var(--fwk-plane-inline);
}

.woocommerce section.related.products > h2 {
	max-width: 72rem;
	margin-inline: auto;
	margin-block-end: var(--fwk-space-6);
}

/* Related PDP: no reserved CTA slot — card is the click target; avoids gap before footer. */
body.single-product.woocommerce section.related.products ul.products li.product.fwk-product-card .product-action-wrap,
body.single-product.woocommerce section.related.products ul.products.woo-archive-action-on-hover li.product.fwk-product-card .product-action-wrap,
body.single-product.woocommerce section.related.products ul.products.woo-archive-action-on-hover li.product.fwk-product-card:hover .product-action-wrap,
body.single-product.woocommerce section.related.products ul.products.woo-archive-action-on-hover li.product.fwk-product-card:focus-within .product-action-wrap {
	min-height: 0;
	padding: 0;
	height: 0;
	overflow: hidden;
	visibility: hidden;
	pointer-events: none;
}

.fwk-related-marquee {
	overflow: hidden;
	width: 100vw;
	max-width: 100vw;
	margin-inline: calc(50% - 50vw);
	mask-image: linear-gradient(
		90deg,
		transparent 0,
		#000 1.5rem,
		#000 calc(100% - 1.5rem),
		transparent 100%
	);
	-webkit-mask-image: linear-gradient(
		90deg,
		transparent 0,
		#000 1.5rem,
		#000 calc(100% - 1.5rem),
		transparent 100%
	);
}

.woocommerce section.related.products .fwk-related-marquee ul.products,
.woocommerce section.related.products .fwk-related-marquee ul.products.grid-cols,
.fwk-related-marquee__track {
	display: flex;
	flex-wrap: nowrap;
	align-items: stretch;
	gap: var(--fwk-grid-gap);
	width: max-content;
	max-width: none;
	margin: 0;
	padding: 0;
	list-style: none;
	grid-template-columns: none;
	will-change: transform;
	animation: fwk-related-marquee var(--fwk-related-marquee-duration) linear infinite;
}

.fwk-related-marquee:hover ul.products,
.fwk-related-marquee:focus-within ul.products {
	animation-play-state: paused;
}

.woocommerce section.related.products .fwk-related-marquee ul.products > li.product {
	flex: 0 0 var(--fwk-related-card-w);
	width: var(--fwk-related-card-w) !important;
	max-width: var(--fwk-related-card-w);
	float: none !important;
	margin: 0 !important;
}

@keyframes fwk-related-marquee {
	from {
		transform: translate3d(0, 0, 0);
	}
	to {
		transform: translate3d(-50%, 0, 0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.fwk-related-marquee__track {
		animation: none;
		will-change: auto;
	}

	.fwk-related-marquee {
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		mask-image: none;
		-webkit-mask-image: none;
	}

	.woocommerce section.related.products .fwk-related-marquee ul.products > li.product {
		scroll-snap-align: start;
	}

	.woocommerce section.related.products .fwk-related-marquee ul.products > li[data-fwk-related-clone] {
		display: none;
	}
}

/* Beat Kadence archive column widths inside related/upsell/cross-sell grids. */
section.related.products:not(:has(.fwk-related-marquee)) ul.products.grid-cols,
section.up-sells.upsells ul.products.grid-cols,
section.upsells ul.products.grid-cols,
.cross-sells ul.products.grid-cols {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(var(--fwk-grid-min), 1fr));
	gap: var(--fwk-grid-gap);
}

section.related.products:not(:has(.fwk-related-marquee)) ul.products > li.product,
section.up-sells.upsells ul.products > li.product,
section.upsells ul.products > li.product,
.cross-sells ul.products > li.product {
	width: auto !important;
	max-width: none;
	float: none !important;
	margin: 0 !important;
}

/* Single product ? layout shell (S1: grid buy-box, not WC float). */
body.single-product.woocommerce div.product {
	align-items: flex-start;
}

body.fwk-pdp.single-product .content-container,
body.fwk-pdp.single-product .woocommerce {
	max-width: 72rem;
}

body.single-product.woocommerce div.product .entry-summary,
body.single-product.woocommerce div.product .summary {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	max-width: 100%;
	box-sizing: border-box;
}

body.single-product.woocommerce div.product .entry-summary > *,
body.single-product.woocommerce div.product .summary > * {
	max-width: 100%;
}

body.single-product.woocommerce div.product div.images,
body.single-product.woocommerce div.product > .woocommerce-product-gallery {
	margin-block-end: var(--fwk-space-4);
	max-width: 100%;
}

/* Desktop/tablet: gallery | buy-box; SEO/related full width below. */
@media (min-width: 56.25em) {
	body.fwk-pdp.single-product.woocommerce div.product {
		display: grid;
		grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
		column-gap: var(--fwk-space-8);
		row-gap: var(--fwk-space-8);
		align-items: start;
	}

	/* WC clearfix ::after becomes an empty grid row (+ row-gap) after related. */
	body.fwk-pdp.single-product.woocommerce div.product::after {
		content: none;
		display: none;
		clear: none;
	}

	body.fwk-pdp.single-product.woocommerce div.product > div.images,
	body.fwk-pdp.single-product.woocommerce div.product > .woocommerce-product-gallery {
		grid-column: 1;
		grid-row: 1;
		width: 100% !important;
		max-width: none !important;
		float: none !important;
		margin: 0 !important;
	}

	body.fwk-pdp.single-product.woocommerce div.product > .entry-summary,
	body.fwk-pdp.single-product.woocommerce div.product > .summary {
		grid-column: 2;
		grid-row: 1;
		width: auto !important;
		max-width: none !important;
		float: none !important;
		margin: 0 !important;
	}

	body.fwk-pdp.single-product.woocommerce div.product > .woocommerce-tabs,
	body.fwk-pdp.single-product.woocommerce div.product > .fwk-pdp-accordion,
	body.fwk-pdp.single-product.woocommerce div.product > .fwk-pdp-info,
	body.fwk-pdp.single-product.woocommerce div.product > .fwk-section,
	body.fwk-pdp.single-product.woocommerce div.product > .fwk-benefits,
	body.fwk-pdp.single-product.woocommerce div.product > .fwk-benefits--pdp,
	body.fwk-pdp.single-product.woocommerce div.product > section.related,
	body.fwk-pdp.single-product.woocommerce div.product > .related.products,
	body.fwk-pdp.single-product.woocommerce div.product > .up-sells,
	body.fwk-pdp.single-product.woocommerce div.product > .upsells {
		grid-column: 1 / -1;
	}
}

/* Kit gallery: CLS-safe packshot + dense thumbs; mute WC zoom chrome.
   Targets both classic div.images wrap and gallery-as-direct-child. */
body.single-product.woocommerce div.product div.images .woocommerce-product-gallery,
body.single-product.woocommerce div.product > .woocommerce-product-gallery {
	opacity: 1 !important;
	position: relative;
}

body.single-product.woocommerce div.product div.images .woocommerce-product-gallery__trigger,
body.single-product.woocommerce div.product > .woocommerce-product-gallery .woocommerce-product-gallery__trigger {
	display: none !important;
}

/* PDP packshot uses --fwk-pdp-media-ratio (never card 5/2 or 3/1). */
body.single-product.woocommerce div.product div.images .woocommerce-product-gallery__wrapper,
body.single-product.woocommerce div.product div.images .woocommerce-product-gallery__image,
body.single-product.woocommerce div.product > .woocommerce-product-gallery .woocommerce-product-gallery__wrapper,
body.single-product.woocommerce div.product > .woocommerce-product-gallery .woocommerce-product-gallery__image {
	aspect-ratio: var(--fwk-pdp-media-ratio);
	max-width: 100%;
	min-width: 0;
}

body.single-product.woocommerce div.product div.images .woocommerce-product-gallery__wrapper,
body.single-product.woocommerce div.product > .woocommerce-product-gallery .woocommerce-product-gallery__wrapper {
	overflow: hidden;
}

body.single-product.woocommerce div.product div.images .woocommerce-product-gallery__image,
body.single-product.woocommerce div.product > .woocommerce-product-gallery .woocommerce-product-gallery__image {
	position: relative;
	/* LAW: no wash plate under packshot — share section/page plane. */
	background: transparent;
	border-radius: var(--fwk-radius-lg);
	overflow: hidden;
	isolation: isolate;
}

body.single-product.woocommerce div.product div.images .woocommerce-product-gallery__image img.zoomImg,
body.single-product.woocommerce div.product > .woocommerce-product-gallery .woocommerce-product-gallery__image img.zoomImg {
	max-width: none;
	pointer-events: none;
}

body.single-product.woocommerce div.product div.images .woocommerce-product-gallery__image a,
body.single-product.woocommerce div.product > .woocommerce-product-gallery .woocommerce-product-gallery__image a {
	display: block;
	height: 100%;
	cursor: zoom-in;
}

body.single-product.woocommerce div.product div.images .woocommerce-product-gallery__image img,
body.single-product.woocommerce div.product > .woocommerce-product-gallery .woocommerce-product-gallery__image img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	border-radius: var(--fwk-radius-lg);
	background: transparent;
}

/* Dense thumb strip. */
body.single-product.woocommerce div.product div.images ol.flex-control-thumbs,
body.single-product.woocommerce div.product div.images .flex-control-nav.flex-control-thumbs,
body.single-product.woocommerce div.product > .woocommerce-product-gallery ol.flex-control-thumbs,
body.single-product.woocommerce div.product > .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs {
	display: flex;
	flex-wrap: nowrap;
	align-items: stretch;
	justify-content: flex-start;
	gap: var(--fwk-space-1);
	margin: var(--fwk-space-2) 0 0;
	padding: 0;
	list-style: none;
	width: 100%;
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
}

body.single-product.woocommerce div.product div.images ol.flex-control-thumbs li,
body.single-product.woocommerce div.product div.images .flex-control-nav.flex-control-thumbs li,
body.single-product.woocommerce div.product > .woocommerce-product-gallery ol.flex-control-thumbs li,
body.single-product.woocommerce div.product > .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li {
	box-sizing: border-box;
	position: relative;
	/* ?44px tap: width ?4.25rem at thumb ratio 3/2 ? height ?44?48px. */
	width: clamp(4.25rem, 22vw, 5rem) !important;
	max-width: 5rem;
	min-height: 44px;
	flex: 0 0 auto !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
	aspect-ratio: var(--fwk-pdp-thumb-ratio);
	height: auto !important;
	background: transparent;
	border-radius: var(--fwk-radius-sm);
	overflow: hidden;
}

body.single-product.woocommerce div.product div.images ol.flex-control-thumbs li img,
body.single-product.woocommerce div.product div.images .flex-control-nav.flex-control-thumbs li img,
body.single-product.woocommerce div.product > .woocommerce-product-gallery ol.flex-control-thumbs li img,
body.single-product.woocommerce div.product > .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li img {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	border-radius: var(--fwk-radius-sm);
	border: 1px solid var(--fwk-color-border);
	opacity: 0.88;
	cursor: pointer;
	transition: opacity var(--fwk-duration) var(--fwk-ease), border-color var(--fwk-duration) var(--fwk-ease), transform var(--fwk-duration-fast) var(--fwk-ease-out);
}

body.single-product.woocommerce div.product div.images ol.flex-control-thumbs li img.flex-active,
body.single-product.woocommerce div.product div.images ol.flex-control-thumbs li:hover img,
body.single-product.woocommerce div.product div.images .flex-control-nav.flex-control-thumbs li img.flex-active,
body.single-product.woocommerce div.product div.images .flex-control-nav.flex-control-thumbs li:hover img,
body.single-product.woocommerce div.product > .woocommerce-product-gallery ol.flex-control-thumbs li img.flex-active,
body.single-product.woocommerce div.product > .woocommerce-product-gallery ol.flex-control-thumbs li:hover img,
body.single-product.woocommerce div.product > .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li img.flex-active,
body.single-product.woocommerce div.product > .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li:hover img {
	opacity: 1;
	border-color: var(--fwk-color-accent);
}

body.single-product.woocommerce div.product div.images ol.flex-control-thumbs li:hover img,
body.single-product.woocommerce div.product div.images .flex-control-nav.flex-control-thumbs li:hover img,
body.single-product.woocommerce div.product > .woocommerce-product-gallery ol.flex-control-thumbs li:hover img,
body.single-product.woocommerce div.product > .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li:hover img {
	transform: translateY(-1px);
}

@media (min-width: 48.01em) {
	body.single-product.woocommerce div.product div.images ol.flex-control-thumbs li,
	body.single-product.woocommerce div.product div.images .flex-control-nav.flex-control-thumbs li,
	body.single-product.woocommerce div.product > .woocommerce-product-gallery ol.flex-control-thumbs li,
	body.single-product.woocommerce div.product > .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li {
		width: clamp(4.75rem, 7.5vw, 6rem) !important;
		max-width: 6rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.single-product.woocommerce div.product div.images ol.flex-control-thumbs li img,
	body.single-product.woocommerce div.product div.images .flex-control-nav.flex-control-thumbs li img,
	body.single-product.woocommerce div.product > .woocommerce-product-gallery ol.flex-control-thumbs li img,
	body.single-product.woocommerce div.product > .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li img {
		transition: none;
		transform: none !important;
	}

	body.single-product.woocommerce div.product div.images ol.flex-control-thumbs li:hover img,
	body.single-product.woocommerce div.product div.images .flex-control-nav.flex-control-thumbs li:hover img,
	body.single-product.woocommerce div.product > .woocommerce-product-gallery ol.flex-control-thumbs li:hover img,
	body.single-product.woocommerce div.product > .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li:hover img {
		transform: none;
	}
}

/* Single product ? title, price, summary. */
.woocommerce div.product .product_title {
	font-family: var(--fwk-font-display);
	font-size: var(--fwk-text-2xl);
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 1.2;
	text-wrap: balance;
	margin-block-end: var(--fwk-space-3);
	color: var(--fwk-color-text);
}

.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce div.product .woocommerce-variation-price .price,
.woocommerce div.product .fwk-buy-bar__price .price {
	color: var(--fwk-color-text);
	font-size: var(--fwk-text-2xl);
	font-weight: 700;
	font-variant-numeric: tabular-nums lining-nums;
	margin: 0;
	display: inline-flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: var(--fwk-space-2);
}

/* Buy-bar price must stay one line (UA thousands space must not wrap). */
.woocommerce div.product .fwk-buy-bar__price .price,
.woocommerce div.product .fwk-buy-bar__price .woocommerce-Price-amount,
.woocommerce div.product .fwk-buy-bar__price .amount {
	flex-wrap: nowrap;
	white-space: nowrap;
}

.woocommerce div.product p.price del,
.woocommerce div.product .woocommerce-variation-price .price del,
.woocommerce div.product .fwk-buy-bar__price .price del {
	color: var(--fwk-color-muted);
	font-weight: 500;
	font-size: var(--fwk-text-lg);
}

.woocommerce div.product p.price ins,
.woocommerce div.product .woocommerce-variation-price .price ins,
.woocommerce div.product .fwk-buy-bar__price .price ins {
	color: var(--fwk-color-sale);
	text-decoration: none;
}

/* Variation template price is synced into buy bar — hide duplicate. */
.woocommerce div.product .single_variation_wrap .woocommerce-variation-price {
	display: none !important;
}

/* PDP summary head — stock · SKU · category + wishlist (above title). */
.fwk-pdp-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-3);
	margin: 0 0 var(--fwk-space-3);
	min-height: 2.75rem;
}

.fwk-pdp-head__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.3rem 0.55rem;
	min-width: 0;
	font-size: var(--fwk-text-sm);
	line-height: 1.3;
}

.fwk-pdp-head__sep {
	color: color-mix(in oklch, var(--fwk-color-muted) 55%, transparent);
	font-weight: 400;
	user-select: none;
}

.fwk-pdp-stock {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	margin: 0;
	font-size: inherit;
	font-weight: 600;
	letter-spacing: 0.01em;
}

.fwk-pdp-stock__dot {
	width: 0.45rem;
	height: 0.45rem;
	border-radius: 50%;
	flex: 0 0 auto;
	background: currentColor;
}

.fwk-pdp-stock--in {
	color: var(--fwk-color-selected, oklch(45% 0.12 145));
}

.fwk-pdp-stock--out {
	color: var(--fwk-color-muted);
}

/* SKU: reference code — muted label, tabular value. */
.fwk-pdp-head__sku {
	display: inline-flex;
	align-items: baseline;
	gap: 0.3rem;
	color: var(--fwk-color-muted);
	font-variant-numeric: tabular-nums lining-nums;
}

.fwk-pdp-head__sku-label {
	font-weight: 500;
}

.fwk-pdp-head__sku-value {
	font-weight: 600;
	color: var(--fwk-color-text);
}

.fwk-pdp-head__wish {
	flex: 0 0 auto;
	margin-inline-start: auto;
}

/* Beat card absolute positioning when heart sits in the summary head. */
.fwk-pdp-head__wish .fwk-wishlist-toggle--card.fwk-wishlist-toggle--pdp-head {
	position: relative;
	top: auto;
	right: auto;
	z-index: auto;
	display: inline-grid;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	border-radius: var(--fwk-radius-control);
	opacity: 0.85;
	color: var(--fwk-color-muted);
	background: transparent;
	box-shadow: none;
}

.fwk-pdp-head__wish .fwk-wishlist-toggle--card.fwk-wishlist-toggle--pdp-head:hover,
.fwk-pdp-head__wish .fwk-wishlist-toggle--card.fwk-wishlist-toggle--pdp-head:focus-visible {
	opacity: 1;
	color: var(--fwk-color-text);
	background: var(--fwk-color-sunken, oklch(96% 0.005 250));
}

.fwk-pdp-head__wish .fwk-wishlist-toggle--card.fwk-wishlist-toggle--pdp-head.is-active {
	opacity: 1;
	color: oklch(55% 0.22 25);
}

.fwk-pdp-price-meta {
	margin: 0 0 var(--fwk-space-4);
}

.woocommerce div.product .woocommerce-product-details__short-description {
	max-width: 40rem;
	font-size: var(--fwk-text-sm);
	line-height: 1.55;
	color: var(--fwk-color-muted);
	margin-block-end: var(--fwk-space-4);
}

.woocommerce div.product .woocommerce-product-details__short-description p {
	margin: 0;
	font: inherit;
	color: inherit;
}

.woocommerce div.product .woocommerce-product-details__short-description p + p {
	margin-block-start: var(--fwk-space-2);
}

/* Default WC product_meta removed from PDP; keep quiet fallback if re-enabled. */
.woocommerce div.product .product_meta {
	display: none;
}

/* Size grid — vertical stack (spacing SSOT). */
.fwk-sizes {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: var(--fwk-space-2);
	margin-block: var(--fwk-space-4);
}

.fwk-sizes__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-3);
	margin: 0;
}

.fwk-sizes__head > .fwk-sizechart-trigger {
	flex: 0 0 auto;
	min-height: 0;
	align-items: center;
	align-self: center;
	line-height: 1.3;
}

.fwk-sizes__label {
	flex: 1 1 auto;
	min-width: 0;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	line-height: 1.3;
	color: var(--fwk-color-text);
}

/* Underline chips — denser strip, PLP-aligned visual language. */
.fwk-sizes__grid {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: var(--fwk-space-1);
	width: 100%;
	min-width: 0;
	margin: 0;
	justify-content: start;
}

/* Kids scale switcher (CF-5.1k) — radiogroup, not tablist.
   Also carries `.fwk-filters__segment` (2-col default) — win with higher specificity. */
.fwk-sizes__scale,
.fwk-sizes__scale.fwk-filters__segment {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--fwk-space-2);
	margin: 0;
	padding: 3px;
	border: 1px solid var(--fwk-color-border);
	border-radius: var(--fwk-radius-md);
	background: var(--fwk-color-sunken);
}

.fwk-sizes__scale .fwk-filters__segment-btn {
	min-height: 44px;
	min-width: 0;
}

/* U9c SizeConfirm — quiet post-select status (no card chrome). */
.fwk-sizes__chosen {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--fwk-space-3);
	margin: 0;
	padding-block-start: var(--fwk-space-2);
	border-block-start: 1px solid var(--fwk-color-border);
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-text);
	line-height: 1.4;
	min-height: calc(1em * 1.4 + var(--fwk-space-2));
}

.fwk-sizes__chosen-primary {
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	color: var(--fwk-color-text);
}

.fwk-sizes__chosen-sep {
	color: var(--fwk-color-muted);
	user-select: none;
}

.fwk-sizes__chosen-meta {
	font-weight: 400;
	font-variant-numeric: tabular-nums;
	color: var(--fwk-color-muted);
	min-width: 0;
}

.fwk-sizes__chosen-pair {
	display: inline-flex;
	align-items: center;
	gap: var(--fwk-space-2);
	min-width: 0;
}

.fwk-sizes__chosen-label {
	flex: 0 0 auto;
	font-weight: 400;
	color: var(--fwk-color-muted);
	font-size: var(--fwk-text-sm);
}

/* Size Honesty: foot mm + stamp chips. */
.fwk-sizes__foot-chip,
.fwk-sizes__us-chip {
	flex: 0 0 auto;
	align-self: center;
	min-height: 32px;
	padding: var(--fwk-space-1) var(--fwk-space-3);
	font-size: var(--fwk-text-xs);
	font-variant-numeric: tabular-nums;
	cursor: pointer;
}

/* Empty-state: no reserved height (density first; small jump on first select OK). */
.fwk-sizes__chosen[hidden] {
	display: none !important;
	visibility: hidden;
	pointer-events: none;
	min-height: 0;
	padding: 0;
	border: 0;
	margin: 0;
}

.fwk-sizes__chosen:not([hidden]) {
	display: flex;
	visibility: visible;
}

/* Instant label swap ? keep cell size stable (CLS ? 0). */
.fwk-sizes[data-size-group="kids"] .fwk-size__label {
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.fwk-sizes[data-active-scale="mm"] .fwk-size {
	font-size: var(--fwk-text-xs);
}

@media (prefers-reduced-motion: reduce) {
	.fwk-sizes__scale .fwk-filters__segment-btn,
	.fwk-sizes[data-size-group="kids"] .fwk-size__label {
		transition: none;
	}
}

/* === UIK: Size button (U9 underline chip, PLP-aligned) ===================== */
.fwk-size {
	display: inline-flex;
	align-items: flex-end;
	justify-content: center;
	flex: 0 0 auto;
	width: auto;
	max-width: 100%;
	min-width: 0;
	min-height: 44px;
	padding: 0 var(--fwk-space-2) 2px;
	border: 0;
	border-bottom: 2px solid color-mix(in oklch, var(--fwk-color-text) 12%, transparent);
	border-radius: 0;
	background: transparent;
	color: var(--fwk-color-text);
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	cursor: pointer;
	transition: border-color var(--fwk-duration) var(--fwk-ease), color var(--fwk-duration) var(--fwk-ease), box-shadow var(--fwk-duration) var(--fwk-ease);
}

.fwk-size__label {
	line-height: 1;
	pointer-events: none;
}

.fwk-size:hover:not([disabled]):not(.fwk-size--unavailable):not([aria-pressed="true"]):not(.is-pressed):not(.is-selected) {
	border-bottom-color: color-mix(in oklch, var(--fwk-color-text) 28%, transparent);
	background: transparent;
	color: var(--fwk-color-text);
}

.fwk-size:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
}

.fwk-size:active:not([disabled]):not(.fwk-size--unavailable) {
	transform: none;
}

/* pressed = selected — green text + underline (no fill box) */
.fwk-size[aria-pressed="true"],
.fwk-size[aria-pressed="true"]:hover,
.fwk-size[aria-pressed="true"]:focus-visible,
.fwk-size.is-pressed,
.fwk-size.is-pressed:hover,
.fwk-size.is-selected,
.fwk-size.is-selected:hover {
	background: transparent;
	border-bottom-color: var(--fwk-color-selected);
	color: var(--fwk-color-selected);
}

/* OOS / unavailable */
.fwk-size[disabled],
.fwk-size--unavailable,
.fwk-size--oos,
.fwk-size.is-oos {
	color: var(--fwk-color-disabled);
	border-bottom-style: dashed;
	border-bottom-color: color-mix(in oklch, var(--fwk-color-disabled) 45%, transparent);
	cursor: not-allowed;
	text-decoration: line-through;
}

/* Hide native size dropdown when the button grid is active (source of truth stays in DOM). */
.fwk-has-size-grid form.variations_form table.variations,
.fwk-has-size-grid form.variations_form .variations select,
.fwk-has-size-grid form.variations_form select[name^="attribute_"] {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	clip-path: inset(50%) !important;
	white-space: nowrap !important;
	border: 0 !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

/* Add-to-cart — buy bar unites price + qty + ATC (after size). */
body.single-product.woocommerce div.product form.cart {
	display: block;
	margin-block: var(--fwk-space-5) 0;
}

body.single-product.woocommerce div.product form.cart .variations {
	margin-bottom: 0;
	border: 0;
}

body.single-product.woocommerce div.product form.cart .woocommerce-variation-add-to-cart,
body.single-product.woocommerce div.product form.cart:not(.variations_form) {
	display: block;
	margin-top: 0;
}

body.single-product.woocommerce div.product form.cart .woocommerce-variation-add-to-cart::after {
	display: none;
	content: none;
}

/*
 * Buy bar — borderless composition (minimalism / U14 spirit).
 * Price = type · qty = quiet sunken tool · CTA = only filled object.
 * No card chrome (border / surface plate / padded box).
 */
.fwk-buy-bar {
	display: grid;
	grid-template-columns: minmax(10rem, max-content) minmax(0, 1fr);
	align-items: center;
	gap: var(--fwk-space-5);
	margin-block-start: var(--fwk-space-5);
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

.fwk-buy-bar__price {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: var(--fwk-space-2) var(--fwk-space-3);
	min-width: 0;
}

.fwk-buy-bar__sale {
	flex: 0 0 auto;
}

.fwk-buy-bar__actions {
	display: flex;
	flex-wrap: nowrap;
	align-items: stretch;
	gap: var(--fwk-space-3);
	min-width: 0;
}

body.single-product.woocommerce div.product form.cart .fwk-buy-bar__actions .quantity,
body.single-product.woocommerce div.product form.cart .fwk-buy-bar__actions .fwk-qty,
body.single-product.woocommerce div.product form.cart .woocommerce-variation-add-to-cart .quantity,
body.single-product.woocommerce div.product form.cart:not(.variations_form) .quantity {
	float: none;
	width: auto;
	margin: 0;
	padding: 0;
	flex: 0 0 auto;
	display: inline-flex;
	align-items: stretch;
	border: 0;
	border-radius: var(--fwk-radius-sm);
	background: var(--fwk-color-sunken);
	overflow: hidden;
	box-shadow: none;
	transition: opacity 160ms ease;
}

/* Demote qty until size is chosen — CTA owns attention. */
.fwk-buy-bar[data-ready='0'] .fwk-buy-bar__actions .quantity,
.fwk-buy-bar[data-ready='0'] .fwk-buy-bar__actions .fwk-qty {
	opacity: 0.42;
}

body.single-product.woocommerce div.product form.cart .fwk-buy-bar__actions .quantity .qty,
body.single-product.woocommerce div.product form.cart .woocommerce-variation-add-to-cart .quantity .qty,
body.single-product.woocommerce div.product form.cart:not(.variations_form) .quantity .qty {
	width: 2.75rem;
	min-width: 2.75rem;
	height: auto;
	min-height: 48px;
	border: 0;
	border-inline: 0;
	text-align: center;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	background: transparent;
	box-shadow: none;
}

/* Quiet +/- inside sunken qty — no nested fills / hairlines. */
.fwk-buy-bar .fwk-qty__btn {
	background: transparent;
	color: var(--fwk-color-muted);
}

.fwk-buy-bar .fwk-qty__btn:hover,
.fwk-buy-bar .fwk-qty__btn:focus-visible {
	background: color-mix(in oklch, var(--fwk-color-text) 6%, transparent);
	color: var(--fwk-color-text);
}

.fwk-buy-bar .fwk-qty__input,
.fwk-buy-bar .fwk-qty .qty {
	border-inline: 0 !important;
	background: transparent !important;
}

body.single-product.woocommerce div.product form.cart .fwk-buy-bar__actions .button.single_add_to_cart_button,
body.single-product.woocommerce div.product form.cart .woocommerce-variation-add-to-cart .button.single_add_to_cart_button,
body.single-product.woocommerce div.product form.cart:not(.variations_form) .button.single_add_to_cart_button {
	float: none;
	width: auto;
	flex: 1 1 auto;
	min-height: 48px;
	height: auto;
	line-height: 1.2;
	padding: var(--fwk-space-3) var(--fwk-space-5);
	min-width: min(100%, 9rem);
	white-space: nowrap;
	border: 0;
	box-shadow: none;
}

/* Need-size CTA: Action ink (same as ready ATC), not Accent sky / washed disabled. */
body.single-product.woocommerce div.product form.cart .fwk-buy-bar__actions .button.single_add_to_cart_button.is-need-size,
body.single-product.woocommerce div.product form.cart .woocommerce-variation-add-to-cart .button.single_add_to_cart_button.is-need-size {
	opacity: 1;
	cursor: pointer;
	pointer-events: auto;
	background: var(--fwk-button-ink);
	color: var(--fwk-color-on-cta);
	border-color: transparent;
}

body.single-product.woocommerce div.product form.cart .fwk-buy-bar__actions .button.single_add_to_cart_button.is-need-size:hover,
body.single-product.woocommerce div.product form.cart .fwk-buy-bar__actions .button.single_add_to_cart_button.is-need-size:focus-visible,
body.single-product.woocommerce div.product form.cart .woocommerce-variation-add-to-cart .button.single_add_to_cart_button.is-need-size:hover,
body.single-product.woocommerce div.product form.cart .woocommerce-variation-add-to-cart .button.single_add_to_cart_button.is-need-size:focus-visible {
	background: var(--fwk-button-ink-hover);
	color: var(--fwk-color-on-cta);
}

.woocommerce div.product form.cart .quantity {
	display: inline-flex;
	align-items: stretch;
	border: 0;
	border-radius: var(--fwk-radius-sm);
	background: var(--fwk-color-sunken);
	overflow: hidden;
	box-shadow: none;
}

.woocommerce div.product form.cart .quantity input.qty {
	width: 3.5rem;
	min-height: 44px;
	border: 0;
	text-align: center;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	background: transparent;
}

@media (max-width: 40em) {
	.fwk-buy-bar {
		grid-template-columns: 1fr;
		align-items: stretch;
		gap: var(--fwk-space-3);
	}

	.fwk-buy-bar__actions {
		width: 100%;
	}
}

/* Empty-size submit nudge (P-P1-5). */
@keyframes fwk-size-nudge {
	0%,
	100% {
		transform: translateX(0);
	}
	20% {
		transform: translateX(-4px);
	}
	40% {
		transform: translateX(4px);
	}
	60% {
		transform: translateX(-3px);
	}
	80% {
		transform: translateX(3px);
	}
}

.fwk-sizes.is-nudge .fwk-sizes__grid {
	animation: fwk-size-nudge 0.45s ease;
}

.fwk-sizes.is-nudge .fwk-size:not([disabled]):not(.fwk-size--unavailable):not(.fwk-size--oos):not(.is-oos) {
	border-bottom-color: var(--fwk-color-accent);
}

@media (prefers-reduced-motion: reduce) {
	.fwk-sizes.is-nudge .fwk-sizes__grid {
		animation: none;
	}

	.fwk-sizes.is-nudge .fwk-size:not([disabled]):not(.fwk-size--oos):not(.fwk-size--unavailable):not(.is-oos) {
		outline: 2px solid var(--fwk-color-accent);
		outline-offset: 2px;
	}
}

/* PDP Product Info Hybrid — U25 Specs + U17 section accordion (not clamp-wall / not dual tabs). */
.fwk-pdp-info {
	margin-block-start: var(--fwk-space-8);
	margin-block-end: var(--fwk-space-6);
	padding-block-start: var(--fwk-space-6);
	border-block-start: 1px solid var(--fwk-color-border);
}

.fwk-pdp-info > * + * {
	margin-block-start: var(--fwk-space-8);
	padding-block-start: var(--fwk-space-6);
	border-block-start: 1px solid var(--fwk-color-border);
}

/* U25 Specs — product facts (stacked dt→dd), storefront + /ui-kit/. */
.fwk-specs {
	max-width: 52rem;
}

/* Shared section label — Specs + Story (Product Info Hybrid). */
.fwk-specs__title,
.fwk-pdp-story__title {
	margin: 0 0 var(--fwk-space-4);
	font-family: var(--fwk-font, inherit);
	font-size: var(--fwk-text-xs);
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--fwk-color-muted);
}

.fwk-specs__list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
	gap: var(--fwk-space-6) var(--fwk-space-8);
	margin: 0;
	max-width: 52rem;
}

.fwk-specs__row {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--fwk-space-1);
	padding-block: 0;
	border-block-end: 0;
	min-width: 0;
}

.fwk-specs__term {
	margin: 0;
	font-size: var(--fwk-text-xs);
	font-weight: 500;
	line-height: 1.35;
	color: var(--fwk-color-muted);
}

.fwk-specs__value {
	margin: 0;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	line-height: 1.4;
	color: var(--fwk-color-text);
	overflow-wrap: break-word;
}

.fwk-specs__value p {
	margin: 0;
	font: inherit;
	font-weight: inherit;
	color: inherit;
}

.fwk-specs__value a {
	color: var(--fwk-color-accent);
	text-decoration: underline;
	text-underline-offset: 0.12em;
}

/* Story — lead + U17 section accordion. */
.fwk-pdp-story {
	position: relative;
	max-width: 42rem;
}

.fwk-pdp-story__lead {
	margin: 0 0 var(--fwk-space-5);
	font-size: var(--fwk-text-base);
	line-height: 1.7;
	color: color-mix(in oklch, var(--fwk-color-text) 88%, var(--fwk-color-muted));
}

.fwk-pdp-story__lead p {
	margin: 0 0 var(--fwk-space-4);
	font: inherit;
	color: inherit;
}

.fwk-pdp-story__lead p:last-child {
	margin-block-end: 0;
}

/* Benefit chips — Phase 6a from «Переваги моделі» ul/li (theme markup, not Hub classes). */
.fwk-benefit-chips {
	display: flex;
	flex-wrap: wrap;
	gap: var(--fwk-space-2);
	margin: 0 0 var(--fwk-space-5);
	padding: 0;
	list-style: none;
	max-width: 42rem;
}

.fwk-benefit-chip {
	margin: 0;
	padding: var(--fwk-space-2) var(--fwk-space-3);
	border: 1px solid var(--fwk-color-border);
	border-radius: var(--fwk-radius-sm);
	background: var(--fwk-color-surface);
	color: color-mix(in oklch, var(--fwk-color-text) 88%, var(--fwk-color-muted));
	font-size: var(--fwk-text-sm);
	font-weight: 500;
	line-height: 1.35;
}

/* PDP description accordion (U17 scoped under Product Info). */
.fwk-pdp-info .fwk-pdp-accordion {
	margin: 0;
	max-width: 42rem;
	border-block-start: 1px solid var(--fwk-color-border);
}

.fwk-pdp-info .fwk-pdp-accordion__item {
	border-block-end: 1px solid var(--fwk-color-border);
}

.fwk-pdp-info .fwk-pdp-accordion__heading {
	margin: 0;
	font-size: inherit;
	font-weight: inherit;
}

.fwk-pdp-info .fwk-pdp-accordion__trigger,
.fwk-pdp-info button.fwk-btn-plain.fwk-accordion__trigger.fwk-pdp-accordion__trigger {
	min-height: 48px;
	padding-block: var(--fwk-space-4);
	font-size: var(--fwk-text-base);
	font-weight: 600;
	text-align: start;
}

.fwk-pdp-info .fwk-pdp-accordion__panel {
	font-size: var(--fwk-text-base);
	line-height: 1.65;
	color: var(--fwk-color-text);
}

.fwk-pdp-info .fwk-pdp-accordion__body {
	max-width: 42rem;
	padding: 0 0 var(--fwk-space-5);
	color: var(--fwk-color-text);
}

/* Legacy clamp story (UI Kit demo only) + shared body typography. */
.fwk-pdp-story__body {
	font-size: var(--fwk-text-base);
	line-height: 1.65;
	color: var(--fwk-color-text);
}

.fwk-pdp-story__body[data-fwk-clamp]:not(.is-expanded) {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 8;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(
		to bottom,
		#000 0%,
		#000 62%,
		transparent 100%
	);
	mask-image: linear-gradient(
		to bottom,
		#000 0%,
		#000 62%,
		transparent 100%
	);
}

.fwk-pdp-story.is-expanded .fwk-pdp-story__body,
.fwk-pdp-story__body.is-expanded {
	display: block;
	-webkit-line-clamp: unset;
	overflow: visible;
	-webkit-mask-image: none;
	mask-image: none;
}

.fwk-pdp-story__more {
	margin-block-start: var(--fwk-space-3);
	padding: var(--fwk-space-2) 0;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	letter-spacing: 0.01em;
	color: var(--fwk-color-accent);
	text-decoration: underline;
	text-underline-offset: 0.16em;
	text-decoration-thickness: 1px;
}

.fwk-pdp-story__more:hover {
	color: var(--fwk-color-text);
	background: transparent;
}

.fwk-pdp-story__more:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
	border-radius: var(--fwk-radius-control);
}

.fwk-pdp-story__more[hidden] {
	display: none !important;
}

/* SEO description typography (accordion body + legacy story / UI Kit). */
.fwk-pdp-info .fwk-pdp-accordion__body p,
.fwk-pdp-story__body p {
	margin: 0 0 var(--fwk-space-4);
	color: var(--fwk-color-text);
	font: inherit;
	font-size: var(--fwk-text-base);
	line-height: 1.65;
}

.fwk-pdp-info .fwk-pdp-accordion__body p:last-child,
.fwk-pdp-story__body p:last-child {
	margin-block-end: 0;
}

.fwk-pdp-info .fwk-pdp-accordion__body h3,
.fwk-pdp-story__body h3 {
	margin: var(--fwk-space-5) 0 var(--fwk-space-3);
	font-family: var(--fwk-font, inherit);
	font-size: var(--fwk-text-lg);
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: 0.01em;
	color: var(--fwk-color-text);
}

.fwk-pdp-info .fwk-pdp-accordion__body h4,
.fwk-pdp-story__body h4 {
	margin: var(--fwk-space-4) 0 var(--fwk-space-2);
	font-size: var(--fwk-text-base);
	font-weight: 600;
	line-height: 1.35;
	color: var(--fwk-color-text);
}

.fwk-pdp-info .fwk-pdp-accordion__body ul,
.fwk-pdp-info .fwk-pdp-accordion__body ol,
.fwk-pdp-story__body ul,
.fwk-pdp-story__body ol {
	margin: 0 0 var(--fwk-space-4);
	padding-inline-start: 1.25em;
	list-style: disc;
}

.fwk-pdp-info .fwk-pdp-accordion__body ul,
.fwk-pdp-story__body ul {
	list-style: none;
	padding-inline-start: 0;
}

.fwk-pdp-info .fwk-pdp-accordion__body ul > li,
.fwk-pdp-story__body ul > li {
	position: relative;
	padding-inline-start: 1.15em;
}

.fwk-pdp-info .fwk-pdp-accordion__body ul > li::before,
.fwk-pdp-story__body ul > li::before {
	content: '';
	position: absolute;
	inset-inline-start: 0.15em;
	top: 0.55em;
	width: 0.35em;
	height: 0.35em;
	border-radius: 50%;
	background: color-mix(in oklch, var(--fwk-color-accent) 70%, var(--fwk-color-muted));
}

.fwk-pdp-info .fwk-pdp-accordion__body ol,
.fwk-pdp-story__body ol {
	list-style: decimal;
}

.fwk-pdp-info .fwk-pdp-accordion__body li,
.fwk-pdp-story__body li {
	margin-block: 0.4em;
	line-height: 1.55;
	color: var(--fwk-color-text);
	font-size: var(--fwk-text-sm);
}

.fwk-pdp-info .fwk-pdp-accordion__body li strong,
.fwk-pdp-story__body li strong {
	font-weight: 600;
}

.fwk-pdp-info .fwk-pdp-accordion__body table,
.fwk-pdp-story__body table {
	width: 100%;
	max-width: 100%;
	min-width: 0;
	margin: 0 0 var(--fwk-space-5);
	border-collapse: collapse;
	font-size: var(--fwk-text-sm);
	overflow-wrap: break-word;
}

.fwk-pdp-info .fwk-pdp-accordion__body th,
.fwk-pdp-info .fwk-pdp-accordion__body td,
.fwk-pdp-story__body th,
.fwk-pdp-story__body td {
	padding: var(--fwk-space-2) var(--fwk-space-3);
	border-bottom: 1px solid var(--fwk-color-border);
	text-align: start;
	vertical-align: top;
}

.fwk-pdp-info .fwk-pdp-accordion__body thead th,
.fwk-pdp-story__body thead th {
	background: var(--fwk-color-sunken);
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	color: var(--fwk-color-text);
}

.fwk-pdp-info .fwk-pdp-accordion__body td:first-child,
.fwk-pdp-story__body td:first-child {
	font-weight: 600;
}

.fwk-pdp-info .fwk-pdp-accordion__body hr,
.fwk-pdp-story__body hr {
	margin: var(--fwk-space-5) 0;
	border: 0;
	border-top: 1px solid var(--fwk-color-border);
}

.fwk-pdp-info .fwk-pdp-accordion__body > h2:first-child,
.fwk-pdp-story__body > h2:first-child {
	display: none;
}

@media (max-width: 767px) {
	.fwk-specs__list {
		grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
		gap: var(--fwk-space-5) var(--fwk-space-6);
	}

	.fwk-pdp-info .fwk-pdp-accordion__body h3,
	.fwk-pdp-story__body h3 {
		font-size: var(--fwk-text-base);
		font-weight: 700;
	}

	.fwk-pdp-info .fwk-pdp-accordion__body h4,
	.fwk-pdp-story__body h4 {
		font-size: var(--fwk-text-sm);
		font-weight: 600;
	}

	.fwk-pdp-info .fwk-pdp-accordion__body table,
	.fwk-pdp-story__body table {
		table-layout: fixed;
	}

	.fwk-pdp-info .fwk-pdp-accordion__body td:first-child,
	.fwk-pdp-info .fwk-pdp-accordion__body th:first-child,
	.fwk-pdp-story__body td:first-child,
	.fwk-pdp-story__body th:first-child {
		width: 38%;
	}
}

/* Legacy WC tablist (if a plugin re-enables tabs.php). */
.woocommerce div.product .woocommerce-tabs ul.tabs {
	display: flex;
	flex-wrap: wrap;
	gap: var(--fwk-space-1);
	padding: var(--fwk-space-1);
	margin: 0 0 var(--fwk-space-6);
	list-style: none;
	border: 0;
	border-radius: var(--fwk-radius-md);
	background: var(--fwk-color-sunken);
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs::after {
	display: none;
	content: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	border-radius: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
	display: none;
	content: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	display: block;
	min-height: 40px;
	padding: var(--fwk-space-2) var(--fwk-space-5);
	border-radius: var(--fwk-radius-control);
	font-weight: 600;
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-muted);
	text-decoration: none;
	line-height: 1.4;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:focus-visible {
	color: var(--fwk-color-text);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	color: var(--fwk-color-text);
	background: var(--fwk-color-surface);
	box-shadow: var(--fwk-shadow-sm);
}

.woocommerce div.product .woocommerce-tabs .panel {
	font-size: var(--fwk-text-base);
	line-height: 1.65;
	color: var(--fwk-color-text);
	max-width: 48rem;
	padding: 0;
	margin: 0;
	border: 0;
	background: transparent;
}

.woocommerce div.product .woocommerce-tabs .panel h2:first-child {
	display: none;
}

/* PDP Croslite — full-bleed plane, flush into related (no border / gutter / seam). */
.fwk-benefits--pdp {
	position: relative;
	isolation: isolate;
	width: 100vw;
	max-width: 100vw;
	margin-inline: calc(50% - 50vw);
	margin-block: 0;
	margin-block-end: 80px;
	box-sizing: border-box;
	padding-block: clamp(2rem, 1.25rem + 2.5vw, 3rem);
	/* Content inset = plane token (aligns with related / site chrome). */
	padding-inline: var(--fwk-plane-inline);
	border: 0;
	border-block: 0;
	background:
		radial-gradient(ellipse 60% 45% at 8% 0%, color-mix(in oklch, var(--fwk-sky-100) 65%, transparent), transparent 68%),
		var(--fwk-plane-products);
}

.fwk-benefits--pdp > .fwk-container {
	position: relative;
	z-index: 1;
	/* Section already owns --fwk-plane-inline — avoid double gutter. */
	max-width: 72rem;
	padding-inline: 0;
}

/* Related immediately under benefits: shared product plane. */
body.single-product.woocommerce div.product > .fwk-benefits--pdp + section.related.products,
body.single-product.woocommerce div.product > .fwk-benefits--pdp + .related.products {
	margin-block-start: 0;
	padding-block-start: var(--fwk-space-6);
	border-block-start: 0;
	background: var(--fwk-plane-products);
}

/* Cancel PDP grid row-gap so benefits margin-block-end (80px) is the true gap. */
@media (min-width: 56.25em) {
	body.fwk-pdp.single-product.woocommerce div.product > .fwk-benefits--pdp + section.related.products,
	body.fwk-pdp.single-product.woocommerce div.product > .fwk-benefits--pdp + .related.products {
		margin-block-start: calc(-1 * var(--fwk-space-8));
	}
}

.fwk-benefits--pdp .fwk-benefits__eyebrow {
	margin: 0 0 var(--fwk-space-2);
	font-size: var(--fwk-text-xs);
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--fwk-color-accent);
}

.fwk-benefits--pdp .fwk-benefits__heading {
	margin: 0 0 var(--fwk-space-6);
	font: var(--fwk-type-title);
	font-size: var(--fwk-text-xl);
	letter-spacing: -0.02em;
	max-width: 28rem;
}

.fwk-benefits__proof--pdp {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
	gap: var(--fwk-space-6);
	list-style: none;
	margin: 0;
	padding: 0;
}

.fwk-benefits__proof--pdp .fwk-benefits__proof-item {
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
}

.fwk-benefits__proof--pdp .fwk-benefits__stat {
	display: block;
	font-family: var(--fwk-font-display);
	font-size: var(--fwk-text-xl);
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--fwk-color-accent);
	line-height: 1.15;
}

.fwk-benefits__proof--pdp .fwk-benefits__proof-title {
	display: block;
	margin-block: var(--fwk-space-2) var(--fwk-space-1);
	font-family: var(--fwk-font-display);
	font-size: var(--fwk-text-base);
	font-weight: 700;
	color: var(--fwk-color-text);
}

.fwk-benefits__proof--pdp .fwk-benefits__proof-text {
	margin: 0;
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-muted);
	line-height: 1.45;
}

/* U14 Feedback v4 Borderless — toast (overlay) + WC inline notices (ink only) */
.fwk-toast-region {
	position: fixed;
	inset-inline-end: var(--fwk-space-4);
	bottom: calc(
		var(--fwk-space-4) + var(--fwk-cookie-bar-offset, 0px) + env(safe-area-inset-bottom)
	);
	/* Above cookie bar (same base --fwk-z-toast); below modal. */
	z-index: calc(var(--fwk-z-toast, 400) + 1);
	display: grid;
	gap: var(--fwk-space-2);
	width: min(22rem, calc(100vw - 2rem));
	pointer-events: none;
}

body.fwk-has-sticky-atc .fwk-toast-region {
	bottom: calc(
		5.75rem + var(--fwk-cookie-bar-offset, 0px) + env(safe-area-inset-bottom)
	);
}

body.fwk-has-dock:not(.fwk-has-sticky-atc):not(.fwk-dock-suppressed):not(.fwk-dock-suppressed-filters) .fwk-toast-region {
	bottom: calc(
		4.5rem + var(--fwk-cookie-bar-offset, 0px) + env(safe-area-inset-bottom)
	);
}

/* Shared notice chrome (toast + WC). Beat Kadence `.woocommerce .woocommerce-*`
   (blue left bar + palette7 bg). U14 v4 Borderless — ink + copy, no fills/borders. */
.fwk-notice,
.fwk-toast,
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error,
.woocommerce-page .woocommerce-message,
.woocommerce-page .woocommerce-info,
.woocommerce-page .woocommerce-error,
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info,
.woocommerce-notices-wrapper .woocommerce-error {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--fwk-space-3);
	padding: var(--fwk-space-3) 0;
	margin: 0 0 var(--fwk-space-4);
	border-radius: 0;
	/* Kill Kadence 5px colored border-left + any hairline box. */
	border: 0 !important;
	border-inline-start: 0 !important;
	background: transparent !important;
	color: var(--fwk-color-text);
	box-shadow: none;
	list-style: none;
	position: relative;
}

/* Inline WC: typography row only (no sunken plate / no outline). */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error,
.woocommerce-page .woocommerce-message,
.woocommerce-page .woocommerce-info,
.woocommerce-page .woocommerce-error,
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info,
.woocommerce-notices-wrapper .woocommerce-error {
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	line-height: 1.35;
	background: transparent !important;
}

.fwk-toast {
	justify-content: flex-start;
	margin: 0;
	padding: var(--fwk-space-3) var(--fwk-space-4);
	flex-wrap: nowrap;
	border-radius: var(--fwk-radius-md);
	background: var(--fwk-color-surface) !important;
	box-shadow: var(--fwk-shadow-lg);
	pointer-events: auto;
	animation: fwk-toast-in var(--fwk-duration-slow) var(--fwk-ease-out);
}

/* Type modifiers: same chrome; semantics via icon/copy only. */
.fwk-notice--success,
.fwk-toast--success,
.fwk-notice--neutral,
.fwk-toast--neutral,
.fwk-notice--info,
.fwk-toast--info,
.woocommerce-message,
.woocommerce .woocommerce-message,
.woocommerce-page .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-info,
.woocommerce .woocommerce-info,
.woocommerce-page .woocommerce-info,
.woocommerce-notices-wrapper .woocommerce-info {
	color: var(--fwk-color-text);
}

.fwk-toast--success,
.fwk-toast--neutral,
.fwk-toast--info {
	background: var(--fwk-color-surface) !important;
}

.fwk-notice--danger,
.fwk-toast--danger,
.fwk-toast--error,
.woocommerce-error,
.woocommerce .woocommerce-error,
.woocommerce-page .woocommerce-error,
.woocommerce-notices-wrapper .woocommerce-error {
	background: transparent !important;
	color: color-mix(in oklch, var(--fwk-color-danger) 70%, var(--fwk-color-text));
}

.fwk-toast--danger,
.fwk-toast--error {
	background: var(--fwk-color-surface) !important;
	color: color-mix(in oklch, var(--fwk-color-danger) 70%, var(--fwk-color-text));
}

.fwk-toast--danger .fwk-toast__msg,
.fwk-toast--error .fwk-toast__msg {
	color: color-mix(in oklch, var(--fwk-color-danger) 70%, var(--fwk-color-text));
}

.woocommerce-error,
.woocommerce .woocommerce-error,
.woocommerce-page .woocommerce-error,
.woocommerce-notices-wrapper .woocommerce-error {
	color: color-mix(in oklch, var(--fwk-color-danger) 70%, var(--fwk-color-text));
}

/* Inline WC notice CTA → toast-style text link (minimal, not Kadence float button). */
.woocommerce .woocommerce-message .button,
.woocommerce .woocommerce-info .button,
.woocommerce .woocommerce-error .button,
.woocommerce-page .woocommerce-message .button,
.woocommerce-page .woocommerce-info .button,
.woocommerce-page .woocommerce-error .button,
.woocommerce-notices-wrapper .woocommerce-message .button,
.woocommerce-notices-wrapper .woocommerce-info .button,
.woocommerce-notices-wrapper .woocommerce-error .button {
	float: none;
	margin: 0;
	margin-inline-start: auto;
	min-height: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--fwk-color-accent);
	font-size: var(--fwk-text-xs);
	font-weight: 700;
	line-height: 1.35;
	box-shadow: none;
	text-decoration: none;
	white-space: nowrap;
}

.woocommerce .woocommerce-message .button:hover,
.woocommerce .woocommerce-info .button:hover,
.woocommerce .woocommerce-error .button:hover,
.woocommerce-page .woocommerce-message .button:hover,
.woocommerce-page .woocommerce-info .button:hover,
.woocommerce-page .woocommerce-error .button:hover,
.woocommerce-notices-wrapper .woocommerce-message .button:hover,
.woocommerce-notices-wrapper .woocommerce-info .button:hover,
.woocommerce-notices-wrapper .woocommerce-error .button:hover {
	background: transparent;
	color: var(--fwk-color-accent);
	border-color: transparent;
	text-decoration: underline;
	box-shadow: none;
}

.woocommerce .woocommerce-message .button:focus-visible,
.woocommerce .woocommerce-info .button:focus-visible,
.woocommerce .woocommerce-error .button:focus-visible {
	outline: 2px solid var(--fwk-color-focus);
	outline-offset: 2px;
	box-shadow: none;
}

.fwk-toast__icon {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 1.25rem;
	height: 1.25rem;
	color: var(--fwk-color-muted);
}

.fwk-toast__icon svg {
	display: block;
	width: 1.25rem;
	height: 1.25rem;
}

/* Quiet: all toast icons muted; danger = muted danger ink only. */
.fwk-toast--success .fwk-toast__icon,
.fwk-toast--neutral .fwk-toast__icon,
.fwk-toast--info .fwk-toast__icon {
	color: var(--fwk-color-muted);
}

.fwk-toast--danger .fwk-toast__icon,
.fwk-toast--error .fwk-toast__icon {
	color: color-mix(in oklch, var(--fwk-color-danger) 70%, var(--fwk-color-text));
}

.fwk-toast__body {
	flex: 1 1 auto;
	min-width: 0;
}

.fwk-toast__msg {
	margin: 0;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	color: var(--fwk-color-text);
	line-height: 1.35;
}

.fwk-toast__link,
.fwk-toast__action {
	flex: 0 0 auto;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	font-family: inherit;
	font-size: var(--fwk-text-xs);
	font-weight: 700;
	color: var(--fwk-color-accent);
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	line-height: 1.35;
}

.fwk-toast__link:hover,
.fwk-toast__action:hover {
	text-decoration: underline;
}

.fwk-toast__link:focus-visible,
.fwk-toast__action:focus-visible {
	outline: 2px solid var(--fwk-color-focus);
	outline-offset: 2px;
	border-radius: 2px;
}

/* WC list notices: kill default bullets; soft DNA already applied. */
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
	display: none !important;
}

.woocommerce-error li,
.woocommerce-message li,
.woocommerce-info li {
	list-style: none !important;
}

@keyframes fwk-toast-in {
	from {
		opacity: 0;
		transform: translateY(0.5rem);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.fwk-toast {
		animation: fwk-toast-in-fade var(--fwk-duration-slow) var(--fwk-ease-out);
	}

	@keyframes fwk-toast-in-fade {
		from { opacity: 0; }
		to { opacity: 1; }
	}
}

@media (max-width: 30em) {
	:root {
		/* 9rem ? 2 + gap fits @375 with container pad ? 2-col PLP/search. */
		--fwk-grid-min: 9rem;
		/* Honest packshot ratio on mobile too (no landscape crop). */
		--fwk-card-media-ratio: 4 / 3;
		--fwk-card-pad: var(--fwk-space-2);
		--fwk-grid-gap: var(--fwk-space-3);
		/* Premium P1: colour is a separate row ? model may use 2 lines. */
		--fwk-card-title-lines: 2;
		--fwk-card-title-lh: 1.3;
	}

	/* Lock PDP media against any accidental card-ratio bleed. */
	body.fwk-pdp {
		--fwk-pdp-media-ratio: 4 / 3;
	}

	.woocommerce ul.products,
	.woocommerce-page ul.products,
	section.related.products ul.products,
	section.upsells ul.products,
	section.cross-sells ul.products,
	.fwk-bestsellers ul.products,
	.fwk-search__results ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	ul.products li.product.fwk-product-card .product-details.entry-content-wrap,
	ul.products li.product.fwk-product-card .entry-content-wrap,
	ul.products li.product.fwk-product-card .product-details.content-bg,
	.woocommerce ul.products.woo-archive-action-on-hover li.product.fwk-product-card .entry-content-wrap,
	.woocommerce ul.products.woo-archive-action-on-hover li.product.fwk-product-card:hover .entry-content-wrap,
	.woocommerce ul.products.woo-archive-action-on-hover li.product.fwk-product-card:focus-within .entry-content-wrap {
		padding: var(--fwk-space-2) var(--fwk-card-pad) var(--fwk-space-1);
		gap: var(--fwk-space-1);
	}

	ul.products li.product.fwk-product-card .product-action-wrap,
	.woocommerce ul.products.woo-archive-action-on-hover li.product.fwk-product-card .product-action-wrap,
	.woocommerce ul.products.woo-archive-action-on-hover li.product.fwk-product-card:hover .product-action-wrap,
	.woocommerce ul.products.woo-archive-action-on-hover li.product.fwk-product-card:focus-within .product-action-wrap {
		padding: 0 0 var(--fwk-space-2);
	}

	ul.products li.product.fwk-product-card .woocommerce-loop-product__title {
		font-size: var(--fwk-text-sm);
	}

	ul.products li.product.fwk-product-card .fwk-card-sizes {
		margin-block: 0;
	}

	/* Buy-bar actions: qty + ATC stay one row. */
	body.single-product.woocommerce div.product form.cart .fwk-buy-bar__actions .quantity,
	body.single-product.woocommerce div.product form.cart .fwk-qty {
		flex: 0 0 auto;
		align-self: stretch;
		width: auto;
		max-width: none;
	}

	body.single-product.woocommerce div.product form.cart .fwk-buy-bar__actions .button.single_add_to_cart_button {
		flex: 1 1 auto;
		width: auto;
		min-width: 0;
	}
}

.fwk-size-table tbody tr.is-active {
	background: var(--fwk-color-accent-soft);
	outline: 2px solid var(--fwk-color-accent);
}

.fwk-sizes__hint,
.fwk-sizes p.fwk-sizes__hint,
body.single-product.woocommerce div.product .fwk-sizes > p.fwk-sizes__hint {
	margin: 0;
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-muted);
}

.fwk-sizes__hint[hidden],
.fwk-sizes p.fwk-sizes__hint[hidden],
body.single-product.woocommerce div.product .fwk-sizes > p.fwk-sizes__hint[hidden] {
	display: none !important;
}

.fwk-sizes__note,
.fwk-sizes p.fwk-sizes__note,
body.single-product.woocommerce div.product .fwk-sizes > p.fwk-sizes__note {
	margin: 0;
	font-size: var(--fwk-text-xs, 0.8125rem);
	color: var(--fwk-color-muted);
	line-height: 1.45;
}

/* Size Honesty ? muted shop-grid note under size buttons (no card chrome). */
.fwk-sizes__legend {
	margin-block: var(--fwk-space-2) 0;
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-muted);
	line-height: 1.45;
}

/* Inline foot-picker removed — cm helper in size-chart modal. */

.fwk-size--recommended:not([aria-pressed="true"]) {
	border-bottom-color: var(--fwk-color-accent);
	color: var(--fwk-color-accent);
	box-shadow: none;
}

.fwk-size-table tbody [data-size-slug] {
	cursor: pointer;
	transition: background-color var(--fwk-duration) var(--fwk-ease);
}

.fwk-size-table tbody [data-size-slug]:hover {
	background: var(--fwk-color-sunken, oklch(96% 0.005 250));
}

.fwk-foot-helper {
	display: grid;
	gap: var(--fwk-space-2);
	margin-block: var(--fwk-space-4);
}

.fwk-foot-helper__input {
	max-width: 8rem;
	padding: var(--fwk-space-2) var(--fwk-space-3);
	border: 1px solid var(--fwk-color-border);
	border-radius: var(--fwk-radius-sm);
}

.fwk-foot-helper__hint {
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-accent);
	margin: 0;
}

/* C1 ? Archive header (H1 + count + short description) */
.fwk-archive-header {
	display: grid;
	gap: var(--fwk-space-3);
	margin-block: 0 var(--fwk-space-6);
	padding-block-end: var(--fwk-space-5);
	border-bottom: 1px solid var(--fwk-color-border);
}

.fwk-archive-header .fwk-breadcrumbs {
	margin: 0;
}

.fwk-archive-header__top {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-2) var(--fwk-space-4);
}

.fwk-archive-header__title {
	margin: 0;
	font-family: var(--fwk-font-display);
	font-size: clamp(1.5rem, 1.15rem + 1.2vw, 2rem);
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.02em;
	color: var(--fwk-color-text);
	text-wrap: balance;
	min-width: 0;
	flex: 1 1 auto;
}

/* Desktop: Sort replaces visible «Знайдено N» beside H1. */
.fwk-archive-header__sort {
	flex: 0 1 auto;
	min-width: 10rem;
	max-width: min(100%, 15rem);
}

.fwk-archive-header__sort:empty {
	display: none;
}

.fwk-archive-header__sort .woocommerce-ordering,
.fwk-archive-header__sort .kadence-woo-ordering {
	display: flex;
	width: 100%;
	margin: 0;
	position: relative;
}

/* Custom orderby listbox (native <select> popup is OS chrome — not stylable). */
.fwk-orderby {
	position: relative;
	display: block;
	width: 100%;
	min-width: 0;
}

.fwk-orderby__native {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

.fwk-orderby__trigger {
	appearance: none;
	-webkit-appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-2);
	box-sizing: border-box;
	width: 100%;
	min-height: 44px;
	padding: var(--fwk-space-2) 0;
	border: 0;
	border-bottom: 1px solid color-mix(in oklch, var(--fwk-color-text) 18%, transparent);
	border-radius: 0;
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
	color: var(--fwk-color-text) !important;
	font-family: var(--fwk-font);
	font-size: var(--fwk-text-sm);
	font-weight: 500;
	line-height: 1.3;
	text-align: start;
	text-decoration: none !important;
	cursor: pointer;
	transform: none !important;
}

.fwk-orderby__trigger::after {
	content: "";
	flex: 0 0 0.65rem;
	width: 0.65rem;
	height: 0.65rem;
	margin-inline-start: auto;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: translateY(-0.15rem) rotate(45deg);
	opacity: 0.55;
	transition: transform var(--fwk-duration) var(--fwk-ease), opacity var(--fwk-duration) var(--fwk-ease);
}

.fwk-orderby.is-open .fwk-orderby__trigger::after {
	transform: translateY(0.1rem) rotate(-135deg);
	opacity: 0.9;
}

.fwk-orderby__value {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: inherit;
}

/* Kill theme/Woo button fill (sky/blue) on hover/focus/active/open. */
.fwk-orderby__trigger:hover,
.fwk-orderby__trigger:focus,
.fwk-orderby__trigger:focus-visible,
.fwk-orderby__trigger:active,
.fwk-orderby.is-open .fwk-orderby__trigger,
.woocommerce .fwk-orderby__trigger:hover,
.woocommerce .fwk-orderby__trigger:focus,
.woocommerce .fwk-orderby__trigger:active {
	background: transparent !important;
	background-color: transparent !important;
	color: var(--fwk-color-text) !important;
	border-color: transparent !important;
	border-bottom-color: color-mix(in oklch, var(--fwk-color-text) 36%, transparent) !important;
	box-shadow: none !important;
	outline: none;
	transform: none !important;
}

.fwk-orderby__trigger:focus-visible,
.fwk-orderby.is-open .fwk-orderby__trigger {
	border-bottom-color: color-mix(in oklch, var(--fwk-color-text) 45%, transparent) !important;
}

.fwk-orderby__list {
	position: absolute;
	z-index: var(--fwk-z-dropdown);
	inset-inline-end: 0;
	top: calc(100% + 0.35rem);
	min-width: 100%;
	width: max-content;
	max-width: min(18rem, 92vw);
	margin: 0;
	padding: var(--fwk-space-1);
	list-style: none;
	background: var(--fwk-color-surface);
	border: 1px solid color-mix(in oklch, var(--fwk-color-text) 10%, transparent);
	border-radius: var(--fwk-radius-md);
	box-shadow: var(--fwk-shadow-md);
}

.fwk-orderby__list[hidden] {
	display: none !important;
}

.fwk-orderby__list > li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.fwk-orderby__option {
	appearance: none;
	-webkit-appearance: none;
	display: block;
	box-sizing: border-box;
	width: 100%;
	min-height: 40px;
	padding: var(--fwk-space-2) var(--fwk-space-3);
	border: 0;
	border-radius: var(--fwk-radius-sm);
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
	color: var(--fwk-color-text) !important;
	font-family: var(--fwk-font);
	font-size: var(--fwk-text-sm);
	font-weight: 500;
	line-height: 1.3;
	text-align: start;
	text-decoration: none !important;
	cursor: pointer;
	transform: none !important;
}

.fwk-orderby__option:hover,
.fwk-orderby__option:focus,
.fwk-orderby__option:focus-visible,
.fwk-orderby__option:active,
.woocommerce .fwk-orderby__option:hover,
.woocommerce .fwk-orderby__option:focus,
.woocommerce .fwk-orderby__option:active {
	outline: none;
	background: color-mix(in oklch, var(--fwk-color-text) 6%, transparent) !important;
	background-color: color-mix(in oklch, var(--fwk-color-text) 6%, transparent) !important;
	color: var(--fwk-color-text) !important;
	border-color: transparent !important;
	box-shadow: none !important;
	transform: none !important;
}

.fwk-orderby__option.is-selected,
.fwk-orderby__option[aria-selected="true"],
.fwk-orderby__option.is-selected:hover,
.fwk-orderby__option[aria-selected="true"]:hover {
	color: var(--fwk-color-text) !important;
	font-weight: 600;
	background: color-mix(in oklch, var(--fwk-color-text) 8%, transparent) !important;
	background-color: color-mix(in oklch, var(--fwk-color-text) 8%, transparent) !important;
}

/* Fallback if JS has not enhanced yet. */
.fwk-archive-header__sort .woocommerce-ordering select:not(.fwk-orderby__native),
.fwk-archive-header__sort select.orderby:not(.fwk-orderby__native) {
	box-sizing: border-box;
	width: 100%;
	min-height: 44px;
	padding: var(--fwk-space-2) 1.75rem var(--fwk-space-2) 0;
	border: 0;
	border-bottom: 1px solid color-mix(in oklch, var(--fwk-color-text) 18%, transparent);
	border-radius: 0;
	background-color: transparent;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23475569' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0 center;
	background-size: 1rem;
	appearance: none;
	-webkit-appearance: none;
	font-size: var(--fwk-text-sm);
	font-weight: 500;
}

.fwk-archive-header__count {
	margin: 0;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	color: var(--fwk-color-muted);
	white-space: nowrap;
}

.fwk-archive-header__desc {
	margin: 0;
	max-width: 42rem;
	font-size: var(--fwk-text-sm);
	line-height: 1.5;
	color: var(--fwk-color-muted);
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

/* Hide empty WC products header ? C1 owns the title. */
.post-type-archive-product .woocommerce-products-header,
.tax-product_cat .woocommerce-products-header,
.tax-product_tag .woocommerce-products-header {
	display: none;
}

/* Catalog filters ? CF-1 shell (sidebar ?64em / sheet <64em) */
.fwk-catalog {
	display: grid;
	gap: var(--fwk-space-4);
	align-items: start;
}

.fwk-catalog-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: var(--fwk-space-3);
}

.fwk-catalog__count {
	margin: 0;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	color: var(--fwk-color-text);
}

.fwk-catalog__filter-toggle {
	display: inline-flex;
	align-items: center;
	gap: var(--fwk-space-2);
	min-height: 44px;
}

.fwk-catalog__filter-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.25rem;
	min-height: 1.25rem;
	padding: 0 0.35em;
	border-radius: var(--fwk-radius-pill);
	background: var(--fwk-button-ink);
	color: var(--fwk-color-on-cta);
	font-size: var(--fwk-text-xs);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

.fwk-catalog__filter-badge[hidden] {
	display: none !important;
}

/* === CF-1.6 Facet hygiene === */
.fwk-catalog-chips-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--fwk-space-2) var(--fwk-space-3);
}

.fwk-catalog-chips-row:has(.fwk-catalog-chips[hidden]):has([data-fwk-filters-reset-all][hidden]) {
	display: none;
}

.fwk-catalog-chips {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--fwk-space-2);
	flex: 1 1 auto;
	min-width: 0;
}

.fwk-catalog-chips[hidden] {
	display: none !important;
}

.fwk-catalog-chips .fwk-chip {
	min-height: 36px;
	padding-block: var(--fwk-space-1);
	padding-inline: var(--fwk-space-3);
	gap: var(--fwk-space-2);
	cursor: pointer;
}

.fwk-catalog-chips .fwk-chip__prefix {
	color: color-mix(in oklch, var(--fwk-neutral-0) 72%, transparent);
	font-weight: 500;
	font-size: var(--fwk-text-xs);
	letter-spacing: 0.01em;
}

.fwk-catalog-chips .fwk-chip__x {
	font-size: 1rem;
	line-height: 1;
	opacity: 0.7;
}

.fwk-catalog-chips__clear,
.fwk-catalog-chips__reset,
.fwk-catalog-chips-row [data-fwk-filters-reset-all],
.fwk-catalog-chips [data-fwk-filters-reset-all] {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	min-height: 36px;
	padding: 0 var(--fwk-space-2);
	border: 0;
	border-radius: var(--fwk-radius-control);
	background: transparent;
	color: var(--fwk-color-muted);
	font: inherit;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 0.15em;
	cursor: pointer;
	white-space: nowrap;
}

.fwk-catalog-chips__clear[hidden],
.fwk-catalog-chips__reset[hidden],
.fwk-catalog-chips-row [data-fwk-filters-reset-all][hidden],
.fwk-catalog-chips [data-fwk-filters-reset-all][hidden] {
	display: none !important;
}

.fwk-catalog-chips__clear:hover,
.fwk-catalog-chips__reset:hover,
.fwk-catalog-chips-row [data-fwk-filters-reset-all]:hover,
.fwk-catalog-chips [data-fwk-filters-reset-all]:hover {
	color: var(--fwk-color-text);
}

.fwk-catalog-chips__clear:focus-visible,
.fwk-catalog-chips__reset:focus-visible,
.fwk-catalog-chips-row [data-fwk-filters-reset-all]:focus-visible,
.fwk-catalog-chips [data-fwk-filters-reset-all]:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
	color: var(--fwk-color-text);
}

/* Premium P2.5 ? same auto-fill contract as live product grid (no 2/4 hard lie). */
.fwk-catalog-skeleton {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(var(--fwk-grid-min), 1fr));
	gap: var(--fwk-grid-gap, var(--fwk-space-4));
}

@media (max-width: 30em) {
	/* P2.5: lock to forced 2-col PLP (products override auto-fill here). */
	.fwk-catalog-skeleton {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.fwk-catalog-skeleton[hidden] {
	display: none !important;
}

.fwk-catalog-skeleton span {
	display: block;
	aspect-ratio: var(--fwk-card-media-ratio);
	border-radius: var(--fwk-radius-md);
	background: linear-gradient(90deg, var(--fwk-color-sunken) 25%, var(--fwk-neutral-200) 50%, var(--fwk-color-sunken) 75%);
	background-size: 200% 100%;
	animation: fwk-skeleton-pulse 1.2s ease-in-out infinite;
}

@keyframes fwk-skeleton-pulse {
	0% { background-position: 100% 0; }
	100% { background-position: -100% 0; }
}

.fwk-catalog.is-filtering .fwk-catalog-skeleton {
	display: grid;
}

/* Premium P0.3 ? honesty: skeleton only (no ghost old grid under tiles). */
.fwk-catalog.is-filtering > ul.products,
.fwk-catalog.is-filtering .fwk-loop__empty,
.fwk-catalog.is-filtering > .woocommerce-pagination,
.fwk-catalog.is-filtering > nav.woocommerce-pagination {
	visibility: hidden;
	opacity: 0;
	height: 0;
	max-height: 0;
	overflow: hidden;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	pointer-events: none;
}

/* Filters shell — contain children; never grow past sidebar track. */
.fwk-filters {
	margin: 0;
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}

.fwk-filters__backdrop {
	display: none;
	border: 0;
	padding: 0;
	margin: 0;
	cursor: pointer;
	background: oklch(20% 0.02 250 / 0.45);
}

.fwk-filters__sheet {
	background: transparent;
	border: 0;
	border-radius: 0;
	min-width: 0;
	max-width: 100%;
	width: 100%;
	box-sizing: border-box;
	overflow-x: clip;
}

@media (max-width: 63.99em) {
	.fwk-filters__sheet {
		background: var(--fwk-color-surface);
		border: 0;
		border-radius: var(--fwk-radius-xl) var(--fwk-radius-xl) 0 0;
		box-shadow: var(--fwk-shadow-md);
	}
}

.fwk-filters__sheet-head {
	display: none;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-3);
	min-height: 3.5rem;
	/* Equal breathing around 44px dismiss; less end pad so X clears sheet radius. */
	padding: 0.625rem 0.75rem 0.625rem 1.25rem;
	border-bottom: 1px solid var(--fwk-color-border);
	box-sizing: border-box;
}

.fwk-filters__sheet-title {
	margin: 0;
	font-family: var(--fwk-font-display);
	font-size: var(--fwk-text-lg);
	font-weight: 700;
	line-height: 1.2;
}

/* FILT-P1-1: ghost dismiss — no bordered tile crowding the sheet corner. */
.fwk-filters__close.fwk-icon-button,
button.fwk-filters__close {
	box-sizing: border-box;
	flex: 0 0 auto;
	width: 44px;
	height: 44px;
	min-width: 44px;
	min-height: 44px;
	margin: 0;
	padding: 0;
	border: 0;
	border-color: transparent;
	border-radius: var(--fwk-radius-control);
	background: transparent;
	color: var(--fwk-color-text);
	font-size: 1.5rem;
	line-height: 1;
	font-weight: 400;
	box-shadow: none;
}

.fwk-filters__close.fwk-icon-button > span,
button.fwk-filters__close > span {
	display: block;
	line-height: 1;
	/* × glyph sits slightly high — nudge for optical center. */
	transform: translateY(-0.05em);
}

.fwk-filters__close.fwk-icon-button:hover,
.fwk-filters__close.fwk-icon-button:focus-visible,
button.fwk-filters__close:hover,
button.fwk-filters__close:focus-visible {
	background: var(--fwk-color-sunken);
	border-color: transparent;
	box-shadow: none;
	color: var(--fwk-color-text);
}

.fwk-filters__close.fwk-icon-button:focus-visible,
button.fwk-filters__close:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
}

.fwk-filters__sheet-body {
	padding: var(--fwk-space-2) 0;
	display: grid;
	gap: var(--fwk-space-2);
	background: transparent;
	min-width: 0;
	max-width: 100%;
	width: 100%;
	box-sizing: border-box;
}

.fwk-filters__group {
	margin: 0;
	border-bottom: 1px solid var(--fwk-color-border);
	padding-block-end: var(--fwk-space-3);
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}

.fwk-filters__group:last-of-type {
	border-bottom: 0;
}

.fwk-filters__group summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-3);
	cursor: pointer;
	font-weight: 600;
	padding-block: var(--fwk-space-2);
	padding-inline-end: 0.75rem;
	list-style: none;
	min-width: 0;
	max-width: 100%;
	overflow: hidden;
	box-sizing: border-box;
}

.fwk-filters__group summary::-webkit-details-marker {
	display: none;
}

/* CF-1.6: details chevron — keep inside flex track (was +2px scrollWidth). */
.fwk-filters__group summary::after {
	content: "";
	box-sizing: border-box;
	width: 0.65rem;
	height: 0.65rem;
	margin-inline-start: auto;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transform-origin: 50% 45%;
	transition: transform var(--fwk-duration) var(--fwk-ease), opacity var(--fwk-duration) var(--fwk-ease);
	flex: 0 0 0.65rem;
	opacity: 0.55;
}

.fwk-filters__group[open] > summary {
	color: var(--fwk-color-text);
}

.fwk-filters__group[open] > summary::after {
	transform: rotate(-135deg);
	opacity: 0.9;
}

.fwk-filters__group summary:focus-visible {
	outline: none;
	box-shadow: inset var(--fwk-focus-ring);
	border-radius: var(--fwk-radius-xs);
}

.fwk-filters__panel {
	padding-block-start: var(--fwk-space-2);
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}

.fwk-filters__panel--scroll {
	max-height: 14rem;
	overflow-x: hidden;
	overflow-y: auto;
}

.fwk-filters__segment {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--fwk-space-4);
	margin-block-end: var(--fwk-space-3);
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
}

.fwk-filters__segment-btn {
	min-height: 40px;
	padding: 0 0 var(--fwk-space-1);
	border: 0;
	border-bottom: 2px solid transparent;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	color: var(--fwk-color-muted);
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	cursor: pointer;
	transition: color var(--fwk-duration) var(--fwk-ease), border-color var(--fwk-duration) var(--fwk-ease);
}

.fwk-filters__segment-btn:hover,
.fwk-filters__segment-btn:focus-visible,
.fwk-filters__segment-btn:active {
	background: transparent;
	box-shadow: none;
	color: var(--fwk-color-text);
}

.fwk-filters__segment-btn:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
}

.fwk-filters__segment-btn.is-active,
.fwk-filters__segment-btn[aria-pressed="true"] {
	background: transparent;
	color: var(--fwk-color-selected);
	border-bottom-color: var(--fwk-color-selected);
	box-shadow: none;
}

.fwk-filters__segment-btn.is-active:hover,
.fwk-filters__segment-btn[aria-pressed="true"]:hover,
.fwk-filters__segment-btn.is-active:focus-visible,
.fwk-filters__segment-btn[aria-pressed="true"]:focus-visible {
	background: transparent;
	color: var(--fwk-color-selected);
	border-bottom-color: var(--fwk-color-selected);
	box-shadow: none;
}

.fwk-filters__segment-btn.is-active:focus-visible,
.fwk-filters__segment-btn[aria-pressed="true"]:focus-visible {
	box-shadow: var(--fwk-focus-ring);
}

/* CF-1.6: size chips — hug label text; gap between chips stays 0.375rem. */
.fwk-filters__sizes {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 0.375rem;
	width: 100%;
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}

/* Adults PLP: EU · мм · US — one compact row; filter value stays EU slug. */
.fwk-filters__size-scale,
.fwk-filters__size-scale.fwk-filters__segment {
	flex: 0 0 100%;
	display: flex;
	flex-wrap: nowrap;
	align-items: stretch;
	gap: 0;
	margin: 0 0 var(--fwk-space-2);
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	width: 100%;
	min-width: 0;
}

.fwk-filters__size-scale .fwk-filters__segment-btn {
	flex: 1 1 0;
	min-width: 0;
	min-height: 32px;
	padding: 0 0 2px;
	font-size: var(--fwk-text-xs, 0.75rem);
	line-height: 1.2;
	white-space: nowrap;
}

.fwk-filters__size-scale-note {
	flex: 0 0 100%;
	width: 100%;
	margin: 0 0 var(--fwk-space-2);
	color: var(--fwk-color-muted);
	font-size: var(--fwk-text-xs, 0.75rem);
	line-height: 1.35;
}

.fwk-filters__size-scale-note[hidden] {
	display: none !important;
}

.fwk-filters__sizes[data-active-scale="eu"] .fwk-filters__size span,
.fwk-filters__sizes[data-active-scale="mm"] .fwk-filters__size span,
.fwk-filters__sizes[data-active-scale="stamp"] .fwk-filters__size span {
	font-size: var(--fwk-text-xs, 0.75rem);
	font-weight: 600;
	letter-spacing: -0.01em;
}

.fwk-filters__sizes.is-hidden,
.fwk-filters__sizes[hidden] {
	display: none !important;
}

.fwk-filters__size {
	position: relative;
	display: flex;
	flex: 0 0 auto;
	width: auto;
	max-width: 100%;
	cursor: pointer;
}

.fwk-filters__size span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: auto;
	min-width: 0;
	min-height: 44px;
	padding-inline: 5px;
	border: 0;
	border-bottom: 2px solid color-mix(in oklch, var(--fwk-color-text) 12%, transparent);
	border-radius: 0;
	background: transparent;
	color: var(--fwk-color-text);
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	transition: border-color var(--fwk-duration) var(--fwk-ease), color var(--fwk-duration) var(--fwk-ease);
}

.fwk-filters__size:hover span {
	border-bottom-color: color-mix(in oklch, var(--fwk-color-text) 28%, transparent);
}

.fwk-filters__size input:checked + span {
	background: transparent;
	color: var(--fwk-color-selected);
	border-bottom-color: var(--fwk-color-selected);
}

.fwk-filters__size input:focus-visible + span {
	box-shadow: var(--fwk-focus-ring);
}

.fwk-filters__size input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

/* === W5-min T2: Size facet collapse === */
.fwk-filters__sizes-hint {
	flex: 0 0 100%;
	width: 100%;
	margin: 0 0 var(--fwk-space-1);
	color: var(--fwk-color-muted);
	font-size: var(--fwk-text-xs, 0.75rem);
	font-weight: 600;
	letter-spacing: 0.02em;
	line-height: 1.3;
}

.fwk-filters__sizes.is-expanded .fwk-filters__sizes-hint,
.fwk-filters__sizes-hint[hidden] {
	display: none;
}

.fwk-filters__sizes:not(.is-expanded) .fwk-filters__size.is-extra:not(.is-pinned) {
	display: none;
}

/* Filters text controls — deltas on F.plain (.fwk-btn-plain in PHP). */
.fwk-filters button.fwk-btn-plain.fwk-filters__text-btn,
.fwk-filters button.fwk-btn-plain.fwk-filters__size-more,
.fwk-filters button.fwk-btn-plain.fwk-filters__collection-more {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	padding: var(--fwk-space-1) 0;
	color: var(--fwk-color-muted);
	font: inherit;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	line-height: 1.3;
	text-decoration: underline;
	text-underline-offset: 0.15em;
	text-decoration-thickness: 1px;
	transition: color var(--fwk-duration) var(--fwk-ease), box-shadow var(--fwk-duration) var(--fwk-ease);
}

.fwk-filters button.fwk-btn-plain.fwk-filters__size-more {
	flex: 0 0 100%;
	width: 100%;
	margin-block-start: var(--fwk-space-1);
}

.fwk-filters button.fwk-btn-plain.fwk-filters__collection-more {
	width: 100%;
	min-height: 36px;
}

.fwk-filters button.fwk-btn-plain.fwk-filters__text-btn:hover,
.fwk-filters button.fwk-btn-plain.fwk-filters__size-more:hover,
.fwk-filters button.fwk-btn-plain.fwk-filters__collection-more:hover {
	color: var(--fwk-color-text);
	text-decoration: underline;
}

.fwk-filters button.fwk-btn-plain.fwk-filters__text-btn:focus-visible,
.fwk-filters button.fwk-btn-plain.fwk-filters__size-more:focus-visible,
.fwk-filters button.fwk-btn-plain.fwk-filters__collection-more:focus-visible {
	color: var(--fwk-color-text);
}

.fwk-filters button.fwk-btn-plain.fwk-filters__text-btn:active,
.fwk-filters button.fwk-btn-plain.fwk-filters__size-more:active,
.fwk-filters button.fwk-btn-plain.fwk-filters__collection-more:active {
	color: var(--fwk-color-text);
	opacity: 0.85;
}

.fwk-filters__option {
	display: flex;
	align-items: center;
	gap: var(--fwk-space-2);
	min-height: 40px;
	margin: 0;
	font-size: var(--fwk-text-sm);
	cursor: pointer;
}

.fwk-filters__option input[type="checkbox"] {
	width: 1.125rem;
	height: 1.125rem;
	margin: 0;
	flex: 0 0 auto;
	accent-color: var(--fwk-color-selected);
	cursor: pointer;
}

.fwk-filters__option:has(input[type="checkbox"]:checked) {
	color: var(--fwk-color-selected);
	font-weight: 600;
}

.fwk-filters__option.is-hidden,
.fwk-filters__option[hidden] {
	display: none !important;
}

/* CF-1.6: collection search + top-N list (Pack A markup). */
.fwk-filters__panel--collections {
	display: grid;
	gap: var(--fwk-space-2);
}

.fwk-filters__collection-search,
.fwk-filters__search,
[data-fwk-collection-facet] .fwk-filters__collection-search {
	display: block;
	margin: 0;
}

.fwk-filters__collection-search-input,
.fwk-filters__search input,
.fwk-filters__search input[type="search"],
.fwk-filters__search input[type="text"],
input.fwk-filters__search,
input.fwk-filters__collection-search-input,
input[data-fwk-collection-search] {
	box-sizing: border-box;
	width: 100%;
	min-height: 40px;
	padding: var(--fwk-space-2) var(--fwk-space-3);
	border: 1px solid var(--fwk-color-control-border);
	border-radius: var(--fwk-radius-control);
	background: var(--fwk-color-surface);
	color: var(--fwk-color-text);
	font-family: var(--fwk-font);
	font-size: var(--fwk-text-sm);
	line-height: 1.3;
	transition: border-color var(--fwk-duration) var(--fwk-ease), box-shadow var(--fwk-duration) var(--fwk-ease), background-color var(--fwk-duration) var(--fwk-ease);
}

.fwk-filters__collection-search-input::placeholder,
.fwk-filters__search input::placeholder,
.fwk-filters__search input[type="search"]::placeholder,
.fwk-filters__search input[type="text"]::placeholder,
input.fwk-filters__search::placeholder,
input.fwk-filters__collection-search-input::placeholder,
input[data-fwk-collection-search]::placeholder {
	color: var(--fwk-color-muted);
}

.fwk-filters__collection-search-input:focus-visible,
.fwk-filters__search input:focus-visible,
.fwk-filters__search input[type="search"]:focus-visible,
.fwk-filters__search input[type="text"]:focus-visible,
input.fwk-filters__search:focus-visible,
input.fwk-filters__collection-search-input:focus-visible,
input[data-fwk-collection-search]:focus-visible {
	outline: none;
	border-color: var(--fwk-color-accent);
	box-shadow: var(--fwk-focus-ring);
	background: var(--fwk-color-surface);
}

.fwk-filters__collection-list {
	display: grid;
	gap: 0;
}

[data-fwk-collection-facet]:not(.is-expanded) .fwk-filters__option.is-extra:not(.is-pinned),
[data-fwk-collection-facet]:not(.is-expanded) [data-fwk-collection-tier="extra"]:not(.is-pinned),
.fwk-filters__panel--collections:not(.is-expanded) .fwk-filters__option.is-extra:not(.is-pinned) {
	display: none;
}

[data-fwk-collection-facet].is-searching .fwk-filters__option.is-extra,
[data-fwk-collection-facet].is-searching [data-fwk-collection-tier="extra"],
.fwk-filters__panel--collections.is-searching .fwk-filters__option.is-extra {
	display: flex;
}

[data-fwk-collection-facet].is-searching .fwk-filters__collection-more,
.fwk-filters__collection-more[hidden] {
	display: none !important;
}

/* === CF-1.7 CRO filters === */
/* Pack A hyphenated aliases в†’ same compact row as .fwk-filters__mysize. */
.fwk-filters__my-size {
	display: flex;
	flex-direction: column;
	gap: var(--fwk-space-1);
	width: 100%;
	min-width: 0;
	margin: 0 0 var(--fwk-space-2);
	padding: 0 0 var(--fwk-space-2);
	border-block-end: 1px solid color-mix(in oklch, var(--fwk-color-text) 10%, transparent);
}
.fwk-filters__my-size-row {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: flex-start;
	gap: var(--fwk-space-2);
	min-width: 0;
	min-height: 36px;
}
.fwk-filters__my-size-label {
	flex: 0 1 auto;
	min-width: 0;
	margin: 0;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	color: var(--fwk-color-text);
	line-height: 1.3;
	cursor: pointer;
	white-space: nowrap;
}
.fwk-filters__my-size-select {
	box-sizing: border-box;
	flex: 0 0 auto;
	width: 4.25rem;
	min-width: 4.25rem;
	max-width: 5rem;
	min-height: 36px;
	padding: 0 var(--fwk-space-2);
	padding-inline-end: 1.35rem;
	border: 1px solid var(--fwk-color-control-border);
	border-radius: var(--fwk-radius-control);
	background: var(--fwk-color-surface);
	color: var(--fwk-color-text);
	font: inherit;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	box-shadow: none;
}
.fwk-filters__my-size-select:focus-visible {
	outline: none;
	border-color: var(--fwk-color-selected);
	box-shadow: var(--fwk-focus-ring);
}
.fwk-filters__my-size-hint {
	margin: 0;
	font-size: var(--fwk-text-xs);
	color: var(--fwk-color-muted, #64748b);
}
.fwk-filters__my-size-hint[hidden] {
	display: none !important;
}
.fwk-filters__option--stock {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-3);
	width: 100%;
	min-height: 44px;
	margin: 0;
	cursor: pointer;
	font-weight: 600;
}

/* In stock - one-row switch (checkbox or role=switch). */
.fwk-filters__stock,
[data-fwk-facet="stock"] {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-3);
	box-sizing: border-box;
	width: 100%;
	min-width: 0;
	min-height: 44px;
	margin: 0;
	padding: var(--fwk-space-2) 0;
	border: 0;
	background: transparent;
	color: var(--fwk-color-text);
	font: inherit;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	line-height: 1.3;
	text-align: start;
	cursor: pointer;
}

.fwk-filters__stock-label,
.fwk-filters__stock > span:not(.fwk-filters__stock-switch):not(.fwk-filters__stock-track),
[data-fwk-facet="stock"] > span:not(.fwk-filters__stock-switch):not(.fwk-filters__stock-track) {
	flex: 1 1 auto;
	min-width: 0;
}

.fwk-filters__stock input[type="checkbox"],
[data-fwk-facet="stock"] input[type="checkbox"] {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
	margin: 0;
	pointer-events: none;
}

.fwk-filters__stock-switch,
.fwk-filters__stock-track,
.fwk-filters__stock [role="switch"],
[data-fwk-facet="stock"] [role="switch"],
.fwk-filters__stock input[type="checkbox"] + .fwk-filters__stock-switch,
.fwk-filters__stock input[type="checkbox"] + .fwk-filters__stock-track,
[data-fwk-facet="stock"] input[type="checkbox"] + .fwk-filters__stock-switch,
[data-fwk-facet="stock"] input[type="checkbox"] + .fwk-filters__stock-track {
	position: relative;
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	width: 2.875rem;
	height: 1.75rem;
	padding: 0;
	/* OFF: visible track — control-fill is transparent (too invisible on white). */
	border: 1.5px solid color-mix(in oklch, var(--fwk-color-text) 32%, transparent);
	border-radius: var(--fwk-radius-pill);
	background: color-mix(in oklch, var(--fwk-color-text) 14%, var(--fwk-color-surface));
	box-shadow: inset 0 1px 2px oklch(20% 0.02 250 / 0.08);
	transition:
		background-color var(--fwk-duration) var(--fwk-ease),
		border-color var(--fwk-duration) var(--fwk-ease),
		box-shadow var(--fwk-duration) var(--fwk-ease);
}

.fwk-filters__stock-switch::after,
.fwk-filters__stock-track::after,
.fwk-filters__stock [role="switch"]::after,
[data-fwk-facet="stock"] [role="switch"]::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 0.15rem;
	width: 1.35rem;
	height: 1.35rem;
	border-radius: 50%;
	background: var(--fwk-neutral-0);
	border: 1px solid color-mix(in oklch, var(--fwk-color-text) 12%, transparent);
	box-shadow: 0 1px 3px oklch(20% 0.02 250 / 0.22), 0 0 0 1px oklch(100% 0 0 / 0.6);
	transform: translateY(-50%);
	transition: left var(--fwk-duration) var(--fwk-ease), background-color var(--fwk-duration) var(--fwk-ease), border-color var(--fwk-duration) var(--fwk-ease);
}

.fwk-filters__option--stock {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-3);
	width: 100%;
	min-width: 0;
	margin: 0;
	cursor: pointer;
}

/* Pressed / on */
.fwk-filters__stock input[type="checkbox"]:checked + .fwk-filters__stock-switch,
.fwk-filters__stock input[type="checkbox"]:checked + .fwk-filters__stock-track,
[data-fwk-facet="stock"] input[type="checkbox"]:checked + .fwk-filters__stock-switch,
[data-fwk-facet="stock"] input[type="checkbox"]:checked + .fwk-filters__stock-track,
.fwk-filters__stock.is-on .fwk-filters__stock-switch,
.fwk-filters__stock.is-on .fwk-filters__stock-track,
.fwk-filters__stock.is-active .fwk-filters__stock-switch,
.fwk-filters__stock.is-active .fwk-filters__stock-track,
[data-fwk-facet="stock"].is-on .fwk-filters__stock-switch,
[data-fwk-facet="stock"].is-on .fwk-filters__stock-track,
[data-fwk-facet="stock"].is-active .fwk-filters__stock-switch,
[data-fwk-facet="stock"].is-active .fwk-filters__stock-track,
.fwk-filters__stock [role="switch"][aria-checked="true"],
[data-fwk-facet="stock"] [role="switch"][aria-checked="true"],
.fwk-filters__stock[aria-pressed="true"] .fwk-filters__stock-switch,
.fwk-filters__stock[aria-pressed="true"] .fwk-filters__stock-track,
[data-fwk-facet="stock"][aria-pressed="true"] .fwk-filters__stock-switch,
[data-fwk-facet="stock"][aria-pressed="true"] .fwk-filters__stock-track {
	background: var(--fwk-color-selected);
	border-color: var(--fwk-color-selected);
}

.fwk-filters__stock input[type="checkbox"]:checked + .fwk-filters__stock-switch::after,
.fwk-filters__stock input[type="checkbox"]:checked + .fwk-filters__stock-track::after,
[data-fwk-facet="stock"] input[type="checkbox"]:checked + .fwk-filters__stock-switch::after,
[data-fwk-facet="stock"] input[type="checkbox"]:checked + .fwk-filters__stock-track::after,
.fwk-filters__stock.is-on .fwk-filters__stock-switch::after,
.fwk-filters__stock.is-on .fwk-filters__stock-track::after,
.fwk-filters__stock.is-active .fwk-filters__stock-switch::after,
.fwk-filters__stock.is-active .fwk-filters__stock-track::after,
[data-fwk-facet="stock"].is-on .fwk-filters__stock-switch::after,
[data-fwk-facet="stock"].is-on .fwk-filters__stock-track::after,
[data-fwk-facet="stock"].is-active .fwk-filters__stock-switch::after,
[data-fwk-facet="stock"].is-active .fwk-filters__stock-track::after,
.fwk-filters__stock [role="switch"][aria-checked="true"]::after,
[data-fwk-facet="stock"] [role="switch"][aria-checked="true"]::after,
.fwk-filters__stock[aria-pressed="true"] .fwk-filters__stock-switch::after,
.fwk-filters__stock[aria-pressed="true"] .fwk-filters__stock-track::after,
[data-fwk-facet="stock"][aria-pressed="true"] .fwk-filters__stock-switch::after,
[data-fwk-facet="stock"][aria-pressed="true"] .fwk-filters__stock-track::after {
	left: calc(100% - 1.35rem - 0.15rem);
	background: var(--fwk-neutral-0);
	border-color: transparent;
}

.fwk-filters__stock input[type="checkbox"]:checked + .fwk-filters__stock-switch,
.fwk-filters__stock input[type="checkbox"]:checked + .fwk-filters__stock-track,
[data-fwk-facet="stock"] input[type="checkbox"]:checked + .fwk-filters__stock-switch,
[data-fwk-facet="stock"] input[type="checkbox"]:checked + .fwk-filters__stock-track {
	box-shadow: none;
}

.fwk-filters__stock:focus-visible,
[data-fwk-facet="stock"]:focus-visible,
.fwk-filters__stock input[type="checkbox"]:focus-visible + .fwk-filters__stock-switch,
.fwk-filters__stock input[type="checkbox"]:focus-visible + .fwk-filters__stock-track,
[data-fwk-facet="stock"] input[type="checkbox"]:focus-visible + .fwk-filters__stock-switch,
[data-fwk-facet="stock"] input[type="checkbox"]:focus-visible + .fwk-filters__stock-track,
.fwk-filters__stock [role="switch"]:focus-visible,
[data-fwk-facet="stock"] [role="switch"]:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
	border-radius: var(--fwk-radius-pill);
}

.fwk-filters__stock:hover .fwk-filters__stock-switch,
.fwk-filters__stock:hover .fwk-filters__stock-track,
.fwk-filters__option--stock:hover .fwk-filters__stock-switch,
.fwk-filters__option--stock:hover .fwk-filters__stock-track,
[data-fwk-facet="stock"]:hover .fwk-filters__stock-switch,
[data-fwk-facet="stock"]:hover .fwk-filters__stock-track {
	border-color: color-mix(in oklch, var(--fwk-color-text) 48%, transparent);
	background: color-mix(in oklch, var(--fwk-color-text) 20%, var(--fwk-color-surface));
}

.fwk-filters__stock:hover input[type="checkbox"]:checked + .fwk-filters__stock-switch,
.fwk-filters__stock:hover input[type="checkbox"]:checked + .fwk-filters__stock-track,
.fwk-filters__option--stock:hover input[type="checkbox"]:checked + .fwk-filters__stock-switch,
.fwk-filters__option--stock:hover input[type="checkbox"]:checked + .fwk-filters__stock-track {
	background: var(--fwk-color-selected);
	border-color: var(--fwk-color-selected);
}

/* My size — one row: label | EU select + Ok (stock-toggle density). */
.fwk-filters__mysize {
	display: flex;
	flex-direction: column;
	gap: var(--fwk-space-1);
	box-sizing: border-box;
	width: 100%;
	min-width: 0;
	margin: 0 0 var(--fwk-space-2);
	padding: 0 0 var(--fwk-space-2);
	border-block-end: 1px solid color-mix(in oklch, var(--fwk-color-text) 10%, transparent);
}

.fwk-filters__mysize-row {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: flex-start;
	gap: var(--fwk-space-2);
	min-width: 0;
	min-height: 36px;
}

.fwk-filters__mysize-label,
.fwk-filters__mysize > label,
.fwk-filters__mysize .fwk-label {
	flex: 0 1 auto;
	display: block;
	margin: 0;
	min-width: 0;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	color: var(--fwk-color-text);
	line-height: 1.3;
	cursor: pointer;
	white-space: nowrap;
}

.fwk-filters__mysize-controls {
	display: inline-flex;
	flex: 0 0 auto;
	flex-wrap: nowrap;
	align-items: center;
	gap: var(--fwk-space-1);
	min-width: 0;
}

.fwk-filters__mysize-input,
.fwk-filters__mysize-select,
.fwk-filters__mysize input[type="text"],
.fwk-filters__mysize input[type="number"],
.fwk-filters__mysize input[type="search"],
.fwk-filters__mysize select,
.fwk-filters__mysize .fwk-field {
	appearance: none;
	-webkit-appearance: none;
	box-sizing: border-box;
	flex: 0 0 auto;
	width: 4.25rem;
	min-width: 4.25rem;
	max-width: 5rem;
	min-height: 36px;
	padding: 0 var(--fwk-space-2);
	border: 1px solid var(--fwk-color-control-border);
	border-radius: var(--fwk-radius-control);
	background-color: var(--fwk-color-surface);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%2364748b' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.45rem center;
	background-size: 0.65rem;
	padding-inline-end: 1.35rem;
	color: var(--fwk-color-text);
	font-family: var(--fwk-font);
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	line-height: 1.3;
	font-variant-numeric: tabular-nums;
	cursor: pointer;
	transition: border-color var(--fwk-duration) var(--fwk-ease), box-shadow var(--fwk-duration) var(--fwk-ease);
}

.fwk-filters__mysize-input::placeholder,
.fwk-filters__mysize input::placeholder {
	color: var(--fwk-color-muted);
}

.fwk-filters__mysize-input:focus-visible,
.fwk-filters__mysize-select:focus-visible,
.fwk-filters__mysize input:focus-visible,
.fwk-filters__mysize select:focus-visible,
.fwk-filters__mysize .fwk-field:focus-visible {
	outline: none;
	border-color: var(--fwk-color-selected);
	box-shadow: var(--fwk-focus-ring);
}

/* Compact outline Ok — demoted vs sheet «Показати N», still a clear control. */
.fwk-filters button.fwk-filters__mysize-apply,
.fwk-filters button.fwk-filters__my-size-apply,
.fwk-filters__mysize [data-fwk-my-size-apply] {
	appearance: none;
	-webkit-appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	box-sizing: border-box;
	min-width: 2.5rem;
	min-height: 36px;
	margin: 0;
	padding: 0 var(--fwk-space-2);
	border: 1px solid color-mix(in oklch, var(--fwk-color-selected) 42%, transparent);
	border-radius: var(--fwk-radius-control);
	background: transparent;
	box-shadow: none;
	color: var(--fwk-color-selected);
	font: inherit;
	font-size: var(--fwk-text-sm);
	font-weight: 700;
	line-height: 1;
	text-decoration: none;
	cursor: pointer;
	transition:
		color var(--fwk-duration) var(--fwk-ease),
		background-color var(--fwk-duration) var(--fwk-ease),
		border-color var(--fwk-duration) var(--fwk-ease),
		box-shadow var(--fwk-duration) var(--fwk-ease);
}

.fwk-filters button.fwk-filters__mysize-apply:hover,
.fwk-filters button.fwk-filters__my-size-apply:hover,
.fwk-filters__mysize [data-fwk-my-size-apply]:hover {
	background: color-mix(in oklch, var(--fwk-color-selected) 12%, transparent);
	border-color: var(--fwk-color-selected);
	color: var(--fwk-color-selected);
	text-decoration: none;
}

.fwk-filters button.fwk-filters__mysize-apply:focus-visible,
.fwk-filters button.fwk-filters__my-size-apply:focus-visible,
.fwk-filters__mysize [data-fwk-my-size-apply]:focus-visible {
	outline: none;
	border-color: var(--fwk-color-selected);
	box-shadow: var(--fwk-focus-ring);
	color: var(--fwk-color-selected);
}

.fwk-filters button.fwk-filters__mysize-apply:active,
.fwk-filters button.fwk-filters__my-size-apply:active,
.fwk-filters__mysize [data-fwk-my-size-apply]:active {
	background: color-mix(in oklch, var(--fwk-color-selected) 18%, transparent);
	opacity: 1;
	transform: none;
}

.fwk-filters__mysize-apply:disabled,
.fwk-filters__mysize [data-fwk-my-size-apply]:disabled,
.fwk-filters__mysize [data-fwk-mysize-apply]:disabled,
.fwk-filters button.fwk-filters__mysize-apply:disabled,
.fwk-filters button.fwk-filters__my-size-apply:disabled {
	opacity: 0.45;
	pointer-events: none;
	cursor: not-allowed;
}

.fwk-filters__mysize-hint {
	margin: 0;
	font-size: var(--fwk-text-xs);
	color: var(--fwk-color-muted);
	line-height: 1.35;
}

.fwk-filters__mysize-hint[hidden] {
	display: none !important;
}

.fwk-filters__price {
	display: flex;
	align-items: flex-end;
	gap: var(--fwk-space-2);
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}

/* === CF-1.8 a11y === */
.fwk-filters__price-field {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	margin: 0;
	min-width: 0;
}

.fwk-filters__price-label {
	font-size: var(--fwk-text-xs);
	color: var(--fwk-color-muted);
	line-height: 1.2;
}

.fwk-filters__price-sep {
	align-self: center;
	padding-bottom: 0.65rem;
	color: var(--fwk-color-muted);
	flex: 0 0 auto;
}

.fwk-filters__sheet:focus {
	outline: none;
}

.fwk-filters__sheet:focus-visible {
	outline: 2px solid var(--fwk-color-focus, var(--fwk-color-cta));
	outline-offset: 2px;
}

.fwk-filters__price input {
	flex: 1 1 0;
	width: auto;
	min-width: 0;
	max-width: 5.5rem;
	min-height: 44px;
	padding: var(--fwk-space-2) var(--fwk-space-3);
	border: 1px solid var(--fwk-color-border);
	border-radius: var(--fwk-radius-sm);
	font-variant-numeric: tabular-nums;
	box-sizing: border-box;
}

.fwk-filters__actions,
.fwk-filters__sheet-foot {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-3);
	padding: var(--fwk-space-3) 0;
	border-top: 1px solid var(--fwk-color-border);
	background: transparent;
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}

.fwk-filters__submit {
	min-height: 44px;
	margin-inline-start: auto;
}

.fwk-filters__reset {
	font-size: var(--fwk-text-sm);
	min-height: 44px;
	display: inline-flex;
	align-items: center;
}

.fwk-filters__reset[hidden] {
	display: none !important;
}

.fwk-loop__empty {
	padding: var(--fwk-space-10) var(--fwk-space-5);
	text-align: center;
	border: 1px dashed var(--fwk-color-border);
	border-radius: var(--fwk-radius-md);
	background: var(--fwk-color-surface);
}

.fwk-loop__empty-title {
	margin: 0;
	font-family: var(--fwk-font-display);
	font-size: var(--fwk-text-xl);
	font-weight: 700;
	color: var(--fwk-color-text);
}

.fwk-loop__empty-hint {
	margin: var(--fwk-space-2) 0 0;
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-muted);
	line-height: 1.45;
}

.fwk-loop__empty-cta {
	margin: var(--fwk-space-5) 0 0;
}

/* === P0: Catalog grid visibility === */
/* Desktop >=1024: sticky left sidebar beside products (CSS grid, not float). */
@media (min-width: 64em) {
	/*
	 * Explicit 2-col grid. Filters use a large row-span (not 1/-1):
	 * 1/-1 only covers explicit tracks and previously sized the first
	 * row to sidebar height, pushing ul.products below the fold.
	 * Structure: [filters sticky] [ toolbar/chips/top/products/pagination ]
	 */
	.fwk-catalog {
		display: grid;
		grid-template-columns: 18.5rem minmax(0, 1fr);
		column-gap: var(--fwk-space-8);
		row-gap: var(--fwk-space-4);
		align-items: start;
		position: relative;
		padding-inline-start: 0;
	}

	.fwk-catalog > *:not(.fwk-filters) {
		grid-column: 2;
		min-width: 0;
	}

	.fwk-filters {
		grid-column: 1;
		grid-row: 1 / span 50;
		width: 100%;
		max-width: 18.5rem;
		min-width: 0;
		margin: 0;
		float: none;
		position: sticky;
		top: calc(var(--fwk-header-height) + var(--fwk-space-4));
		max-height: calc(100vh - var(--fwk-header-height) - var(--fwk-space-8));
		/* Vertical only — H-scroll was from summary chevron (+2px) / rigid min-widths. */
		overflow-x: hidden;
		overflow-y: auto;
		/* Scroll via wheel/touch; hide track (stable gutter looked like a strip). */
		scrollbar-width: none;
		-ms-overflow-style: none;
		overscroll-behavior: contain;
		align-self: start;
		box-sizing: border-box;
	}

	.fwk-filters::-webkit-scrollbar {
		display: none;
		width: 0;
		height: 0;
	}

	.fwk-catalog__filter-toggle {
		display: none;
	}

	/*
	 * Desktop: Sort in catalog toolbar (Pack P1-B). Filter toggle hidden — sidebar ≥64em.
	 */
	.fwk-catalog-toolbar {
		display: flex;
		flex-wrap: nowrap;
		align-items: stretch;
		justify-content: flex-end;
		gap: var(--fwk-space-3);
		min-width: 0;
	}

	.fwk-catalog-toolbar__sort {
		display: flex;
		align-items: stretch;
		flex: 0 1 auto;
		min-width: 10rem;
		max-width: min(100%, 15rem);
		margin-inline-start: auto;
	}

	.fwk-catalog-toolbar__sort:empty {
		display: none;
	}

	.fwk-catalog-toolbar__sort .woocommerce-ordering,
	.fwk-catalog-toolbar__sort .kadence-woo-ordering,
	.fwk-catalog-toolbar .woocommerce-ordering {
		display: flex;
		align-items: stretch;
		width: 100%;
		min-width: 0;
		margin: 0;
		position: relative;
	}

	.fwk-filters__sheet-head {
		display: none;
	}

	.fwk-filters__backdrop {
		display: none !important;
	}

	.fwk-filters__sheet {
		border-radius: var(--fwk-radius-md);
	}

	/* Size chips: hug text + 5px side pad; gap unchanged. */
	.fwk-filters__sizes {
		gap: 0.375rem;
	}

	.fwk-filters__size span {
		min-width: 0;
		min-height: 44px;
		padding-inline: 5px;
		font-size: var(--fwk-text-sm);
	}

	/* CF-1.7: compact stock + mysize in sticky 17.5rem sidebar. */
	.fwk-filters__stock,
	[data-fwk-facet="stock"] {
		min-height: 40px;
		padding-block: var(--fwk-space-1);
	}

	.fwk-filters__mysize-row,
	.fwk-filters__my-size-row {
		min-height: 36px;
	}

	.fwk-filters__mysize-input,
	.fwk-filters__mysize-select,
	.fwk-filters__mysize input[type="text"],
	.fwk-filters__mysize input[type="number"],
	.fwk-filters__mysize select,
	.fwk-filters__mysize .fwk-field,
	.fwk-filters button.fwk-filters__mysize-apply,
	.fwk-filters button.fwk-filters__my-size-apply,
	.fwk-filters__mysize [data-fwk-my-size-apply] {
		min-height: 36px;
	}

	/* F12: desktop live-filters ? hide primary Apply; reset stays. */
	.fwk-filters__submit {
		display: none !important;
	}

	.fwk-filters__sheet-foot {
		justify-content: flex-start;
	}

	.fwk-catalog ul.products {
		display: grid;
		width: 100%;
		min-width: 0;
		max-width: 100%;
	}
}

/* Mobile / tablet <1024: bottom sheet */
@media (max-width: 63.99em) {
	/* Sort returns to toolbar; keep header slot collapsed when empty. */
	.fwk-archive-header__sort:empty {
		display: none;
	}

	/*
	 * CF-1.6: Filters | Sort equal-weight toolbar @375.
	 * Sort may live in .fwk-catalog-toolbar__sort (Pack A) or sibling .kadence-shop-top-row.
	 */
	.fwk-catalog {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		column-gap: var(--fwk-space-3);
		row-gap: var(--fwk-space-3);
	}

	.fwk-catalog-toolbar {
		grid-column: 1;
		grid-row: 1;
		display: flex;
		flex-wrap: nowrap;
		align-items: stretch;
		justify-content: stretch;
		gap: var(--fwk-space-3);
		min-width: 0;
	}

	.fwk-catalog-toolbar .fwk-catalog__filter-toggle,
	.fwk-catalog-toolbar .fwk-catalog-toolbar__sort {
		flex: 1 1 0;
		width: 100%;
		min-width: 0;
		min-height: 40px;
	}

	.fwk-catalog-toolbar .fwk-catalog__filter-toggle {
		justify-content: center;
		font-size: var(--fwk-text-sm);
		min-height: 40px;
		padding-block: var(--fwk-space-2);
	}

	.fwk-catalog-toolbar__sort {
		display: flex;
		align-items: stretch;
	}

	.fwk-catalog-toolbar__sort:empty {
		display: none;
	}

	.fwk-catalog-toolbar__sort .woocommerce-ordering,
	.fwk-catalog-toolbar__sort .kadence-woo-ordering,
	.fwk-catalog-toolbar > .woocommerce-ordering,
	.fwk-catalog-toolbar > .kadence-woo-ordering,
	.fwk-catalog-toolbar .woocommerce-ordering {
		flex: 1 1 0;
		display: flex;
		align-items: stretch;
		min-width: 0;
		width: 100%;
		margin: 0;
	}

	.fwk-catalog-toolbar__sort .fwk-orderby__trigger,
	.fwk-catalog-toolbar .fwk-orderby__trigger {
		min-height: 40px;
		font-size: 0.875rem;
	}

	.fwk-catalog-toolbar__sort .woocommerce-ordering,
	.fwk-catalog-toolbar .woocommerce-ordering {
		position: relative;
	}

	/* Pack A: both controls inside toolbar ? span full row */
	.fwk-catalog:has(.fwk-catalog-toolbar .woocommerce-ordering) .fwk-catalog-toolbar,
	.fwk-catalog:has(.fwk-catalog-toolbar .kadence-woo-ordering) .fwk-catalog-toolbar,
	.fwk-catalog:has(.fwk-catalog-toolbar__sort:not(:empty)) .fwk-catalog-toolbar {
		grid-column: 1 / -1;
	}

	/* Legacy DOM: Kadence top-row is Sort half beside Filters */
	.fwk-catalog > .kadence-shop-top-row {
		grid-column: 2;
		grid-row: 1;
		display: flex;
		align-items: stretch;
		justify-content: stretch;
		margin: 0;
		min-width: 0;
	}

	.fwk-catalog:has(.fwk-catalog-toolbar__sort:not(:empty)) > .kadence-shop-top-row {
		display: none;
	}

	.fwk-catalog > .kadence-shop-top-row .kadence-shop-top-item,
	.fwk-catalog > .kadence-shop-top-row .kadence-woo-ordering,
	.fwk-catalog > .kadence-shop-top-row .woocommerce-ordering {
		flex: 1 1 auto;
		width: 100%;
		min-width: 0;
		margin: 0;
	}

	.fwk-catalog > .kadence-shop-top-row .woocommerce-ordering select {
		width: 100%;
		min-height: 40px;
		font-size: 0.875rem;
	}

	/* No Sort row (empty archive) ? Filters full width */
	.fwk-catalog:not(:has(> .kadence-shop-top-row)):not(:has(.fwk-catalog-toolbar__sort:not(:empty))):not(:has(.fwk-catalog-toolbar .woocommerce-ordering)) .fwk-catalog-toolbar {
		grid-column: 1 / -1;
	}

	.fwk-catalog-chips,
	.fwk-catalog-chips-row,
	.fwk-catalog-skeleton,
	.fwk-catalog > .fwk-filters,
	.fwk-catalog > ul.products,
	.fwk-catalog > .woocommerce-pagination,
	.fwk-catalog > .fwk-loop__empty,
	.fwk-catalog > nav.woocommerce-pagination {
		grid-column: 1 / -1;
	}

	.fwk-filters {
		position: fixed;
		inset: 0;
		z-index: var(--fwk-z-drawer);
		pointer-events: none;
		visibility: hidden;
	}

	.fwk-filters.is-open {
		pointer-events: auto;
		visibility: visible;
	}

	.fwk-filters__backdrop {
		display: block;
		position: absolute;
		inset: 0;
		opacity: 0;
		transition: opacity var(--fwk-duration) var(--fwk-ease);
	}

	.fwk-filters.is-open .fwk-filters__backdrop {
		opacity: 1;
	}

	.fwk-filters__sheet {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		max-height: min(88vh, 40rem);
		display: flex;
		flex-direction: column;
		border-radius: var(--fwk-radius-lg) var(--fwk-radius-lg) 0 0;
		border-bottom: 0;
		transform: translateY(110%);
		transition: transform var(--fwk-duration-slow) var(--fwk-ease-out);
		box-shadow: var(--fwk-shadow-md);
	}

	.fwk-filters.is-open .fwk-filters__sheet {
		transform: translateY(0);
	}

	.fwk-filters__sheet-head {
		display: flex;
		flex: 0 0 auto;
	}

	.fwk-filters__form {
		display: flex;
		flex-direction: column;
		min-height: 0;
		flex: 1 1 auto;
	}

	.fwk-filters__sheet-body {
		flex: 1 1 auto;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		-ms-overflow-style: none;
		/* Mobile sheet is full-bleed — inset content to match sheet-head title gutter. */
		padding-block: var(--fwk-space-2);
		padding-inline: 1.25rem;
		box-sizing: border-box;
	}

	.fwk-filters__sheet-body::-webkit-scrollbar {
		display: none;
		width: 0;
		height: 0;
	}

	/* CF-1.7: sheet - compact mysize row, 44px taps, no overflow. */
	.fwk-filters__stock,
	[data-fwk-facet="stock"],
	.fwk-filters__mysize,
	.fwk-filters__my-size {
		max-width: 100%;
		overflow-wrap: anywhere;
	}

	.fwk-filters__mysize-row,
	.fwk-filters__my-size-row,
	.fwk-filters__mysize-controls {
		max-width: 100%;
		min-height: 44px;
	}

	.fwk-filters__mysize-input,
	.fwk-filters__mysize-select,
	.fwk-filters__mysize input,
	.fwk-filters__mysize select,
	.fwk-filters__mysize .fwk-field,
	.fwk-filters__my-size-select {
		width: 4.75rem;
		min-width: 4.75rem;
		max-width: 5.5rem;
		min-height: 44px;
	}

	.fwk-filters button.fwk-filters__mysize-apply,
	.fwk-filters button.fwk-filters__my-size-apply,
	.fwk-filters__mysize [data-fwk-my-size-apply] {
		min-width: 2.75rem;
		min-height: 44px;
		padding-inline: var(--fwk-space-3);
	}

	.fwk-filters__sheet-foot {
		flex: 0 0 auto;
		position: sticky;
		bottom: 0;
		padding-inline: 1.25rem;
		box-sizing: border-box;
	}

	body.fwk-filters-open {
		overflow: hidden;
	}
}

@media (prefers-reduced-motion: reduce) {
	.fwk-catalog-skeleton span,
	.fwk-filters__backdrop,
	.fwk-filters__sheet,
	.fwk-filters__group summary::after {
		animation: none !important;
		transition: none !important;
	}
}

/* F04: dual chrome ? C1 owns count; hide WC/Kadence result-count duplicate. */
.post-type-archive-product .woocommerce-result-count,
.tax-product_cat .woocommerce-result-count,
.tax-product_tag .woocommerce-result-count,
.kadence-woo-results-count {
	display: none !important;
}

/* -----------------------------------------------------------------------------
   13. Site header — HDR-F Figma glass (1:1813) + drawers
   -------------------------------------------------------------------------- */
:root {
	--fwk-header-height: 5rem;
	--fwk-header-top-height: 0px;
	/* Gap from sticky header bottom → first page content (crumbs / title). */
	--fwk-header-content-gap: 40px;
	/* Figma 1:1813 — frosted glass, not opaque white */
	--fwk-header-glass: rgba(255, 255, 255, 0.2);
	--fwk-header-glass-dense: rgba(255, 255, 255, 0.55);
	--fwk-header-blur: 6px;
	--fwk-header-border: #c8cfd4;
	--fwk-header-gutter: 1.25rem;
	--fwk-header-shadow:
		0 1px 3px rgba(83, 118, 147, 0.1),
		0 1px 2px rgba(83, 118, 147, 0.06);
}

@media screen and (min-width: 1025px) {
	:root {
		--fwk-header-gutter: clamp(1.5rem, 4vw, 6.1875rem); /* ~99px @1440 */
	}
}

html {
	scroll-padding-top: calc(var(--fwk-header-height) + 0.5rem);
	overflow-x: clip;
}

body {
	overflow-x: clip;
	max-width: 100%;
}

/* Child-owned glass shell — Figma: rgba(255,255,255,.2) + blur(6px) */
#masthead.fwk-site-header {
	position: sticky;
	top: 0;
	z-index: var(--fwk-z-sticky);
	width: 100%;
	background-color: var(--fwk-header-glass);
	background-image: none;
	backdrop-filter: blur(var(--fwk-header-blur)) saturate(1.2);
	-webkit-backdrop-filter: blur(var(--fwk-header-blur)) saturate(1.2);
	border-bottom: 0.8px solid var(--fwk-header-border);
	box-shadow: var(--fwk-header-shadow);
	transition:
		background-color var(--fwk-duration) var(--fwk-ease),
		box-shadow var(--fwk-duration) var(--fwk-ease),
		border-color var(--fwk-duration) var(--fwk-ease);
}

/*
 * Home overlay: hero must sit UNDER the bar or backdrop samples #inner-wrap white.
 * Kadence `.content-area { margin-top: 5rem }` was pushing the sky below the glass.
 */
body.fwk-header-overlay #primary.content-area {
	margin-top: 0;
}

/*
 * Sticky header is in-flow (occupies height). Kadence 5rem on .content-area
 * double-counts clearance → empty band under the bar.
 * DoD: --fwk-header-content-gap (40px) from header bottom to first content.
 */
body:not(.fwk-header-overlay) #primary.content-area {
	margin-top: var(--fwk-header-content-gap);
}

/*
 * Cart / checkout / account / thank-you: Kadence `.entry-hero` sits ABOVE
 * #primary as a sibling. That slab + primary margin = double air.
 * Unbox hero, give it the 40px gap, zero primary top.
 */
body.fwk-cart-page #inner-wrap > .entry-hero,
body.fwk-checkout-page #inner-wrap > .entry-hero,
body.fwk-thankyou-page #inner-wrap > .entry-hero,
body.fwk-account-page #inner-wrap > .entry-hero {
	margin: 0;
	padding-block: var(--fwk-header-content-gap) var(--fwk-space-3);
	padding-inline: var(--fwk-header-gutter, var(--fwk-container-pad));
	min-height: 0;
	background: transparent !important;
	background-image: none !important;
	border: 0 !important;
	box-shadow: none !important;
}

body.fwk-cart-page #inner-wrap > .entry-hero .entry-hero-container-inner,
body.fwk-checkout-page #inner-wrap > .entry-hero .entry-hero-container-inner,
body.fwk-thankyou-page #inner-wrap > .entry-hero .entry-hero-container-inner,
body.fwk-account-page #inner-wrap > .entry-hero .entry-hero-container-inner,
body.fwk-cart-page #inner-wrap > .entry-hero .hero-container,
body.fwk-checkout-page #inner-wrap > .entry-hero .hero-container,
body.fwk-thankyou-page #inner-wrap > .entry-hero .hero-container,
body.fwk-account-page #inner-wrap > .entry-hero .hero-container {
	margin: 0;
	padding: 0;
	min-height: 0;
}

body.fwk-cart-page #inner-wrap > .entry-hero .entry-header,
body.fwk-checkout-page #inner-wrap > .entry-hero .entry-header,
body.fwk-thankyou-page #inner-wrap > .entry-hero .entry-header,
body.fwk-account-page #inner-wrap > .entry-hero .entry-header {
	margin: 0;
	padding: 0;
	max-width: var(--fwk-container-max, 1280px);
	margin-inline: auto;
	width: 100%;
}

body.fwk-cart-page #primary.content-area,
body.fwk-checkout-page #primary.content-area,
body.fwk-thankyou-page #primary.content-area,
body.fwk-account-page #primary.content-area {
	margin-top: 0;
}

/* Search template: #primary.fwk-search uses padding, not Kadence content-area mt. */
body:not(.fwk-header-overlay) #primary.fwk-search,
body:not(.fwk-header-overlay) .fwk-search.site-main {
	margin-top: 0;
	padding-block-start: var(--fwk-header-content-gap);
}

body.fwk-header-overlay #inner-wrap {
	background: transparent;
}

/*
 * Kadence `#wrapper { overflow: clip }` creates a backdrop root that often
 * kills visible blur on the absolute header. Keep X clip via html/body.
 */
body.fwk-header-overlay #wrapper.site {
	overflow: visible;
}

/* Home: float over hero (out of flow) */
body.fwk-header-overlay #masthead.fwk-site-header--overlay {
	position: absolute;
	inset-inline: 0;
	top: 0;
	background-color: var(--fwk-header-glass);
}

body.fwk-header-overlay #masthead.fwk-site-header--overlay.is-scrolled {
	position: fixed;
	background-color: var(--fwk-header-glass-dense);
}

/* Non-home / scrolled: denser frosted, still translucent (not solid white) */
body:not(.fwk-header-overlay) #masthead.fwk-site-header,
#masthead.fwk-site-header.is-scrolled {
	background-color: var(--fwk-header-glass-dense);
}

.fwk-site-header__inner {
	display: flex;
	align-items: center;
	min-height: var(--fwk-header-height);
	padding-inline: var(--fwk-header-gutter);
}

.fwk-site-header__content {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-4);
	width: 100%;
	max-width: 1242px;
	margin-inline: auto;
	min-height: 3.75rem;
}

.fwk-site-header__brand {
	flex: 0 0 auto;
	min-width: 0;
}

.fwk-site-header__logo {
	display: inline-flex;
	align-items: center;
	line-height: 0;
}

.fwk-site-header__logo img {
	display: block;
	width: auto;
	height: 2.5rem; /* ~40px — stacked ShoesBOX lockup */
	max-width: min(8.5rem, 42vw);
	object-fit: contain;
	/* Lift the lockup off the glass header (Figma HDR-F). */
	filter:
		drop-shadow(0 1px 1px rgba(15, 32, 56, 0.18))
		drop-shadow(0 2px 4px rgba(15, 32, 56, 0.16));
}

@media screen and (min-width: 1025px) {
	.fwk-site-header__logo img {
		height: 2.75rem; /* ~44px */
		max-width: 9rem;
	}
}

.fwk-site-header__nav {
	display: none;
	flex: 1 1 auto;
	justify-content: center;
	min-width: 0;
}

@media screen and (min-width: 1025px) {
	.fwk-site-header__nav {
		display: flex;
	}
}

.fwk-site-header__menu {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0 1.25rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.fwk-site-header__link {
	display: inline-flex;
	align-items: center;
	padding: 0.48rem 0.525rem;
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.4;
	color: #575f66;
	text-decoration: none;
	transition: color var(--fwk-duration-fast) var(--fwk-ease);
}

.fwk-site-header__link:hover,
.fwk-site-header__item.is-current .fwk-site-header__link,
.fwk-site-header__link[aria-current="page"] {
	color: var(--fwk-color-text, #1a2026);
}

.fwk-site-header__actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 0.35rem;
	flex: 0 0 auto;
}

.fwk-site-header__action {
	display: flex;
	align-items: center;
}

/* Search: white rounded chip (Figma) */
.fwk-site-header .fwk-icon-button--search,
.fwk-site-header .search-toggle-open.fwk-icon-button--search {
	background: #fff;
	border-radius: 6px;
	color: #3c434a;
}

.fwk-site-header .fwk-icon-button--search:hover,
.fwk-site-header .search-toggle-open.fwk-icon-button--search:hover {
	background: #fff;
	color: var(--fwk-color-text);
}

.fwk-site-header .search-toggle-icon,
.fwk-site-header .fwk-wishlist-header__icon,
.fwk-site-header .fwk-site-header__cart-icon,
.fwk-site-header .menu-toggle-icon {
	display: inline-flex;
	line-height: 0;
}

.fwk-site-header .search-toggle-icon svg,
.fwk-site-header .fwk-wishlist-header__icon svg,
.fwk-site-header .fwk-site-header__cart-icon svg,
.fwk-site-header .menu-toggle-icon svg {
	width: 1.125rem;
	height: 1.125rem;
	display: block;
}

.fwk-site-header .header-cart-button {
	position: relative;
}

.fwk-site-header .header-cart-button .header-cart-total {
	position: absolute;
	top: 0.15rem;
	right: 0.1rem;
	/* Neutralize Kadence `.header-cart-button .header-cart-total` (2.1em square /
	   0.65em font) so the cart badge matches the wishlist badge lockup. */
	width: auto;
	height: auto;
	min-width: 1.15rem;
	min-height: 1.15rem;
	padding: 0 0.3em;
	font-size: var(--fwk-text-xs);
}

/* Menu hamburger: mobile/tablet only */
.fwk-site-header__menu-toggle {
	display: flex;
}

@media screen and (min-width: 1025px) {
	.fwk-site-header__menu-toggle {
		display: none;
	}
}

/* Focus when Kadence adds hide-focus-outline */
body.hide-focus-outline a:focus-visible,
body.hide-focus-outline button:focus-visible,
body.hide-focus-outline [tabindex]:focus-visible,
body.hide-focus-outline .search-toggle-open:focus-visible,
body.hide-focus-outline .header-cart-button:focus-visible,
body.hide-focus-outline .menu-toggle-open:focus-visible,
body.hide-focus-outline .fwk-site-header__link:focus-visible {
	outline: 2px solid var(--fwk-color-focus, var(--fwk-color-accent));
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	#masthead.fwk-site-header {
		backdrop-filter: none;
		-webkit-backdrop-filter: none;
		background: color-mix(in oklch, var(--fwk-color-surface) 94%, transparent);
	}
}

/* Cart count badge ? desktop + mobile header */
.header-cart-wrap .header-cart-total,
.header-mobile-cart-wrap .header-cart-total,
.header-cart-total {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.15rem;
	min-height: 1.15rem;
	padding: 0 0.3em;
	border-radius: var(--fwk-radius-pill);
	background: var(--fwk-button-ink);
	color: var(--fwk-color-on-cta);
	font-size: var(--fwk-text-xs);
	font-weight: 700;
	font-variant-numeric: tabular-nums lining-nums;
	line-height: 1;
	/* Never hide the digit (opacity only softens empty state). */
	visibility: visible;
}

/* Empty: hide digit noise (HDR-B P1-5); keep fragment hooks in DOM */
.header-cart-is-empty-true .header-cart-total,
.header-cart-total.header-cart-is-empty-true {
	display: none !important;
}

.header-cart-is-empty-false .header-cart-total,
.header-cart-total.header-cart-is-empty-false {
	display: inline-flex;
	opacity: 1;
}

/* Mobile sticky / drawer header: same badge prominence as desktop */
#mobile-header .header-mobile-cart-wrap .header-cart-button {
	position: relative;
}

#mobile-header .header-mobile-cart-wrap .header-cart-total {
	opacity: 1;
	/* Same neutralization as desktop (Kadence 2.1em square). */
	width: auto;
	height: auto;
	min-width: 1.15rem;
	min-height: 1.15rem;
	padding: 0 0.3em;
	font-size: var(--fwk-text-xs);
}

#mobile-header .header-mobile-cart-wrap .header-cart-total.header-cart-is-empty-true {
	display: none !important;
}

/* G5 ? Mobile drawer zones (W-HDR XOR: zones replace WP #mobile-menu) */
.fwk-drawer-zones {
	display: grid;
	gap: var(--fwk-space-6);
	margin-block-end: var(--fwk-space-4);
	padding-inline: var(--fwk-space-1);
}

.fwk-drawer-zone__title {
	margin: 0 0 var(--fwk-space-3);
	font-size: var(--fwk-text-xs);
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--fwk-color-muted);
}

/* 2x2 audience grid ? no orphan chip */
.fwk-drawer-cats {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--fwk-space-2);
}

.fwk-drawer-zone__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: var(--fwk-space-1);
}

.fwk-drawer-zone__link {
	display: inline-flex;
	align-items: center;
	min-height: 48px;
	padding-inline: var(--fwk-space-1);
	font-weight: 600;
	font-size: var(--fwk-text-base);
	color: var(--fwk-color-text);
	text-decoration: none;
	border-radius: var(--fwk-radius-sm);
}

.fwk-drawer-zone__link:hover,
.fwk-drawer-zone__link:focus-visible {
	color: var(--fwk-color-accent);
}

.fwk-drawer-zone__link:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
}

.fwk-drawer-zone__link--sale {
	color: var(--fwk-color-sale);
	font-weight: 700;
}

.fwk-drawer-zone__link--muted {
	font-weight: 500;
	color: var(--fwk-color-muted);
	font-size: var(--fwk-text-sm);
	min-height: 44px;
}

#mobile-drawer .drawer-content .fwk-drawer-cats .fwk-chip {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 48px;
	padding-inline: var(--fwk-space-3);
	text-align: center;
	text-decoration: none;
}

/* Kadence popup-drawer paints #fff text ? force Kit ink on close */
#mobile-drawer .drawer-inner {
	background: var(--fwk-color-bg);
	color: var(--fwk-color-text);
}

#mobile-drawer .drawer-header {
	position: sticky;
	top: 0;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 3.25rem;
	padding: var(--fwk-space-2) 1.25rem;
	border-bottom: 1px solid var(--fwk-color-border);
	background: var(--fwk-color-surface);
	color: var(--fwk-color-text);
}

#mobile-drawer .menu-toggle-close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: var(--fwk-space-2);
	margin: 0;
	border: 0;
	border-radius: var(--fwk-radius-control);
	background: transparent;
	color: var(--fwk-color-text);
	box-shadow: none;
	cursor: pointer;
}

#mobile-drawer .menu-toggle-close:hover,
#mobile-drawer .menu-toggle-close:focus-visible {
	background: var(--fwk-color-sunken);
	color: var(--fwk-color-text);
}

#mobile-drawer .menu-toggle-close:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
}

#mobile-drawer .menu-toggle-close .kadence-svg-icon,
#mobile-drawer .menu-toggle-close svg {
	color: inherit;
	fill: currentColor;
	stroke: currentColor;
}

#mobile-drawer .mobile-navigation:not(:has(.menu > li)),
#mobile-drawer .mobile-menu-container:not(:has(.menu > li)) {
	display: none;
}

/* Mobile header icons: ghost Kit, same weight */
@media (max-width: 48em) {
	#mobile-header .search-toggle-open,
	#mobile-header .header-cart-button,
	#mobile-header .menu-toggle-open,
	#mobile-header #mobile-toggle.menu-toggle-open {
		border-color: transparent;
		background: transparent;
		box-shadow: none;
	}

	#mobile-header .search-toggle-open:hover,
	#mobile-header .search-toggle-open:focus-visible,
	#mobile-header .header-cart-button:hover,
	#mobile-header .header-cart-button:focus-visible,
	#mobile-header .menu-toggle-open:hover,
	#mobile-header .menu-toggle-open:focus-visible,
	#mobile-header #mobile-toggle.menu-toggle-open:hover,
	#mobile-header #mobile-toggle.menu-toggle-open:focus-visible {
		background: var(--fwk-color-sunken);
		border-color: transparent;
		color: var(--fwk-color-accent);
	}
}
/* G6 — Mini-cart drawer (grid row + incentive + upsell + pinned footer) */
/* Beat Kadence `.popup-drawer .drawer-inner { overflow: auto }` — one scroll layer only. */
#cart-drawer.popup-drawer .drawer-inner,
#cart-drawer .drawer-inner {
	background: var(--fwk-color-bg);
	display: flex;
	flex-direction: column;
	height: 100%;
	max-height: 100dvh;
	min-height: 0;
	overflow: hidden;
}

#cart-drawer .drawer-content.widget_shopping_cart {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
	overflow: hidden;
	/* Kadence base .popup-drawer .drawer-content adds 1.5em inline padding;
	   this theme's own blocks (incentive/list/upsell/footer) already carry
	   their own --fwk-space-5 inline padding, so the Kadence value only
	   doubled the inset (~44px) on every row. Zero it here so the mini-cart
	   item row can use the drawer width, while incentive/upsell/footer keep
	   their own (unchanged) horizontal padding and stay aligned with it. */
	padding-inline: 0;
}

/* Kadence wrappers between .drawer-content and our scroll/footer — must
   participate in the flex column or .fwk-mini-cart-scroll never gets a
   clipped height and the sticky footer overlays items + upsell. */
#cart-drawer .mini-cart-container,
#cart-drawer .kadence-mini-cart-refresh {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
	overflow: hidden;
	height: 100%;
}

#cart-drawer .fwk-cart-incentive {
	flex: 0 0 auto;
}

#cart-drawer .fwk-mini-cart-scroll {
	flex: 1 1 auto;
	min-height: 0;
	overflow-x: hidden;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	/* Scroll via wheel/touch; hide track (nested Kadence bars ate gutter). */
	scrollbar-width: none;
	-ms-overflow-style: none;
	overscroll-behavior: contain;
	padding-bottom: var(--fwk-space-4);
}

#cart-drawer .fwk-mini-cart-scroll::-webkit-scrollbar {
	display: none;
	width: 0;
	height: 0;
}

#cart-drawer .drawer-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-3);
	padding: 8px var(--fwk-space-5) !important;
	min-height: 0 !important;
	height: auto !important;
	border-bottom: 1px solid var(--fwk-color-border);
	background: var(--fwk-color-surface);
	flex: 0 0 auto;
}

#cart-drawer .side-cart-header {
	margin: 0;
	font-family: var(--fwk-font-display);
	font-size: var(--fwk-text-base);
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -0.02em;
	color: var(--fwk-color-text);
}

#cart-drawer .side-cart-header__count {
	margin-left: var(--fwk-space-1);
	font-family: inherit;
	font-weight: 500;
	color: var(--fwk-color-muted);
}

#cart-drawer .cart-toggle-close {
	width: 40px;
	height: 40px;
	min-width: 40px;
	min-height: 40px;
	padding: 0;
}

/* Beat Kadence `#cart-drawer.popup-drawer .drawer-content ul.product_list_widget
   { max-height:…; overflow:auto }` — list grows inside .fwk-mini-cart-scroll. */
#cart-drawer.popup-drawer .drawer-content ul.product_list_widget,
#cart-drawer .woocommerce-mini-cart {
	margin: 0;
	padding: var(--fwk-space-2) var(--fwk-space-5);
	list-style: none;
	max-height: none;
	overflow: visible;
	width: 100%;
	box-sizing: border-box;
}

/* Row: media | body(title, meta, foot: price + stepper). Beat Kadence/Woo floats. */
#cart-drawer .fwk-mini-cart-item,
#cart-drawer .woocommerce-mini-cart-item.fwk-mini-cart-item,
#cart-drawer.popup-drawer .drawer-content ul.product_list_widget li.fwk-mini-cart-item {
	display: grid !important;
	grid-template-columns: var(--fwk-cart-media-w, 5.5rem) minmax(0, 1fr);
	grid-template-rows: auto;
	column-gap: var(--fwk-space-3);
	row-gap: 0;
	align-items: start;
	justify-items: stretch;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	padding-block: var(--fwk-space-3);
	padding-inline: 0;
	margin: 0;
	border-bottom: 1px solid var(--fwk-color-border);
	position: static;
	float: none;
	clear: both;
}

#cart-drawer .fwk-mini-cart-item::before,
#cart-drawer .fwk-mini-cart-item::after,
#cart-drawer .woocommerce-mini-cart-item.fwk-mini-cart-item::before,
#cart-drawer .woocommerce-mini-cart-item.fwk-mini-cart-item::after {
	content: none !important;
	display: none !important;
}

#cart-drawer .fwk-mini-cart-item > .fwk-mini-cart-item__media,
#cart-drawer .fwk-mini-cart-item > .fwk-mini-cart-item__body {
	float: none;
	clear: none;
	margin: 0;
	max-width: none;
}

.fwk-mini-cart-item__media,
#cart-drawer .fwk-mini-cart-item__media {
	display: block;
	grid-column: 1;
	grid-row: 1;
	width: var(--fwk-cart-media-w, 5.5rem);
	height: auto;
	aspect-ratio: var(--fwk-cart-media-ratio, 5 / 3);
	border-radius: var(--fwk-radius-sm);
	overflow: clip;
	background: #fff !important;
	text-decoration: none;
	justify-self: start;
	align-self: start;
}

/*
 * LAW: cart thumbs = packshot contain on white. Never cover-crop landscape
 * assets (woocommerce_thumbnail is uncropped ~2:1) into a square slot.
 * Unified white slot: mini-cart, cart page, upsell, checkout review, legacy table.
 */
.fwk-mini-cart-item__media,
.fwk-mini-cart-item__media img,
.fwk-cart-line__media,
.fwk-cart-line__media a,
.fwk-cart-line__media img,
.fwk-cart-upsell__media,
.fwk-cart-upsell__media img,
.fwk-review__media,
.fwk-review__media img,
.fwk-review__thumb,
.fwk-review__thumb img,
img.fwk-cart-thumb,
.fwk-cart-page table.cart .product-thumbnail,
.fwk-cart-page table.cart .product-thumbnail a,
.fwk-cart-page table.cart .product-thumbnail img,
.fwk-cart-page table.shop_table .product-thumbnail,
.fwk-cart-page table.shop_table .product-thumbnail a,
.fwk-cart-page table.shop_table .product-thumbnail img {
	background: #fff !important;
	background-color: #fff !important;
}

.fwk-cart-thumb,
#cart-drawer .fwk-cart-thumb,
.fwk-mini-cart-item__media img,
#cart-drawer .fwk-mini-cart-item__media img,
#cart-drawer .fwk-mini-cart-item__media img.fwk-cart-thumb,
.fwk-cart-line__media img,
.fwk-cart-line__media img.fwk-cart-thumb,
.fwk-cart-upsell__media img {
	display: block !important;
	float: none !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;
	margin: 0 !important;
	padding: 0 !important;
	object-fit: contain !important;
	object-position: center !important;
	border: 0 !important;
	background: #fff !important;
	box-sizing: border-box;
}

.fwk-mini-cart-item__body,
#cart-drawer .fwk-mini-cart-item__body {
	grid-column: 2;
	grid-row: 1;
	min-width: 0;
	width: 100%;
	max-width: 100%;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 2px;
	text-align: start;
}

.fwk-mini-cart-item__foot,
#cart-drawer .fwk-mini-cart-item__foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-3);
	width: 100%;
	min-width: 0;
	margin-top: 4px;
}

.fwk-mini-cart-item__foot .fwk-mini-cart-item__price,
#cart-drawer .fwk-mini-cart-item__foot .fwk-mini-cart-item__price {
	flex: 1 1 auto;
	min-width: 0;
}

.fwk-mini-cart-item__foot .fwk-qty-stepper,
#cart-drawer .fwk-mini-cart-item__foot .fwk-qty-stepper {
	flex: 0 0 auto;
	margin: 0;
}

.fwk-mini-cart-item__title {
	font-weight: 600;
	font-size: var(--fwk-text-sm);
	line-height: 1.35;
	color: var(--fwk-color-text);
	text-decoration: none;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.fwk-mini-cart-item__title:hover {
	color: var(--fwk-color-cta);
}

.fwk-mini-cart-item__meta,
.fwk-mini-cart-item__meta .variation,
.fwk-mini-cart-item__meta dl,
#cart-drawer .fwk-mini-cart-item__meta dl.variation {
	display: block;
	margin: 0;
	padding: 0;
	font-size: var(--fwk-text-xs);
	color: var(--fwk-color-muted);
	line-height: 1.35;
	text-align: start;
	float: none;
	width: auto;
	max-width: 100%;
}

.fwk-mini-cart-item__meta dt,
.fwk-mini-cart-item__meta dd,
#cart-drawer .fwk-mini-cart-item__meta dl.variation dt,
#cart-drawer .fwk-mini-cart-item__meta dl.variation dd {
	display: inline;
	float: none;
	margin: 0;
	padding: 0;
	text-align: start;
}

/* WC already prints «Розмір:» in <dt> — no extra colon. */
.fwk-mini-cart-item__meta dt::after,
#cart-drawer .fwk-mini-cart-item__meta dl.variation dt::after {
	content: none;
}

.fwk-mini-cart-item__meta dd,
#cart-drawer .fwk-mini-cart-item__meta dl.variation dd {
	margin-inline-end: 0.35em;
}

.fwk-mini-cart-item__meta dd p,
#cart-drawer .fwk-mini-cart-item__meta dl.variation dd p {
	display: inline;
	margin: 0;
}

.fwk-mini-cart-item__qty,
.fwk-mini-cart-item__price,
#cart-drawer .fwk-mini-cart-item .quantity,
#cart-drawer .fwk-mini-cart-item .fwk-mini-cart-item__price {
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-text);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	padding: 0;
	flex: none;
}

/* Qty stepper (trash | N | +) — Figma cart card / mini-cart shared */
.fwk-qty-stepper {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 0;
	box-sizing: border-box;
	width: 70px;
	min-width: 70px;
	height: 32px;
	min-height: 32px;
	padding: 5px;
	border: 0.5px solid #e2e2e2;
	border-radius: 3px;
	background: var(--fwk-color-surface);
}

.fwk-qty-stepper__dec,
.fwk-qty-stepper__inc {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 12px;
	height: 12px;
	min-width: 12px;
	min-height: 12px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 2px;
	background: transparent;
	color: var(--fwk-color-muted);
	cursor: pointer;
	line-height: 1;
	font-size: 14px;
	font-weight: 600;
	transition: color 0.15s ease, background-color 0.15s ease;
}

/* Enlarge hit target without growing the Figma chrome */
.fwk-qty-stepper__dec::before,
.fwk-qty-stepper__inc::before {
	content: "";
	position: absolute;
	inset: -6px -4px;
}

.fwk-qty-stepper__dec,
.fwk-qty-stepper__inc {
	position: relative;
}

.fwk-qty-stepper__dec .fwk-icon-trash {
	width: 12px;
	height: 12px;
	flex: 0 0 12px;
}

.fwk-qty-stepper__input {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
	opacity: 0;
	pointer-events: none;
}

.fwk-qty-stepper__value {
	flex: 1 1 auto;
	min-width: 1rem;
	text-align: center;
	font-family: var(--fwk-font);
	font-size: 14px;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	color: var(--fwk-color-text);
	line-height: 1;
	border-inline: 0.5px solid #e2e2e2;
	padding-inline: 4px;
}

.fwk-qty-stepper__dec:hover,
.fwk-qty-stepper__dec:focus-visible,
.fwk-qty-stepper__dec:active {
	color: var(--fwk-color-danger);
	background: transparent;
	outline: none;
}

.fwk-qty-stepper__inc:hover,
.fwk-qty-stepper__inc:focus-visible {
	color: var(--fwk-color-success);
	background: transparent;
	outline: none;
}

.fwk-qty-stepper__dec:focus-visible,
.fwk-qty-stepper__inc:focus-visible {
	box-shadow: var(--fwk-focus-ring);
}

.fwk-qty-stepper__inc:disabled,
.fwk-qty-stepper.is-busy .fwk-qty-stepper__dec,
.fwk-qty-stepper.is-busy .fwk-qty-stepper__inc {
	opacity: 0.45;
	cursor: not-allowed;
	pointer-events: none;
}

.fwk-mini-cart-item__remove,
#cart-drawer .fwk-mini-cart-item .remove {
	position: static;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: 0;
	border-radius: var(--fwk-radius-sm);
	border: 0;
	background: transparent;
	color: var(--fwk-color-muted);
	text-decoration: none;
	line-height: 1;
	justify-self: end;
}

.fwk-mini-cart-item__remove:hover,
.fwk-mini-cart-item__remove:focus-visible,
#cart-drawer .fwk-mini-cart-item .remove:hover,
#cart-drawer .fwk-mini-cart-item .remove:focus-visible {
	color: var(--fwk-color-danger);
	border-color: transparent;
	background: transparent;
}

.fwk-icon-trash {
	display: block;
	width: 20px;
	height: 20px;
	flex: 0 0 20px;
}

/* Incentive */
.fwk-cart-incentive {
	margin: 0;
	padding: var(--fwk-space-3) var(--fwk-space-5);
	border-bottom: 1px solid var(--fwk-color-border);
	background: var(--fwk-color-surface);
}

.fwk-cart-incentive__primary {
	margin: 0;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	line-height: 1.35;
	color: var(--fwk-color-text);
}

.fwk-cart-incentive__secondary {
	margin: 4px 0 0;
	font-size: var(--fwk-text-xs);
	color: var(--fwk-color-muted);
	line-height: 1.35;
}

.fwk-cart-incentive__track {
	margin-top: var(--fwk-space-2);
	height: 4px;
	border-radius: 999px;
	background: var(--fwk-color-sunken);
	overflow: clip;
}

.fwk-cart-incentive__fill {
	display: block;
	height: 100%;
	border-radius: inherit;
	background: var(--fwk-color-selected);
	max-width: 100%;
}

.fwk-cart-incentive__gift {
	margin: 0;
	font-size: calc(var(--fwk-text-xs) + 2pt);
	font-weight: 600;
	line-height: 1.35;
	color: var(--fwk-color-text);
}

.fwk-cart-incentive__gift--nudge {
	font-size: var(--fwk-text-sm);
	line-height: 1.35;
}

.fwk-cart-incentive__gift-sub {
	margin: 0;
	font-size: var(--fwk-text-sm);
	font-weight: 500;
	color: var(--fwk-color-muted);
	line-height: 1.4;
}

.fwk-cart-incentive--cart {
	padding: 0 0 var(--fwk-space-4);
	border-bottom: 0;
	background: transparent;
}

/*
 * Jibbitz incentive — quiet status strip (not a CTA blue plate).
 * Applied = soft brand/success; nudge = soft sky “action needed”.
 * Must follow --cart so strip bg/padding win over transparent cart reset.
 */
.fwk-cart-incentive--jibbitz-applied,
.fwk-cart-incentive--jibbitz-nudge {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: var(--fwk-space-2);
	padding: var(--fwk-space-3) var(--fwk-space-3) var(--fwk-space-3) var(--fwk-space-4);
	border: 0;
	border-inline-start: 3px solid var(--fwk-color-selected);
	border-radius: var(--fwk-radius-sm);
	background: color-mix(in oklch, var(--fwk-color-brand-soft) 65%, var(--fwk-color-surface));
}

.fwk-cart-incentive--jibbitz-nudge {
	border-inline-start-color: var(--fwk-color-cta);
	background: color-mix(in oklch, var(--fwk-sky-100) 75%, var(--fwk-color-surface));
}

.fwk-cart-incentive--jibbitz-nudge .fwk-cart-incentive__gift--nudge {
	padding: 0;
	border-radius: 0;
	background: transparent;
	color: var(--fwk-color-text);
}

.fwk-cart-incentive--jibbitz-applied .fwk-cart-incentive__gift,
.fwk-cart-incentive--jibbitz-nudge .fwk-cart-incentive__gift {
	margin: 0;
	font-size: calc(var(--fwk-text-sm) + 1pt);
	font-weight: 600;
	line-height: 1.35;
	color: var(--fwk-color-text);
}

.fwk-cart-incentive--jibbitz-applied .fwk-cart-incentive__gift-sub,
.fwk-cart-incentive--jibbitz-nudge .fwk-cart-incentive__gift-sub {
	margin: 0;
	font-size: var(--fwk-text-sm);
	font-weight: 500;
	line-height: 1.4;
	color: var(--fwk-color-muted);
}

.fwk-cart-incentive--cart.fwk-cart-incentive--jibbitz-applied,
.fwk-cart-incentive--cart.fwk-cart-incentive--jibbitz-nudge {
	margin: 0 0 var(--fwk-space-3);
	padding: var(--fwk-space-3) var(--fwk-space-3) var(--fwk-space-3) var(--fwk-space-4);
	border-bottom: 0;
	background: color-mix(in oklch, var(--fwk-color-brand-soft) 65%, var(--fwk-color-surface));
}

.fwk-cart-incentive--cart.fwk-cart-incentive--jibbitz-nudge {
	background: color-mix(in oklch, var(--fwk-sky-100) 75%, var(--fwk-color-surface));
}

.fwk-cart-incentive--checkout.fwk-cart-incentive--jibbitz-applied,
.fwk-cart-incentive--checkout.fwk-cart-incentive--jibbitz-nudge,
.fwk-cart-incentive--pdp.fwk-cart-incentive--jibbitz-applied,
.fwk-cart-incentive--pdp.fwk-cart-incentive--jibbitz-nudge {
	margin: 0 0 var(--fwk-space-4);
}

.fwk-cart-incentive--pdp {
	max-width: 100%;
}

.fwk-cart-incentive--jibbitz-applied .fwk-cart-incentive__gift-sub a,
.fwk-cart-incentive--jibbitz-nudge .fwk-cart-incentive__gift-sub a {
	color: var(--fwk-color-text);
	font-weight: 600;
	text-decoration: underline;
	text-decoration-color: color-mix(in oklch, var(--fwk-color-text) 30%, transparent);
	text-underline-offset: 0.18em;
}

.fwk-cart-incentive--jibbitz-applied .fwk-cart-incentive__gift-sub a:hover,
.fwk-cart-incentive--jibbitz-applied .fwk-cart-incentive__gift-sub a:focus-visible,
.fwk-cart-incentive--jibbitz-nudge .fwk-cart-incentive__gift-sub a:hover,
.fwk-cart-incentive--jibbitz-nudge .fwk-cart-incentive__gift-sub a:focus-visible {
	color: var(--fwk-color-cta);
	text-decoration-color: var(--fwk-color-cta);
}

/* Bonus Jibbitz price: strikethrough + −N% / «Подарунок» */
.fwk-jibbitz-gift-price {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.35em;
}

.fwk-jibbitz-gift-price__was {
	font-weight: 400;
	text-decoration: line-through;
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-muted);
}

.fwk-jibbitz-gift-price__now {
	text-decoration: none;
	font-weight: 600;
	color: var(--fwk-color-text);
}

.fwk-jibbitz-gift-price__pct,
.fwk-jibbitz-gift-price__badge {
	display: inline-block;
	padding: 0.15em 0.45em;
	border-radius: 4px;
	font-size: var(--fwk-text-xs);
	font-weight: 700;
	line-height: 1.2;
	color: var(--fwk-color-on-cta);
	background: var(--fwk-color-sale);
	white-space: nowrap;
}

.fwk-jibbitz-gift-price--gift .fwk-jibbitz-gift-price__now {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.fwk-jibbitz-gift-price--gift {
	position: relative;
	align-items: center;
}

.fwk-jibbitz-gift-price__mix {
	flex-basis: 100%;
	font-size: var(--fwk-text-xs);
	font-weight: 400;
	color: var(--fwk-color-muted);
}

.fwk-cart-incentive__gift-sub a {
	color: var(--fwk-color-cta);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.fwk-cart-incentive__gift-sub a:hover,
.fwk-cart-incentive__gift-sub a:focus-visible {
	color: var(--fwk-color-cta-hover);
}

/* Upsell strip — minimal (no card frames / no clip) */
.fwk-cart-upsell {
	padding: var(--fwk-space-3) 0 var(--fwk-space-5);
	border-top: 1px solid var(--fwk-color-border);
	margin-bottom: var(--fwk-space-2);
}

.fwk-cart-upsell__title {
	margin: 0 var(--fwk-space-5) var(--fwk-space-2);
	font-size: var(--fwk-text-sm);
	font-weight: 700;
	color: var(--fwk-color-text);
}

.fwk-cart-upsell__list {
	display: flex;
	gap: var(--fwk-space-3);
	margin: 0;
	padding: 0 var(--fwk-space-5) var(--fwk-space-4);
	padding-inline-end: calc(var(--fwk-space-5) + 0.75rem);
	list-style: none;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
}

.fwk-cart-upsell__item {
	flex: 0 0 6.75rem;
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-height: 0;
	background: transparent;
	border: 0;
	box-shadow: none;
	padding: 0;
}

.fwk-cart-upsell__media {
	display: block;
	width: 100%;
	aspect-ratio: var(--fwk-cart-media-ratio, 5 / 3);
	height: auto;
	flex: 0 0 auto;
	border-radius: 0;
	overflow: clip;
	background: #fff !important;
}

.fwk-cart-upsell__media img {
	width: 100%;
	height: 100%;
	object-fit: contain !important;
	object-position: center;
	display: block;
	background: #fff !important;
}

.fwk-cart-upsell__body {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.fwk-cart-upsell__name {
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	color: var(--fwk-color-text);
	text-decoration: none;
	line-height: 1.3;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.fwk-cart-upsell__price {
	font-size: var(--fwk-text-sm);
	font-weight: 500;
	font-variant-numeric: tabular-nums;
	color: var(--fwk-color-text);
}

.fwk-cart-upsell__cta,
#cart-drawer a.fwk-cart-upsell__cta,
#cart-drawer a.fwk-cart-upsell__cta.fwk-btn-plain {
	margin-top: 2px;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	align-self: start;
	background: transparent;
	border: 0;
	padding: 0;
	box-shadow: none;
	border-radius: 0;
	text-decoration: none !important;
	color: var(--fwk-color-cta);
}

.fwk-cart-upsell__cta:hover,
.fwk-cart-upsell__cta:focus,
.fwk-cart-upsell__cta:focus-visible,
.fwk-cart-upsell__cta:active,
#cart-drawer a.fwk-cart-upsell__cta:hover,
#cart-drawer a.fwk-cart-upsell__cta:focus,
#cart-drawer a.fwk-cart-upsell__cta:focus-visible,
#cart-drawer a.fwk-cart-upsell__cta:active {
	text-decoration: none !important;
	color: var(--fwk-color-cta-hover);
}

.fwk-cart-upsell--cart {
	margin-top: var(--fwk-space-4);
	padding-inline: 0;
}

.fwk-cart-upsell--cart .fwk-cart-upsell__title,
.fwk-cart-upsell--cart .fwk-cart-upsell__list {
	margin-inline: 0;
	padding-inline: 0;
}

/* Cart aside: one step under line (lg), keeps price/upsell ratio ≤1.35. */
.fwk-cart-page .fwk-cart-upsell__name,
.fwk-cart-page .fwk-cart-upsell__price,
.fwk-cart-page .fwk-cart-upsell__cta,
.fwk-cart-upsell--cart .fwk-cart-upsell__name,
.fwk-cart-upsell--cart .fwk-cart-upsell__price,
.fwk-cart-upsell--cart .fwk-cart-upsell__cta {
	font-size: var(--fwk-text-base);
}

/* Free-ship progress under «Разом» */
.fwk-mini-cart-ship-progress {
	margin: 0;
	padding: 0 var(--fwk-space-5) var(--fwk-space-2);
}

.fwk-mini-cart-ship-progress__label {
	margin: 0 0 var(--fwk-space-2);
	font-size: var(--fwk-text-sm);
	font-weight: 500;
	line-height: 1.4;
	color: var(--fwk-color-muted);
}

.fwk-mini-cart-ship-progress.is-unlocked .fwk-mini-cart-ship-progress__label {
	color: var(--fwk-color-success);
	font-weight: 600;
}

.fwk-mini-cart-ship-progress__track {
	height: 4px;
	border-radius: 999px;
	background: var(--fwk-color-sunken);
	overflow: clip;
}

.fwk-mini-cart-ship-progress__fill {
	display: block;
	height: 100%;
	border-radius: inherit;
	background: var(--fwk-color-selected);
	max-width: 100%;
	transition: width 0.25s ease;
}

.fwk-mini-cart-ship-progress--cart {
	padding: var(--fwk-space-3) 0 var(--fwk-space-4);
}

/* Cart summary: status line must match incentive type scale (not xs meta). */
.fwk-mini-cart-ship-progress--cart .fwk-mini-cart-ship-progress__label {
	margin: 0 0 var(--fwk-space-3);
	font-size: calc(var(--fwk-text-sm) + 1pt);
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: 0.01em;
}

.fwk-mini-cart-ship-progress--cart.is-unlocked .fwk-mini-cart-ship-progress__label {
	color: var(--fwk-color-success);
}

.fwk-mini-cart-ship-progress--cart .fwk-mini-cart-ship-progress__track {
	height: 5px;
}

/* Checkout summary (aside) — same rhythm as cart progress. */
.fwk-mini-cart-ship-progress--checkout {
	padding: var(--fwk-space-3) 0 0;
	margin-block-start: var(--fwk-space-2);
	border-top: 1px solid var(--fwk-color-border);
}

.fwk-mini-cart-ship-progress--checkout .fwk-mini-cart-ship-progress__label {
	margin: 0 0 var(--fwk-space-3);
	font-size: calc(var(--fwk-text-sm) + 1pt);
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: 0.01em;
}

.fwk-checkout-page .fwk-mini-cart-ship-progress--checkout.is-unlocked .fwk-mini-cart-ship-progress__label {
	/* Checkout ink zone: no brand-green money/status. */
	color: var(--fwk-color-text);
}

.fwk-mini-cart-ship-progress--checkout .fwk-mini-cart-ship-progress__track {
	height: 5px;
}

/* Pinned footer — flex sibling (not sticky overlay over scrollport) */
#cart-drawer .fwk-mini-cart-footer {
	margin-top: auto;
	flex: 0 0 auto;
	background: var(--fwk-color-surface);
	border-top: 1px solid var(--fwk-color-border);
	position: static;
	z-index: auto;
}

#cart-drawer .woocommerce-mini-cart__total {
	margin: 0;
	padding: var(--fwk-space-4) var(--fwk-space-5) var(--fwk-space-2);
	border: 0;
	background: transparent;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	display: flex;
	justify-content: space-between;
	gap: var(--fwk-space-3);
}

#cart-drawer .woocommerce-mini-cart__buttons {
	display: grid;
	gap: var(--fwk-space-3);
	margin: 0;
	padding: var(--fwk-space-2) var(--fwk-space-5) var(--fwk-space-5);
}

#cart-drawer .woocommerce-mini-cart__buttons .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	margin: 0;
	width: 100%;
	border-radius: var(--fwk-radius-control);
	font-weight: 600;
	text-align: center;
}

#cart-drawer .woocommerce-mini-cart__buttons .checkout {
	background: var(--fwk-button-ink);
	border-color: transparent;
	color: var(--fwk-color-on-cta);
}

#cart-drawer .woocommerce-mini-cart__buttons .checkout:hover {
	background: var(--fwk-button-ink-hover);
	border-color: transparent;
	color: var(--fwk-color-on-cta);
	box-shadow: var(--fwk-shadow-sm);
}

#cart-drawer .woocommerce-mini-cart__buttons .checkout:focus-visible {
	outline: none;
	background: var(--fwk-button-ink-hover);
	border-color: transparent;
	color: var(--fwk-color-on-cta);
	box-shadow: var(--fwk-focus-ring);
}

#cart-drawer .woocommerce-mini-cart__buttons .checkout:active {
	background: var(--fwk-button-ink-active);
	box-shadow: none;
	transform: scale(0.97);
}

.fwk-mini-cart-empty-cta {
	display: inline-flex;
	margin-block-start: var(--fwk-space-4);
	min-height: 44px;
}

.fwk-mini-cart-empty {
	padding: var(--fwk-space-8) var(--fwk-space-5);
	text-align: center;
}

#cart-drawer .woocommerce-mini-cart__empty-message,
.widget_shopping_cart .woocommerce-mini-cart__empty-message {
	margin: 0;
	font-size: var(--fwk-text-base);
	font-weight: 600;
	color: var(--fwk-color-text);
	line-height: 1.45;
}

.fwk-mini-cart-empty__hint {
	margin: var(--fwk-space-2) 0 0;
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-muted);
	line-height: 1.45;
}

#cart-drawer .woocommerce-mini-cart__empty-cta {
	display: flex;
	justify-content: center;
	margin: var(--fwk-space-5) 0 0;
}

/* G7 ? Search drawer (soft minimalism)
 * Kadence `.popup-drawer .drawer-inner { color:#fff }` is for dark overlay.
 * Light Kit surfaces ? reset color + close icon, drop border noise.
 */
#search-drawer .drawer-inner {
	background:
		linear-gradient(180deg, var(--fwk-sky-100) 0%, var(--fwk-color-bg) 32%),
		var(--fwk-color-bg);
	color: var(--fwk-color-text);
}

#search-drawer .drawer-header {
	border-bottom: 0;
	background: transparent;
}

#search-drawer .drawer-header .search-toggle-close,
#search-drawer .drawer-header .drawer-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: var(--fwk-space-2);
	margin: var(--fwk-space-2);
	border: 0;
	border-radius: var(--fwk-radius-control);
	background: transparent;
	color: var(--fwk-color-text);
	box-shadow: none;
	cursor: pointer;
	transition:
		background-color var(--fwk-duration) var(--fwk-ease),
		color var(--fwk-duration) var(--fwk-ease);
}

#search-drawer .drawer-header .search-toggle-close:hover,
#search-drawer .drawer-header .search-toggle-close:focus-visible,
#search-drawer .drawer-header .drawer-toggle:hover,
#search-drawer .drawer-header .drawer-toggle:focus-visible {
	background: var(--fwk-color-sunken);
	color: var(--fwk-color-text);
	box-shadow: none;
}

#search-drawer .drawer-header .search-toggle-close:focus-visible,
#search-drawer .drawer-header .drawer-toggle:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
}

#search-drawer .drawer-header .search-toggle-close .kadence-svg-icon,
#search-drawer .drawer-header .drawer-toggle .kadence-svg-icon,
#search-drawer .drawer-header .search-toggle-close svg,
#search-drawer .drawer-header .drawer-toggle svg {
	color: inherit;
	fill: currentColor;
}

#search-drawer .drawer-inner .drawer-content {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: flex-start;
	position: absolute;
	inset: 0;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	padding: clamp(1rem, 3vw, 2rem) var(--fwk-space-5) clamp(2rem, 6vw, 3.5rem);
	max-width: none;
	margin: 0;
	color: var(--fwk-color-text);
}

.fwk-search-drawer {
	display: grid;
	gap: var(--fwk-space-5);
	width: min(100%, 36rem);
	margin-inline: auto;
	padding-block-start: clamp(0.5rem, 4vh, 3rem);
}

.fwk-search-drawer__title {
	margin: 0;
	font-family: var(--fwk-font-display, var(--fwk-font));
	font-size: clamp(1.35rem, 2.5vw, 1.75rem);
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 1.2;
	color: var(--fwk-color-text);
	text-align: center;
}

.fwk-search-drawer__lead {
	margin: calc(var(--fwk-space-2) * -1) 0 0;
	font-size: var(--fwk-text-sm);
	line-height: 1.45;
	color: var(--fwk-color-muted);
}

.fwk-search-drawer__hint,
.fwk-search-hint {
	margin: var(--fwk-space-2) 0 0;
	font-size: var(--fwk-text-xs);
	color: var(--fwk-color-muted);
	text-align: center;
}

.fwk-search-drawer__kbd,
.fwk-search-hint kbd {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.5rem;
	padding: 0.1em 0.4em;
	border: 0;
	border-radius: var(--fwk-radius-sm);
	background: var(--fwk-color-sunken);
	font-family: var(--fwk-font-numeric, inherit);
	font-size: 0.75em;
	font-weight: 600;
	color: var(--fwk-color-text);
}

/* Form: E3 inline on desktop; soft field (no drop-shadow / double chrome). */
#search-drawer .drawer-inner form.fwk-search-form,
#search-drawer .drawer-inner form.woocommerce-product-search {
	display: grid !important;
	grid-template-columns: 1fr auto;
	align-items: stretch;
	gap: var(--fwk-space-2);
	width: 100%;
	max-width: none;
	margin: 0;
}

#search-drawer .drawer-inner form.fwk-search-form label,
#search-drawer .drawer-inner form.woocommerce-product-search label {
	flex-grow: 0;
}

#search-drawer .drawer-inner .fwk-search-form .search-field,
#search-drawer .drawer-inner .fwk-search-form input[type="search"],
#search-drawer .drawer-inner form.woocommerce-product-search .search-field,
#search-drawer .drawer-inner form.woocommerce-product-search input[type="search"] {
	width: 100%;
	min-height: 52px;
	padding: var(--fwk-space-3) var(--fwk-space-5) !important;
	border: 0 !important;
	border-radius: var(--fwk-radius-control);
	background: var(--fwk-color-surface);
	font-size: var(--fwk-text-lg);
	color: var(--fwk-color-text) !important;
	/* Hairline via inset shadow ? no stacked border+ring chrome. */
	box-shadow: inset 0 0 0 1px var(--fwk-neutral-200);
}

#search-drawer .drawer-inner .fwk-search-form .search-field:focus,
#search-drawer .drawer-inner .fwk-search-form input[type="search"]:focus,
#search-drawer .drawer-inner form.woocommerce-product-search .search-field:focus,
#search-drawer .drawer-inner form.woocommerce-product-search input[type="search"]:focus {
	outline: none;
	border: 0 !important;
	color: var(--fwk-color-text) !important;
	/* Thin soft-mint hairline ? no lagoon/blue chrome. */
	box-shadow: inset 0 0 0 1px var(--fwk-green-400) !important;
}

#search-drawer .drawer-inner .fwk-search-form__submit,
#search-drawer .drawer-inner form.woocommerce-product-search button[type="submit"],
#search-drawer .drawer-inner form.woocommerce-product-search .search-submit {
	width: auto !important;
	min-width: 7rem;
	min-height: 52px;
	border-radius: var(--fwk-radius-control);
	background: var(--fwk-button-ink) !important;
	border: 0 !important;
	color: var(--fwk-color-on-cta) !important;
	font-weight: 600;
	box-shadow: none;
}

.fwk-search-drawer__block {
	display: grid;
	gap: var(--fwk-space-3);
}

.fwk-search-drawer__label {
	margin: 0;
	font-size: var(--fwk-text-xs);
	font-weight: 600;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--fwk-color-muted);
	text-align: center;
}

.fwk-search-drawer__chips {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--fwk-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Ghost chips ? fill only, no control-border wall. */
#search-drawer .fwk-search-drawer__chips .fwk-chip {
	min-height: 40px;
	text-decoration: none;
	border: 0 !important;
	background: var(--fwk-neutral-100);
	color: var(--fwk-color-text);
	box-shadow: none !important;
	transform: none;
}

#search-drawer .fwk-search-drawer__chips .fwk-chip:hover,
#search-drawer .fwk-search-drawer__chips .fwk-chip:focus-visible {
	background: var(--fwk-color-accent-soft);
	border: 0 !important;
	color: var(--fwk-sky-700);
	transform: none;
	text-decoration: none;
	box-shadow: none !important;
}

#search-drawer .fwk-search-drawer__chips .fwk-chip:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px color-mix(in oklch, var(--fwk-sky-600) 22%, transparent) !important;
}

@media (max-width: 30em) {
	#search-drawer .drawer-inner form.fwk-search-form,
	#search-drawer .drawer-inner form.woocommerce-product-search {
		grid-template-columns: 1fr;
	}

	#search-drawer .drawer-inner .fwk-search-form__submit,
	#search-drawer .drawer-inner form.woocommerce-product-search button[type="submit"],
	#search-drawer .drawer-inner form.woocommerce-product-search .search-submit {
		width: 100% !important;
		min-height: 48px;
	}

	/* Slash shortcut is desktop-only chrome. */
	#search-drawer .fwk-search-hint,
	#search-drawer .fwk-search-drawer__hint {
		display: none;
	}
}

/* Frosted glass: translucent full-window panel so the page shows through. */
#search-drawer.popup-drawer-layout-fullwidth .drawer-inner {
	background:
		linear-gradient(180deg, color-mix(in oklch, var(--fwk-sky-100) 60%, transparent) 0%, color-mix(in oklch, var(--fwk-color-bg) 55%, transparent) 40%),
		rgba(255, 255, 255, 0.55);
	-webkit-backdrop-filter: blur(14px) saturate(1.15);
	backdrop-filter: blur(14px) saturate(1.15);
}

/* No blur support or user prefers less transparency -> opaque Kit surface. */
@supports not ((-webkit-backdrop-filter: blur(2px)) or (backdrop-filter: blur(2px))) {
	#search-drawer.popup-drawer-layout-fullwidth .drawer-inner {
		background:
			linear-gradient(180deg, var(--fwk-sky-100) 0%, var(--fwk-color-bg) 32%),
			var(--fwk-color-bg);
	}
}

@media (prefers-reduced-transparency: reduce) {
	#search-drawer.popup-drawer-layout-fullwidth .drawer-inner {
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
		background:
			linear-gradient(180deg, var(--fwk-sky-100) 0%, var(--fwk-color-bg) 32%),
			var(--fwk-color-bg);
	}
}

/* Live suggestions (product rows) */
.fwk-search-suggest {
	display: grid;
	gap: var(--fwk-space-1, 0.25rem);
	margin: 0;
	padding: var(--fwk-space-2);
	border: 1px solid var(--fwk-color-control-border, #d8dde1);
	border-radius: var(--fwk-radius-control, 0.75rem);
	background: color-mix(in oklch, var(--fwk-color-surface, #fff) 82%, transparent);
	box-shadow: var(--fwk-shadow-md, 0 8px 24px rgba(20, 40, 60, 0.12));
	max-height: min(60vh, 28rem);
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}

.fwk-search-suggest[hidden] {
	display: none;
}

/* Typing with results -> hide idle chrome (popular / recent / hint). */
.fwk-search-drawer.is-suggesting .fwk-search-drawer__block,
.fwk-search-drawer.is-suggesting .fwk-search-drawer__hint {
	display: none;
}

.fwk-search-suggest__item {
	display: flex;
	align-items: center;
	gap: var(--fwk-space-3);
	min-height: 44px;
	padding: var(--fwk-space-2);
	border-radius: var(--fwk-radius-control, 0.75rem);
	text-decoration: none;
	color: var(--fwk-color-text);
	transition: background-color var(--fwk-duration, 0.18s) var(--fwk-ease, ease);
}

.fwk-search-suggest__item:hover,
.fwk-search-suggest__item.is-active {
	background: var(--fwk-color-sunken, var(--fwk-neutral-100, #f1f3f5));
}

.fwk-search-suggest__item:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring, 0 0 0 3px rgba(56, 132, 176, 0.4));
}

.fwk-search-suggest__thumb {
	flex: 0 0 auto;
	width: 52px;
	height: 52px;
	border-radius: var(--fwk-radius-sm, 0.5rem);
	overflow: hidden;
	background: var(--fwk-neutral-100, #f1f3f5);
	display: flex;
	align-items: center;
	justify-content: center;
}

.fwk-search-suggest__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.fwk-search-suggest__body {
	flex: 1 1 auto;
	min-width: 0;
	display: grid;
	gap: 0.125rem;
}

.fwk-search-suggest__title {
	font-size: var(--fwk-text-sm, 0.9rem);
	font-weight: 600;
	line-height: 1.25;
	color: var(--fwk-color-text);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.fwk-search-suggest__price {
	font-size: var(--fwk-text-sm, 0.9rem);
	color: var(--fwk-color-muted);
}

.fwk-search-suggest__price .amount,
.fwk-search-suggest__price ins {
	color: var(--fwk-color-text);
	font-weight: 600;
	text-decoration: none;
}

.fwk-search-suggest__price del {
	color: var(--fwk-color-muted);
	opacity: 0.7;
	margin-inline-end: 0.35rem;
}

.fwk-search-suggest__price.is-oos {
	color: var(--fwk-color-muted);
}

.fwk-search-suggest__all {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	margin-top: var(--fwk-space-1, 0.25rem);
	border-top: 1px solid var(--fwk-color-control-border, #d8dde1);
	font-size: var(--fwk-text-sm, 0.9rem);
	font-weight: 600;
	color: var(--fwk-sky-700, #1d5f80);
	text-decoration: none;
}

.fwk-search-suggest__all:hover,
.fwk-search-suggest__all.is-active {
	background: var(--fwk-color-accent-soft, var(--fwk-neutral-100, #f1f3f5));
}

.fwk-search-suggest__all:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring, 0 0 0 3px rgba(56, 132, 176, 0.4));
}

.fwk-search-suggest__empty {
	padding: var(--fwk-space-3);
	text-align: center;
}

.fwk-search-suggest__empty-title {
	margin: 0;
	font-weight: 600;
	color: var(--fwk-color-text);
}

.fwk-search-suggest__empty-hint {
	margin: var(--fwk-space-1, 0.25rem) 0 0;
	font-size: var(--fwk-text-sm, 0.9rem);
	color: var(--fwk-color-muted);
}

/* Focus ring on nav links (icon buttons use UIK focus) */
.main-navigation a:focus-visible {
	outline: 2px solid var(--fwk-color-focus);
	outline-offset: 2px;
}

/* === W5-min: Cookie compact === */
/* G9 Cookie Notice ? compact bottom bar (not full-bleed mobile wall). */
:root {
	--fwk-cookie-bar-offset: 0px;
	--fwk-sticky-atc-offset: 5.5rem;
}

#cookie-notice {
	z-index: var(--fwk-z-toast) !important;
	font-family: var(--fwk-font) !important;
	border-top: 1px solid var(--fwk-color-control-border) !important;
	box-shadow: var(--fwk-shadow-md);
	/* Opaque Kit surface ? plugin teal/alpha often washes text to invisible. */
	background-color: var(--fwk-color-surface) !important;
	background-image: none !important;
	opacity: 1 !important;
}

#cookie-notice .cookie-notice-container {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: var(--fwk-space-2) var(--fwk-space-3);
	padding: var(--fwk-space-3) var(--fwk-space-5);
	max-width: 72rem;
	margin-inline: auto;
	text-align: start;
}

#cookie-notice .cn-text-container {
	margin: 0;
	flex: 1 1 14rem;
	font-size: var(--fwk-text-sm);
	line-height: 1.4;
	color: var(--fwk-color-text) !important;
}

#cookie-notice .cn-text-container a {
	color: var(--fwk-color-accent);
	text-decoration: underline;
	text-underline-offset: 2px;
}

#cookie-notice .cn-buttons-container {
	display: inline-flex;
	flex-wrap: wrap;
	gap: var(--fwk-space-2);
	align-items: center;
	max-width: 100%;
	min-width: 0;
}

#cookie-notice .cn-button {
	min-height: 44px !important;
	padding: 0.5rem 1rem !important;
	border-radius: var(--fwk-radius-control) !important;
	font-family: var(--fwk-font) !important;
	font-size: var(--fwk-text-sm) !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
	margin: 0 !important;
	white-space: nowrap;
}

/* Accept: Action ink on light bar. */
#cookie-notice #cn-accept-cookie {
	background: var(--fwk-button-ink) !important;
	color: var(--fwk-color-on-cta) !important;
}

#cookie-notice #cn-accept-cookie:hover,
#cookie-notice #cn-accept-cookie:focus-visible {
	background: var(--fwk-button-ink-hover) !important;
	color: var(--fwk-color-on-cta) !important;
}

/* Privacy: ghost Kit secondary ? opaque fill + dark label (never white-on-washed). */
#cookie-notice #cn-more-info {
	background: var(--fwk-color-control-fill) !important;
	color: var(--fwk-color-text) !important;
	border: 1px solid var(--fwk-color-control-border) !important;
	box-shadow: none !important;
	opacity: 1 !important;
	text-shadow: none !important;
}

#cookie-notice #cn-more-info:hover,
#cookie-notice #cn-more-info:focus-visible {
	border-color: var(--fwk-color-accent) !important;
	color: var(--fwk-color-accent) !important;
}

#cookie-notice .cn-close-icon {
	top: 50%;
	right: var(--fwk-space-2);
	transform: translateY(-50%);
	margin: 0;
	width: 44px;
	height: 44px;
	opacity: 0.7;
}

#cookie-notice .cn-close-icon:before,
#cookie-notice .cn-close-icon:after {
	left: 50%;
	top: 50%;
	margin: -7px 0 0 -1px;
}

/* Body / sticky chrome offset while banner is visible (scroll + fold clearance). */
body:has(#cookie-notice.cookie-notice-visible) {
	--fwk-cookie-bar-offset: 4.75rem;
	padding-bottom: calc(var(--fwk-cookie-bar-offset) + env(safe-area-inset-bottom, 0px));
}

body:has(#cookie-notice.cookie-notice-visible) .fwk-hero--v2 .fwk-hero__actions {
	margin-bottom: calc(var(--fwk-cookie-bar-offset) + env(safe-area-inset-bottom, 0px));
}

/* Lift sticky ATC above cookie; keep CTA above banner for hit-testing. */
body:has(#cookie-notice.cookie-notice-visible) .fwk-sticky-atc {
	bottom: calc(var(--fwk-cookie-bar-offset) + env(safe-area-inset-bottom, 0px));
	z-index: calc(var(--fwk-z-toast) + 1);
}

/* PDP @375: sticky + cookie stack ? pad for both bars, not only sticky. */
body.fwk-has-sticky-atc:has(#cookie-notice.cookie-notice-visible) {
	padding-bottom: calc(
		var(--fwk-sticky-atc-offset) + var(--fwk-cookie-bar-offset) + env(safe-area-inset-bottom, 0px)
	);
}

@media (prefers-reduced-motion: reduce) {
	#masthead.site-header,
	#mobile-header,
	.site-main-header-wrap,
	.kadence-sticky-header[data-shrink="true"] {
		transition: none !important;
	}
}

/* Mobile: compact cookie strip ? 1-line text + button row (Accept + privacy). */
@media (max-width: 48em) {
	body:has(#cookie-notice.cookie-notice-visible) {
		/* ~1 line text + CTA row (+ privacy) ? 80?96px */
		--fwk-cookie-bar-offset: 6rem;
	}

	#cookie-notice .cookie-notice-container {
		flex-wrap: wrap;
		align-items: center;
		justify-content: flex-start;
		gap: var(--fwk-space-2);
		padding: 0.5rem 2.5rem 0.5rem var(--fwk-space-3);
		text-align: start;
	}

	#cookie-notice .cn-text-container {
		flex: 1 1 100%;
		min-width: 0;
		font-size: var(--fwk-text-xs);
		line-height: 1.3;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 1;
		overflow: hidden;
	}

	#cookie-notice .cn-buttons-container {
		flex: 1 1 auto;
		flex-direction: row;
		flex-wrap: nowrap;
		justify-content: flex-start;
		width: auto;
		gap: var(--fwk-space-2);
	}

	#cookie-notice .cn-button {
		width: auto;
		max-width: none;
		min-height: 40px !important;
		padding: 0.35rem 0.75rem !important;
		font-size: var(--fwk-text-xs) !important;
	}
}

/* -----------------------------------------------------------------------------
   14. G1 USP top-bar + G4 brand footer
   -------------------------------------------------------------------------- */
.fwk-usp {
	background: transparent;
	border-bottom: 1px solid var(--fwk-color-border);
	color: var(--fwk-color-muted);
	max-height: 4rem;
	overflow: hidden;
	transition:
		max-height var(--fwk-duration) var(--fwk-ease),
		opacity var(--fwk-duration) var(--fwk-ease),
		border-color var(--fwk-duration) var(--fwk-ease);
}

.fwk-usp.is-usp-hidden {
	max-height: 0;
	opacity: 0;
	border-bottom-color: transparent;
	pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
	.fwk-usp {
		transition: none;
	}
}

.fwk-usp__inner {
	padding-block: var(--fwk-space-2);
}

.fwk-usp__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: var(--fwk-space-2) var(--fwk-space-3);
	margin: 0;
	font-size: var(--fwk-text-xs);
	font-weight: 600;
	line-height: 1.35;
	text-align: center;
}

.fwk-usp__sep {
	color: var(--fwk-color-muted);
	font-weight: 400;
}

.fwk-usp__item {
	white-space: nowrap;
}

.fwk-footer {
	margin-block-start: var(--fwk-space-12);
	padding-block-start: var(--fwk-space-12);
	background:
		linear-gradient(180deg, var(--fwk-sky-100) 0%, var(--fwk-color-bg) 42%),
		var(--fwk-color-bg);
	border-top: 1px solid var(--fwk-color-border);
	color: var(--fwk-color-text);
}

/* PDP: drop double top air (related already ends the content plane). */
body.single-product .fwk-footer {
	margin-block-start: 0;
	padding-block-start: var(--fwk-space-8);
}

/* PDP: kill Kadence inline .content-area { margin-bottom: 5rem } before footer. */
body.single-product #primary.content-area,
body.single-product .content-area {
	margin-block-end: 0;
}

.fwk-footer__grid {
	display: grid;
	gap: var(--fwk-space-8);
	grid-template-columns: 1fr;
	padding-block-end: var(--fwk-space-10);
}

@media (min-width: 40em) {
	.fwk-footer__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 64em) {
	.fwk-footer__grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: var(--fwk-space-10);
	}
}

.fwk-footer__title {
	margin: 0 0 var(--fwk-space-4);
	font-size: var(--fwk-text-sm);
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--fwk-color-muted);
}

.fwk-footer__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: var(--fwk-space-3);
}

.fwk-footer__list a {
	color: var(--fwk-color-text);
	text-decoration: none;
	font-size: var(--fwk-text-sm);
	font-weight: 500;
	transition: color var(--fwk-duration) var(--fwk-ease);
}

.fwk-footer__list a:hover,
.fwk-footer__list a:focus-visible {
	color: var(--fwk-color-accent);
}

.fwk-footer__list a:focus-visible {
	outline: 2px solid var(--fwk-color-focus);
	outline-offset: 2px;
}

.fwk-footer__list--legal {
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-muted);
	line-height: 1.45;
}

.fwk-footer__phone {
	font-size: var(--fwk-text-lg) !important;
	font-weight: 700 !important;
	font-variant-numeric: tabular-nums;
	letter-spacing: -0.01em;
}

.fwk-footer__email {
	font-size: var(--fwk-text-sm);
	word-break: break-word;
}

.fwk-footer__messengers {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--fwk-space-2);
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-muted);
}

.fwk-footer__pay {
	list-style: none;
	margin: var(--fwk-space-5) 0 0;
	padding: 0;
	display: grid;
	gap: var(--fwk-space-2);
}

.fwk-footer__pay li {
	display: inline-flex;
	align-items: center;
	gap: var(--fwk-space-2);
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	color: var(--fwk-color-text);
}

.fwk-footer__pay-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	border-radius: var(--fwk-radius-sm);
	background: var(--fwk-color-surface);
	border: 1px solid var(--fwk-color-border);
	color: var(--fwk-color-accent);
}

.fwk-footer__iban-label {
	display: block;
	font-size: var(--fwk-text-xs);
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--fwk-color-muted);
	margin-block-end: var(--fwk-space-1);
}

.fwk-footer__iban {
	display: block;
	font-family: var(--fwk-font-numeric);
	font-size: var(--fwk-text-xs);
	font-variant-numeric: tabular-nums;
	word-break: break-all;
	color: var(--fwk-color-text);
	background: var(--fwk-color-surface);
	border: 1px solid var(--fwk-color-border);
	border-radius: var(--fwk-radius-sm);
	padding: var(--fwk-space-2) var(--fwk-space-3);
}

.fwk-footer__bottom {
	border-top: 1px solid var(--fwk-color-border);
	background: color-mix(in oklch, var(--fwk-color-surface) 70%, var(--fwk-sky-100));
}

.fwk-footer__bottom-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--fwk-space-1);
	padding-block: var(--fwk-space-4);
}

.fwk-footer__copy {
	margin: 0;
	font-size: var(--fwk-text-xs);
	color: var(--fwk-color-muted);
	text-align: center;
}

.fwk-footer__credit {
	margin: 0;
}

.fwk-footer__credit-link {
	display: inline-flex;
	align-items: center;
	gap: 0.35em;
	font-size: var(--fwk-text-xs);
	color: var(--fwk-color-muted);
	text-decoration: none;
}

.fwk-footer__credit-link:hover,
.fwk-footer__credit-link:focus-visible {
	color: var(--fwk-color-muted);
}

.fwk-footer__credit-link:focus-visible {
	outline: 2px solid var(--fwk-color-accent);
	outline-offset: 2px;
}

.fwk-footer__credit-icon {
	display: inline-flex;
	flex-shrink: 0;
	opacity: 0.85;
	color: inherit;
}

.fwk-footer__credit-link:hover .fwk-footer__credit-icon,
.fwk-footer__credit-link:focus-visible .fwk-footer__credit-icon {
	color: var(--fwk-color-sale);
	opacity: 1;
}

.fwk-footer__credit-name {
	font-weight: 500;
}

.fwk-footer__credit-link:hover .fwk-footer__credit-name,
.fwk-footer__credit-link:focus-visible .fwk-footer__credit-name {
	color: var(--fwk-color-accent);
}

/* === W-HDR: USP mobile diet ? 2 priority facts; rest via smart-hide scroll === */
@media (max-width: 48em) {
	.fwk-usp__inner {
		padding-block: var(--fwk-space-1);
	}

	.fwk-usp__list {
		flex-wrap: nowrap;
		justify-content: center;
		gap: var(--fwk-space-1) var(--fwk-space-2);
		overflow: hidden;
		white-space: nowrap;
	}

	.fwk-usp__item {
		white-space: nowrap;
		font-size: 0.7rem;
	}

	.fwk-usp__item--defer,
	.fwk-usp__sep--defer {
		display: none;
	}

	.fwk-usp__sep {
		flex-shrink: 0;
	}
}

/* === UX-5: Cart / checkout skin (K1?K14) + U19/U20/U21 ==================== */

/* U21 ? Empty state atom */
.fwk-empty {
	display: grid;
	justify-items: center;
	gap: var(--fwk-space-3);
	text-align: center;
	padding: var(--fwk-space-10) var(--fwk-space-4);
	max-width: min(28rem, 100%);
	width: 100%;
	margin-inline: auto;
	box-sizing: border-box;
}

.fwk-empty__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 4.5rem;
	height: 4.5rem;
	border-radius: var(--fwk-radius-pill);
	background: var(--fwk-color-accent-soft);
	color: var(--fwk-color-accent);
	margin-block-end: var(--fwk-space-2);
}

.fwk-empty__title {
	margin: 0;
	font: var(--fwk-type-title);
	font-size: var(--fwk-text-xl);
	color: var(--fwk-color-text);
}

.fwk-empty__text {
	margin: 0;
	max-width: 100%;
	font-size: var(--fwk-text-sm);
	line-height: 1.5;
	color: var(--fwk-color-muted);
	overflow-wrap: anywhere;
}

.fwk-empty__actions {
	margin: var(--fwk-space-4) 0 0;
}

/* U19 ? Qty stepper */
.fwk-qty {
	display: inline-flex;
	align-items: stretch;
	border: 1px solid var(--fwk-color-border-strong);
	border-radius: var(--fwk-radius-sm);
	background: var(--fwk-color-surface);
	overflow: hidden;
	vertical-align: middle;
}

.fwk-qty__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	margin: 0;
	padding: 0;
	border: 0;
	background: var(--fwk-color-sunken);
	color: var(--fwk-color-text);
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	transition: background-color var(--fwk-duration) var(--fwk-ease), color var(--fwk-duration) var(--fwk-ease);
}

.fwk-qty__btn:hover,
.fwk-qty__btn:focus-visible {
	background: var(--fwk-color-accent-soft);
	color: var(--fwk-color-accent);
}

.fwk-qty__btn:focus-visible {
	outline: none;
	box-shadow: inset var(--fwk-focus-ring);
	z-index: 1;
}

.fwk-qty__btn:disabled,
.fwk-qty__btn[aria-disabled="true"] {
	opacity: 0.4;
	pointer-events: none;
}

.fwk-qty__input,
.fwk-qty .qty {
	width: 3rem !important;
	min-width: 3rem;
	min-height: 44px !important;
	margin: 0 !important;
	padding: 0 var(--fwk-space-1) !important;
	border: 0 !important;
	border-inline: 1px solid var(--fwk-color-border) !important;
	border-radius: 0 !important;
	background: var(--fwk-color-surface) !important;
	box-shadow: none !important;
	text-align: center;
	font-variant-numeric: tabular-nums;
	font-weight: 600;
	font-size: var(--fwk-text-sm);
	-moz-appearance: textfield;
	appearance: textfield;
}

.fwk-qty__input::-webkit-outer-spin-button,
.fwk-qty__input::-webkit-inner-spin-button,
.fwk-qty .qty::-webkit-outer-spin-button,
.fwk-qty .qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* K1 — Cart page shell */
.fwk-cart-page .entry-content-wrap,
.fwk-cart-page .woocommerce {
	max-width: 72rem;
	margin-inline: auto;
}

/*
 * Beat Kadence `.kadence-woo-cart-form-wrap > form { float:left; width:70%; padding-right }`.
 * Our aside lives INSIDE the form grid — the 30% “ghost column” was empty collaterals space.
 */
.fwk-cart-page .kadence-woo-cart-form-wrap {
	display: block;
	width: 100%;
	max-width: 100%;
}

.fwk-cart-page .kadence-woo-cart-form-wrap > form.woocommerce-cart-form,
.fwk-cart-page .kadence-woo-cart-form-wrap > form.fwk-cart {
	float: none;
	width: 100%;
	max-width: 100%;
	padding-inline-end: 0;
	padding-right: 0;
	margin-inline: 0;
}

.fwk-cart-page .kadence-woo-cart-form-wrap::after {
	content: "";
	display: table;
	clear: both;
}

.fwk-cart-page .entry-title,
.fwk-cart-page .woocommerce-products-header__title {
	font: var(--fwk-type-title);
	font-size: var(--fwk-text-xl);
	line-height: 1.2;
	letter-spacing: -0.02em;
	margin-block-end: var(--fwk-space-6);
}

/* Kadence entry-hero title on cart — left aligned; spacing from --fwk-header-content-gap. */
.fwk-cart-page .entry-hero .entry-header,
.fwk-cart-page .entry-hero .entry-title {
	text-align: start;
}

.fwk-cart-page .entry-hero .entry-title {
	margin-block-end: 0;
}

.fwk-cart-page .woocommerce-cart-form {
	margin-block-end: var(--fwk-space-8);
}

/* K2 ? Cart table */
.fwk-cart-page table.shop_table {
	border: 1px solid var(--fwk-color-border);
	border-radius: var(--fwk-radius-lg);
	border-collapse: separate;
	border-spacing: 0;
	background: var(--fwk-color-surface);
	overflow: hidden;
}

.fwk-cart-page table.shop_table thead th {
	background: var(--fwk-color-sunken);
	border: 0;
	border-bottom: 1px solid var(--fwk-color-border);
	padding: var(--fwk-space-3) var(--fwk-space-4);
	font-size: var(--fwk-text-xs);
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--fwk-color-muted);
}

/* C-P0-1 / C-P1-2: hide WC a11y thead labels so they do not drive column width. */
.fwk-cart-page table.shop_table thead th.product-remove,
.fwk-cart-page table.shop_table thead th.product-thumbnail {
	overflow: hidden;
	white-space: nowrap;
	text-indent: -9999px;
	font-size: 0;
	line-height: 0;
	color: transparent;
	letter-spacing: 0;
	padding-block: var(--fwk-space-3);
	padding-inline: 0;
}

.fwk-cart-page table.shop_table thead th.product-remove,
.fwk-cart-page table.shop_table .product-remove {
	width: 3.5rem;
	min-width: 3.5rem;
	max-width: 3.5rem;
}

.fwk-cart-page table.shop_table thead th.product-thumbnail,
.fwk-cart-page table.shop_table .product-thumbnail {
	width: 5.5rem;
	min-width: 5.5rem;
	max-width: 5.5rem;
}

/* C-P0-1: WC smallscreen hides .product-thumbnail ? keep it visible on brand cart. */
.fwk-cart-page #content table.cart .product-thumbnail,
.fwk-cart-page table.cart .product-thumbnail,
.fwk-cart-page.woocommerce-page table.cart .product-thumbnail {
	display: table-cell !important;
	visibility: visible !important;
}

.fwk-cart-page table.shop_table .product-thumbnail a {
	display: block;
	width: 4.5rem;
	min-width: 4.5rem;
	line-height: 0;
	background: #fff !important;
}

.fwk-cart-page table.shop_table td {
	border: 0;
	border-bottom: 1px solid var(--fwk-color-border);
	padding: var(--fwk-space-4);
	vertical-align: middle;
}

.fwk-cart-page table.shop_table tr:last-child td {
	border-bottom: 0;
}

/* Beat WC cart img{width:32px}; packshot must FIT the square slot (no crop). */
.fwk-cart-page table.shop_table .product-thumbnail img,
.fwk-cart-page table.cart .product-thumbnail img,
.fwk-cart-page.woocommerce-cart table.cart img.fwk-cart-thumb,
.fwk-cart-page.woocommerce-cart table.cart .product-thumbnail img {
	display: block !important;
	width: 4.5rem !important;
	min-width: 4.5rem !important;
	max-width: 4.5rem !important;
	height: 4.5rem !important;
	object-fit: contain;
	object-position: center;
	border-radius: var(--fwk-radius-sm);
	border: 0;
	background: var(--fwk-color-surface);
	box-shadow: none;
}

.fwk-cart-page table.shop_table .product-name a {
	color: var(--fwk-color-text);
	font-weight: 600;
	text-decoration: none;
}

.fwk-cart-page table.shop_table .product-name a:hover {
	color: var(--fwk-color-accent);
}

/* C-P0-3: EU size under title (dl.variation / item data). */
.fwk-cart-page table.shop_table .product-name .variation,
.fwk-cart-page table.shop_table .product-name dl.variation {
	display: block;
	clear: both;
	margin: var(--fwk-space-1) 0 0;
	padding: 0;
	font-size: var(--fwk-text-sm);
	line-height: 1.4;
	color: var(--fwk-color-muted);
}

.fwk-cart-page table.shop_table .product-name .variation dt,
.fwk-cart-page table.shop_table .product-name .variation dd,
.fwk-cart-page table.shop_table .product-name dl.variation dt,
.fwk-cart-page table.shop_table .product-name dl.variation dd {
	display: inline;
	float: none;
	margin: 0;
	padding: 0;
}

.fwk-cart-page table.shop_table .product-name .variation dt,
.fwk-cart-page table.shop_table .product-name dl.variation dt {
	font-weight: 600;
	margin-inline-end: 0.25em;
}

.fwk-cart-page table.shop_table .product-name .variation dd p,
.fwk-cart-page table.shop_table .product-name dl.variation dd p {
	display: inline;
	margin: 0;
}

/* C-P0-2: price must not wrap as ?1 / 399?. */
.fwk-cart-page table.shop_table .product-price,
.fwk-cart-page table.shop_table .product-subtotal {
	white-space: nowrap;
	min-width: 6.5rem;
}

.fwk-cart-page table.shop_table .product-price .amount,
.fwk-cart-page table.shop_table .product-subtotal .amount,
.fwk-cart-page table.shop_table .product-price .amount bdi,
.fwk-cart-page table.shop_table .product-subtotal .amount bdi,
.fwk-cart-page table.shop_table .product-price .woocommerce-Price-amount,
.fwk-cart-page table.shop_table .product-subtotal .woocommerce-Price-amount {
	display: inline-block;
	white-space: nowrap !important;
	font-variant-numeric: tabular-nums;
	word-break: keep-all;
}

.fwk-cart-page table.shop_table .product-remove .remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: var(--fwk-radius-pill);
	border: 1px solid var(--fwk-color-border);
	background: var(--fwk-color-surface);
	color: var(--fwk-color-muted) !important;
	font-size: 1.25rem;
	text-decoration: none;
}

.fwk-cart-page table.shop_table .product-remove .remove:hover,
.fwk-cart-page table.shop_table .product-remove .remove:focus-visible {
	border-color: var(--fwk-color-danger);
	color: var(--fwk-color-danger) !important;
	background: var(--fwk-color-danger-soft);
}

.fwk-cart-page .actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--fwk-space-3);
	padding: var(--fwk-space-4) 0 0;
}

.fwk-cart-page .coupon {
	display: flex;
	flex-wrap: wrap;
	gap: var(--fwk-space-2);
	flex: 1 1 auto;
}

.fwk-cart-page .coupon .input-text {
	min-height: 44px;
	padding: var(--fwk-space-3) var(--fwk-space-4);
	border: 1px solid var(--fwk-color-border-strong);
	border-radius: var(--fwk-radius-sm);
	background: var(--fwk-color-surface);
}

.fwk-cart-page .actions .button {
	background: var(--fwk-color-secondary-bg);
	color: var(--fwk-color-secondary-text);
	border: 1px solid var(--fwk-color-secondary-border);
}

.fwk-cart-page .actions .button:hover {
	background: var(--fwk-color-secondary-bg-hover);
	border-color: var(--fwk-color-secondary-border-hover);
	color: var(--fwk-color-cta);
	box-shadow: none;
}

.fwk-cart-page .actions .button:focus-visible {
	outline: none;
	background: var(--fwk-color-secondary-bg-hover);
	border-color: var(--fwk-color-secondary-border-hover);
	color: var(--fwk-color-cta);
	box-shadow: var(--fwk-focus-ring);
}

/* K3 ? Cart totals */
.fwk-cart-page .cart-collaterals {
	display: grid;
	gap: var(--fwk-space-6);
}

/* Card chrome now provided by the wrapping .fwk-cosummary — keep cart_totals
   as plain flow to avoid a double-bordered box inside the summary. */
.fwk-cart-page .cart_totals {
	background: transparent;
	border: 0;
	border-radius: 0;
	padding: 0;
}

.fwk-cart-page .cart_totals > h2 {
	margin: 0 0 var(--fwk-space-4);
	font: var(--fwk-type-title);
	font-size: var(--fwk-text-lg);
}

.fwk-cart-page .cart_totals table.shop_table {
	border: 0;
	border-radius: 0;
	background: transparent;
}

.fwk-cart-page .cart_totals table.shop_table th,
.fwk-cart-page .cart_totals table.shop_table td {
	border: 0;
	border-bottom: 1px solid var(--fwk-color-border);
	padding: var(--fwk-space-3) 0;
	background: transparent;
	vertical-align: baseline;
}

/* C-P0-4: shipping label/destination must not truncate (????????? ?? 30.?). */
.fwk-cart-page .cart_totals table.shop_table th {
	white-space: normal;
	overflow: visible;
	text-overflow: clip;
	max-width: none;
	line-height: 1.35;
}

.fwk-cart-page .cart_totals .woocommerce-shipping-totals th,
.fwk-cart-page .cart_totals .woocommerce-shipping-totals td {
	white-space: normal;
	overflow: visible;
	vertical-align: top;
}

.fwk-cart-page .cart_totals .woocommerce-shipping-destination {
	display: block;
	margin: var(--fwk-space-2) 0 0;
	white-space: normal;
	overflow: visible;
	text-align: start;
	line-height: 1.4;
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-muted);
}

.fwk-cart-page .cart_totals .woocommerce-shipping-methods {
	text-align: start;
	margin: 0;
	padding: 0;
	list-style: none;
}

.fwk-cart-page .cart_totals .woocommerce-shipping-methods li {
	margin: 0 0 var(--fwk-space-1);
}

/* C-P1-4: keep amount on one line next to label (esp. mobile). */
.fwk-cart-page .cart_totals table.shop_table .amount,
.fwk-cart-page .cart_totals table.shop_table .amount bdi {
	display: inline-block;
	white-space: nowrap !important;
	font-variant-numeric: tabular-nums;
}

.fwk-cart-page .cart_totals table.shop_table td {
	text-align: end;
}

.fwk-cart-page .cart_totals .cart-subtotal th,
.fwk-cart-page .cart_totals .cart-subtotal td {
	font-size: var(--fwk-text-sm);
	font-weight: 500;
}

.fwk-cart-page .cart_totals .cart-subtotal th {
	color: var(--fwk-color-muted);
}

.fwk-cart-page .cart_totals .order-total th {
	border-bottom: 0;
	font-size: var(--fwk-text-base);
	font-weight: 700;
	padding-block-start: var(--fwk-space-4);
	color: var(--fwk-color-text);
}

.fwk-cart-page .cart_totals .order-total td {
	border-bottom: 0;
	font-size: var(--fwk-text-lg);
	font-weight: 700;
	padding-block-start: var(--fwk-space-4);
}

.fwk-cart-page .cart_totals .order-total .amount {
	font-size: var(--fwk-text-lg);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	color: var(--fwk-color-selected);
}

/* K4 — Proceed CTA (U1 lg: flex center, full-width in aside) */
.fwk-cart-page .wc-proceed-to-checkout {
	padding-block-start: var(--fwk-space-4);
	margin: 0;
}

.fwk-cart-page .woocommerce .wc-proceed-to-checkout a.checkout-button.button.alt,
.fwk-cart-page .wc-proceed-to-checkout .checkout-button,
.fwk-cart-page .wc-proceed-to-checkout .fwk-cart-checkout-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--fwk-space-2);
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	min-height: 52px;
	padding: var(--fwk-space-4) var(--fwk-space-6);
	margin: 0;
	border: 1px solid transparent;
	border-radius: var(--fwk-radius-control);
	background: var(--fwk-button-ink);
	color: var(--fwk-color-on-cta);
	font-size: var(--fwk-text-base);
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0.01em;
	text-align: center;
	text-decoration: none;
	white-space: nowrap;
	box-shadow: none;
	transition:
		background-color var(--fwk-duration) var(--fwk-ease),
		box-shadow var(--fwk-duration) var(--fwk-ease),
		transform var(--fwk-duration-press) var(--fwk-ease-out);
}

.fwk-cart-page .woocommerce .wc-proceed-to-checkout a.checkout-button.button.alt:hover,
.fwk-cart-page .wc-proceed-to-checkout .checkout-button:hover,
.fwk-cart-page .wc-proceed-to-checkout .fwk-cart-checkout-btn:hover {
	background: var(--fwk-button-ink-hover);
	color: var(--fwk-color-on-cta);
	border-color: transparent;
	box-shadow: var(--fwk-shadow-sm);
	text-decoration: none;
}

.fwk-cart-page .woocommerce .wc-proceed-to-checkout a.checkout-button.button.alt:focus-visible,
.fwk-cart-page .wc-proceed-to-checkout .checkout-button:focus-visible,
.fwk-cart-page .wc-proceed-to-checkout .fwk-cart-checkout-btn:focus-visible {
	outline: none;
	background: var(--fwk-button-ink-hover);
	color: var(--fwk-color-on-cta);
	box-shadow: var(--fwk-focus-ring);
}

.fwk-cart-page .woocommerce .wc-proceed-to-checkout a.checkout-button.button.alt:active,
.fwk-cart-page .wc-proceed-to-checkout .checkout-button:active,
.fwk-cart-page .wc-proceed-to-checkout .fwk-cart-checkout-btn:active {
	transform: scale(0.97);
	background: var(--fwk-button-ink-active);
	box-shadow: none;
}

@media (max-width: 22.5em) {
	.fwk-cart-page .woocommerce .wc-proceed-to-checkout a.checkout-button.button.alt,
	.fwk-cart-page .wc-proceed-to-checkout .checkout-button,
	.fwk-cart-page .wc-proceed-to-checkout .fwk-cart-checkout-btn {
		white-space: normal;
		padding-inline: var(--fwk-space-4);
	}
}

/* K5 ? Cross-sells use product grid atoms already */
.fwk-cart-page .cross-sells > h2 {
	font: var(--fwk-type-title);
	font-size: var(--fwk-text-lg);
	margin-block-end: var(--fwk-space-4);
}

/* K6 ? hide WC default empty paragraph if any leftover */
.fwk-cart-page .cart-empty.woocommerce-info {
	display: none;
}

@media (max-width: 48em) {
	.fwk-cart-page table.shop_table_responsive tr {
		display: block;
		padding: var(--fwk-space-4);
		border-bottom: 1px solid var(--fwk-color-border);
	}

	.fwk-cart-page table.shop_table_responsive tr:last-child {
		border-bottom: 0;
	}

	.fwk-cart-page table.shop_table_responsive td {
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: var(--fwk-space-3);
		padding: var(--fwk-space-2) 0 !important;
		border: 0 !important;
		text-align: end;
	}

	/* Thumbnail stays visible + leading on mobile card row. */
	.fwk-cart-page table.shop_table_responsive .product-thumbnail,
	.fwk-cart-page #content table.cart .product-thumbnail,
	.fwk-cart-page table.cart .product-thumbnail {
		display: flex !important;
		justify-content: flex-start;
		width: auto !important;
		min-width: 0 !important;
		max-width: none !important;
		padding-block-end: var(--fwk-space-2) !important;
	}

	.fwk-cart-page table.shop_table_responsive .product-name {
		display: block;
		text-align: start;
	}

	.fwk-cart-page table.shop_table_responsive .product-price,
	.fwk-cart-page table.shop_table_responsive .product-subtotal {
		white-space: nowrap;
	}

	.fwk-cart-page table.shop_table_responsive .product-remove {
		justify-content: flex-end;
	}

	.fwk-cart-page .cart_totals .woocommerce-shipping-totals td {
		text-align: start;
	}
}

/* K7 ? Checkout 2-col layout */
.fwk-checkout-page .entry-content-wrap,
.fwk-checkout-page .woocommerce {
	max-width: 72rem;
	margin-inline: auto;
}

.fwk-checkout-page .entry-title {
	font: var(--fwk-type-title);
	letter-spacing: -0.02em;
	margin-block-end: var(--fwk-space-4);
}

/* Layout now handled by U-Checkout redesign (.fwk-checkout__grid). Old K7
   grid + sticky #order_review skin is superseded; keep form as block flow so
   the new accordion + aside template controls the columns. */
.fwk-checkout-page form.checkout {
	display: block;
}

.fwk-checkout-page #customer_details .col-1,
.fwk-checkout-page #customer_details .col-2 {
	width: 100%;
	float: none;
	max-width: none;
}

.fwk-checkout-page .woocommerce-billing-fields > h3,
.fwk-checkout-page .woocommerce-shipping-fields > h3,
.fwk-checkout-page .woocommerce-additional-fields > h3 {
	font: var(--fwk-type-title);
	font-size: var(--fwk-text-lg);
	margin-block-end: var(--fwk-space-4);
}

/* K9 ? Billing fields already bridged via U7; tighten rows */
.fwk-checkout-page .woocommerce-billing-fields__field-wrapper,
.fwk-checkout-page .woocommerce-shipping-fields__field-wrapper,
.fwk-checkout-page .woocommerce-additional-fields__field-wrapper {
	display: grid;
	gap: var(--fwk-space-4);
}

.fwk-checkout-page .form-row {
	margin: 0;
	padding: 0;
}

.fwk-checkout-page .form-row-first,
.fwk-checkout-page .form-row-last {
	width: 100%;
	float: none;
}

@media (min-width: 40em) {
	.fwk-checkout-page .woocommerce-billing-fields__field-wrapper {
		grid-template-columns: 1fr 1fr;
	}

	.fwk-checkout-page .form-row-wide {
		grid-column: 1 / -1;
	}
}

/* K10 ? UA-only: no empty country row (field is hidden input) */
.fwk-checkout-page .woocommerce-billing-fields .form-row.address-field#billing_country_field,
.fwk-checkout-page .woocommerce-shipping-fields .form-row.address-field#shipping_country_field,
.fwk-checkout-page #billing_country_field:has(> input[type="hidden"]),
.fwk-checkout-page #shipping_country_field:has(> input[type="hidden"]) {
	display: none;
}

/* K10 ? Shipping / NP plugin fields inherit U7 */
.fwk-checkout-page .woocommerce-shipping-methods,
.fwk-checkout-page ul#shipping_method {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: var(--fwk-space-2);
}

/* Legacy WC shipping list — flat rows (NP cards own the chooser). */
.fwk-checkout-page ul#shipping_method li {
	margin: 0;
	padding: var(--fwk-space-3) 0;
	border: 0;
	border-bottom: 1px solid var(--fwk-color-border);
	border-radius: 0;
	background: transparent;
}

.fwk-checkout-page ul#shipping_method li:has(input:checked) {
	border-color: transparent;
	border-bottom-color: var(--fwk-color-border);
	background: var(--fwk-color-sunken);
	box-shadow: none;
}

/* U20 Payment — list rows (not sky/green cards). */
.fwk-payment-methods #payment,
.fwk-checkout-page #payment {
	background: transparent;
	border-radius: 0;
}

.fwk-checkout-page #payment ul.payment_methods,
.fwk-checkout-page #payment ul.wc_payment_methods {
	list-style: none;
	margin: 0 0 var(--fwk-space-4);
	padding: 0;
	border: 0;
	display: flex;
	flex-direction: column;
	gap: 0;
}

.fwk-checkout-page #payment ul.payment_methods > li,
.fwk-checkout-page #payment ul.wc_payment_methods > li.wc_payment_method {
	margin: 0;
	padding: 0;
	border: 0;
	border-bottom: 1px solid var(--fwk-color-border);
	border-radius: 0;
	background: transparent;
	overflow: visible;
	transition: background-color var(--fwk-duration) var(--fwk-ease);
}

.fwk-checkout-page #payment ul.payment_methods > li:has(input:checked),
.fwk-checkout-page #payment ul.wc_payment_methods > li.wc_payment_method:has(input:checked) {
	border-color: transparent;
	border-bottom-color: var(--fwk-color-border);
	background: var(--fwk-color-sunken);
	box-shadow: none;
}

.fwk-checkout-page #payment ul.payment_methods > li > label,
.fwk-checkout-page #payment ul.wc_payment_methods > li.wc_payment_method > label {
	display: flex;
	align-items: center;
	gap: var(--fwk-space-3);
	min-height: 52px;
	padding: var(--fwk-space-3) 0;
	margin: 0;
	cursor: pointer;
	font-weight: 600;
	font-size: var(--fwk-text-sm);
}

.fwk-checkout-page #payment div.payment_box {
	margin: 0;
	padding: 0 0 var(--fwk-space-3);
	background: transparent;
	border: 0;
	border-top: 0;
	color: var(--fwk-color-muted);
	font-size: var(--fwk-text-sm);
	line-height: 1.45;
	box-shadow: none;
}

.fwk-checkout-page #payment div.payment_box::before {
	display: none;
}

/* K12 ? Order review + place order */
.fwk-checkout-page #order_review table.shop_table {
	border: 0;
	margin: 0 0 var(--fwk-space-4);
}

.fwk-checkout-page #order_review table.shop_table th,
.fwk-checkout-page #order_review table.shop_table td {
	border: 0;
	border-bottom: 1px solid var(--fwk-color-border);
	padding: var(--fwk-space-3) 0;
	background: transparent;
}

.fwk-checkout-page #order_review .order-total th,
.fwk-checkout-page #order_review .order-total td {
	border-bottom: 0;
	font-size: var(--fwk-text-lg);
	font-weight: 700;
	padding-block-start: var(--fwk-space-4);
}

.fwk-checkout-page #payment .place-order {
	margin: 0;
	padding: var(--fwk-space-4) 0 0;
	border-top: 1px solid var(--fwk-color-border);
}

.fwk-checkout-page #place_order {
	width: 100%;
	min-height: 52px;
	font-size: var(--fwk-text-base);
}

.fwk-checkout-page .woocommerce-privacy-policy-text {
	font-size: var(--fwk-text-xs);
	color: var(--fwk-color-muted);
	margin-block-end: var(--fwk-space-3);
}

/* K13 ? Thank you — Quiet chrome (no success-soft plate). */
.fwk-thankyou {
	display: grid;
	justify-items: start;
	gap: var(--fwk-space-2);
	margin-block-end: var(--fwk-space-6);
	padding: var(--fwk-space-5);
	background: var(--fwk-color-surface);
	border: 1px solid var(--fwk-color-border);
	border-radius: var(--fwk-radius-lg);
}

.fwk-thankyou__icon {
	color: var(--fwk-color-muted);
	margin-block-end: var(--fwk-space-1);
}

.fwk-thankyou__eyebrow {
	margin: 0;
	font-size: var(--fwk-text-xs);
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--fwk-color-muted);
}

.fwk-thankyou__order,
.fwk-thankyou__next {
	margin: 0;
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-text);
}

.fwk-thankyou-page .woocommerce-order {
	max-width: 40rem;
}

.fwk-thankyou-page .woocommerce-notice--success,
.fwk-thankyou-page .woocommerce-thankyou-order-received {
	background: transparent;
	border: 0;
	padding: 0;
	font: var(--fwk-type-title);
	font-size: var(--fwk-text-xl);
	color: var(--fwk-color-text);
}

.fwk-thankyou-page ul.woocommerce-order-overview {
	display: grid;
	gap: var(--fwk-space-3);
	margin: var(--fwk-space-5) 0;
	padding: var(--fwk-space-4);
	list-style: none;
	background: var(--fwk-color-surface);
	border: 1px solid var(--fwk-color-border);
	border-radius: var(--fwk-radius-lg);
}

.fwk-thankyou-page ul.woocommerce-order-overview li {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-muted);
}

.fwk-thankyou-page ul.woocommerce-order-overview li strong {
	display: block;
	margin-block-start: var(--fwk-space-1);
	color: var(--fwk-color-text);
	font-size: var(--fwk-text-base);
	font-variant-numeric: tabular-nums;
}

/* K14 ? BACS callout */
.fwk-thankyou-page .woocommerce-bacs-bank-details,
.fwk-checkout-page .woocommerce-bacs-bank-details {
	margin-block-start: var(--fwk-space-5);
	padding: var(--fwk-space-5);
	background: var(--fwk-color-surface);
	border: 1px solid var(--fwk-color-border);
	border-left: 3px solid var(--fwk-color-accent);
	border-radius: var(--fwk-radius-md);
}

.fwk-thankyou-page .woocommerce-bacs-bank-details h2,
.fwk-checkout-page .woocommerce-bacs-bank-details h2 {
	margin: 0 0 var(--fwk-space-3);
	font: var(--fwk-type-title);
	font-size: var(--fwk-text-lg);
}

.fwk-checkout-page .woocommerce-bacs-bank-details .wc-bacs-bank-details-account-name,
.fwk-checkout-page .woocommerce-bacs-bank-details ul.wc-bacs-bank-details.order_details {
	font-size: var(--fwk-text-sm);
	font-variant-numeric: tabular-nums;
}

.fwk-checkout ul.wc_payment_methods .payment_box .woocommerce-bacs-bank-details {
	margin-block-start: var(--fwk-space-2);
	padding: var(--fwk-space-3);
	border-left-width: 2px;
}

.fwk-checkout ul.wc_payment_methods .payment_box .woocommerce-bacs-bank-details h2 {
	font-size: var(--fwk-text-sm);
	margin-block-end: var(--fwk-space-2);
}

.fwk-checkout ul.wc_payment_methods .payment_box .fwk-bacs-hint {
	margin: var(--fwk-space-2) 0 0;
	font-size: var(--fwk-text-xs);
	color: var(--fwk-color-muted);
}

.fwk-np--invalid .fwk-np__methods {
	outline: 2px solid color-mix(in oklch, var(--fwk-color-danger) 35%, transparent);
	outline-offset: 2px;
	border-radius: var(--fwk-radius-sm);
}

/* Mobile card chrome for #order_review is superseded by .fwk-cosummary; keeping
   it here would double-border the summary. Intentionally neutralised. */

/* === CF-3: Sticky ATC (mobile) ============================================= */
.fwk-sticky-atc {
	position: fixed;
	inset-inline: 0;
	bottom: 0;
	z-index: var(--fwk-z-sticky);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-3);
	padding: var(--fwk-space-3) var(--fwk-space-4);
	padding-bottom: max(var(--fwk-space-3), env(safe-area-inset-bottom));
	background: color-mix(in oklch, var(--fwk-color-surface) 92%, transparent);
	backdrop-filter: blur(10px);
	border-top: 1px solid var(--fwk-color-border);
	box-shadow: 0 -8px 24px oklch(25% 0.03 250 / 0.08);
}

.fwk-sticky-atc[hidden] {
	display: none !important;
}

.fwk-sticky-atc__meta {
	display: grid;
	gap: 0.15rem;
	min-width: 0;
}

.fwk-sticky-atc__price {
	font-weight: 700;
	font-size: var(--fwk-text-base);
	font-variant-numeric: tabular-nums lining-nums;
	white-space: nowrap;
	color: var(--fwk-color-text);
	line-height: 1.2;
}

.fwk-sticky-atc__price del {
	font-weight: 500;
	color: var(--fwk-color-muted);
	font-size: var(--fwk-text-sm);
	margin-inline-end: var(--fwk-space-1);
}

.fwk-sticky-atc__size {
	font-size: var(--fwk-text-xs);
	font-weight: 600;
	color: var(--fwk-color-muted);
}

.fwk-sticky-atc__cta {
	flex: 0 0 auto;
	min-width: 9.5rem;
}

.fwk-sticky-atc__cta.is-need-size {
	background: var(--fwk-button-ink);
}

.fwk-sticky-atc__cta.is-need-size:hover,
.fwk-sticky-atc__cta.is-need-size:focus-visible {
	background: var(--fwk-button-ink-hover);
}

body.fwk-has-sticky-atc {
	padding-bottom: calc(var(--fwk-sticky-atc-offset) + env(safe-area-inset-bottom, 0px));
}

@media (min-width: 64em) {
	.fwk-sticky-atc {
		display: none !important;
	}

	body.fwk-has-sticky-atc {
		padding-bottom: 0;
	}
}

/* === UIK: Styleguide page ================================================== */
.fwk-uikit {
	max-width: 80rem;
	margin-inline: auto;
	padding-block: var(--fwk-space-8) var(--fwk-space-16);
	padding-inline: var(--fwk-space-4);
	display: grid;
	gap: var(--fwk-space-12);
}

.fwk-uikit__denied {
	margin: var(--fwk-space-8) auto;
	max-width: 28rem;
	text-align: center;
	padding: var(--fwk-space-6);
	border: 1px dashed var(--fwk-color-border);
	border-radius: var(--fwk-radius-md);
	color: var(--fwk-color-muted);
	background: var(--fwk-color-surface);
}

.fwk-uikit__intro {
	display: grid;
	gap: var(--fwk-space-3);
	max-width: 40rem;
}

.fwk-uikit__eyebrow {
	margin: 0;
	font-size: var(--fwk-text-xs);
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--fwk-color-accent);
}

.fwk-uikit__title {
	margin: 0;
	font-family: var(--fwk-font-display);
	font-size: clamp(1.75rem, 1.2rem + 1.5vw, 2.5rem);
	font-weight: 700;
	line-height: 1.15;
	color: var(--fwk-color-text);
}

.fwk-uikit__lead,
.fwk-uikit__hint {
	margin: 0;
	font-size: var(--fwk-text-sm);
	line-height: 1.5;
	color: var(--fwk-color-muted);
}

.fwk-uikit__section {
	display: grid;
	gap: var(--fwk-space-4);
	padding-block-start: var(--fwk-space-8);
	border-top: 1px solid var(--fwk-color-border);
}

.fwk-uikit__h2 {
	margin: 0;
	font-family: var(--fwk-font-display);
	font-size: var(--fwk-text-xl);
	font-weight: 700;
	color: var(--fwk-color-text);
}

.fwk-uikit__h3 {
	margin: 0 0 var(--fwk-space-3);
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	color: var(--fwk-color-muted);
}

.fwk-uikit__block {
	display: grid;
	gap: var(--fwk-space-2);
}

.fwk-uikit__row {
	display: flex;
	flex-wrap: wrap;
	gap: var(--fwk-space-3);
	align-items: center;
}

.fwk-uikit__row--align {
	align-items: flex-end;
}

.fwk-uikit__sizes {
	max-width: 28rem;
	margin: 0;
}

.fwk-uikit__fields {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
	gap: var(--fwk-space-5);
}

.fwk-uikit__field {
	min-width: 0;
}

.fwk-uikit__cards {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
	gap: var(--fwk-space-5);
	margin: 0 !important;
	padding: 0;
	list-style: none;
	float: none !important;
	width: 100% !important;
}

.fwk-uikit__cards > .product {
	width: auto !important;
	margin: 0 !important;
	float: none !important;
}

.fwk-uikit__card-img {
	display: block;
	aspect-ratio: var(--fwk-card-media-ratio);
	height: 100%;
	background:
		linear-gradient(145deg, var(--fwk-color-sunken), var(--fwk-neutral-200));
}

.fwk-uikit__toasts {
	display: grid;
	gap: var(--fwk-space-3);
	max-width: 24rem;
}

/* Demo toast: inline, not fixed overlay (U14 v4 — shadow only, no border). */
.fwk-toast--demo {
	position: static;
	animation: none;
	width: 100%;
	box-shadow: var(--fwk-shadow-md);
}

/* U15 ? standalone skeleton atom for styleguide / future JS */
.fwk-skeleton {
	display: block;
	border-radius: var(--fwk-radius-md);
	background: linear-gradient(90deg, var(--fwk-color-sunken) 25%, var(--fwk-neutral-200) 50%, var(--fwk-color-sunken) 75%);
	background-size: 200% 100%;
	animation: fwk-skeleton-pulse 1.2s ease-in-out infinite;
}

.fwk-skeleton--card {
	aspect-ratio: 1;
}

.fwk-skeleton--line {
	height: 0.875rem;
	width: 100%;
	border-radius: var(--fwk-radius-sm);
}

.fwk-skeleton--short {
	width: 60%;
}

.fwk-uikit__skeleton {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--fwk-space-4);
	max-width: 36rem;
}

.fwk-uikit__skeleton .fwk-skeleton--line {
	grid-column: 1 / -1;
}

@media (prefers-reduced-motion: reduce) {
	.fwk-skeleton {
		animation: none;
	}
}

/* Styleguide mock states (screenshots without real hover/focus) */
.fwk-uikit .fwk-button.is-hover {
	background: var(--fwk-color-cta-hover);
	color: var(--fwk-color-on-cta);
	box-shadow: var(--fwk-shadow-sm);
}

.fwk-uikit .fwk-button.is-focus {
	outline: none;
	background: var(--fwk-color-cta-hover);
	color: var(--fwk-color-on-cta);
	box-shadow: var(--fwk-focus-ring);
}

.fwk-uikit .fwk-button.is-active {
	background: var(--fwk-color-cta-active);
	color: var(--fwk-color-on-cta);
	box-shadow: none;
	transform: scale(0.97);
}

.fwk-uikit .fwk-button--secondary.is-hover {
	background: var(--fwk-color-secondary-bg-hover);
	color: var(--fwk-color-cta);
	border-color: var(--fwk-color-secondary-border-hover);
	box-shadow: none;
}

.fwk-uikit .fwk-button--secondary.is-focus {
	outline: none;
	background: var(--fwk-color-secondary-bg-hover);
	color: var(--fwk-color-cta);
	border-color: var(--fwk-color-secondary-border-hover);
	box-shadow: var(--fwk-focus-ring);
}

.fwk-uikit .fwk-button--secondary.is-active {
	background: var(--fwk-sky-200);
	color: var(--fwk-color-cta-active);
	border-color: var(--fwk-color-cta-active);
	transform: scale(0.97);
}

.fwk-uikit .fwk-button--ghost.is-hover {
	background: var(--fwk-color-sunken);
	color: var(--fwk-color-text);
	border-color: var(--fwk-color-accent);
	box-shadow: none;
}

.fwk-uikit .fwk-button--ghost.is-focus {
	outline: none;
	background: var(--fwk-color-sunken);
	color: var(--fwk-color-text);
	border-color: var(--fwk-color-accent);
	box-shadow: var(--fwk-focus-ring);
}

.fwk-uikit .fwk-button--ghost.is-active {
	background: var(--fwk-neutral-300);
	border-color: var(--fwk-color-accent);
	transform: scale(0.97);
}

.fwk-uikit .fwk-chip.is-hover {
	border-color: var(--fwk-color-accent);
	background: var(--fwk-color-accent-soft);
	color: var(--fwk-color-accent);
}

.fwk-uikit .fwk-field.is-focus {
	outline: none;
	border-color: var(--fwk-color-focus);
	box-shadow: var(--fwk-focus-ring);
}

@media (min-width: 80em) {
	.fwk-uikit {
		padding-inline: var(--fwk-space-8);
	}
}

/* === E: Errors & Search ==================================================== */

/* E1 ? 404 editorial */
.fwk-error {
	padding-block: clamp(2.5rem, 6vw, 5rem) var(--fwk-space-16);
	background:
		linear-gradient(180deg, var(--fwk-sky-100) 0%, var(--fwk-color-bg) 48%),
		var(--fwk-color-bg);
}

.fwk-error__inner {
	display: grid;
	gap: var(--fwk-space-8);
	align-items: center;
	max-width: 52rem;
	margin-inline: auto;
	text-align: center;
}

.fwk-error__visual {
	display: flex;
	justify-content: center;
}

.fwk-error__svg {
	width: min(100%, 18rem);
	height: auto;
	border-radius: var(--fwk-radius-lg);
}

.fwk-error__copy {
	display: grid;
	gap: var(--fwk-space-3);
	justify-items: center;
}

.fwk-error__eyebrow {
	margin: 0;
	font-size: var(--fwk-text-xs);
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--fwk-color-accent);
}

.fwk-error__title {
	margin: 0;
	font-family: var(--fwk-font-display);
	font-size: clamp(1.75rem, 1.2rem + 1.6vw, 2.5rem);
	font-weight: 700;
	line-height: 1.15;
	color: var(--fwk-color-text);
	letter-spacing: -0.02em;
	max-width: 100%;
	overflow-wrap: anywhere;
}

.fwk-error__lead {
	margin: 0;
	max-width: min(36ch, 100%);
	font-size: var(--fwk-text-base);
	line-height: 1.5;
	color: var(--fwk-color-muted);
	overflow-wrap: anywhere;
}

.fwk-error__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--fwk-space-3);
	justify-content: center;
	margin-block-start: var(--fwk-space-4);
	width: 100%;
	max-width: 100%;
}

.fwk-error__actions .fwk-button {
	min-width: min(10rem, 100%);
}

@media (max-width: 30em) {
	.fwk-error__actions {
		flex-direction: column;
		align-items: stretch;
	}

	.fwk-error__actions .fwk-button {
		width: 100%;
		min-width: 0;
	}
}

.fwk-error__search {
	width: min(100%, 24rem);
	margin-block-start: var(--fwk-space-6);
	padding-block-start: var(--fwk-space-6);
	border-top: 1px solid var(--fwk-color-border);
}

.fwk-error__search-label {
	margin: 0 0 var(--fwk-space-3);
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-muted);
}

@media (min-width: 48em) {
	.fwk-error__inner {
		grid-template-columns: minmax(0, 16rem) minmax(0, 1fr);
		text-align: start;
		gap: var(--fwk-space-10);
	}

	.fwk-error__copy {
		justify-items: start;
	}

	.fwk-error__actions {
		justify-content: flex-start;
	}

	.fwk-error__svg {
		width: 100%;
	}
}

@media (prefers-reduced-motion: no-preference) {
	.fwk-error__svg {
		animation: fwk-error-enter 0.55s var(--fwk-ease-out) both;
	}

	.fwk-error__copy {
		animation: fwk-error-enter 0.55s var(--fwk-ease-out) 0.08s both;
	}
}

@keyframes fwk-error-enter {
	from {
		opacity: 0;
		transform: translateY(0.5rem);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.fwk-error__svg,
	.fwk-error__copy {
		animation: none;
	}
}

/* E2 — Search results */
.fwk-search {
	padding-block: var(--fwk-header-content-gap, var(--fwk-space-6)) var(--fwk-space-16);
}

.fwk-search__inner {
	display: grid;
	gap: var(--fwk-space-6);
}

.fwk-search__header.fwk-archive-header {
	margin-block-end: 0;
	gap: var(--fwk-space-4);
}

.fwk-search__refine {
	max-width: 36rem;
	width: 100%;
}

.fwk-search__refine .fwk-search-form {
	max-width: none;
	width: 100%;
}

/* Pack A seat: audience chip row (Men/Women/Kids). */
.fwk-search__audience {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;
	gap: var(--fwk-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}

.fwk-search__audience .fwk-search__chips {
	justify-content: flex-start;
	width: 100%;
}

.fwk-search__audience .fwk-chip.is-selected,
.fwk-search__audience .fwk-chip[aria-pressed="true"],
.fwk-search__audience .fwk-chip[aria-current="page"] {
	/* Selected chrome from UIK `.fwk-chip.is-selected`; keep specificity seat. */
	background: var(--fwk-color-text);
	border-color: var(--fwk-color-text);
	color: var(--fwk-neutral-0);
}

.fwk-search__toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-3) var(--fwk-space-4);
	margin-block-end: var(--fwk-space-5);
	padding-block-end: var(--fwk-space-4);
	border-bottom: 1px solid var(--fwk-color-border);
}

.fwk-search__showing {
	margin: 0;
	font-size: var(--fwk-text-sm);
	font-variant-numeric: tabular-nums;
	color: var(--fwk-color-muted);
}

.fwk-search__ordering {
	margin-inline-start: auto;
}

.fwk-search__ordering .woocommerce-ordering {
	margin: 0;
}

.fwk-search__ordering .woocommerce-ordering select,
.fwk-search__ordering .orderby {
	box-sizing: border-box;
	min-height: 44px;
	padding: var(--fwk-space-2) 2.5rem var(--fwk-space-2) var(--fwk-space-4);
	border: 1px solid var(--fwk-color-control-border);
	border-radius: var(--fwk-radius-control);
	background-color: var(--fwk-color-control-fill);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23475569' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right var(--fwk-space-3) center;
	background-size: 1rem;
	color: var(--fwk-color-text);
	font-family: var(--fwk-font);
	font-size: var(--fwk-text-sm);
	font-weight: 500;
	line-height: 1.3;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}

.fwk-search__ordering .woocommerce-ordering select:focus-visible,
.fwk-search__ordering .orderby:focus-visible {
	outline: none;
	border-color: var(--fwk-color-accent);
	box-shadow: var(--fwk-focus-ring);
}

.fwk-search__results ul.products {
	margin-block-start: 0;
}

.fwk-search__pagination {
	margin-block-start: var(--fwk-space-8);
}

.fwk-search__pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: var(--fwk-space-2);
	justify-content: center;
}

/* Chip styles: see U18 block below (a/span.page-numbers only — not the list). */

.fwk-search__empty {
	border-style: solid;
	border-color: var(--fwk-color-border);
	background: color-mix(in oklch, var(--fwk-color-surface) 92%, var(--fwk-sky-100, #e8f4fb));
	padding-block: var(--fwk-space-10);
}

/* G9 residual: empty chips clear cookie via shared offset (sticky ATC/PDP untouched). */
body:has(#cookie-notice.cookie-notice-visible) .fwk-search__empty {
	padding-bottom: calc(
		var(--fwk-space-10) + var(--fwk-cookie-bar-offset, 4.75rem) + 1.25rem +
			env(safe-area-inset-bottom, 0px)
	);
}

body:has(#cookie-notice.cookie-notice-visible) .fwk-search__suggestions,
body:has(#cookie-notice.cookie-notice-visible) .fwk-search__chips {
	scroll-margin-bottom: calc(var(--fwk-cookie-bar-offset, 4.75rem) + env(safe-area-inset-bottom, 0px));
}

body:has(#cookie-notice.cookie-notice-visible) .fwk-search__inner {
	padding-bottom: calc(var(--fwk-cookie-bar-offset, 4.75rem) + env(safe-area-inset-bottom, 0px));
}

.fwk-search__empty-icon {
	display: grid;
	place-items: center;
	width: 3.5rem;
	height: 3.5rem;
	margin: 0 auto var(--fwk-space-4);
	border-radius: var(--fwk-radius-xl);
	background: color-mix(in oklch, var(--fwk-color-accent) 10%, var(--fwk-color-surface));
	color: var(--fwk-color-accent);
}

.fwk-search__suggestions {
	margin-block-start: var(--fwk-space-8);
	display: grid;
	gap: var(--fwk-space-3);
	justify-items: center;
}

.fwk-search__suggestions-label {
	margin: 0;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	color: var(--fwk-color-muted);
}

.fwk-search__chips {
	display: flex;
	flex-wrap: wrap;
	gap: var(--fwk-space-2);
	justify-content: center;
	margin: 0;
	padding: 0;
	list-style: none;
}

.fwk-search__recovery {
	margin-block-start: var(--fwk-space-4);
}

.fwk-search__recovery .fwk-bestsellers .fwk-container {
	max-width: none;
	padding-inline: 0;
}

.fwk-search__recovery .fwk-section {
	padding-block: var(--fwk-space-8) 0;
	border-block-start: 1px solid var(--fwk-color-border);
}

@media (max-width: 30em) {
	.fwk-search__refine {
		max-width: none;
		width: 100%;
	}

	.fwk-search__refine .fwk-search-form {
		grid-template-columns: 1fr auto;
		width: 100%;
		max-width: none;
		align-items: stretch;
	}

	/* Input + submit same Kit height @375 (stretch already; lock box model). */
	.fwk-search__refine .fwk-search-form .search-field,
	.fwk-search__refine .fwk-search-form input[type="search"],
	.fwk-search__refine .fwk-search-form button[type="submit"],
	.fwk-search__refine .fwk-search-form .search-submit,
	.fwk-search__refine .fwk-search-form .fwk-search-form__submit {
		box-sizing: border-box;
		min-height: 44px;
		height: 44px;
		align-self: stretch;
	}

	.fwk-search__toolbar {
		flex-direction: column;
		align-items: stretch;
	}

	.fwk-search__ordering {
		margin-inline-start: 0;
		width: 100%;
	}

	.fwk-search__ordering .woocommerce-ordering,
	.fwk-search__ordering .woocommerce-ordering select,
	.fwk-search__ordering .orderby {
		width: 100%;
	}

	.fwk-search__results ul.products li.product.fwk-product-card .product-action-wrap .button,
	.fwk-search__results ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta {
		font-size: var(--fwk-text-xs);
		padding-inline: var(--fwk-space-2);
		min-height: 40px;
	}
}
/* E3 ? Search form (inline + drawer shared atom)
 * Kadence WC (`form.woocommerce-product-search button[type=submit]`) makes the
 * submit invisible (transparent + absolute 50px) and shows only an icon.
 * Beat that so E2/E3 / 404 show a real Kit button.
 */
.fwk-search-form,
form.fwk-search-form.search-form,
form.fwk-search-form.woocommerce-product-search {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: var(--fwk-space-2);
	align-items: stretch;
	position: relative;
	width: 100%;
	max-width: 36rem;
}

.fwk-search-form .search-field,
.fwk-search-form input[type="search"],
form.fwk-search-form.woocommerce-product-search .search-field,
form.fwk-search-form.woocommerce-product-search input[type="search"],
form.fwk-search-form.search-form .search-field,
form.fwk-search-form.search-form input[type="search"] {
	width: 100%;
	min-height: 44px;
	margin: 0;
	padding: var(--fwk-space-3) var(--fwk-space-4) !important;
	border: 1px solid var(--fwk-color-control-border);
	border-radius: var(--fwk-radius-control);
	background: var(--fwk-color-surface);
	font-size: var(--fwk-text-base);
	color: var(--fwk-color-text);
	line-height: 1.3;
}

.fwk-search-form .search-field:focus,
.fwk-search-form input[type="search"]:focus,
form.fwk-search-form.woocommerce-product-search .search-field:focus,
form.fwk-search-form.woocommerce-product-search input[type="search"]:focus {
	outline: none;
	border-color: var(--fwk-green-400);
	box-shadow: inset 0 0 0 1px var(--fwk-green-400);
}

.fwk-search-form__submit,
.fwk-search-form button[type="submit"],
.fwk-search-form .search-submit,
form.fwk-search-form.woocommerce-product-search button[type="submit"],
form.fwk-search-form.woocommerce-product-search .search-submit,
form.fwk-search-form.search-form button[type="submit"],
form.fwk-search-form.search-form .search-submit,
.fwk-search-form .search-submit[type="submit"] {
	position: relative !important;
	inset: auto !important;
	top: auto !important;
	right: auto !important;
	bottom: auto !important;
	left: auto !important;
	z-index: auto;
	width: auto !important;
	min-width: 6.5rem;
	min-height: 44px;
	overflow: visible !important;
	padding: var(--fwk-space-3) var(--fwk-space-5) !important;
	border-radius: var(--fwk-radius-control);
	color: var(--fwk-color-on-cta) !important;
	background: var(--fwk-button-ink) !important;
	border: 1px solid transparent;
	box-shadow: none;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	line-height: 1.2;
	text-indent: 0 !important;
	clip: auto !important;
	clip-path: none !important;
}

.fwk-search-form__submit:hover,
.fwk-search-form button[type="submit"]:hover,
.fwk-search-form .search-submit:hover,
form.fwk-search-form.woocommerce-product-search button[type="submit"]:hover,
form.fwk-search-form.woocommerce-product-search .search-submit:hover {
	color: var(--fwk-color-on-cta) !important;
	background: var(--fwk-button-ink-hover) !important;
	filter: none;
}

.fwk-search-form__submit:focus-visible,
.fwk-search-form button[type="submit"]:focus-visible,
.fwk-search-form .search-submit:focus-visible,
form.fwk-search-form.woocommerce-product-search button[type="submit"]:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
}

.fwk-search-form__submit-text {
	position: static !important;
	display: inline !important;
	width: auto !important;
	height: auto !important;
	overflow: visible !important;
	color: inherit !important;
	clip: auto !important;
	clip-path: none !important;
	white-space: nowrap;
}

/* Kadence injects icon after submit ? hide outside drawer (higher specificity than WC). */
.fwk-search-form .kadence-search-icon-wrap,
form.fwk-search-form.search-form .kadence-search-icon-wrap,
form.fwk-search-form.woocommerce-product-search .kadence-search-icon-wrap,
form.woocommerce-product-search.fwk-search-form .kadence-search-icon-wrap {
	display: none !important;
}

/* Drawer form chrome: G7 ? above owns layout; only kill Kadence icon here. */
#search-drawer .fwk-search-form .kadence-search-icon-wrap,
#search-drawer form.woocommerce-product-search.fwk-search-form .kadence-search-icon-wrap {
	display: none !important;
}

/* -----------------------------------------------------------------------------
   G8 ? Breadcrumbs (Kadence / WC / Rank Math)
   -------------------------------------------------------------------------- */
.fwk-breadcrumbs,
.kadence-breadcrumbs,
.woocommerce-breadcrumb,
.rank-math-breadcrumb,
.product-title.product-above .kadence-breadcrumbs {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: var(--fwk-space-1);
	margin: 0 0 var(--fwk-space-3);
	max-width: 100%;
	overflow: hidden;
	font-size: var(--fwk-text-sm);
	line-height: 1.4;
	color: var(--fwk-color-muted);
}

.fwk-breadcrumbs nav,
.rank-math-breadcrumb p {
	margin: 0;
	display: contents;
}

.fwk-breadcrumbs a,
.kadence-breadcrumbs a,
.woocommerce-breadcrumb a,
.rank-math-breadcrumb a {
	color: var(--fwk-neutral-700);
	text-decoration: none;
	white-space: nowrap;
}

.fwk-breadcrumbs a:hover,
.kadence-breadcrumbs a:hover,
.woocommerce-breadcrumb a:hover,
.rank-math-breadcrumb a:hover {
	color: var(--fwk-color-text);
	text-decoration: underline;
}

.fwk-breadcrumbs a:focus-visible,
.kadence-breadcrumbs a:focus-visible,
.woocommerce-breadcrumb a:focus-visible,
.rank-math-breadcrumb a:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
	border-radius: var(--fwk-radius-sm);
}

/* Separator ? Kadence uses SVG/span; WC uses our sep class. */
.fwk-breadcrumbs__sep,
.kadence-breadcrumbs .bc-sep,
.kadence-breadcrumbs .separator,
.woocommerce-breadcrumb .fwk-breadcrumbs__sep,
.rank-math-breadcrumb .separator {
	flex: 0 0 auto;
	opacity: 0.55;
	padding-inline: var(--fwk-space-1);
}

.kadence-breadcrumb-container,
.fwk-breadcrumbs,
.kadence-breadcrumbs,
.woocommerce-breadcrumb,
.rank-math-breadcrumb {
	max-width: 100%;
	min-width: 0;
}

/* Mobile: truncate middle trail, keep last crumb readable. */
@media (max-width: 47.99em) {
	.kadence-breadcrumb-container {
		overflow-x: auto;
		scrollbar-width: none;
		max-width: 100%;
	}

	.fwk-breadcrumbs,
	.kadence-breadcrumbs,
	.woocommerce-breadcrumb,
	.rank-math-breadcrumb {
		mask-image: linear-gradient(90deg, transparent 0, #000 0.75rem, #000 calc(100% - 0.25rem), transparent 100%);
		-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 0.75rem, #000 calc(100% - 0.25rem), transparent 100%);
		overflow-x: auto;
		scrollbar-width: none;
	}

	.fwk-breadcrumbs::-webkit-scrollbar,
	.kadence-breadcrumbs::-webkit-scrollbar,
	.woocommerce-breadcrumb::-webkit-scrollbar,
	.rank-math-breadcrumb::-webkit-scrollbar {
		display: none;
	}

	.fwk-breadcrumbs > *:last-child,
	.kadence-breadcrumbs > *:last-child,
	.woocommerce-breadcrumb > *:last-child {
		flex-shrink: 0;
		font-weight: 600;
		color: var(--fwk-color-text);
	}
}

.product-title.product-above {
	margin-block: var(--fwk-space-4) var(--fwk-space-2);
}

/* -----------------------------------------------------------------------------
   U18 / C5 — Catalog pagination (shared with search) · Color Law minimal 2026-07-24
   Beat Kadence: .woocommerce nav.woocommerce-pagination ul li .page-numbers
   (margin-right + inline-block). Never chip-box the ul.page-numbers list.
   Pattern: text + bottom underline (U9 spirit) — no per-item borders / grey plates.
   Current = Selected green underline; hover = deepen; focus = ring only.
   -------------------------------------------------------------------------- */
.woocommerce nav.woocommerce-pagination,
.fwk-search__pagination.woocommerce-pagination,
.fwk-search__pagination {
	margin-block: var(--fwk-space-8) var(--fwk-space-4);
}

.woocommerce nav.woocommerce-pagination ul.page-numbers,
.woocommerce nav.woocommerce-pagination ul,
.fwk-search__pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: var(--fwk-space-1) var(--fwk-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
	border: 0;
	background: transparent;
	box-shadow: none;
	min-width: 0;
	min-height: 0;
}

/* Kill Woo clearfix pseudo on ul.page-numbers */
.woocommerce nav.woocommerce-pagination ul.page-numbers::before,
.woocommerce nav.woocommerce-pagination ul.page-numbers::after {
	content: none;
	display: none;
}

.woocommerce nav.woocommerce-pagination ul.page-numbers li,
.woocommerce-page nav.woocommerce-pagination ul.page-numbers li {
	display: flex;
	align-items: center;
	justify-content: center;
	float: none;
	margin: 0 !important;
	padding: 0;
	list-style: none;
	border: 0;
	background: transparent;
}

/* Text cells — no boxes (anti-stripe). Tap target via padding. */
.woocommerce nav.woocommerce-pagination ul li a.page-numbers,
.woocommerce nav.woocommerce-pagination ul li span.page-numbers,
.fwk-search__pagination a.page-numbers,
.fwk-search__pagination span.page-numbers {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0 !important;
	min-width: 2.75rem;
	min-height: 2.75rem;
	height: auto;
	padding: var(--fwk-space-2) var(--fwk-space-3);
	border: 0;
	border-bottom: 2px solid transparent;
	border-radius: 0;
	background: transparent;
	color: var(--fwk-color-muted);
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	text-decoration: none;
	line-height: 1;
	transition:
		color var(--fwk-duration) var(--fwk-ease),
		border-color var(--fwk-duration) var(--fwk-ease),
		box-shadow var(--fwk-duration) var(--fwk-ease);
}

.woocommerce nav.woocommerce-pagination ul li a.page-numbers:hover,
.woocommerce nav.woocommerce-pagination ul li a.page-numbers.is-hover,
.fwk-search__pagination a.page-numbers:hover,
.fwk-search__pagination a.page-numbers.is-hover {
	border-bottom-color: color-mix(in oklch, var(--fwk-color-selected) 45%, transparent);
	color: var(--fwk-color-selected);
	text-decoration: none;
	background: transparent;
}

.woocommerce nav.woocommerce-pagination ul li a.page-numbers:focus-visible,
.fwk-search__pagination a.page-numbers:focus-visible {
	outline: none;
	color: var(--fwk-color-selected);
	border-bottom-color: var(--fwk-color-selected);
	border-radius: var(--fwk-radius-sm);
	box-shadow: var(--fwk-focus-ring);
	background: transparent;
}

.woocommerce nav.woocommerce-pagination ul li span.page-numbers.current,
.woocommerce nav.woocommerce-pagination ul li span.current,
.fwk-search__pagination span.page-numbers.current {
	background: transparent;
	border-bottom-color: var(--fwk-color-selected);
	color: var(--fwk-color-selected);
	cursor: default;
}

.woocommerce nav.woocommerce-pagination ul li span.page-numbers.dots,
.fwk-search__pagination span.page-numbers.dots {
	border-bottom-color: transparent;
	background: transparent;
	color: var(--fwk-color-disabled);
	min-width: 1.75rem;
	padding-inline: var(--fwk-space-1);
	pointer-events: none;
	font-weight: 500;
}

/* Prev / Next — slightly stronger text, same borderless language */
.woocommerce nav.woocommerce-pagination ul li a.page-numbers.prev,
.woocommerce nav.woocommerce-pagination ul li a.page-numbers.next,
.fwk-search__pagination a.page-numbers.prev,
.fwk-search__pagination a.page-numbers.next {
	color: var(--fwk-color-text);
	padding-inline: var(--fwk-space-4);
	min-width: auto;
}

.woocommerce nav.woocommerce-pagination ul li a.page-numbers.prev:hover,
.woocommerce nav.woocommerce-pagination ul li a.page-numbers.next:hover,
.woocommerce nav.woocommerce-pagination ul li a.page-numbers.prev.is-hover,
.woocommerce nav.woocommerce-pagination ul li a.page-numbers.next.is-hover,
.fwk-search__pagination a.page-numbers.prev:hover,
.fwk-search__pagination a.page-numbers.next:hover,
.fwk-search__pagination a.page-numbers.prev.is-hover,
.fwk-search__pagination a.page-numbers.next.is-hover {
	color: var(--fwk-color-selected);
}

@media (max-width: 29.99em) {
	.woocommerce nav.woocommerce-pagination ul li a.page-numbers:not(.prev):not(.next),
	.woocommerce nav.woocommerce-pagination ul li span.page-numbers:not(.current):not(.dots),
	.fwk-search__pagination a.page-numbers:not(.prev):not(.next) {
		display: none;
	}

	.woocommerce nav.woocommerce-pagination ul li span.page-numbers.current,
	.fwk-search__pagination span.page-numbers.current {
		display: inline-flex;
	}

	.woocommerce nav.woocommerce-pagination ul li a.page-numbers.prev,
	.woocommerce nav.woocommerce-pagination ul li a.page-numbers.next,
	.fwk-search__pagination a.page-numbers.prev,
	.fwk-search__pagination a.page-numbers.next {
		flex: 1 1 auto;
	}
}

/* === H10: Home FAQ (pattern only — chrome from U17) === */
.fwk-home-faq {
	padding-block: clamp(2.5rem, 1.5rem + 4vw, 4.5rem);
	background: var(--fwk-color-surface);
	border-block-start: 1px solid var(--fwk-color-border);
}

.fwk-home-faq__grid {
	display: grid;
	gap: var(--fwk-space-8);
	align-items: start;
}

.fwk-home-faq__intro {
	min-width: 0;
}

.fwk-home-faq__head {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--fwk-space-2);
	margin-block-end: var(--fwk-space-5);
	max-width: 22rem;
	text-align: start;
}

.fwk-home-faq__head h2 {
	text-align: start;
}

.fwk-home-faq__help {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: var(--fwk-space-2) var(--fwk-space-3);
	margin: 0;
	font: var(--fwk-type-body);
	font-size: var(--fwk-text-sm);
	line-height: 1.45;
	color: var(--fwk-color-muted);
}

.fwk-home-faq__help-label {
	color: var(--fwk-color-text);
	font-weight: 600;
}

.fwk-home-faq__help-links {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: var(--fwk-space-2);
}

.fwk-home-faq__help-sep {
	opacity: 0.55;
	user-select: none;
}

.fwk-home-faq__accordion {
	min-width: 0;
	max-width: 40rem;
	width: 100%;
}

/* Mobile: show "Не знайшли відповідь?" help line after the FAQ accordion (desktop keeps it in the intro). */
@media (max-width: 63.99em) {
	.fwk-home-faq__intro {
		display: contents;
	}

	.fwk-home-faq__head {
		order: 1;
		margin-block-end: 0;
	}

	.fwk-home-faq__accordion {
		order: 2;
	}

	.fwk-home-faq__help {
		order: 3;
	}
}

@media (min-width: 64em) {
	.fwk-home-faq__grid {
		grid-template-columns: minmax(14rem, 22rem) minmax(0, 1fr);
		gap: clamp(2rem, 1rem + 3vw, 4rem);
	}

	.fwk-home-faq__intro {
		position: sticky;
		top: calc(var(--fwk-header-offset, 4.5rem) + var(--fwk-space-4));
	}

	.fwk-home-faq__head {
		margin-block-end: var(--fwk-space-6);
	}
}

/* === UIK: Accordion (U17) ==================================================
   Compose: button.fwk-btn-plain.fwk-accordion__trigger
   States: default В· hover В· focus-visible В· active В· open (accent-soft, never CTA fill)
   Motion: grid-template-rows 0fr→1fr; [hidden] stays display:none
   -------------------------------------------------------------------------- */
.fwk-accordion {
	max-width: 44rem;
	margin-inline: 0;
}

.fwk-home-faq .fwk-accordion {
	max-width: none;
}

.fwk-accordion__item {
	border-block-end: 1px solid var(--fwk-color-border);
}

.fwk-accordion__item:first-child {
	border-block-start: 1px solid var(--fwk-color-border);
}

.fwk-accordion__heading {
	margin: 0;
	font: inherit;
}

button.fwk-btn-plain.fwk-accordion__trigger,
.fwk-accordion__trigger.fwk-btn-plain {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-4);
	width: calc(100% + 2 * var(--fwk-space-3));
	min-height: 44px;
	padding: var(--fwk-space-4) var(--fwk-space-3);
	margin-inline: calc(-1 * var(--fwk-space-3));
	border-radius: var(--fwk-radius-control);
	background: transparent;
	background-color: transparent;
	color: var(--fwk-color-text);
	font-family: var(--fwk-font-display);
	font-size: var(--fwk-text-base);
	font-weight: 600;
	line-height: 1.35;
	text-align: start;
	transition:
		color var(--fwk-duration) var(--fwk-ease),
		background-color var(--fwk-duration) var(--fwk-ease),
		box-shadow var(--fwk-duration) var(--fwk-ease);
}

button.fwk-btn-plain.fwk-accordion__trigger:hover,
button.fwk-btn-plain.fwk-accordion__trigger.is-hover {
	background: transparent;
	background-color: transparent;
	color: var(--fwk-color-accent);
	box-shadow: none;
}

button.fwk-btn-plain.fwk-accordion__trigger:hover .fwk-accordion__icon,
button.fwk-btn-plain.fwk-accordion__trigger.is-hover .fwk-accordion__icon {
	color: var(--fwk-color-accent);
}

button.fwk-btn-plain.fwk-accordion__trigger:focus {
	outline: none;
	background: transparent;
	background-color: transparent;
	box-shadow: none;
	color: var(--fwk-color-text);
}

button.fwk-btn-plain.fwk-accordion__trigger:focus-visible {
	outline: none;
	background: transparent;
	background-color: transparent;
	color: var(--fwk-color-text);
	box-shadow: var(--fwk-focus-ring);
	border-radius: var(--fwk-radius-control);
}

button.fwk-btn-plain.fwk-accordion__trigger:active {
	background: transparent;
	background-color: transparent;
	box-shadow: none;
	color: var(--fwk-color-text);
	opacity: 0.9;
	transform: none;
}

.fwk-accordion__item.is-open > .fwk-accordion__heading > button.fwk-btn-plain.fwk-accordion__trigger,
.fwk-accordion__item.is-open button.fwk-btn-plain.fwk-accordion__trigger {
	background: var(--fwk-color-accent-soft);
	background-color: var(--fwk-color-accent-soft);
	color: var(--fwk-color-text);
}

.fwk-accordion__item.is-open > .fwk-accordion__heading > button.fwk-btn-plain.fwk-accordion__trigger:hover,
.fwk-accordion__item.is-open > .fwk-accordion__heading > button.fwk-btn-plain.fwk-accordion__trigger:focus-visible,
.fwk-accordion__item.is-open button.fwk-btn-plain.fwk-accordion__trigger:hover,
.fwk-accordion__item.is-open button.fwk-btn-plain.fwk-accordion__trigger:focus-visible {
	background: var(--fwk-color-accent-soft);
	background-color: var(--fwk-color-accent-soft);
	color: var(--fwk-color-text);
}

.fwk-accordion__item.is-open button.fwk-btn-plain.fwk-accordion__trigger:focus-visible {
	box-shadow: var(--fwk-focus-ring);
}

.fwk-accordion__question {
	flex: 1 1 auto;
	min-width: 0;
	text-wrap: balance;
}

.fwk-accordion__icon {
	display: grid;
	place-items: center;
	flex: 0 0 auto;
	width: 1.75rem;
	height: 1.75rem;
	color: var(--fwk-color-muted);
	transition: transform var(--fwk-duration) var(--fwk-ease), color var(--fwk-duration) var(--fwk-ease);
}

.fwk-accordion__item.is-open .fwk-accordion__icon {
	transform: rotate(180deg);
	color: var(--fwk-color-accent);
}

.fwk-accordion__panel {
	display: grid;
	grid-template-rows: 0fr;
	overflow: hidden;
	transition: grid-template-rows var(--fwk-duration) var(--fwk-ease);
}

.fwk-accordion__panel[hidden] {
	display: none;
}

.fwk-accordion__item.is-open .fwk-accordion__panel {
	grid-template-rows: 1fr;
}

.fwk-accordion__item.is-open .fwk-accordion__panel[hidden] {
	display: grid;
}

.fwk-accordion__body {
	min-height: 0;
	overflow: hidden;
	padding: var(--fwk-space-5) var(--fwk-space-3) var(--fwk-space-5);
	max-width: 40rem;
}

.fwk-accordion__body p {
	margin: 0;
	color: var(--fwk-color-muted);
	font: var(--fwk-type-body);
	font-size: var(--fwk-text-sm);
	line-height: 1.55;
}

.fwk-accordion__body strong {
	color: var(--fwk-color-text);
	font-weight: 600;
}

.fwk-accordion__body .fwk-link {
	font-weight: 600;
}

@media (prefers-reduced-motion: reduce) {
	.fwk-accordion__icon,
	.fwk-accordion__panel,
	button.fwk-btn-plain.fwk-accordion__trigger {
		transition: none;
	}
}


/* === A*: My Account === */
.fwk-account-page .entry-content-wrap,
.fwk-account-page .woocommerce {
	max-width: 56rem;
}

.fwk-account-page .entry-title {
	margin-block-end: var(--fwk-space-6);
	font: var(--fwk-type-title);
	font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem);
	color: var(--fwk-color-text);
}

/* ?? A1 Login / Register ?? */
.fwk-account-auth {
	display: grid;
	gap: var(--fwk-space-8);
	margin: 0;
	padding: 0;
	border: 0;
}

@media (min-width: 768px) {
	.fwk-account-auth {
		grid-template-columns: 1fr 1fr;
		gap: var(--fwk-space-10);
		align-items: start;
	}

	.fwk-account-auth__col + .fwk-account-auth__col {
		padding-inline-start: var(--fwk-space-10);
		border-inline-start: 1px solid var(--fwk-color-border);
	}
}

.fwk-account-auth .u-column1,
.fwk-account-auth .u-column2,
.fwk-account-auth .col-1,
.fwk-account-auth .col-2 {
	float: none;
	width: auto;
	max-width: none;
	margin: 0;
	padding: 0;
}

.fwk-account-auth__header {
	margin-block-end: var(--fwk-space-5);
}

.fwk-account-auth__title {
	margin: 0 0 var(--fwk-space-2);
	font: var(--fwk-type-title);
	font-size: var(--fwk-text-xl);
	color: var(--fwk-color-text);
}

.fwk-account-auth__lead,
.fwk-account-form__hint {
	margin: 0;
	color: var(--fwk-color-muted);
	font: var(--fwk-type-body);
	font-size: var(--fwk-text-sm);
	line-height: 1.5;
}

.fwk-account-form .form-row {
	margin-block-end: var(--fwk-space-4);
}

.fwk-account-form .woocommerce-form-login__rememberme {
	display: inline-flex;
	align-items: center;
	gap: var(--fwk-space-2);
	min-height: 44px;
	margin: 0;
	font-size: var(--fwk-text-sm);
	font-weight: 500;
	color: var(--fwk-color-text);
	cursor: pointer;
}

.fwk-account-form .woocommerce-form__input-checkbox {
	width: 1.125rem;
	height: 1.125rem;
	margin: 0;
	accent-color: var(--fwk-color-cta);
	cursor: pointer;
}

.fwk-account-form .woocommerce-form__input-checkbox:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
}

.fwk-account-form__row--actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-3);
}

.fwk-account-form__row--actions .button,
.fwk-account-form__row--submit .button {
	min-height: 44px;
}

.fwk-account-form .lost_password {
	margin: var(--fwk-space-3) 0 0;
}

.fwk-account-page--guest .woocommerce-form-login .button,
.fwk-account-page--guest .woocommerce-form-register .button {
	width: 100%;
}

@media (min-width: 480px) {
	.fwk-account-page--guest .woocommerce-form-login .button,
	.fwk-account-page--guest .woocommerce-form-register .button {
		width: auto;
		min-width: 10rem;
	}
}

/* ?? A2 Dashboard nav ?? */
.fwk-account-page--member .woocommerce {
	display: grid;
	gap: var(--fwk-space-6);
}

@media (min-width: 900px) {
	.fwk-account-page--member .woocommerce {
		grid-template-columns: minmax(11rem, 14rem) minmax(0, 1fr);
		gap: var(--fwk-space-8);
		align-items: start;
	}

	.fwk-account-page.kadence-account-nav-right .woocommerce {
		grid-template-columns: minmax(0, 1fr) minmax(11rem, 14rem);
	}

	.fwk-account-page.kadence-account-nav-right .account-navigation-wrap {
		order: 2;
	}

	.fwk-account-page.kadence-account-nav-right .woocommerce-MyAccount-content {
		order: 1;
	}
}

.fwk-account-page .account-navigation-wrap {
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
}

.fwk-account-page .account-navigation-wrap .kadence-account-avatar {
	display: none;
}

.fwk-account-nav__list {
	display: flex;
	flex-wrap: nowrap;
	gap: var(--fwk-space-1);
	margin: 0;
	padding: 0 0 var(--fwk-space-2);
	list-style: none;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
	border-block-end: 1px solid var(--fwk-color-border);
}

.fwk-account-nav__list li {
	flex: 0 0 auto;
	margin: 0;
	padding: 0;
	border: 0;
}

.fwk-account-nav__list a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: var(--fwk-space-2) var(--fwk-space-4);
	border: 0;
	border-radius: var(--fwk-radius-sm);
	background: transparent;
	color: var(--fwk-color-muted);
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
	transition: color var(--fwk-duration) var(--fwk-ease), background-color var(--fwk-duration) var(--fwk-ease);
}

.fwk-account-nav__list a:hover {
	color: var(--fwk-color-text);
	background: var(--fwk-color-sunken);
}

.fwk-account-nav__list a:focus {
	outline: none;
}

.fwk-account-nav__list a:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
}

.fwk-account-nav__list li.is-active a,
.fwk-account-nav__list a[aria-current="page"] {
	color: var(--fwk-color-text);
	background: var(--fwk-color-accent-soft);
}

.fwk-account-nav__list .woocommerce-MyAccount-navigation-link--customer-logout a {
	color: var(--fwk-color-muted);
}

@media (min-width: 900px) {
	.fwk-account-nav__list {
		flex-direction: column;
		flex-wrap: wrap;
		overflow: visible;
		padding: 0;
		border-block-end: 0;
		border-inline-start: 1px solid var(--fwk-color-border);
		gap: var(--fwk-space-1);
	}

	.fwk-account-nav__list li {
		width: 100%;
	}

	.fwk-account-nav__list a {
		justify-content: flex-start;
		width: 100%;
		padding-inline: var(--fwk-space-4);
		border-radius: 0 var(--fwk-radius-sm) var(--fwk-radius-sm) 0;
		border-inline-start: 2px solid transparent;
		margin-inline-start: -1px;
	}

	.fwk-account-nav__list li.is-active a,
	.fwk-account-nav__list a[aria-current="page"] {
		border-inline-start-color: var(--fwk-color-accent);
		background: transparent;
		color: var(--fwk-color-text);
	}

	.fwk-account-page.kadence-account-nav-right .fwk-account-nav__list {
		border-inline-start: 0;
		border-inline-end: 1px solid var(--fwk-color-border);
	}

	.fwk-account-page.kadence-account-nav-right .fwk-account-nav__list a {
		border-radius: var(--fwk-radius-sm) 0 0 var(--fwk-radius-sm);
		border-inline-start: 0;
		border-inline-end: 2px solid transparent;
		margin-inline-start: 0;
		margin-inline-end: -1px;
	}

	.fwk-account-page.kadence-account-nav-right .fwk-account-nav__list li.is-active a,
	.fwk-account-page.kadence-account-nav-right .fwk-account-nav__list a[aria-current="page"] {
		border-inline-end-color: var(--fwk-color-accent);
	}
}

.fwk-account-dashboard {
	display: grid;
	gap: var(--fwk-space-4);
	max-width: 40rem;
}

.fwk-account-dashboard__hello,
.fwk-account-dashboard__lead {
	margin: 0;
	font: var(--fwk-type-body);
	font-size: var(--fwk-text-base);
	line-height: 1.55;
	color: var(--fwk-color-text);
}

.fwk-account-dashboard__lead {
	color: var(--fwk-color-muted);
	font-size: var(--fwk-text-sm);
}

.fwk-account-page .woocommerce-MyAccount-content {
	min-width: 0;
}

.fwk-account-page .woocommerce-EditAccountForm .form-row,
.fwk-account-page .woocommerce-address-fields .form-row {
	margin-block-end: var(--fwk-space-4);
}

.fwk-account-page .woocommerce-EditAccountForm fieldset {
	margin: var(--fwk-space-6) 0;
	padding: 0;
	border: 0;
}

.fwk-account-page .woocommerce-EditAccountForm legend {
	padding: 0;
	margin-block-end: var(--fwk-space-3);
	font: var(--fwk-type-title);
	font-size: var(--fwk-text-lg);
}

/* ?? A3 Orders ?? */
.fwk-account-orders {
	width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.fwk-account-orders__table {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	background: transparent;
}

.fwk-account-orders__table thead th {
	padding: var(--fwk-space-3) var(--fwk-space-3);
	border-block-end: 1px solid var(--fwk-color-border);
	color: var(--fwk-color-muted);
	font-size: var(--fwk-text-xs);
	font-weight: 600;
	letter-spacing: 0.02em;
	text-align: start;
	text-transform: uppercase;
}

.fwk-account-orders__table tbody th,
.fwk-account-orders__table tbody td {
	padding: var(--fwk-space-4) var(--fwk-space-3);
	border-block-end: 1px solid var(--fwk-color-border);
	vertical-align: middle;
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-text);
	background: transparent;
}

.fwk-account-orders__number {
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

.fwk-account-orders__status {
	display: inline-block;
	color: var(--fwk-color-muted);
	font-weight: 600;
}

.fwk-account-orders__status--processing,
.fwk-account-orders__status--on-hold {
	color: var(--fwk-color-accent);
}

.fwk-account-orders__status--completed {
	color: var(--fwk-color-success);
}

.fwk-account-orders__status--cancelled,
.fwk-account-orders__status--failed {
	color: var(--fwk-color-danger);
}

.fwk-account-orders__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--fwk-space-2);
}

.fwk-account-orders__actions .button {
	margin: 0;
}

.fwk-account-orders__pager {
	display: flex;
	flex-wrap: wrap;
	gap: var(--fwk-space-3);
	margin-block-start: var(--fwk-space-6);
}

.fwk-empty--orders {
	padding-block: var(--fwk-space-8);
}

@media (max-width: 767px) {
	.fwk-account-orders {
		overflow: visible;
	}

	.fwk-account-orders__table thead {
		display: none;
	}

	.fwk-account-orders__table,
	.fwk-account-orders__table tbody,
	.fwk-account-orders__table tr,
	.fwk-account-orders__table th,
	.fwk-account-orders__table td {
		display: block;
		width: 100%;
	}

	.fwk-account-orders__table tbody tr {
		margin-block-end: var(--fwk-space-4);
		padding: var(--fwk-space-4) 0;
		border-block-end: 1px solid var(--fwk-color-border);
	}

	.fwk-account-orders__table tbody th,
	.fwk-account-orders__table tbody td {
		display: flex;
		justify-content: space-between;
		align-items: baseline;
		gap: var(--fwk-space-4);
		padding: var(--fwk-space-2) 0;
		border: 0;
		text-align: end;
	}

	.fwk-account-orders__table tbody th::before,
	.fwk-account-orders__table tbody td::before {
		content: attr(data-title);
		flex: 0 0 auto;
		color: var(--fwk-color-muted);
		font-size: var(--fwk-text-xs);
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.02em;
		text-align: start;
	}

	.fwk-account-orders__actions {
		justify-content: flex-end;
		width: 100%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.fwk-account-nav__list a {
		transition: none;
	}
}

/* === U16: Tabs ============================================================= */
/* Atom `.fwk-tabs` ? styleguide + reusable pill tabs (PDP WC block unchanged). */
.fwk-tabs {
	display: grid;
	gap: var(--fwk-space-6);
	max-width: 48rem;
}

.fwk-tabs__list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--fwk-space-1);
	padding: var(--fwk-space-1);
	margin: 0;
	list-style: none;
	border: 0;
	border-radius: var(--fwk-radius-md);
	background: var(--fwk-color-sunken);
}

.fwk-tabs__tab {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	padding: var(--fwk-space-2) var(--fwk-space-5);
	border: 0;
	border-radius: var(--fwk-radius-control);
	background: transparent;
	color: var(--fwk-color-muted);
	font-family: inherit;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	line-height: 1.4;
	text-decoration: none;
	cursor: pointer;
	transition:
		color var(--fwk-duration-fast, 120ms) var(--fwk-ease-out, ease),
		background-color var(--fwk-duration-fast, 120ms) var(--fwk-ease-out, ease),
		box-shadow var(--fwk-duration-fast, 120ms) var(--fwk-ease-out, ease);
}

.fwk-tabs__tab:hover {
	color: var(--fwk-color-text);
}

.fwk-tabs__tab:focus {
	outline: none;
}

.fwk-tabs__tab:focus-visible {
	color: var(--fwk-color-text);
	box-shadow: var(--fwk-focus-ring);
}

.fwk-tabs__tab.is-active,
.fwk-tabs__tab[aria-selected="true"] {
	color: var(--fwk-color-text);
	background: var(--fwk-color-surface);
	box-shadow: var(--fwk-shadow-sm);
}

.fwk-tabs__tab:disabled,
.fwk-tabs__tab.is-disabled,
.fwk-tabs__tab[aria-disabled="true"] {
	opacity: 0.45;
	cursor: not-allowed;
	pointer-events: none;
	color: var(--fwk-color-muted);
	background: transparent;
	box-shadow: none;
}

.fwk-tabs__panel {
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	font-size: var(--fwk-text-base);
	line-height: 1.65;
	color: var(--fwk-color-text);
}

.fwk-tabs__panel:focus {
	outline: none;
}

.fwk-tabs__panel:focus-visible {
	box-shadow: var(--fwk-focus-ring);
	border-radius: var(--fwk-radius-sm);
}

.fwk-tabs__panel p {
	margin: 0;
}

/* Styleguide mock states (screenshots without real hover/focus) */
.fwk-uikit .fwk-tabs__tab.is-hover {
	color: var(--fwk-color-text);
}

.fwk-uikit .fwk-tabs__tab.is-focus {
	color: var(--fwk-color-text);
	outline: none;
	box-shadow: var(--fwk-focus-ring);
}

.fwk-uikit__tabs-matrix .fwk-tabs__list {
	flex-wrap: wrap;
}

@media (prefers-reduced-motion: reduce) {
	.fwk-tabs__tab {
		transition: none;
	}
}

/* === P0: Kadence loop icons === */
/*
 * Kadence injects arrow + spinner + check into loop CTAs.
 * Parent hide rules require `.woocommerce ul.products` - home
 * bestsellers lack body.woocommerce, so icons overlap CTA text.
 */
.fwk-bestsellers ul.products li.product .button .kadence-spinner-svg,
.fwk-bestsellers ul.products li.product .button .kadence-check-svg,
.fwk-bestsellers ul.products li.product .button .kadence-arrow-right-alt-svg,
.fwk-bestsellers ul.products li.product .button .kadence-svg-iconset,
ul.products li.product.fwk-product-card .button .kadence-spinner-svg,
ul.products li.product.fwk-product-card .button .kadence-check-svg,
ul.products li.product.fwk-product-card .button .kadence-arrow-right-alt-svg,
ul.products li.product.fwk-product-card .button .kadence-svg-iconset,
.fwk-product-card .product-action-wrap .button .kadence-spinner-svg,
.fwk-product-card .product-action-wrap .button .kadence-check-svg,
.fwk-product-card .product-action-wrap .button .kadence-arrow-right-alt-svg,
.fwk-product-card .product-action-wrap .button .kadence-svg-iconset,
.products .fwk-product-card .button .kadence-spinner-svg,
.products .fwk-product-card .button .kadence-check-svg,
.products .fwk-product-card .button .kadence-arrow-right-alt-svg,
.products .fwk-product-card .button .kadence-svg-iconset {
	display: none !important;
}

/* === T4 Perception === */
/* V-HERO-SLAB: collapse Kadence gray title slabs on soft pages (header/nav untouched). */
.fwk-cart-page .entry-hero,
.fwk-checkout-page .entry-hero,
.fwk-account-page .entry-hero,
.woocommerce-cart .entry-hero,
.woocommerce-checkout .entry-hero,
.woocommerce-account .entry-hero {
	padding-block: var(--fwk-space-3);
	padding-inline: 0;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none;
}

.fwk-cart-page .entry-hero .entry-hero-container-inner,
.fwk-checkout-page .entry-hero .entry-hero-container-inner,
.fwk-account-page .entry-hero .entry-hero-container-inner,
.woocommerce-cart .entry-hero .entry-hero-container-inner,
.woocommerce-checkout .entry-hero .entry-hero-container-inner,
.woocommerce-account .entry-hero .entry-hero-container-inner {
	min-height: 0 !important;
	padding-block: var(--fwk-space-2);
	background: transparent !important;
	border: 0 !important;
}

.fwk-cart-page .entry-hero .hero-section-overlay,
.fwk-checkout-page .entry-hero .hero-section-overlay,
.fwk-account-page .entry-hero .hero-section-overlay,
.woocommerce-cart .entry-hero .hero-section-overlay,
.woocommerce-checkout .entry-hero .hero-section-overlay,
.woocommerce-account .entry-hero .hero-section-overlay {
	display: none !important;
}

.fwk-cart-page .entry-hero .entry-header,
.fwk-checkout-page .entry-hero .entry-header,
.fwk-account-page .entry-hero .entry-header,
.woocommerce-cart .entry-hero .entry-header,
.woocommerce-checkout .entry-hero .entry-header,
.woocommerce-account .entry-hero .entry-header {
	min-height: 0 !important;
	padding-block: 0;
	justify-content: flex-start;
	align-items: flex-start;
	text-align: start;
}

.fwk-cart-page .entry-hero .entry-title,
.fwk-checkout-page .entry-hero .entry-title,
.fwk-account-page .entry-hero .entry-title,
.woocommerce-cart .entry-hero .entry-title,
.woocommerce-checkout .entry-hero .entry-title,
.woocommerce-account .entry-hero .entry-title {
	margin: 0;
	font: var(--fwk-type-title);
	letter-spacing: -0.02em;
	color: var(--fwk-color-text);
	text-align: start;
}

/* Cart utility H1: one step below marketing title (text-xl, not 2xl). */
.fwk-cart-page .entry-hero .entry-title,
.woocommerce-cart .entry-hero .entry-title {
	font-size: var(--fwk-text-xl);
	line-height: 1.2;
}

/* V-TOOLBAR: hide Kadence grid/list; Kit sort on shop top only (not .fwk-search__ordering). */
.kadence-woo-toggle,
.kadence-shop-top .kadence-product-toggle-container,
.kadence-shop-top-row .kadence-product-toggle-container,
.kadence-product-toggle-container {
	display: none !important;
}

.kadence-shop-top-row .woocommerce-ordering,
.kadence-woo-ordering .woocommerce-ordering {
	margin: 0;
}

.kadence-shop-top-row .woocommerce-ordering select,
.kadence-woo-ordering .woocommerce-ordering select,
.fwk-catalog-toolbar .woocommerce-ordering select {
	box-sizing: border-box;
	min-height: 44px;
	padding: var(--fwk-space-2) 2.5rem var(--fwk-space-2) var(--fwk-space-4);
	border: 1px solid var(--fwk-color-control-border);
	border-radius: var(--fwk-radius-control);
	background-color: var(--fwk-color-control-fill);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23475569' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right var(--fwk-space-3) center;
	background-size: 1rem;
	color: var(--fwk-color-text);
	font-family: var(--fwk-font);
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.3;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}

.kadence-shop-top-row .woocommerce-ordering select:focus-visible,
.kadence-woo-ordering .woocommerce-ordering select:focus-visible {
	outline: none;
	border-color: var(--fwk-color-accent);
	box-shadow: var(--fwk-focus-ring);
}

/* V-CARD CTA: layout reinforce only — reveal SSOT is §12 U10 hover rules above. */
ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta,
ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta--outline,
ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta--text,
ul.products li.product.fwk-product-card .product-action-wrap .button:not(.kb-button) {
	justify-content: flex-start;
	width: auto;
	max-width: 100%;
	padding-inline: 0;
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

ul.products li.product.fwk-product-card .product-action-wrap .fwk-card-cta--ghost,
ul.products li.product.fwk-product-card .product-action-wrap .button.fwk-card-cta--ghost {
	border: 0;
	color: var(--fwk-color-muted);
}

/* =============================================================================
   Premium Unbox 2026 — dock, chrome, surfaces (after all Kit sections)
   ============================================================================= */

/* --- U23 Bottom dock ------------------------------------------------------- */
.fwk-dock {
	display: none;
}

@media (max-width: 64em) {
	body.fwk-has-dock {
		padding-bottom: calc(var(--fwk-bottom-dock-offset) + 0.25rem);
	}

	body.fwk-has-dock.fwk-has-sticky-atc,
	body.fwk-has-dock.fwk-dock-suppressed,
	body.fwk-has-dock.fwk-dock-suppressed-filters {
		padding-bottom: 0;
	}

	body.fwk-has-dock.fwk-has-sticky-atc {
		padding-bottom: calc(var(--fwk-sticky-atc-offset, 5.5rem) + env(safe-area-inset-bottom, 0px));
	}

	body.fwk-has-dock:has(#cookie-notice.cookie-notice-visible):not(.fwk-has-sticky-atc):not(.fwk-dock-suppressed):not(.fwk-dock-suppressed-filters) {
		padding-bottom: calc(var(--fwk-bottom-dock-offset) + var(--fwk-cookie-bar-offset, 0px) + 0.25rem);
	}

	.fwk-dock {
		display: block;
		position: fixed;
		inset-inline: 0.75rem;
		bottom: calc(0.5rem + env(safe-area-inset-bottom, 0px));
		z-index: var(--fwk-z-dock);
		pointer-events: none;
		transition: opacity var(--fwk-duration) var(--fwk-ease), transform var(--fwk-duration) var(--fwk-ease);
	}

	body:has(#cookie-notice.cookie-notice-visible) .fwk-dock {
		bottom: calc(0.5rem + var(--fwk-cookie-bar-offset, 0px) + env(safe-area-inset-bottom, 0px));
	}

	body.fwk-dock-suppressed .fwk-dock,
	body.fwk-dock-suppressed-filters .fwk-dock,
	body.fwk-has-sticky-atc .fwk-dock {
		opacity: 0;
		transform: translateY(120%);
		pointer-events: none;
		visibility: hidden;
	}

	.fwk-dock__bar {
		--fwk-dock-bar-fill: color-mix(in oklch, var(--fwk-color-surface) 92%, transparent);
		pointer-events: auto;
		display: grid;
		grid-template-columns: repeat(5, 1fr);
		align-items: stretch;
		gap: 0;
		min-height: var(--fwk-bottom-dock-height);
		padding: 0.35rem 0.25rem;
		border-radius: var(--fwk-radius-pill);
		border: 1.5px solid transparent;
		/* Gradient outline (white → blue → green) via padding-box/border-box
		   background-clip trick — keeps the pill's fully-rounded corners
		   (border-image would tile/clip badly on a 9999px radius) and does
		   not interfere with the backdrop-filter glass fill below. */
		background-image:
			linear-gradient(var(--fwk-dock-bar-fill), var(--fwk-dock-bar-fill)),
			linear-gradient(100deg, var(--fwk-color-surface) 0%, var(--fwk-sky-400) 48%, var(--fwk-green-400) 100%);
		background-origin: border-box;
		background-clip: padding-box, border-box;
		box-shadow:
			var(--fwk-shadow-dock),
			0 12px 28px oklch(32% 0.05 235 / 0.18),
			0 2px 6px oklch(28% 0.03 235 / 0.08);
		backdrop-filter: blur(16px);
		-webkit-backdrop-filter: blur(16px);
	}

	.fwk-dock__item {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 0.15rem;
		min-height: 44px;
		padding: 0.2rem;
		border: 0;
		background: transparent;
		color: var(--fwk-color-muted);
		font: inherit;
		font-size: 0.625rem;
		font-weight: 600;
		line-height: 1.1;
		text-decoration: none;
		cursor: pointer;
		border-radius: var(--fwk-radius-pill);
		transition: color var(--fwk-duration) var(--fwk-ease), background-color var(--fwk-duration) var(--fwk-ease);
	}

	.fwk-dock__item:hover,
	.fwk-dock__item:focus-visible {
		color: var(--fwk-color-selected);
		background: var(--fwk-color-selected-soft);
		outline: none;
	}

	.fwk-dock__item:focus-visible {
		box-shadow: var(--fwk-focus-ring);
	}

	.fwk-dock__item.is-current {
		color: var(--fwk-color-selected);
	}

	.fwk-dock__item.is-current .fwk-dock__label {
		color: var(--fwk-color-selected);
	}

	.fwk-dock__icon {
		position: relative;
		display: inline-flex;
		width: 1.35rem;
		height: 1.35rem;
	}

	.fwk-dock__icon svg {
		width: 100%;
		height: 100%;
	}

	.fwk-dock__badge {
		position: absolute;
		top: -0.35rem;
		right: -0.45rem;
		min-width: 1rem;
		height: 1rem;
		padding: 0 0.25rem;
		border-radius: var(--fwk-radius-pill);
		background: var(--fwk-button-ink);
		color: var(--fwk-color-on-cta);
		font-size: 0.625rem;
		font-weight: 700;
		line-height: 1rem;
		text-align: center;
	}

	.fwk-dock__badge.header-cart-is-empty-true,
	.fwk-dock__badge[hidden] {
		display: none !important;
	}

	.fwk-dock__label {
		max-width: 100%;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	/* U23 IA: primary actions (search / wishlist / cart) move to the dock;
	   the glass header keeps only logo + hamburger (→ #mobile-drawer service menu). */
	body.fwk-has-dock .fwk-site-header__actions .search-toggle-open-container,
	body.fwk-has-dock .fwk-site-header__actions .fwk-wishlist-header,
	body.fwk-has-dock .fwk-site-header__actions .header-cart-wrap {
		display: none !important;
	}

	body.fwk-has-dock .fwk-site-header__menu-toggle {
		display: flex !important;
	}

	#masthead.fwk-site-header,
	#masthead.site-header {
		background-color: var(--fwk-header-glass, rgba(255, 255, 255, 0.2)) !important;
		background-image: none !important;
		border-bottom: 0.8px solid var(--fwk-header-border, #c8cfd4);
		box-shadow: var(--fwk-header-shadow) !important;
		backdrop-filter: blur(var(--fwk-header-blur, 6px)) saturate(1.2) !important;
		-webkit-backdrop-filter: blur(var(--fwk-header-blur, 6px)) saturate(1.2) !important;
	}

	body:not(.fwk-header-overlay) #masthead.fwk-site-header,
	#masthead.fwk-site-header.is-scrolled,
	#masthead.site-header.is-scrolled {
		background-color: var(--fwk-header-glass-dense) !important;
		border-bottom-color: color-mix(in oklch, var(--fwk-color-text) 8%, transparent);
	}

	body.fwk-header-overlay #masthead.fwk-site-header--overlay:not(.is-scrolled) {
		background-color: var(--fwk-header-glass) !important;
	}
}

@media (min-width: 64.01em) {
	.fwk-dock {
		display: none !important;
	}
}

/* --- U24 More sheet -------------------------------------------------------- */
#mobile-drawer .drawer-content.mobile-drawer-content {
	/* Single gutter — avoid stacking with .fwk-more-sheet padding. */
	padding: var(--fwk-space-3) 1.25rem var(--fwk-space-6);
}

#mobile-drawer .drawer-header::before {
	content: "Меню";
	font-family: var(--fwk-font-display);
	font-size: var(--fwk-text-base);
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--fwk-color-text);
	line-height: 1.2;
}

.fwk-more-sheet {
	display: grid;
	gap: var(--fwk-space-5);
	padding: 0;
	margin: 0;
}

.fwk-more-sheet__section {
	min-width: 0;
}

.fwk-more-sheet__eyebrow {
	margin: 0 0 var(--fwk-space-1);
	font-size: var(--fwk-text-xs);
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--fwk-color-muted);
}

.fwk-more-sheet__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.fwk-more-sheet__link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-3);
	min-height: 48px;
	padding: 0.65rem 0;
	border-bottom: 1px solid color-mix(in oklch, var(--fwk-color-text) 8%, transparent);
	color: var(--fwk-color-text);
	font-size: var(--fwk-text-base);
	font-weight: 600;
	text-decoration: none;
}

.fwk-more-sheet__list > li:last-child .fwk-more-sheet__link {
	border-bottom: 0;
}

.fwk-more-sheet__link:hover,
.fwk-more-sheet__link:focus-visible {
	color: var(--fwk-color-selected);
	outline: none;
}

.fwk-more-sheet__link:focus-visible {
	box-shadow: inset var(--fwk-focus-ring);
	border-radius: var(--fwk-radius-xs);
}

.fwk-more-sheet__link.is-current,
.fwk-more-sheet__link--sale {
	color: var(--fwk-color-selected);
}

.fwk-more-sheet__link--sale {
	color: var(--fwk-color-sale);
}

.fwk-more-sheet__link--muted {
	font-weight: 500;
	font-variant-numeric: tabular-nums;
	color: var(--fwk-color-muted);
}

.fwk-more-sheet__trust {
	margin: 0;
	padding-block-start: var(--fwk-space-2);
	border-block-start: 1px solid color-mix(in oklch, var(--fwk-color-text) 8%, transparent);
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-muted);
	line-height: 1.45;
}

/* Hide legacy chip grid styles when more-sheet present */
.fwk-drawer-zones .fwk-drawer-cats {
	display: none;
}

/* --- U23 Category quick-sheet (dock «Каталог») ----------------------------- */
.fwk-cat-sheet {
	position: fixed;
	inset: 0;
	z-index: var(--fwk-z-drawer);
	display: flex;
	align-items: flex-end;
	justify-content: center;
}

.fwk-cat-sheet[hidden] {
	display: none;
}

.fwk-cat-sheet__overlay {
	position: absolute;
	inset: 0;
	background: color-mix(in oklch, var(--fwk-color-text) 45%, transparent);
	opacity: 0;
	transition: opacity var(--fwk-duration) var(--fwk-ease);
}

.fwk-cat-sheet.is-open .fwk-cat-sheet__overlay {
	opacity: 1;
}

.fwk-cat-sheet__panel {
	position: relative;
	width: 100%;
	max-width: 34rem;
	max-height: 82vh;
	overflow-y: auto;
	padding: var(--fwk-space-3) var(--fwk-space-5) calc(var(--fwk-space-6) + env(safe-area-inset-bottom, 0px));
	background: var(--fwk-color-surface);
	border-radius: var(--fwk-radius-xl, 1.25rem) var(--fwk-radius-xl, 1.25rem) 0 0;
	box-shadow: var(--fwk-shadow-dock);
	transform: translateY(100%);
	transition: transform var(--fwk-duration) var(--fwk-ease);
}

.fwk-cat-sheet.is-open .fwk-cat-sheet__panel {
	transform: translateY(0);
}

.fwk-cat-sheet__header {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 2.5rem;
	margin-bottom: var(--fwk-space-2);
}

.fwk-cat-sheet__grip {
	position: absolute;
	top: 0.4rem;
	left: 50%;
	width: 2.25rem;
	height: 0.25rem;
	transform: translateX(-50%);
	border-radius: var(--fwk-radius-pill);
	background: color-mix(in oklch, var(--fwk-color-text) 18%, transparent);
}

.fwk-cat-sheet__title {
	margin: 0.5rem 0 0;
	font-size: var(--fwk-text-lg, 1.125rem);
	font-weight: 700;
	color: var(--fwk-color-text);
}

.fwk-cat-sheet__close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	margin-top: 0.35rem;
	border: 0;
	background: transparent;
	color: var(--fwk-color-muted);
	border-radius: var(--fwk-radius-pill);
	cursor: pointer;
	transition: color var(--fwk-duration) var(--fwk-ease), background-color var(--fwk-duration) var(--fwk-ease);
}

.fwk-cat-sheet__close:hover,
.fwk-cat-sheet__close:focus-visible {
	color: var(--fwk-color-text);
	background: var(--fwk-color-selected-soft);
	outline: none;
}

.fwk-cat-sheet__close:focus-visible {
	box-shadow: var(--fwk-focus-ring);
}

.fwk-cat-sheet__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.fwk-cat-sheet__link {
	display: flex;
	align-items: center;
	min-height: 48px;
	padding: var(--fwk-space-3) 0;
	border-bottom: 1px solid color-mix(in oklch, var(--fwk-color-text) 8%, transparent);
	color: var(--fwk-color-text);
	font-size: var(--fwk-text-base);
	font-weight: 600;
	text-decoration: none;
}

.fwk-cat-sheet__link:hover,
.fwk-cat-sheet__link:focus-visible {
	color: var(--fwk-color-selected);
	outline: none;
}

.fwk-cat-sheet__link.is-current {
	color: var(--fwk-color-selected);
}

.fwk-cat-sheet__link--sale {
	color: var(--fwk-color-sale);
}

.fwk-cat-sheet__list li:last-child .fwk-cat-sheet__link {
	border-bottom: 0;
}

@media (prefers-reduced-motion: reduce) {
	.fwk-cat-sheet__overlay,
	.fwk-cat-sheet__panel {
		transition: none;
	}
}

/* --- Hero cat pills: less glass -------------------------------------------- */
.fwk-hero-cat__pill {
	background: color-mix(in oklch, var(--fwk-color-surface) 55%, transparent) !important;
	border-color: color-mix(in oklch, var(--fwk-color-text) 10%, transparent) !important;
	box-shadow: none !important;
	backdrop-filter: blur(6px);
}

/* --- Filters: unboxed text/underline actives (green в‰  fill) ---------------- */
.fwk-filters .fwk-filters__segment {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	gap: var(--fwk-space-4) !important;
	padding: 0 !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	width: 100% !important;
	min-width: 0 !important;
	box-sizing: border-box !important;
}

.fwk-filters .fwk-filters__segment-btn,
.fwk-filters .fwk-filters__segment-btn:hover,
.fwk-filters .fwk-filters__segment-btn:focus-visible,
.fwk-filters .fwk-filters__segment-btn:active {
	background: transparent !important;
	border: 0 !important;
	border-bottom: 2px solid transparent !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	color: var(--fwk-color-muted) !important;
}

.fwk-filters .fwk-filters__segment-btn:hover,
.fwk-filters .fwk-filters__segment-btn:focus-visible {
	color: var(--fwk-color-text) !important;
}

.fwk-filters .fwk-filters__segment-btn:focus-visible {
	box-shadow: var(--fwk-focus-ring) !important;
}

.fwk-filters .fwk-filters__segment-btn.is-active,
.fwk-filters .fwk-filters__segment-btn[aria-pressed="true"],
.fwk-filters .fwk-filters__segment-btn.is-active:hover,
.fwk-filters .fwk-filters__segment-btn[aria-pressed="true"]:hover,
.fwk-filters .fwk-filters__segment-btn.is-active:focus-visible,
.fwk-filters .fwk-filters__segment-btn[aria-pressed="true"]:focus-visible,
.fwk-filters .fwk-filters__segment-btn.is-active:active,
.fwk-filters .fwk-filters__segment-btn[aria-pressed="true"]:active {
	background: transparent !important;
	border-bottom-color: var(--fwk-color-selected) !important;
	color: var(--fwk-color-selected) !important;
	box-shadow: none !important;
}

.fwk-filters .fwk-filters__segment-btn.is-active:focus-visible,
.fwk-filters .fwk-filters__segment-btn[aria-pressed="true"]:focus-visible {
	box-shadow: var(--fwk-focus-ring) !important;
}

/* Size scale EUВ·РјРјВ·US: keep 1 row (parent segment rule forces 2-col). */
.fwk-filters .fwk-filters__size-scale.fwk-filters__segment,
.fwk-filters .fwk-filters__size-scale {
	display: flex !important;
	flex-wrap: nowrap !important;
	align-items: stretch !important;
	flex: 0 0 100% !important;
	gap: 0 !important;
	grid-template-columns: none !important;
	padding: 0 !important;
	margin: 0 0 var(--fwk-space-2) !important;
	border: 0 !important;
	background: transparent !important;
	width: 100% !important;
}

.fwk-filters .fwk-filters__size-scale .fwk-filters__segment-btn {
	flex: 1 1 0 !important;
	min-width: 0 !important;
	min-height: 32px !important;
	padding: 0 0 2px !important;
	font-size: var(--fwk-text-xs, 0.75rem) !important;
	line-height: 1.2 !important;
	white-space: nowrap !important;
}

.fwk-filters .fwk-filters__size,
.fwk-filters .fwk-filters__sizes label,
.fwk-filters .fwk-filters__size span {
	background: transparent !important;
	box-shadow: none !important;
}

.fwk-filters .fwk-filters__size span {
	border: 0 !important;
	border-bottom: 2px solid color-mix(in oklch, var(--fwk-color-text) 12%, transparent) !important;
	border-radius: 0 !important;
	width: auto !important;
	padding-inline: 5px !important;
}

.fwk-filters .fwk-filters__size input:checked + span,
.fwk-filters .fwk-filters__size.is-selected,
.fwk-filters .fwk-filters__sizes label:has(input:checked) span {
	background: transparent !important;
	border-bottom-color: var(--fwk-color-selected) !important;
	color: var(--fwk-color-selected) !important;
}

.fwk-filters .fwk-filters__option input[type="checkbox"] {
	accent-color: var(--fwk-color-selected);
}

.fwk-filters .fwk-filters__sheet-body {
	background: transparent !important;
}

.fwk-filters .fwk-filters__group {
	border-bottom-color: color-mix(in oklch, var(--fwk-color-text) 8%, transparent) !important;
}

.fwk-filters .fwk-filters__my-size,
.fwk-filters .fwk-filters__mysize {
	border-block-end-color: color-mix(in oklch, var(--fwk-color-text) 10%, transparent);
}

/* Compact mysize: boxed EU select + outline Ok (beat Kadence button chrome). */
.fwk-filters .fwk-filters__my-size-select,
.fwk-filters .fwk-filters__mysize-select,
.fwk-filters .fwk-filters__mysize input,
.fwk-filters .fwk-filters__mysize select {
	width: 4.25rem !important;
	min-width: 4.25rem !important;
	max-width: 5rem !important;
	background-color: var(--fwk-color-surface) !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%2364748b' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 0.45rem center !important;
	background-size: 0.65rem !important;
	border: 1px solid var(--fwk-color-control-border) !important;
	border-radius: var(--fwk-radius-control) !important;
	box-shadow: none !important;
	padding-inline: var(--fwk-space-2) 1.35rem !important;
}

.fwk-filters .fwk-filters__my-size-select:focus-visible,
.fwk-filters .fwk-filters__mysize-select:focus-visible,
.fwk-filters .fwk-filters__mysize select:focus-visible {
	border-color: var(--fwk-color-selected) !important;
	box-shadow: var(--fwk-focus-ring) !important;
}

.fwk-filters button.fwk-filters__text-btn,
.fwk-filters button.fwk-filters__size-more,
.fwk-filters button.fwk-filters__collection-more,
.fwk-filters button.fwk-filters__text-btn:hover,
.fwk-filters button.fwk-filters__size-more:hover,
.fwk-filters button.fwk-filters__collection-more:hover,
.fwk-filters button.fwk-filters__text-btn:focus-visible,
.fwk-filters button.fwk-filters__size-more:focus-visible,
.fwk-filters button.fwk-filters__collection-more:focus-visible,
.fwk-filters button.fwk-filters__text-btn:active,
.fwk-filters button.fwk-filters__size-more:active,
.fwk-filters button.fwk-filters__collection-more:active {
	background: transparent !important;
	border-color: transparent !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

.fwk-filters button.fwk-filters__size-more:hover,
.fwk-filters button.fwk-filters__collection-more:hover,
.fwk-filters button.fwk-filters__text-btn.fwk-filters__size-more:hover,
.fwk-filters button.fwk-filters__text-btn.fwk-filters__collection-more:hover {
	color: var(--fwk-color-text) !important;
}

.fwk-filters button.fwk-filters__my-size-apply,
.fwk-filters button.fwk-filters__mysize-apply,
.fwk-filters .fwk-filters__mysize [data-fwk-my-size-apply],
.fwk-filters .fwk-filters__mysize [data-fwk-mysize-apply] {
	background: transparent !important;
	border: 1px solid color-mix(in oklch, var(--fwk-color-selected) 42%, transparent) !important;
	border-radius: var(--fwk-radius-control) !important;
	box-shadow: none !important;
	color: var(--fwk-color-selected) !important;
	text-decoration: none !important;
}

.fwk-filters button.fwk-filters__my-size-apply:hover,
.fwk-filters button.fwk-filters__mysize-apply:hover,
.fwk-filters .fwk-filters__mysize [data-fwk-my-size-apply]:hover,
.fwk-filters .fwk-filters__mysize [data-fwk-mysize-apply]:hover,
.fwk-filters button.fwk-filters__my-size-apply:focus-visible,
.fwk-filters button.fwk-filters__mysize-apply:focus-visible,
.fwk-filters .fwk-filters__mysize [data-fwk-my-size-apply]:focus-visible,
.fwk-filters .fwk-filters__mysize [data-fwk-mysize-apply]:focus-visible {
	background: color-mix(in oklch, var(--fwk-color-selected) 12%, transparent) !important;
	border-color: var(--fwk-color-selected) !important;
	color: var(--fwk-color-selected) !important;
}

.fwk-filters button.fwk-filters__text-btn:focus-visible,
.fwk-filters button.fwk-filters__size-more:focus-visible,
.fwk-filters button.fwk-filters__collection-more:focus-visible,
.fwk-filters button.fwk-filters__my-size-apply:focus-visible,
.fwk-filters button.fwk-filters__mysize-apply:focus-visible,
.fwk-filters .fwk-filters__mysize [data-fwk-my-size-apply]:focus-visible,
.fwk-filters .fwk-filters__mysize [data-fwk-mysize-apply]:focus-visible {
	box-shadow: var(--fwk-focus-ring) !important;
}

/* Stock ON = brand green (active), not sky fill plate. */
.fwk-filters .fwk-filters__stock input[type="checkbox"]:checked + .fwk-filters__stock-switch,
.fwk-filters .fwk-filters__stock input[type="checkbox"]:checked + .fwk-filters__stock-track,
.fwk-filters [data-fwk-facet="stock"] input[type="checkbox"]:checked + .fwk-filters__stock-switch,
.fwk-filters [data-fwk-facet="stock"] input[type="checkbox"]:checked + .fwk-filters__stock-track,
.fwk-filters .fwk-filters__stock.is-on .fwk-filters__stock-switch,
.fwk-filters .fwk-filters__stock.is-on .fwk-filters__stock-track,
.fwk-filters .fwk-filters__stock [role="switch"][aria-checked="true"],
.fwk-filters [data-fwk-facet="stock"] [role="switch"][aria-checked="true"] {
	background: var(--fwk-color-selected) !important;
	border-color: var(--fwk-color-selected) !important;
}

@media (min-width: 64em) {
	.fwk-filters__sheet {
		position: sticky;
		top: calc(var(--fwk-header-height, 4.5rem) + 0.75rem);
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		box-shadow: none !important;
	}
}

/* --- Card sizes line ------------------------------------------------------- */
.fwk-card-sizes {
	margin: 0 0 var(--fwk-space-2);
	font-size: var(--fwk-text-xs);
	color: var(--fwk-color-muted);
	font-variant-numeric: tabular-nums;
}

.fwk-card-sizes__label {
	font-weight: 500;
}

.fwk-card-sizes__value {
	font-weight: 600;
	color: var(--fwk-color-text);
}

/* --- PDP thumbs / scale unbox ---------------------------------------------- */
.woocommerce-product-gallery .flex-control-thumbs li img {
	border-color: transparent !important;
	background: transparent !important;
}

.woocommerce-product-gallery .flex-control-thumbs li img.flex-active,
.woocommerce-product-gallery .flex-control-thumbs li img:hover {
	border-color: var(--fwk-color-selected) !important;
	box-shadow: 0 0 0 1px var(--fwk-color-selected);
}

.fwk-sizes__scale {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	padding: 0 !important;
	gap: var(--fwk-space-2);
}

/* PDP buy-bar qty stays borderless sunken (wins over U19 boxed stepper). */
.fwk-buy-bar .fwk-qty,
body.single-product form.cart .fwk-buy-bar .quantity,
body.single-product form.cart .fwk-buy-bar__actions .quantity {
	border: 0 !important;
	background: var(--fwk-color-sunken) !important;
	box-shadow: none !important;
}

/* --- Home section hairlines ------------------------------------------------ */
/* Bestsellers keeps solid white + edge fades (see §8) — do not force transparent. */
.fwk-home-faq {
	border-block-color: color-mix(in oklch, var(--fwk-color-text) 8%, transparent) !important;
	background: transparent !important;
}

.fwk-bestsellers {
	border-block-color: color-mix(in oklch, var(--fwk-color-text) 8%, transparent) !important;
	background-color: var(--fwk-color-surface) !important;
}

/* Keep continuous white when bestsellers follows benefits (wins over fade). */
.fwk-benefits--home + .fwk-bestsellers,
.fwk-plane--benefits + .fwk-bestsellers {
	background: var(--fwk-plane-products) !important;
	background-color: var(--fwk-plane-products) !important;
	border-block-start: 0 !important;
}

/* Home / PDP Croslite wash must win over generic section unbox + keep full-bleed. */
.fwk-benefits--home,
.fwk-benefits--pdp {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-inline: calc(50% - 50vw) !important;
}

.fwk-benefits--home {
	border-block: 0 !important;
}

.fwk-benefits--pdp {
	border-block: 0 !important;
}

/* --- Cart / checkout unbox ------------------------------------------------- */
.fwk-cart-page table.shop_table {
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

.fwk-cart-page table.shop_table thead {
	background: transparent !important;
}

.fwk-cart-page table.shop_table th,
.fwk-cart-page table.shop_table td {
	border-bottom: 1px solid color-mix(in oklch, var(--fwk-color-text) 8%, transparent) !important;
}

.fwk-cart-page .cart_totals {
	border: 0 !important;
	background: transparent !important;
	padding-inline: 0 !important;
	box-shadow: none !important;
}

.fwk-checkout-page #order_review,
.fwk-checkout-page #order_review_heading {
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

.fwk-checkout-page #order_review {
	border-top: 0 !important;
	padding-top: 0;
	/* Kill Kadence `form.checkout .woocommerce-checkout-review-order { padding-left: var(--global-md-spacing) }`. */
	padding-inline: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	/* Kill the legacy WooCommerce/Kadence two-column float that squeezed the
	   summary into ~48% and collapsed the .fwk-cosummary card to its title. */
	float: none !important;
	width: 100% !important;
	max-width: none !important;
}

/* Unbox: kill legacy card chrome + coloured inset bars (traffic lights). */
.fwk-checkout-page ul#shipping_method li,
.fwk-checkout-page #payment ul.payment_methods > li,
.fwk-checkout-page #payment ul.payment_methods > li.wc_payment_method {
	border: 0 !important;
	border-bottom: 1px solid var(--fwk-color-border) !important;
	background: transparent !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

.fwk-checkout-page ul#shipping_method li:has(input:checked),
.fwk-checkout-page #payment ul.payment_methods > li:has(input:checked),
.fwk-checkout-page #payment ul.payment_methods > li.wc_payment_method:has(input:checked) {
	background: var(--fwk-color-sunken) !important;
	border-color: transparent !important;
	border-bottom-color: var(--fwk-color-border) !important;
	box-shadow: none !important;
}

/* Kill the heavy default WooCommerce login / coupon info boxes on checkout —
   collapse them to compact hairline rows with a text-link accent. */
.fwk-checkout-page .woocommerce-form-login-toggle .woocommerce-info,
.fwk-checkout-page .woocommerce-form-coupon-toggle .woocommerce-info {
	background: transparent;
	border: 0;
	border-bottom: 1px solid var(--fwk-color-border);
	border-radius: 0;
	box-shadow: none;
	margin: 0 0 var(--fwk-space-3);
	padding: var(--fwk-space-3) 0;
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-muted);
}

.fwk-checkout-page .woocommerce-form-login-toggle .woocommerce-info::before,
.fwk-checkout-page .woocommerce-form-coupon-toggle .woocommerce-info::before {
	display: none;
}

.fwk-checkout-page .woocommerce-form-login-toggle .woocommerce-info a,
.fwk-checkout-page .woocommerce-form-coupon-toggle .woocommerce-info a {
	color: var(--fwk-color-accent);
	font-weight: 600;
}

/* Thank-you: Quiet surface chrome; WC notice = title only. */
.woocommerce-order .woocommerce-notice--success {
	color: var(--fwk-color-text);
}

.woocommerce-order ul.woocommerce-order-overview {
	border: 0 !important;
	background: transparent !important;
	padding-inline: 0 !important;
}

/* --- Account / empty / search ---------------------------------------------- */
@media (min-width: 48em) {
	.fwk-account-auth__col + .fwk-account-auth__col {
		border-inline-start: 0 !important;
		padding-inline-start: var(--fwk-space-8) !important;
	}
}

.fwk-empty__icon {
	background: var(--fwk-color-brand-soft) !important;
	color: var(--fwk-color-selected) !important;
	border: 0 !important;
	box-shadow: none !important;
}

.fwk-empty,
.fwk-empty--cart {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
}

.fwk-cart-page .entry-content-wrap,
.fwk-cart-page .content-bg,
.fwk-account-page .entry-content-wrap,
.fwk-account-page .content-bg,
.fwk-account-page .woocommerce-form-login,
.fwk-account-page .woocommerce-form-register,
.fwk-account-auth,
.fwk-account-auth__col {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
}

.fwk-account-page .woocommerce-form-login .woocommerce-button,
.fwk-account-page .woocommerce-form-login button[type="submit"] {
	background: var(--fwk-button-ink) !important;
	border-color: var(--fwk-button-ink) !important;
	color: var(--fwk-color-on-cta) !important;
}

#cart-drawer .drawer-header,
#cart-drawer .drawer-inner,
#search-drawer .drawer-inner {
	border-color: color-mix(in oklch, var(--fwk-color-text) 8%, transparent) !important;
}

#search-drawer .drawer-inner {
	background: var(--fwk-color-surface) !important;
}

/* Search focus в†’ green hairline (brand) */
.fwk-search-form input:focus,
#search-drawer input[type="search"]:focus,
.header-search input:focus {
	border-color: var(--fwk-color-selected) !important;
	box-shadow: 0 0 0 1px var(--fwk-color-selected) !important;
}

@media (prefers-reduced-motion: reduce) {
	.fwk-dock,
	.fwk-dock__item {
		transition: none;
	}
}

/* ==========================================================================
   Checkout module — U25 Step accordion · U26 Delivery/Payment list-rows ·
   U27 Order summary · U28 Thank-you · Cart
   All on design tokens (--fwk-*). Progressive-enhancement layout: without JS
   the checkout is a plain single column and still fully works.
   Checkout = ink zone: no brand-green money/selection (traffic-light kill).
   ========================================================================== */

/* Pack A — scope tokens: selection/done → ink; soft → sunken; no green hover flash. */
.fwk-checkout-page,
.fwk-thankyou-page {
	--fwk-checkout-selected: var(--fwk-button-ink);
	--fwk-color-selected: var(--fwk-button-ink);
	--fwk-color-selected-soft: var(--fwk-color-sunken);
	--fwk-color-on-selected: oklch(99% 0 0);
	--fwk-button-ink-hover: var(--fwk-neutral-700);
	--fwk-button-ink-active: var(--fwk-neutral-900);
}

/* Required asterisk: muted ink, not WC default crimson. */
.fwk-checkout-page .form-row .required,
.fwk-checkout-page abbr.required {
	color: var(--fwk-color-muted);
	text-decoration: none;
	border: 0;
	font-weight: 600;
}

/* --- U25.0 Layout ------------------------------------------------------- */
.fwk-checkout__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(300px, 380px);
	gap: var(--fwk-space-8);
	align-items: start;
}

@media (max-width: 900px) {
	.fwk-checkout__grid {
		grid-template-columns: 1fr;
		gap: var(--fwk-space-5);
	}
}

.fwk-checkout__aside {
	position: sticky;
	top: var(--fwk-space-6);
}

@media (max-width: 900px) {
	.fwk-checkout__aside {
		position: static;
		/* Steps come first on mobile; the running total lives in the sticky
		   bottom dock, so the full summary follows the steps for final review. */
		order: 2;
	}
}

/* Hide the now-empty native WC containers once the accordion is built. */
.fwk-checkout__main--built > #customer_details,
.fwk-checkout__main--built > .fwk-costep--payment,
.fwk-checkout__main--built > .fwk-payment-source {
	display: none;
}
.fwk-grp-hidden,
.fwk-np-native {
	display: none !important;
}

/* --- U25.0b Horizontal progress stepper — REMOVED (dual progress kill).
   Accordion `.fwk-costep__num` is the single step indicator. Keep selectors
   inert in case stale DOM appears before JS update. -------------------- */
.fwk-coprogress {
	display: none !important;
}

/* --- U25.1 Steps -------------------------------------------------------- */
.fwk-costeps {
	display: flex;
	flex-direction: column;
	gap: 0;
}

/* Flat minimalism: steps are borderless sections split by hairline dividers,
   not boxed cards. Active step reads via the top stepper + ink number badge. */
.fwk-costep {
	border: 0;
	border-radius: 0;
	background: transparent;
	overflow: visible;
	transition: none;
}

.fwk-costeps .fwk-costep + .fwk-costep {
	border-top: 1px solid var(--fwk-color-border);
}

.fwk-costep.is-open {
	box-shadow: none;
}

.fwk-costep--invalid {
	animation: fwk-costep-shake 0.4s var(--fwk-ease);
}

@keyframes fwk-costep-shake {
	0%, 100% { transform: translateX(0); }
	25% { transform: translateX(-4px); }
	75% { transform: translateX(4px); }
}

.fwk-costep__head {
	margin: 0;
}

.fwk-costep__toggle {
	display: flex;
	align-items: center;
	gap: var(--fwk-space-3);
	width: 100%;
	padding: var(--fwk-space-4) 0;
	border: 0;
	background: transparent;
	cursor: pointer;
	text-align: start;
	font: inherit;
	/* Explicit ink: Kadence `button:hover` paints btn-bg-hover (sky) + light text. */
	color: var(--fwk-color-text);
	box-shadow: none;
	transition: color var(--fwk-duration) var(--fwk-ease);
}

.fwk-costep__toggle:hover,
.fwk-costep__toggle:active,
.fwk-costep__toggle:focus {
	background: transparent;
	color: var(--fwk-color-text);
	box-shadow: none;
}

.fwk-costep__toggle:focus-visible {
	outline: none;
	background: transparent;
	color: var(--fwk-color-text);
	box-shadow: var(--fwk-focus-ring);
	border-radius: var(--fwk-radius-xl);
}

.fwk-costep:not(.is-open) .fwk-costep__toggle:hover .fwk-costep__num,
.fwk-costep:not(.is-open) .fwk-costep__toggle:hover .fwk-costep__title {
	color: var(--fwk-color-text);
}

.fwk-costep.is-open .fwk-costep__toggle {
	cursor: default;
}

.fwk-costep.is-open .fwk-costep__toggle:hover,
.fwk-costep.is-open .fwk-costep__toggle:active,
.fwk-costep.is-open .fwk-costep__toggle:focus {
	background: transparent;
	color: var(--fwk-color-text);
}

.fwk-costep__num {
	/* Perceptual v2: plain index, no pill chrome. */
	display: inline-block;
	flex: 0 0 auto;
	width: auto;
	min-width: 1.25em;
	height: auto;
	border-radius: 0;
	background: transparent;
	border: 0;
	color: var(--fwk-color-muted);
	font-size: var(--fwk-text-base);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	line-height: 1.3;
	transition: color var(--fwk-duration) var(--fwk-ease);
}

.fwk-costep__num::after {
	content: ".";
}

.fwk-costep.is-open .fwk-costep__num {
	background: transparent;
	border: 0;
	color: var(--fwk-button-ink);
	box-shadow: none;
}

/* Done: replace number with ink check glyph. */
.fwk-costep.is-done .fwk-costep__num {
	background: transparent;
	border: 0;
	color: var(--fwk-button-ink);
	font-size: 0;
}

.fwk-costep.is-done .fwk-costep__num::after {
	content: none;
	border: 0;
}

.fwk-costep.is-done .fwk-costep__num::before {
	content: "✓";
	font-size: var(--fwk-text-base);
	font-weight: 700;
	color: var(--fwk-button-ink);
	line-height: 1.3;
}

.fwk-costep__titles {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	flex: 1 1 auto;
}

.fwk-costep__title {
	font-family: var(--fwk-font-display);
	font-size: var(--fwk-text-base);
	font-weight: 700;
	letter-spacing: -0.01em;
}

.fwk-costep.is-open .fwk-costep__title {
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
	text-decoration-color: var(--fwk-button-ink);
}

.fwk-costep__summary {
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-muted);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	display: none;
}

.fwk-costep.is-done:not(.is-open) .fwk-costep__summary {
	display: block;
}

.fwk-costep__edit {
	flex: 0 0 auto;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	color: var(--fwk-color-muted);
	text-decoration: underline;
	text-underline-offset: 2px;
	display: none;
}

.fwk-costep__edit:hover {
	color: var(--fwk-color-text);
}

.fwk-costep.is-done:not(.is-open) .fwk-costep__edit {
	display: inline;
}

.fwk-costep__check {
	display: none;
}

.fwk-costep__body {
	display: none;
	padding: 0 0 var(--fwk-space-5);
}

.fwk-costep.is-open .fwk-costep__body {
	display: block;
}

/* Contact 2×2 grid: name|surname, phone|email (≥40em). Delivery/payment children span full. */
@media (min-width: 40em) {
	.fwk-costep.is-open .fwk-costep__body {
		display: grid;
		grid-template-columns: 1fr 1fr;
		column-gap: var(--fwk-space-3);
		align-items: start;
	}

	.fwk-costep__body > * {
		grid-column: 1 / -1;
	}

	.fwk-costep__body .form-row.form-row-first {
		grid-column: 1;
		width: auto;
		float: none;
	}

	.fwk-costep__body .form-row.form-row-last {
		grid-column: 2;
		width: auto;
		float: none;
	}
}

.fwk-costep__body .form-row {
	margin-block: 0 var(--fwk-space-3);
	padding: 0;
	float: none;
	width: 100%;
	clear: none;
}

/* <40em: force stack even if WC floats form-row-first/last. */
@media (max-width: 39.99em) {
	.fwk-costep__body .form-row.form-row-first,
	.fwk-costep__body .form-row.form-row-last {
		float: none !important;
		width: 100% !important;
		clear: both;
	}
}

/* Sentence-case field labels inside steps (no ALL-CAPS). */
.fwk-costep__body .form-row > label,
.fwk-np__field > label,
.fwk-np__fields .fwk-label,
.fwk-np__ac .fwk-label {
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	text-transform: none;
	letter-spacing: 0;
	color: var(--fwk-color-text);
	margin-block-end: var(--fwk-space-2);
}

.fwk-costep__actions {
	margin-block-start: var(--fwk-space-2);
}

.fwk-costep__continue {
	width: 100%;
}

/* Valid row: ink check (not brand green). */
.fwk-costep__body .form-row {
	position: relative;
}
.fwk-costep__body .form-row.fwk-row-valid input.input-text,
.fwk-costep__body .form-row.fwk-row-valid input {
	border-color: transparent;
	border-bottom-color: var(--fwk-color-border-strong);
	padding-inline-end: 2.25rem;
}
.fwk-costep__body .form-row.fwk-row-valid::after {
	content: "";
	position: absolute;
	inset-inline-end: 4px;
	bottom: 15px;
	width: 11px;
	height: 7px;
	border-left: 2px solid var(--fwk-button-ink);
	border-bottom: 2px solid var(--fwk-button-ink);
	transform: rotate(-45deg);
	pointer-events: none;
}

/* Underline fields — biggest visual jump after radio list. */
.fwk-checkout-page .fwk-costep__body .form-row input.input-text,
.fwk-checkout-page .fwk-costep__body .form-row textarea,
.fwk-checkout-page .fwk-costep__body .form-row select,
.fwk-checkout-page .fwk-costep__body .fwk-field,
.fwk-checkout-page .fwk-np__fields .fwk-field,
.fwk-checkout-page .fwk-np__ac .fwk-field {
	border-width: 0 0 1px !important;
	border-style: solid !important;
	border-color: transparent transparent var(--fwk-color-border) !important;
	border-radius: 0 !important;
	background-color: transparent !important;
	box-shadow: none !important;
	padding-inline: 0 !important;
	min-height: 44px;
	transition:
		border-color var(--fwk-duration) var(--fwk-ease),
		border-bottom-width var(--fwk-duration) var(--fwk-ease);
}

.fwk-checkout-page .fwk-costep__body .form-row input.input-text:hover:not(:focus):not(:disabled),
.fwk-checkout-page .fwk-costep__body .form-row textarea:hover:not(:focus):not(:disabled),
.fwk-checkout-page .fwk-costep__body .form-row select:hover:not(:focus):not(:disabled),
.fwk-checkout-page .fwk-costep__body .fwk-field:hover:not(:focus):not(:disabled),
.fwk-checkout-page .fwk-np__fields .fwk-field:hover:not(:focus):not(:disabled),
.fwk-checkout-page .fwk-np__ac .fwk-field:hover:not(:focus):not(:disabled) {
	border-bottom-color: var(--fwk-color-border-strong) !important;
}

.fwk-checkout-page .fwk-costep__body .form-row input.input-text:focus,
.fwk-checkout-page .fwk-costep__body .form-row textarea:focus,
.fwk-checkout-page .fwk-costep__body .form-row select:focus,
.fwk-checkout-page .fwk-costep__body .fwk-field:focus,
.fwk-checkout-page .fwk-np__fields .fwk-field:focus,
.fwk-checkout-page .fwk-np__ac .fwk-field:focus {
	border-bottom-width: 2px !important;
	border-bottom-color: var(--fwk-button-ink) !important;
	box-shadow: none !important;
	outline: none;
}

.fwk-checkout-page .fwk-costep__body .form-row.woocommerce-invalid input.input-text,
.fwk-checkout-page .fwk-costep__body .form-row.woocommerce-invalid textarea,
.fwk-checkout-page .fwk-np__fields .fwk-field.is-error {
	border-bottom-color: var(--fwk-color-danger) !important;
	background: transparent !important;
}

/* City search icon: keep left padding when underline. */
.fwk-checkout-page .fwk-np__ac[data-fwk-np-ac="city"] .fwk-field {
	padding-inline-start: 28px !important;
	background-position: left 0 center;
}

/* --- U26 Delivery radio list + NP autocomplete -------------------------- */
.fwk-np__methods {
	display: flex;
	flex-direction: column;
	gap: 0;
	margin-block-end: var(--fwk-space-2);
	border-top: 1px solid var(--fwk-color-border);
}

.fwk-np-row {
	display: flex;
	align-items: center;
	gap: var(--fwk-space-3);
	width: 100%;
	padding: var(--fwk-space-3) var(--fwk-space-2);
	margin: 0;
	border: 0;
	border-bottom: 1px solid var(--fwk-color-border);
	border-inline-start: 2px solid transparent;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	cursor: pointer;
	text-align: start;
	font: inherit;
	/* Explicit ink: Kadence `button:hover` paints --global-palette-btn-hover (white). */
	color: var(--fwk-color-text);
	transition:
		background-color var(--fwk-duration) var(--fwk-ease),
		border-inline-start-color var(--fwk-duration) var(--fwk-ease),
		color var(--fwk-duration) var(--fwk-ease);
}

.fwk-np-row:hover,
.fwk-np-row:active,
.fwk-np-row:focus,
.fwk-np-row:focus-visible {
	color: var(--fwk-color-text);
}

.fwk-np-row:hover {
	background: color-mix(in oklch, var(--fwk-color-text) 6%, var(--fwk-color-surface));
}

.fwk-np-row:active {
	background: color-mix(in oklch, var(--fwk-color-text) 12%, var(--fwk-color-surface));
}

/* Kill Kadence `button:focus` sky fill — programmatic focus on step open. */
.fwk-np-row:focus {
	outline: none;
	background: transparent;
	box-shadow: none;
}

.fwk-np-row:focus-visible {
	outline: none;
	background: transparent;
	box-shadow: var(--fwk-focus-ring);
	border-radius: var(--fwk-radius-sm);
}

.fwk-np-row:hover:focus,
.fwk-np-row:hover:focus-visible {
	background: color-mix(in oklch, var(--fwk-color-text) 6%, var(--fwk-color-surface));
}

.fwk-np-row.is-selected {
	border-bottom-color: var(--fwk-color-border);
	border-inline-start-color: var(--fwk-button-ink);
	background: color-mix(in oklch, var(--fwk-color-text) 10%, var(--fwk-color-surface));
	box-shadow: none;
	color: var(--fwk-color-text);
}

.fwk-np-row.is-selected:hover,
.fwk-np-row.is-selected:active,
.fwk-np-row.is-selected:focus,
.fwk-np-row.is-selected:focus-visible {
	color: var(--fwk-color-text);
	background: color-mix(in oklch, var(--fwk-color-text) 10%, var(--fwk-color-surface));
}

.fwk-np-row.is-selected:hover {
	background: color-mix(in oklch, var(--fwk-color-text) 12%, var(--fwk-color-surface));
}

.fwk-np-row.is-selected:focus-visible {
	box-shadow: var(--fwk-focus-ring);
}

.fwk-np-row__dot {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	border-radius: var(--fwk-radius-pill);
	border: 1.5px solid var(--fwk-color-border-strong);
	background: transparent;
	position: relative;
	transition: border-color var(--fwk-duration) var(--fwk-ease), background-color var(--fwk-duration) var(--fwk-ease);
}

.fwk-np-row.is-selected .fwk-np-row__dot {
	border-color: var(--fwk-button-ink);
	background: transparent;
}

/* Ink filled radio dot (●) — no checkmark. */
.fwk-np-row.is-selected .fwk-np-row__dot::after {
	content: "";
	position: absolute;
	inset: 0;
	margin: auto;
	width: 8px;
	height: 8px;
	border-radius: var(--fwk-radius-pill);
	background: var(--fwk-button-ink);
}

.fwk-np-row__label {
	flex: 1 1 auto;
	min-width: 0;
	font-weight: 500;
	font-size: var(--fwk-text-sm);
	line-height: 1.35;
	color: inherit;
}

.fwk-np-row.is-selected .fwk-np-row__label {
	font-weight: 700;
}

.fwk-np__rates-note {
	margin: 0 0 var(--fwk-space-4);
	font-size: var(--fwk-text-xs);
	color: var(--fwk-color-muted);
	line-height: 1.4;
}

.fwk-np__rates-note .fwk-link {
	font-size: inherit;
	margin-inline-start: 0.25em;
}

/* City | Warehouse compact pair (≥40em); stack on narrow. Autocomplete stays absolute per column. */
.fwk-np__fields {
	display: flex;
	flex-direction: column;
	gap: 0;
	margin-block-end: var(--fwk-space-2);
}

.fwk-np__fields[hidden],
.fwk-np__pickup[hidden],
.fwk-np__rates-note[hidden] {
	display: none !important;
}

.fwk-np__fields > .fwk-field-row {
	margin-block: 0 var(--fwk-space-3);
	min-width: 0;
}

@media (min-width: 40em) {
	.fwk-np__fields {
		display: grid;
		grid-template-columns: 1fr 1fr;
		column-gap: var(--fwk-space-3);
		align-items: start;
	}

	/* Only the two AC rows participate; stray nodes (if any) span full. */
	.fwk-np__fields > .fwk-np__ac {
		grid-column: auto;
	}
}

.fwk-np__ac {
	position: relative;
}

/* Search affordance on the city field (type-to-search). */
.fwk-np__ac[data-fwk-np-ac="city"] .fwk-field {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%238a8f98' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: left 0 center;
	padding-inline-start: 28px;
}

.fwk-np-suggest {
	position: absolute;
	z-index: 30;
	inset-inline: 0;
	top: calc(100% + 4px);
	margin: 0;
	padding: var(--fwk-space-1);
	list-style: none;
	max-height: 260px;
	overflow-y: auto;
	background: var(--fwk-color-surface);
	border: 1px solid var(--fwk-color-border);
	border-radius: var(--fwk-radius-md);
	box-shadow: var(--fwk-shadow-lg);
}

.fwk-np-suggest[hidden] {
	display: none !important;
}

.fwk-np-suggest__item {
	padding: var(--fwk-space-2) var(--fwk-space-3);
	border-radius: var(--fwk-radius-sm);
	font-size: var(--fwk-text-sm);
	cursor: pointer;
}

.fwk-np-suggest__item:hover,
.fwk-np-suggest__item.is-active {
	background: var(--fwk-color-selected-soft);
}

.fwk-np-suggest__empty {
	padding: var(--fwk-space-2) var(--fwk-space-3);
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-muted);
}

.fwk-np__pickup-line {
	margin: 0;
	padding: var(--fwk-space-3) var(--fwk-space-4);
	border-radius: var(--fwk-radius-md);
	background: var(--fwk-color-sunken);
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-muted);
}

/* --- U26b Payment radio list (COD / BACS) — ○/● parity with NP --------- */
.fwk-checkout .fwk-payment-methods ul.payment_methods,
.fwk-checkout ul.wc_payment_methods {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0;
	border: 0;
	border-top: 1px solid var(--fwk-color-border);
}

.fwk-checkout ul.wc_payment_methods li.wc_payment_method {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--fwk-space-3);
	border: 0;
	border-bottom: 1px solid var(--fwk-color-border);
	border-inline-start: 2px solid transparent;
	border-radius: 0;
	background: transparent;
	padding: var(--fwk-space-3) var(--fwk-space-2);
	transition:
		background-color var(--fwk-duration) var(--fwk-ease),
		border-inline-start-color var(--fwk-duration) var(--fwk-ease);
	position: relative;
}

.fwk-checkout ul.wc_payment_methods li.wc_payment_method:hover {
	background: color-mix(in oklch, var(--fwk-color-text) 6%, var(--fwk-color-surface));
}

.fwk-checkout ul.wc_payment_methods li.wc_payment_method:active {
	background: color-mix(in oklch, var(--fwk-color-text) 12%, var(--fwk-color-surface));
}

/* WC puts radio as sibling of label — style it as ○/●. */
.fwk-checkout ul.wc_payment_methods li.wc_payment_method > input.input-radio {
	appearance: none;
	-webkit-appearance: none;
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	margin: 0;
	border: 1.5px solid var(--fwk-color-border-strong);
	border-radius: var(--fwk-radius-pill);
	background: transparent;
	cursor: pointer;
	box-shadow: none;
	opacity: 1;
}

.fwk-checkout ul.wc_payment_methods li.wc_payment_method > input.input-radio:checked {
	border-color: var(--fwk-button-ink);
	background: radial-gradient(circle at center, var(--fwk-button-ink) 0 4px, transparent 4.5px);
}

.fwk-checkout ul.wc_payment_methods li.wc_payment_method > input.input-radio:focus {
	outline: none;
}

.fwk-checkout ul.wc_payment_methods li.wc_payment_method > input.input-radio:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
}

.fwk-checkout ul.wc_payment_methods li.wc_payment_method > label {
	display: block;
	flex: 1 1 auto;
	min-width: 0;
	padding: 0;
	margin: 0;
	cursor: pointer;
	font-weight: 500;
	font-size: var(--fwk-text-sm);
}

.fwk-checkout ul.wc_payment_methods li.wc_payment_method > label::before {
	display: none;
}

.fwk-checkout ul.wc_payment_methods li.wc_payment_method:has(input:checked) {
	border-color: transparent;
	border-bottom-color: var(--fwk-color-border);
	border-inline-start-color: var(--fwk-button-ink);
	background: color-mix(in oklch, var(--fwk-color-text) 10%, var(--fwk-color-surface));
	box-shadow: none;
	color: var(--fwk-color-text);
}

.fwk-checkout ul.wc_payment_methods li.wc_payment_method:has(input:checked) > label {
	font-weight: 700;
}

.fwk-checkout ul.wc_payment_methods li.wc_payment_method:has(input:focus-visible) {
	box-shadow: var(--fwk-focus-ring);
	border-radius: var(--fwk-radius-sm);
}

.fwk-checkout ul.wc_payment_methods li.wc_payment_method .payment_box {
	flex: 1 1 100%;
	width: 100%;
	margin: 0;
	padding: 0 0 0 calc(18px + var(--fwk-space-3));
	background: transparent;
	border-radius: 0;
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-muted);
	box-shadow: none;
}

.fwk-checkout ul.wc_payment_methods li.wc_payment_method .payment_box::before {
	display: none;
}

/* --- K11b Payment step IA: methods → notes → place-order -------------- */
/* #payment uses display:contents so .fwk-conotes can sit between methods
   and .place-order without living inside the AJAX-replaced #payment node. */
.fwk-copay {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.fwk-copay .fwk-payment-methods,
.fwk-copay #payment {
	display: contents;
}

.fwk-copay ul.wc_payment_methods,
.fwk-copay ul.payment_methods {
	order: 1;
}

.fwk-copay .fwk-copay-help {
	order: 2;
}

.fwk-copay .fwk-conotes {
	order: 3;
}

.fwk-copay .place-order {
	order: 4;
}

.fwk-copay-help {
	margin: var(--fwk-space-3) 0 0;
	padding: var(--fwk-space-3) 0 0;
	border-top: 1px solid var(--fwk-color-border);
}

.fwk-copay-help__link {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	font-size: var(--fwk-text-sm);
	font-weight: 500;
	color: var(--fwk-color-text);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	text-decoration-color: var(--fwk-color-border-strong);
}

.fwk-copay-help__link:hover,
.fwk-copay-help__link:focus {
	color: var(--fwk-color-text);
	text-decoration-color: var(--fwk-button-ink);
}

.fwk-copay-help__link:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
	border-radius: var(--fwk-radius-sm);
}

.fwk-conotes {
	margin: var(--fwk-space-3) 0 0;
	padding: var(--fwk-space-3) 0 0;
	border-top: 1px solid var(--fwk-color-border);
}

.fwk-conotes__toggle {
	display: inline-flex;
	align-items: center;
	gap: var(--fwk-space-2);
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--fwk-color-text);
	font: inherit;
	font-size: var(--fwk-text-sm);
	font-weight: 500;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	text-decoration-color: var(--fwk-color-border-strong);
	cursor: pointer;
	box-shadow: none;
	min-height: 44px;
}

.fwk-conotes__toggle:hover,
.fwk-conotes__toggle:active,
.fwk-conotes__toggle:focus {
	background: transparent;
	color: var(--fwk-color-text);
	text-decoration-color: var(--fwk-button-ink);
	box-shadow: none;
}

.fwk-conotes__toggle:focus-visible {
	outline: none;
	box-shadow: var(--fwk-focus-ring);
	border-radius: var(--fwk-radius-sm);
}

.fwk-conotes__panel {
	margin-block-start: var(--fwk-space-3);
}

.fwk-conotes .woocommerce-additional-fields > h3,
.fwk-conotes .woocommerce-additional-fields > h3.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.fwk-conotes .form-row > label {
	font-size: var(--fwk-text-sm);
	font-weight: 500;
	color: var(--fwk-color-muted);
}

.fwk-copay .place-order {
	margin-block-start: var(--fwk-space-4);
	padding-block-start: var(--fwk-space-4);
	border-top: 1px solid var(--fwk-color-border);
}

/* Checkout ink-zone: quiet gift badge (no sky slab). */
.fwk-checkout-page .fwk-jibbitz-gift-price__badge,
.fwk-checkout-page .fwk-jibbitz-gift-price__pct {
	background: transparent;
	color: var(--fwk-color-muted);
	border: 1px solid var(--fwk-color-border);
	font-weight: 600;
}

/* --- U27 Order summary (sticky) ---------------------------------------- */
/* Flat like .fwk-costep / payment: hairline rows, no boxed card chrome. */
.fwk-cosummary {
	border: 0;
	border-radius: 0;
	background: transparent;
	padding: 0;
	box-shadow: none;
}

.fwk-cosummary__title {
	margin: 0 0 var(--fwk-space-3);
	padding: 0;
	font-family: var(--fwk-font-display);
	font-size: var(--fwk-text-base);
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--fwk-color-text);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
	text-decoration-color: var(--fwk-button-ink);
}

.fwk-cosummary #order_review {
	font-size: var(--fwk-text-sm);
	padding-inline: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.fwk-cosummary table.shop_table {
	width: 100%;
	border: 0;
	margin: 0;
	border-collapse: collapse;
}

.fwk-cosummary table.shop_table th,
.fwk-cosummary table.shop_table td {
	border: 0;
	padding: var(--fwk-space-2) 0;
}

.fwk-cosummary table.shop_table tbody tr:not(:last-child) td {
	border-bottom: 1px solid var(--fwk-color-border);
}

.fwk-cosummary .cart-subtotal,
.fwk-cosummary .order-total {
	border-top: 1px solid var(--fwk-color-border);
}

.fwk-cosummary .cart-subtotal th,
.fwk-cosummary .cart-subtotal td {
	font-size: var(--fwk-text-sm);
	font-weight: 500;
}

.fwk-cosummary .cart-subtotal th {
	color: var(--fwk-color-muted);
}

.fwk-cosummary .order-total th {
	padding-block-start: var(--fwk-space-3);
	font-size: var(--fwk-text-base);
	font-weight: 700;
	color: var(--fwk-color-text);
}

.fwk-cosummary .order-total td {
	padding-block-start: var(--fwk-space-3);
	font-size: var(--fwk-text-lg);
	font-weight: 700;
}

.fwk-cosummary .order-total .amount {
	font-size: var(--fwk-text-lg);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	color: var(--fwk-color-text);
}

/* --- Coupon (compact, under the summary, bottom-right) ----------------- */
.fwk-coupon {
	margin-block-start: var(--fwk-space-4);
	padding-block-start: var(--fwk-space-4);
	border-top: 1px solid var(--fwk-color-border);
}

.fwk-coupon__label {
	display: block;
	margin-block-end: var(--fwk-space-2);
	font-size: var(--fwk-text-xs);
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--fwk-color-muted);
}

.fwk-coupon__row {
	display: flex;
	gap: var(--fwk-space-2);
}

.fwk-coupon__input {
	flex: 1 1 auto;
	min-width: 0;
}

.fwk-coupon__apply {
	flex: 0 0 auto;
	white-space: nowrap;
}

/* Coupon lives inside the WC cart form on the cart page; keep it flat too. */
.fwk-cart .fwk-coupon {
	margin-block-start: var(--fwk-space-5);
}

/* --- U27.1 Compact review summary (checkout aside) --------------------- */
/* Product rows mirror mini-cart: media | body(title, meta, foot: price + stepper). */
.fwk-review {
	display: flex;
	flex-direction: column;
	gap: 0;
	margin: 0;
	padding: 0;
}

/* Kill Woo/Kadence ul indent so thumbs align with title / hairlines. */
.fwk-checkout-page .fwk-review__items,
.fwk-checkout-page .fwk-cosummary ul.fwk-review__items,
.fwk-checkout-page .woocommerce-checkout-review-order-table .fwk-review__items {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	padding-inline: 0 !important;
	padding-inline-start: 0 !important;
	display: flex;
	flex-direction: column;
	gap: 0;
	border-top: 1px solid var(--fwk-color-border);
}

.fwk-checkout-page .fwk-review__item,
.fwk-checkout-page .fwk-cosummary li.fwk-review__item {
	list-style: none !important;
	display: grid;
	grid-template-columns: var(--fwk-cart-media-w, 5.5rem) minmax(0, 1fr);
	column-gap: var(--fwk-space-3);
	align-items: start;
	padding-block: var(--fwk-space-3);
	padding-inline: 0 !important;
	padding-inline-start: 0 !important;
	margin: 0 !important;
	border-bottom: 1px solid var(--fwk-color-border);
}

.fwk-checkout-page .fwk-review__item::before,
.fwk-checkout-page .fwk-review__item::after {
	content: none !important;
	display: none !important;
}

.fwk-review__media {
	display: block;
	grid-column: 1;
	width: var(--fwk-cart-media-w, 5.5rem);
	height: auto;
	aspect-ratio: var(--fwk-cart-media-ratio, 5 / 3);
	border-radius: var(--fwk-radius-sm);
	overflow: clip;
	background: #fff !important;
}

.fwk-review__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	background: #fff !important;
	border: 0;
}

.fwk-review__body {
	grid-column: 2;
	min-width: 0;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 2px;
	text-align: start;
}

.fwk-review__name {
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	line-height: 1.35;
	color: var(--fwk-color-text);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.fwk-review__meta,
.fwk-review__meta .variation,
.fwk-review__meta dl,
.fwk-review__meta dl.variation {
	display: block;
	margin: 0;
	padding: 0;
	font-size: var(--fwk-text-xs);
	color: var(--fwk-color-muted);
	line-height: 1.35;
}

.fwk-review__meta dt,
.fwk-review__meta dd,
.fwk-review__meta dl.variation dt,
.fwk-review__meta dl.variation dd {
	display: inline;
	float: none;
	margin: 0;
	padding: 0;
}

.fwk-review__meta dt::after,
.fwk-review__meta dl.variation dt::after {
	content: none;
}

.fwk-review__meta dd p,
.fwk-review__meta p {
	display: inline;
	margin: 0;
}

.fwk-review__foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-3);
	width: 100%;
	min-width: 0;
	margin-top: 4px;
	min-height: 32px;
}

.fwk-review__price {
	flex: 1 1 auto;
	min-width: 0;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	color: var(--fwk-color-text);
	/* Allow gift badge / mix price to wrap; amounts stay tabular. */
	white-space: normal;
}

.fwk-review__price .amount,
.fwk-review__price .woocommerce-Price-amount {
	font: inherit;
	color: inherit;
	white-space: nowrap;
}

.fwk-review__foot .fwk-qty-stepper {
	flex: 0 0 auto;
	margin: 0;
}

.fwk-review__totals {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0;
	padding-block-start: 0;
	border-top: 0;
}

.fwk-review__row {
	display: grid;
	grid-template-columns: minmax(7rem, auto) minmax(0, 1fr);
	align-items: baseline;
	gap: var(--fwk-space-3);
	margin: 0;
	padding-block: var(--fwk-space-3);
	border-bottom: 1px solid var(--fwk-color-border);
	font-size: var(--fwk-text-sm);
}

.fwk-review__row dt {
	margin: 0;
	color: var(--fwk-color-muted);
	white-space: nowrap;
	flex: 0 0 auto;
	font-weight: 500;
}

.fwk-review__row dd {
	margin: 0;
	text-align: end;
	font-variant-numeric: tabular-nums;
	min-width: 0;
	font-weight: 600;
	color: var(--fwk-color-text);
}

.fwk-review__row .amount,
.fwk-review__row .amount bdi {
	white-space: nowrap;
}

.fwk-review__row--shipping dd {
	color: var(--fwk-color-text);
	font-weight: 600;
	text-align: end;
	overflow-wrap: anywhere;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
}

.fwk-review__ship-method {
	font-weight: 600;
}

.fwk-review__ship-cost {
	font-weight: 500;
	font-size: var(--fwk-text-xs);
	color: var(--fwk-color-muted);
}

.fwk-review__row--total {
	margin-block-start: 0;
	padding-block: var(--fwk-space-4) var(--fwk-space-3);
	border-bottom: 0;
	border-top: 0;
}

.fwk-review__row--total dt {
	color: var(--fwk-color-text);
	font-weight: 700;
	font-size: var(--fwk-text-base);
}

.fwk-review__row--total dd {
	font-weight: 800;
	font-size: var(--fwk-text-lg);
	white-space: nowrap;
	color: var(--fwk-color-text);
}

.fwk-review__ship-inputs {
	display: none !important;
}

/* --- Mobile sticky total dock ------------------------------------------ */
.fwk-codock {
	position: fixed;
	inset-inline: 0;
	bottom: 0;
	z-index: 60;
	display: none;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-4);
	padding: var(--fwk-space-3) var(--fwk-space-4);
	background: var(--fwk-color-surface);
	border-top: 1px solid var(--fwk-color-border);
	box-shadow: 0 -4px 20px oklch(50% 0.06 245 / 0.1);
	padding-bottom: calc(var(--fwk-space-3) + env(safe-area-inset-bottom, 0px));
}

@media (max-width: 900px) {
	.fwk-checkout-page .fwk-codock {
		display: flex;
	}
	.fwk-checkout-page.fwk-thankyou-page .fwk-codock {
		display: none;
	}
	.fwk-checkout-page main,
	.fwk-checkout-page .fwk-checkout {
		padding-bottom: 84px;
	}
}

.fwk-codock__label {
	display: block;
	font-size: var(--fwk-text-xs);
	color: var(--fwk-color-muted);
}

.fwk-codock__total {
	font-size: var(--fwk-text-lg);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

.fwk-codock__cta {
	flex: 0 0 auto;
	min-width: 150px;
}

/* --- U28 Thank-you ------------------------------------------------------ */
.fwk-ty {
	max-width: 720px;
	margin-inline: auto;
	display: flex;
	flex-direction: column;
	gap: var(--fwk-space-5);
}

.fwk-ty__hero {
	text-align: center;
	padding: var(--fwk-space-8) var(--fwk-space-5) var(--fwk-space-6);
	border: 0;
	border-radius: 0;
	background: transparent;
}

.fwk-ty__badge {
	display: grid;
	place-items: center;
	width: 64px;
	height: 64px;
	margin: 0 auto var(--fwk-space-4);
	border-radius: var(--fwk-radius-pill);
	background: var(--fwk-button-ink);
	color: oklch(99% 0 0);
	box-shadow: none;
}

.fwk-ty__title {
	margin: 0 0 var(--fwk-space-2);
	font-family: var(--fwk-font-display);
	font-size: var(--fwk-text-xl);
	font-weight: 800;
	letter-spacing: -0.02em;
}

.fwk-ty__sub {
	margin: 0;
	color: var(--fwk-color-muted);
	font-size: var(--fwk-text-sm);
}

.fwk-ty__ordernum {
	display: inline-flex;
	align-items: center;
	gap: var(--fwk-space-2);
	margin-block-start: var(--fwk-space-4);
	padding: var(--fwk-space-2) var(--fwk-space-3) var(--fwk-space-2) var(--fwk-space-4);
	border: 1px solid var(--fwk-color-border);
	border-radius: var(--fwk-radius-pill);
	background: var(--fwk-color-surface);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

.fwk-ty__jibbitz {
	margin: var(--fwk-space-3) 0 0;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	line-height: 1.4;
	color: var(--fwk-color-selected);
}

.fwk-ty__copy {
	display: inline-grid;
	place-items: center;
	width: 28px;
	height: 28px;
	border: 0;
	border-radius: var(--fwk-radius-pill);
	background: var(--fwk-color-sunken);
	color: var(--fwk-color-muted);
	cursor: pointer;
	transition: background-color var(--fwk-duration) var(--fwk-ease), color var(--fwk-duration) var(--fwk-ease);
}

.fwk-ty__copy:hover {
	background: var(--fwk-color-selected-soft);
	color: var(--fwk-color-selected);
}

.fwk-ty__copy.is-copied {
	background: var(--fwk-color-selected);
	color: var(--fwk-color-on-selected);
}

.fwk-ty__card {
	border: 1px solid var(--fwk-color-border);
	border-radius: var(--fwk-radius-xl);
	background: var(--fwk-color-surface);
	padding: var(--fwk-space-5);
}

.fwk-ty__card-title {
	margin: 0 0 var(--fwk-space-4);
	font-family: var(--fwk-font-display);
	font-size: var(--fwk-text-base);
	font-weight: 700;
}

.fwk-ty__rows {
	display: flex;
	flex-direction: column;
	gap: var(--fwk-space-2);
	font-size: var(--fwk-text-sm);
}

.fwk-ty__row {
	display: flex;
	justify-content: space-between;
	gap: var(--fwk-space-4);
}

.fwk-ty__row dt {
	color: var(--fwk-color-muted);
	margin: 0;
}

.fwk-ty__row dd {
	margin: 0;
	font-weight: 600;
	text-align: end;
}

.fwk-ty__estimate {
	margin: var(--fwk-space-4) 0 0;
	padding: var(--fwk-space-3) var(--fwk-space-4);
	border-radius: var(--fwk-radius-md);
	background: var(--fwk-color-sunken);
	font-size: var(--fwk-text-sm);
	color: var(--fwk-color-muted);
}

/* Timeline */
.fwk-ty__timeline {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0;
}

.fwk-ty__step {
	position: relative;
	display: flex;
	gap: var(--fwk-space-3);
	padding-block: var(--fwk-space-2);
}

.fwk-ty__step-dot {
	flex: 0 0 auto;
	position: relative;
	width: 22px;
	display: grid;
	place-items: center;
}

.fwk-ty__step-dot::before {
	content: "";
	width: 12px;
	height: 12px;
	border-radius: var(--fwk-radius-pill);
	border: 2px solid var(--fwk-color-border-strong);
	background: var(--fwk-color-surface);
	z-index: 1;
}

.fwk-ty__step:not(:last-child) .fwk-ty__step-dot::after {
	content: "";
	position: absolute;
	top: 18px;
	bottom: -6px;
	width: 2px;
	background: var(--fwk-color-border);
}

.fwk-ty__step.is-done .fwk-ty__step-dot::before,
.fwk-ty__step.is-current .fwk-ty__step-dot::before {
	border-color: var(--fwk-color-selected);
	background: var(--fwk-color-selected);
}

.fwk-ty__step.is-current .fwk-ty__step-label {
	font-weight: 700;
}

.fwk-ty__step-label {
	font-size: var(--fwk-text-sm);
	padding-block: 1px;
}

.fwk-ty__step.is-upcoming .fwk-ty__step-label {
	color: var(--fwk-color-muted);
}

/* Help cards */
.fwk-ty__help {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--fwk-space-3);
}

@media (max-width: 600px) {
	.fwk-ty__help {
		grid-template-columns: 1fr;
	}
}

.fwk-ty__help-card {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: var(--fwk-space-4);
	border: 1px solid var(--fwk-color-border);
	border-radius: var(--fwk-radius-md);
	background: var(--fwk-color-surface);
	text-decoration: none;
	color: var(--fwk-color-text);
	transition: border-color var(--fwk-duration) var(--fwk-ease), box-shadow var(--fwk-duration) var(--fwk-ease);
}

.fwk-ty__help-card:hover {
	border-color: var(--fwk-color-border-strong);
	box-shadow: var(--fwk-shadow-sm);
}

.fwk-ty__help-card strong {
	font-size: var(--fwk-text-sm);
}

.fwk-ty__help-card span {
	font-size: var(--fwk-text-xs);
	color: var(--fwk-color-muted);
}

.fwk-ty__final {
	text-align: center;
	padding-block: var(--fwk-space-4);
}

/* --- Cart ---------------------------------------------------------------- */
.fwk-cart__grid {
	display: grid;
	/* Lines take remaining width; summary sticky track ~18–22rem */
	grid-template-columns: minmax(0, 1fr) minmax(17.5rem, 21rem);
	gap: clamp(1.5rem, 1rem + 2vw, 2.5rem);
	align-items: start;
	width: 100%;
}

@media (max-width: 64em) {
	.fwk-cart__grid {
		grid-template-columns: minmax(0, 1fr) minmax(16rem, 18.75rem);
		gap: var(--fwk-space-6);
	}
}

@media (max-width: 56.25em) {
	.fwk-cart__grid {
		grid-template-columns: 1fr;
		gap: var(--fwk-space-5);
	}
}

.fwk-cart__main {
	container-type: inline-size;
	container-name: fwk-cart-main;
	min-width: 0;
}

.fwk-cart__aside {
	position: sticky;
	top: var(--fwk-space-6);
	min-width: 0;
	width: 100%;
	max-width: 100%;
}

@media (max-width: 56.25em) {
	.fwk-cart__aside {
		position: static;
	}
}

.fwk-cart__lines {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0;
	border-top: 1px solid var(--fwk-color-border);
}

/* Figma cart card: media | body (title, meta, foot: price + stepper). */
.fwk-cart-line {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	padding: 15px 0;
	border: 0;
	border-bottom: 1px solid var(--fwk-color-border);
	border-radius: 0;
	background: transparent;
	min-width: 0;
}

.fwk-cart-line__media {
	flex: 0 0 auto;
	width: 7rem;
	height: auto;
	aspect-ratio: var(--fwk-cart-media-ratio, 5 / 3);
	border-radius: 0;
	overflow: clip;
	background: #fff !important;
	border: 0;
	padding: 0;
}

.fwk-cart-line__media a {
	display: block;
	width: 100%;
	height: 100%;
	background: #fff !important;
}

.fwk-cart-line__media img,
.fwk-cart-line__media img.fwk-cart-thumb {
	width: 100%;
	height: 100%;
	object-fit: contain !important;
	object-position: center;
	background: #fff !important;
}

.fwk-cart-line__body {
	min-width: 0;
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 15px;
}

.fwk-cart-line__info {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	width: 100%;
	min-width: 0;
}

.fwk-cart-line__name {
	display: block;
	font-family: var(--fwk-font-display);
	font-weight: 600;
	font-size: var(--fwk-text-lg);
	line-height: 1.35;
	letter-spacing: -0.015em;
	color: var(--fwk-color-text);
	text-decoration: none;
	overflow-wrap: break-word;
	word-break: normal;
}

.fwk-cart-line__name:hover {
	color: var(--fwk-color-cta);
}

.fwk-cart-line__meta,
.fwk-cart-line__meta .variation,
.fwk-cart-line__meta dl,
.fwk-cart-line__meta dl.variation {
	display: block;
	margin: 0;
	padding: 0;
	font-family: var(--fwk-font);
	font-size: var(--fwk-text-sm);
	font-weight: 500;
	line-height: 1.35;
	color: var(--fwk-color-muted);
	float: none;
	width: auto;
	max-width: 100%;
}

.fwk-cart-line__meta dt,
.fwk-cart-line__meta dd,
.fwk-cart-line__meta dl.variation dt,
.fwk-cart-line__meta dl.variation dd {
	display: inline;
	float: none;
	margin: 0;
	padding: 0;
}

.fwk-cart-line__meta dt::after,
.fwk-cart-line__meta dl.variation dt::after {
	content: none;
}

.fwk-cart-line__meta dd p,
.fwk-cart-line__meta dl.variation dd p {
	display: inline;
	margin: 0;
}

.fwk-cart-line__foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-3);
	width: 100%;
	min-width: 0;
	min-height: 32px;
}

.fwk-cart-line__price {
	font-family: var(--fwk-font);
	font-size: var(--fwk-text-lg);
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: -0.0125em;
	font-variant-numeric: tabular-nums;
	color: var(--fwk-color-text);
	white-space: nowrap;
	min-width: 0;
}

.fwk-cart-line__price .amount,
.fwk-cart-line__price .woocommerce-Price-amount {
	font: inherit;
	color: inherit;
}

.fwk-cart-line__foot .fwk-qty-stepper {
	flex: 0 0 auto;
}

/* Scale media when the cart main column is wide enough (type stays on tokens). */
@container fwk-cart-main (min-width: 420px) {
	.fwk-cart-line {
		gap: 1.5rem;
	}

	.fwk-cart-line__media {
		width: 8.75rem;
	}
}

@container fwk-cart-main (min-width: 560px) {
	.fwk-cart-line {
		gap: 1.75rem;
	}

	.fwk-cart-line__media {
		width: 12.5rem;
	}
}

@container fwk-cart-main (max-width: 340px) {
	.fwk-cart-line__foot {
		flex-wrap: wrap;
		justify-content: flex-start;
	}
}

@media (max-width: 600px) {
	.fwk-cart-line {
		gap: 0.875rem;
		padding: 12px 0;
		align-items: flex-start;
	}

	.fwk-cart-line__media {
		width: 6.5rem;
	}

	.fwk-cart-line__body {
		gap: 12px;
	}

	.fwk-cart-line__name {
		font-size: var(--fwk-text-base);
		line-height: 1.35;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		line-clamp: 2;
		overflow: hidden;
	}

	.fwk-cart-line__price {
		font-size: var(--fwk-text-base);
	}

	/* Price + stepper on separate full-width row so gift badge never eats qty. */
	.fwk-cart .fwk-cart-line__foot {
		flex-wrap: nowrap;
		justify-content: space-between;
		align-items: center;
		gap: var(--fwk-space-2);
		width: 100%;
	}

	.fwk-cart .fwk-cart-line__price {
		flex: 1 1 auto;
		min-width: 0;
		white-space: normal;
	}

	.fwk-cart .fwk-cart-line__foot .fwk-qty-stepper {
		flex: 0 0 auto;
		width: 88px;
		min-width: 88px;
		height: 40px;
		min-height: 40px;
		padding: 4px 6px;
	}

	.fwk-cart .fwk-qty-stepper__dec,
	.fwk-cart .fwk-qty-stepper__inc {
		width: 28px;
		height: 28px;
		min-width: 28px;
		min-height: 28px;
	}

	.fwk-cart .fwk-qty-stepper__dec::before,
	.fwk-cart .fwk-qty-stepper__inc::before {
		inset: -8px;
	}

	.fwk-cart .fwk-qty-stepper__dec .fwk-icon-trash {
		width: 16px;
		height: 16px;
		flex-basis: 16px;
	}

	.fwk-cart .fwk-qty-stepper__value {
		font-size: 15px;
	}
}

/* Promo accordion (shared cart + summary) */
.fwk-promo {
	margin-block-start: var(--fwk-space-4);
	border-top: 1px solid var(--fwk-color-border);
	padding-block-start: var(--fwk-space-3);
}

.fwk-promo__toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	border: 0;
	background: transparent;
	cursor: pointer;
	font: inherit;
	font-size: var(--fwk-text-sm);
	font-weight: 600;
	color: var(--fwk-color-text);
	padding: var(--fwk-space-1) 0;
}

.fwk-promo__toggle::after {
	content: "+";
	color: var(--fwk-color-muted);
	font-size: var(--fwk-text-lg);
}

.fwk-promo[open] .fwk-promo__toggle::after {
	content: "\2212";
}

.fwk-promo__body {
	display: flex;
	gap: var(--fwk-space-2);
	margin-block-start: var(--fwk-space-3);
}

.fwk-promo__body input {
	flex: 1 1 auto;
}

.fwk-cart-checkout-btn {
	width: 100%;
	margin: 0;
}

/* Mobile sticky checkout bar (above bottom dock) */
.fwk-cart-dock {
	--fwk-cart-dock-height: 4.25rem;
	position: fixed;
	inset-inline: 0;
	bottom: var(--fwk-bottom-dock-offset, 4.25rem);
	z-index: 55;
	display: none;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwk-space-3);
	padding: var(--fwk-space-3) var(--fwk-space-4);
	background: var(--fwk-color-surface);
	border-top: 1px solid var(--fwk-color-border);
	box-shadow: 0 -4px 16px oklch(50% 0.06 245 / 0.08);
}

.fwk-cart-dock__label {
	display: block;
	font-size: var(--fwk-text-xs);
	font-weight: 500;
	color: var(--fwk-color-muted);
	line-height: 1.2;
}

.fwk-cart-dock__total {
	font-size: var(--fwk-text-lg);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	color: var(--fwk-color-selected);
	line-height: 1.2;
	min-width: 0;
}

.fwk-cart-dock__cta {
	flex: 0 0 auto;
	min-width: 8.5rem;
	text-align: center;
}

@media (max-width: 56.25em) {
	body.fwk-cart-page .fwk-cart-dock {
		display: flex;
	}

	body.fwk-cart-page.fwk-cart-proceed-visible .fwk-cart-dock {
		display: none;
	}

	body.fwk-cart-page:not(.fwk-cart-proceed-visible) {
		padding-bottom: calc(
			var(--fwk-cart-dock-height, 4.25rem) + var(--fwk-bottom-dock-offset, 4.25rem) + 0.5rem
		);
	}

	body.fwk-cart-page:not(.fwk-cart-proceed-visible) .fwk-cart {
		padding-bottom: var(--fwk-space-4);
	}
}

@media (min-width: 56.26em) {
	.fwk-cart-dock {
		display: none !important;
	}
}

/* Promo accordion on cart uses <details>; kill default marker. */
.fwk-promo > summary {
	list-style: none;
}

.fwk-promo > summary::-webkit-details-marker {
	display: none;
}

.fwk-cart .fwk-promo.fwk-coupon {
	margin-block-start: var(--fwk-space-4);
}

.fwk-cart .fwk-promo .fwk-coupon__row {
	width: 100%;
}