/**
 * Child theme utilities — keep selectors shallow for PageSpeed.
 * Body-driven theming example:
 *   body.env-corporate .spec-details { ... }
 */


/**
 * Premium WooCommerce CTAs (Add to cart, checkout, cart actions).
 * html + body + .woocommerce chain beats Hello Commerce `.woocommerce …` rules.
 * MyAccount nav `.is-active` intentionally omitted — it is not a cart/checkout CTA.
 */
html body.woocommerce #respond input#submit,
html body.woocommerce .woocommerce-message .button,
html body.woocommerce .woocommerce-info .button,
html body.woocommerce button.button,
html body.woocommerce button.button.alt,
html body.woocommerce ul.products li.product .button,
html body.woocommerce a.add_to_cart_button,
html body.woocommerce .woocommerce-account a.button,
html body.woocommerce .woocommerce-account a.button.alt,
html body.woocommerce .woocommerce-account button.button,
html body.woocommerce .woocommerce-cart .cart .button,
html body.woocommerce .woocommerce-cart .woocommerce-cart-form button[name="update_cart"],
html body.woocommerce .woocommerce-cart .woocommerce-cart-form input[name="update_cart"],
html body.woocommerce .woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
html body.woocommerce .woocommerce-cart a.button,
html body.woocommerce .woocommerce-checkout button.button.alt,
html body.woocommerce .woocommerce-checkout #place_order,
html body .woocommerce-mini-cart__buttons .button,
html body .widget_shopping_cart_content .buttons .button {
	background-color: #0C2835;
	border-color: #0C2835;
	border-radius: var(--wc-button-radius, 2px);
	box-shadow: none;
	color: #ffffff;
	font-weight: 600;
	letter-spacing: 1.5px;
	line-height: 1.2;
	padding: 16px 32px;
	text-transform: uppercase;
	transition:
		background-color 0.35s ease,
		border-color 0.35s ease,
		box-shadow 0.35s ease,
		transform 0.25s ease;
}

html body.woocommerce #respond input#submit:hover,
html body.woocommerce #respond input#submit:focus-visible,
html body.woocommerce .woocommerce-message .button:hover,
html body.woocommerce .woocommerce-message .button:focus-visible,
html body.woocommerce .woocommerce-info .button:hover,
html body.woocommerce .woocommerce-info .button:focus-visible,
html body.woocommerce button.button:hover,
html body.woocommerce button.button:focus-visible,
html body.woocommerce button.button.alt:hover,
html body.woocommerce button.button.alt:focus-visible,
html body.woocommerce ul.products li.product .button:hover,
html body.woocommerce ul.products li.product .button:focus-visible,
html body.woocommerce a.add_to_cart_button:hover,
html body.woocommerce a.add_to_cart_button:focus-visible,
html body.woocommerce .woocommerce-account a.button:hover,
html body.woocommerce .woocommerce-account a.button:focus-visible,
html body.woocommerce .woocommerce-account a.button.alt:hover,
html body.woocommerce .woocommerce-account a.button.alt:focus-visible,
html body.woocommerce .woocommerce-account button.button:hover,
html body.woocommerce .woocommerce-account button.button:focus-visible,
html body.woocommerce .woocommerce-cart .cart .button:hover,
html body.woocommerce .woocommerce-cart .cart .button:focus-visible,
html body.woocommerce .woocommerce-cart .woocommerce-cart-form button[name="update_cart"]:hover,
html body.woocommerce .woocommerce-cart .woocommerce-cart-form button[name="update_cart"]:focus-visible,
html body.woocommerce .woocommerce-cart .woocommerce-cart-form input[name="update_cart"]:hover,
html body.woocommerce .woocommerce-cart .woocommerce-cart-form input[name="update_cart"]:focus-visible,
html body.woocommerce .woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover,
html body.woocommerce .woocommerce-cart .wc-proceed-to-checkout a.checkout-button:focus-visible,
html body.woocommerce .woocommerce-cart a.button:hover,
html body.woocommerce .woocommerce-cart a.button:focus-visible,
html body.woocommerce .woocommerce-checkout button.button.alt:hover,
html body.woocommerce .woocommerce-checkout button.button.alt:focus-visible,
html body.woocommerce .woocommerce-checkout #place_order:hover,
html body.woocommerce .woocommerce-checkout #place_order:focus-visible,
html body .woocommerce-mini-cart__buttons .button:hover,
html body .woocommerce-mini-cart__buttons .button:focus-visible,
html body .widget_shopping_cart_content .buttons .button:hover,
html body .widget_shopping_cart_content .buttons .button:focus-visible {
	background-color: #ffffff;
	border-color: #0C2835;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
	color: #0C2835;
	transform: translateY(-1px);
}

html body.woocommerce #respond input#submit:disabled,
html body.woocommerce #respond input#submit[disabled],
html body.woocommerce .woocommerce-message .button:disabled,
html body.woocommerce .woocommerce-message .button[disabled],
html body.woocommerce button.button:disabled,
html body.woocommerce button.button[disabled],
html body.woocommerce button.button.alt:disabled,
html body.woocommerce button.button.alt[disabled],
html body.woocommerce button.button.alt.disabled,
html body.woocommerce ul.products li.product .button:disabled,
html body.woocommerce ul.products li.product .button[disabled],
html body.woocommerce .woocommerce-account a.button:disabled,
html body.woocommerce .woocommerce-account a.button[disabled],
html body.woocommerce .woocommerce-account a.button.alt:disabled,
html body.woocommerce .woocommerce-account a.button.alt[disabled],
html body.woocommerce .woocommerce-account button.button:disabled,
html body.woocommerce .woocommerce-account button.button[disabled],
html body.woocommerce .woocommerce-cart .cart .button:disabled,
html body.woocommerce .woocommerce-cart .cart .button[disabled],
html body.woocommerce .woocommerce-cart .woocommerce-cart-form button[name="update_cart"]:disabled,
html body.woocommerce .woocommerce-cart .woocommerce-cart-form button[name="update_cart"][disabled],
html body.woocommerce .woocommerce-cart .woocommerce-cart-form input[name="update_cart"]:disabled,
html body.woocommerce .woocommerce-cart .woocommerce-cart-form input[name="update_cart"][disabled],
html body.woocommerce .woocommerce-cart .wc-proceed-to-checkout a.checkout-button.disabled,
html body.woocommerce .woocommerce-cart a.button:disabled,
html body.woocommerce .woocommerce-cart a.button[disabled],
html body.woocommerce .woocommerce-checkout button.button.alt:disabled,
html body.woocommerce .woocommerce-checkout button.button.alt[disabled],
html body.woocommerce .woocommerce-checkout #place_order:disabled,
html body.woocommerce .woocommerce-checkout #place_order[disabled],
html body .woocommerce-mini-cart__buttons .button:disabled,
html body .woocommerce-mini-cart__buttons .button[disabled],
html body .widget_shopping_cart_content .buttons .button:disabled,
html body .widget_shopping_cart_content .buttons .button[disabled] {
	background-color: #e7e7e7;
	border-color: #e7e7e7;
	box-shadow: none;
	color: rgba(0, 0, 0, 0.45);
	cursor: not-allowed;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	html body.woocommerce #respond input#submit,
	html body.woocommerce .woocommerce-message .button,
	html body.woocommerce button.button,
	html body.woocommerce button.button.alt,
	html body.woocommerce ul.products li.product .button,
	html body.woocommerce a.add_to_cart_button,
	html body.woocommerce .woocommerce-account a.button,
	html body.woocommerce .woocommerce-account button.button,
	html body.woocommerce .woocommerce-cart .cart .button,
	html body.woocommerce .woocommerce-cart .woocommerce-cart-form button[name="update_cart"],
	html body.woocommerce .woocommerce-cart .woocommerce-cart-form input[name="update_cart"],
	html body.woocommerce .woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
	html body.woocommerce .woocommerce-cart a.button,
	html body.woocommerce .woocommerce-checkout button.button.alt,
	html body.woocommerce .woocommerce-checkout #place_order,
	html body .woocommerce-mini-cart__buttons .button,
	html body .widget_shopping_cart_content .buttons .button {
		transition-duration: 0.01ms;
	}

	html body.woocommerce #respond input#submit:hover,
	html body.woocommerce #respond input#submit:focus-visible,
	html body.woocommerce .woocommerce-message .button:hover,
	html body.woocommerce .woocommerce-message .button:focus-visible,
	html body.woocommerce button.button:hover,
	html body.woocommerce button.button:focus-visible,
	html body.woocommerce button.button.alt:hover,
	html body.woocommerce button.button.alt:focus-visible,
	html body.woocommerce ul.products li.product .button:hover,
	html body.woocommerce ul.products li.product .button:focus-visible,
	html body.woocommerce a.add_to_cart_button:hover,
	html body.woocommerce a.add_to_cart_button:focus-visible,
	html body.woocommerce .woocommerce-account a.button:hover,
	html body.woocommerce .woocommerce-account a.button:focus-visible,
	html body.woocommerce .woocommerce-account button.button:hover,
	html body.woocommerce .woocommerce-account button.button:focus-visible,
	html body.woocommerce .woocommerce-cart .cart .button:hover,
	html body.woocommerce .woocommerce-cart .cart .button:focus-visible,
	html body.woocommerce .woocommerce-cart .woocommerce-cart-form button[name="update_cart"]:hover,
	html body.woocommerce .woocommerce-cart .woocommerce-cart-form button[name="update_cart"]:focus-visible,
	html body.woocommerce .woocommerce-cart .woocommerce-cart-form input[name="update_cart"]:hover,
	html body.woocommerce .woocommerce-cart .woocommerce-cart-form input[name="update_cart"]:focus-visible,
	html body.woocommerce .woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover,
	html body.woocommerce .woocommerce-cart .wc-proceed-to-checkout a.checkout-button:focus-visible,
	html body.woocommerce .woocommerce-cart a.button:hover,
	html body.woocommerce .woocommerce-cart a.button:focus-visible,
	html body.woocommerce .woocommerce-checkout button.button.alt:hover,
	html body.woocommerce .woocommerce-checkout button.button.alt:focus-visible,
	html body.woocommerce .woocommerce-checkout #place_order:hover,
	html body.woocommerce .woocommerce-checkout #place_order:focus-visible,
	html body .woocommerce-mini-cart__buttons .button:hover,
	html body .woocommerce-mini-cart__buttons .button:focus-visible,
	html body .widget_shopping_cart_content .buttons .button:hover,
	html body .widget_shopping_cart_content .buttons .button:focus-visible {
		transform: none;
	}
}

/**
 * Single product: flex gallery + summary (column on small screens, row on wide),
 * branded tabs, soft summary tint — all breakpoints.
 */
html body.woocommerce.single-product div.product {
	align-items: stretch;
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	gap: clamp(1rem, 4vw, 1.75rem);
	position: relative;
}

/* Pull badge out of flex flow so it does not skew column/row alignment */
html body.woocommerce.single-product div.product > span.onsale {
	inset-block-start: 0;
	inset-inline-start: 0;
	position: absolute;
	z-index: 2;
}

/* Do not make .images a flex container — flexslider needs normal block flow for slides + thumbs */
html body.woocommerce.single-product div.product > div.images {
	align-self: stretch;
	box-sizing: border-box;
	width: 100%;
}

/* Never max-width the slide track (.woocommerce-product-gallery__wrapper) — flexslider needs full inline % width */
html body.woocommerce.single-product div.product > div.images .woocommerce-product-gallery {
	max-width: 100%;
}

/* Ensure flexslider slides (incl. appended blueprint) paint and size correctly */
html body.woocommerce.single-product div.product > div.images .flex-viewport .woocommerce-product-gallery__image {
	box-sizing: border-box;
	display: block;
}

/* 1. Reset the container to a tight grid */
.woocommerce-product-gallery .flex-control-thumbs {
    display: grid !important;
    /* This creates a grid where images take up exactly 110px on desktop */
    grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)) !important;
    gap: 0 !important; /* This removes the gaps between images */
    padding: 0 !important;
    margin: 10px 0 0 0 !important;
    list-style: none !important;
}

/* 2. Remove default WooCommerce widths and margins from items */
.woocommerce-product-gallery .flex-control-thumbs li {
    width: 100% !important; /* Allow grid to control width */
    float: none !important; /* Kill the old float system */
    margin: 0 !important;
    padding: 0 !important;
    border: 0.5pt solid #ececec; /* Add a thin designer border between images */
    box-sizing: border-box;
}

/* 3. Ensure images fill their square containers */
.woocommerce-product-gallery .flex-control-thumbs li img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    transition: opacity 0.3s ease;
}

/* 4. Mobile adjustment (Habitt-style tight view for small screens) */
@media screen and (max-width: 768px) {
    .woocommerce-product-gallery .flex-control-thumbs {
        /* On mobile, we use 80px to fit more thumbnails per row */
        grid-template-columns: repeat(auto-fill, minmax(80px, 1fr)) !important;
    }
}
/* Hide Product Categories and Tags */
.product_meta .posted_in, 
.product_meta .tagged_as {
    display: none !important;
}

/* Hide the redundant 'Tea Trolley - Beechwood' variation text */
.woocommerce-variation-description {
    display: none !important;
}
/* SKU display */
.product_meta .sku_wrapper {
    display: block;
    font-size: 13px; /* Smaller, sophisticated font */
    color: #888; /* Subtle grey so it doesn't compete with the title */
    font-weight: 400;
    text-transform: uppercase;
}
html body.woocommerce.single-product div.product > div.images .flex-viewport .woocommerce-product-gallery__image img {
	display: block;
	height: auto;
	max-width: 100%;
	width: 100%;
}

html body.woocommerce.single-product div.product > div.images ol.flex-control-nav.flex-control-thumbs {
	display: grid;
	gap: 8px;
	grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
	list-style: none;
	margin: 16px 0 0;
	padding: 0;
}

html body.woocommerce.single-product div.product > div.images ol.flex-control-nav.flex-control-thumbs li img {
	border: 1px solid rgba(0, 0, 0, 0.08);
	cursor: pointer;
	height: auto;
	transition: border-color 0.2s ease, transform 0.2s ease;
	width: 100%;
}

html body.woocommerce.single-product div.product > div.images ol.flex-control-nav.flex-control-thumbs li img.flex-active {
	border-color: var(--brand-primary);
	transform: translateY(-1px);
}

html body.woocommerce.single-product div.product > div.summary.entry-summary {
	background-color: var(--brand-primary-soft, color-mix(in srgb, var(--brand-primary) 5%, transparent));
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	gap: 14px;
	justify-content: center;
	padding: clamp(1rem, 4vw, 2rem);
	width: 100%;
}

/* Premium summary — mobile-first readable type (min ~16px body scale) */
html body.woocommerce.single-product div.product .product_title.entry-title {
	font-size: clamp(1.375rem, 4.2vw, 2rem);
	font-weight: 600;
	letter-spacing: 0.5px;
	line-height: 1.2;
	margin: 0 0 4px;
}

html body.woocommerce.single-product div.product p.price,
html body.woocommerce.single-product div.product .price .woocommerce-Price-amount {
	color: var(--brand-primary);
	font-size: clamp(1.125rem, 3.5vw, 1.35rem);
	font-weight: 600;
	letter-spacing: 0.3px;
	line-height: 1.25;
	margin: 0;
}

html body.woocommerce.single-product div.product .woocommerce-product-details__short-description {
	color: rgba(0, 0, 0, 0.78);
	font-size: clamp(1rem, 2.8vw, 1.0625rem);
	line-height: 1.6;
	margin: 4px 0 0;
}

html body.woocommerce.single-product div.product .product_meta {
	border-top: 1px solid rgba(0, 0, 0, 0.08);
	color: var(--brand-secondary, #6b6b6b);
	font-size: clamp(0.8125rem, 2.5vw, 0.875rem);
	line-height: 1.5;
	margin-top: clamp(12px, 3vw, 18px);
	padding-top: clamp(12px, 3vw, 14px);
}

html body.woocommerce.single-product div.product > .woocommerce-tabs.wc-tabs-wrapper,
html body.woocommerce.single-product div.product > section.up-sells.upsells.products,
html body.woocommerce.single-product div.product > section.related.products {
	flex: none;
	max-width: 100%;
	width: 100%;
}

@media (min-width: 768px) {
	html body.woocommerce.single-product div.product {
		align-items: center;
		column-gap: clamp(1.25rem, 3vw, 2.75rem);
		flex-direction: row;
		flex-wrap: wrap;
		row-gap: 0;
	}

	html body.woocommerce.single-product div.product > div.images {
		flex: 1 1 45%;
		min-width: min(100%, 280px);
		width: auto;
	}

	html body.woocommerce.single-product div.product > div.summary.entry-summary {
		align-self: center;
		flex: 1 1 42%;
		min-width: min(100%, 260px);
		width: auto;
	}

	html body.woocommerce.single-product div.product > .woocommerce-tabs.wc-tabs-wrapper,
	html body.woocommerce.single-product div.product > section.up-sells.upsells.products,
	html body.woocommerce.single-product div.product > section.related.products {
		flex: 1 1 100%;
	}
}

/* ── ShopEngine/Elementor sets display:flex on #page and .ast-container, which
   turns content and the Elementor footer template into horizontal row siblings.
   Reset both to block so footer stacks below content on all WooCommerce pages. ── */
body.woocommerce #page,
body.woocommerce-page #page {
	display: block !important;
}

body.woocommerce:not(.ast-left-sidebar):not(.ast-right-sidebar) .ast-container,
body.woocommerce-page:not(.ast-left-sidebar):not(.ast-right-sidebar) .ast-container {
	display: block !important;
}

/* Mobile (<=921px): Astra reverses #content > .ast-container (column-reverse) for
   sidebar layouts so products (#primary) render above the filter sidebar
   (#secondary). The Hello Plus footer is a 3rd item in that container, so the
   reversal pushes it to the top instead of the bottom. Pull it back to the end
   with `order` (lower order = placed first at column-reverse's bottom start). */
@media (max-width: 921px) {
	body.woocommerce.ast-left-sidebar #content > .ast-container > [data-elementor-type="ehp-footer"],
	body.woocommerce.ast-right-sidebar #content > .ast-container > [data-elementor-type="ehp-footer"],
	body.woocommerce-page.ast-left-sidebar #content > .ast-container > [data-elementor-type="ehp-footer"],
	body.woocommerce-page.ast-right-sidebar #content > .ast-container > [data-elementor-type="ehp-footer"] {
		order: -1;
	}
}

/* On sidebar layouts, the Hello Plus footer ([data-elementor-type="ehp-footer"]) is
   rendered as a 3rd sibling of #secondary/#primary inside .ast-container, which is a
   flex row. Wrap it onto its own full-width row below the sidebar + content row. */
@media (min-width: 922px) {
	body.woocommerce.ast-left-sidebar .site-content .ast-container,
	body.woocommerce.ast-right-sidebar .site-content .ast-container,
	body.woocommerce-page.ast-left-sidebar .site-content .ast-container,
	body.woocommerce-page.ast-right-sidebar .site-content .ast-container {
		flex-wrap: wrap;
	}

	body.woocommerce.ast-left-sidebar .site-content .ast-container > [data-elementor-type="ehp-footer"],
	body.woocommerce.ast-right-sidebar .site-content .ast-container > [data-elementor-type="ehp-footer"],
	body.woocommerce-page.ast-left-sidebar .site-content .ast-container > [data-elementor-type="ehp-footer"],
	body.woocommerce-page.ast-right-sidebar .site-content .ast-container > [data-elementor-type="ehp-footer"] {
		flex: 1 1 100%;
	}
}

/* site-content always spans full width; #primary only takes 100% when there is no sidebar */
body.woocommerce .site-content,
body.woocommerce-page .site-content {
	width: 100%;
}

body.woocommerce.ast-no-sidebar #primary,
body.woocommerce-page.ast-no-sidebar #primary {
	width: 100%;
}

/* Elementor footer template — always full width below content */
body.woocommerce [data-elementor-type="ako-footer"],
body.woocommerce-page [data-elementor-type="ako-footer"] {
	display: block !important;
	width: 100% !important;
	clear: both;
}

/* Remove container padding on shop & single product — sidebar layout handled by Astra */
@media (min-width: 769px) {
	body.post-type-archive-product .ast-container,
	body.single-product .ast-container {
		max-width: 100%;
		padding-left: 0;
		padding-right: 0;
	}
}

/* Product tabs — premium nav + readable panel (touch-friendly on small screens) */
html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper {
	margin-top: clamp(1.25rem, 4vw, 2.5rem);
}

html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs {
	-webkit-overflow-scrolling: touch;
	border-bottom: 1px solid rgba(0, 0, 0, 0.12);
	display: flex;
	flex-wrap: nowrap;
	gap: 4px;
	list-style: none;
	margin: 0;
	overflow-x: auto;
	padding: 4px 0 0;
	scrollbar-width: thin;
}

html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li {
	background: transparent;
	border: 0;
	flex: 0 0 auto;
	margin: 0;
	padding: 0;
}

html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li::before,
html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li::after {
	display: none;
}

html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li a {
	color: rgba(0, 0, 0, 0.62);
	display: inline-block;
	font-size: clamp(0.75rem, 2.8vw, 0.8125rem);
	font-weight: 600;
	letter-spacing: 1.2px;
	min-height: 44px;
	padding: 12px 16px;
	text-decoration: none;
	text-transform: uppercase;
	transition: color 0.2s ease;
	white-space: nowrap;
}

html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li:hover a,
html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li:focus-within a {
	color: var(--brand-primary);
}

html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li.active {
	background-color: #000;
	border: 0;
	border-radius: var(--wc-button-radius, 2px) var(--wc-button-radius, 2px) 0 0;
	margin-bottom: -1px;
}

html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li.active:hover,
html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li.active:focus-visible {
	background-color: #000;
	border-color: transparent;
	color: #fff;
}

html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li.active,
html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li.active:hover,
html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li.active:focus-visible {
	border-color: #000;
	color: #fff;
}

html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li.active a,
html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li.active:hover a,
html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li.active:focus-visible a {
	color: #fff;
}

html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper .woocommerce-Tabs-panel {
	background-color: #fff;
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-top: 0;
	color: rgba(0, 0, 0, 0.82);
	font-size: clamp(1rem, 2.8vw, 1.0625rem);
	line-height: 1.65;
	padding: clamp(1rem, 4vw, 2rem);
}

html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper .woocommerce-Tabs-panel h2 {
	color: var(--brand-primary, #1a1a1a);
	font-size: clamp(1.125rem, 3.2vw, 1.25rem);
	font-weight: 600;
	letter-spacing: 0.4px;
	line-height: 1.25;
	margin: 0 0 clamp(12px, 3vw, 14px);
}

html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper .woocommerce-Tabs-panel p {
	margin: 0 0 clamp(12px, 3vw, 14px);
}

html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper .woocommerce-Tabs-panel ul {
	margin: 0 0 clamp(12px, 3vw, 14px);
	padding-inline-start: 1.125rem;
}

html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper .woocommerce-Tabs-panel li {
	margin-bottom: 8px;
}

html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper table.shop_attributes {
	border-collapse: collapse;
	width: 100%;
}

html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper table.shop_attributes tr + tr {
	border-top: 1px solid rgba(0, 0, 0, 0.06);
}

html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper table.shop_attributes th,
html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper table.shop_attributes td {
	padding: clamp(10px, 2.8vw, 12px) 0;
	vertical-align: top;
	word-break: break-word;
}

@media (max-width: 599px) {
	html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper table.shop_attributes tbody,
	html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper table.shop_attributes tr,
	html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper table.shop_attributes th,
	html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper table.shop_attributes td {
		display: block;
		width: 100%;
	}

	html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper table.shop_attributes th {
		padding-bottom: 4px;
		padding-top: 12px;
		width: auto;
	}

	html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper table.shop_attributes td {
		padding-bottom: 12px;
		padding-top: 0;
	}
}

html body.woocommerce div.product .woocommerce-tabs.wc-tabs-wrapper table.shop_attributes th {
	color: var(--brand-secondary, #6b6b6b);
	font-size: clamp(0.75rem, 2.6vw, 0.8125rem);
	font-weight: 600;
	line-height: 1.35;
	text-align: start;
	width: min(38%, 10rem);
}

/**
 * Specifications split layout ([product_spec_list]) — stack on mobile; 60/40 on desktop.
 * Blueprint grayscale → color on hover.
 */
.spec-split-layout {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: clamp(1.25rem, 3vw, 2rem);
	margin: clamp(1.25rem, 3vw, 2rem) 0;
}

.spec-split-layout .spec-details {
	flex: 1 1 auto;
	min-width: 0;
	width: 100%;
}

.spec-split-layout .spec-visual {
	flex: 1 1 auto;
	margin: 0;
	overflow: hidden;
	width: 100%;
}

.spec-split-layout .spec-visual__image {
	display: block;
	filter: grayscale(100%);
	height: auto;
	transition: filter 0.45s ease, transform 0.45s ease;
	width: 100%;
}

.spec-split-layout .spec-visual:active .spec-visual__image,
.spec-split-layout .spec-visual:focus-visible .spec-visual__image,
.spec-split-layout .spec-visual:hover .spec-visual__image {
	filter: grayscale(0%);
	transform: scale(1.01);
}

@media (min-width: 768px) {
	.spec-split-layout {
		align-items: center;
		flex-direction: row;
	}

	.spec-split-layout .spec-details {
		flex: 0 0 60%;
		max-width: 60%;
	}

	.spec-split-layout .spec-visual {
		flex: 0 0 40%;
		max-width: 40%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.spec-split-layout .spec-visual__image {
		transition-duration: 0.01ms;
	}

	.spec-split-layout .spec-visual:active .spec-visual__image,
	.spec-split-layout .spec-visual:focus-visible .spec-visual__image,
	.spec-split-layout .spec-visual:hover .spec-visual__image {
		transform: none;
	}
}

.spec-details .furniture-about-item-heading {
	font-size: clamp(1rem, 2.8vw, 1.125rem);
	font-weight: 600;
	line-height: 1.35;
	margin: 0 0 clamp(0.625rem, 2vw, 0.875rem);
}

.spec-details .furniture-specs-table {
	border-collapse: collapse;
	margin: 0;
	width: 100%;
}

.spec-details .furniture-specs-table th,
.spec-details .furniture-specs-table td {
	border-bottom: 0.5pt solid var(--brand-secondary, #6b6b6b);
	line-height: 1.55;
	padding: clamp(12px, 3.5vw, 14px) 0;
	text-align: left;
	vertical-align: top;
}

.spec-details .furniture-specs-table tr:last-child th,
.spec-details .furniture-specs-table tr:last-child td {
	border-bottom-width: 0;
}

.spec-details .furniture-specs-table th {
	color: var(--brand-secondary, #6b6b6b);
	font-size: clamp(0.6875rem, 2.4vw, 0.75rem);
	font-weight: 600;
	letter-spacing: 1.35px;
	text-transform: uppercase;
	width: 38%;
}

.spec-details .furniture-specs-table td {
	color: rgba(0, 0, 0, 0.88);
	font-size: clamp(1rem, 2.85vw, 1.0625rem);
	word-break: break-word;
}

@media (max-width: 599px) {
	.spec-details .furniture-specs-table tbody,
	.spec-details .furniture-specs-table tr,
	.spec-details .furniture-specs-table th,
	.spec-details .furniture-specs-table td {
		display: block;
		width: 100%;
	}

	.spec-details .furniture-specs-table th {
		border-bottom-width: 0;
		padding-bottom: 6px;
		width: auto;
	}

	.spec-details .furniture-specs-table td {
		border-bottom-width: 0.5pt;
		padding-top: 0;
		padding-bottom: clamp(14px, 4vw, 18px);
		margin-bottom: 4px;
	}

	.spec-details .furniture-specs-table tr:last-child td {
		border-bottom-width: 0;
		margin-bottom: 0;
	}
}

/* Material filters — swatch layout (colors/images injected via wp_head) */
.widget_layered_nav .woocommerce-widget-layered-nav-list .wc-layered-nav-term a,
.wc-block-product-filter-checkbox-list__label {
	position: relative;
	display: inline-flex;
	align-items: center;
}

.widget_layered_nav .woocommerce-widget-layered-nav-list .wc-layered-nav-term a::before,
.wc-block-product-filter-checkbox-list__text {
	display: inline-flex;
	align-items: center;
}

.wc-block-product-filter-checkbox-list__text::before {
	flex-shrink: 0;
	border: 1px solid rgba(0, 0, 0, 0.12);
	box-sizing: border-box;
}

.widget_layered_nav .woocommerce-widget-layered-nav-list .wc-layered-nav-term a::before {
	flex-shrink: 0;
	border: 1px solid rgba(0, 0, 0, 0.12);
	box-sizing: border-box;
}

.widget_layered_nav .woocommerce-widget-layered-nav-list .wc-layered-nav-term.chosen a::before,
.widget_layered_nav .woocommerce-widget-layered-nav-list .wc-layered-nav-term.woocommerce-widget-layered-nav-list__item--chosen a::before,
.wc-block-product-filter-checkbox-list__item.wc-layered-nav-term:has(.wc-block-product-filter-checkbox-list__input:checked) .wc-block-product-filter-checkbox-list__text::before {
	box-shadow: 0 0 0 2px currentColor;
}

/* Lookbook slider — scoped to results wrapper (no shop/filter impact) */
#lookbook-results-container,
.lookbook-results,
[data-lookbook-results] {
	margin-top: 3.5rem;
	padding: 2.5rem 0 0;
	border-top: 1px solid rgba(0, 0, 0, 0.06);
	max-width: 72rem;
	margin-left: auto;
	margin-right: auto;
}

.lookbook-results .results-heading {
	margin: 0 0 2rem;
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	text-align: center;
	color: var(--brand-primary, #1a1a1a);
}

#lookbook-results-container.is-hidden,
#lookbook-results-container[hidden],
.lookbook-results.is-hidden,
.lookbook-results[hidden],
[data-lookbook-results].is-hidden,
[data-lookbook-results][hidden],
#lookbook-results-container[style*="display: none"],
#lookbook-results-container[style*="display:none"],
.lookbook-results[style*="display: none"],
.lookbook-results[style*="display:none"] {
	display: none;
}

#lookbook-results-container:not([hidden]):not(.is-hidden),
.lookbook-results:not([hidden]):not(.is-hidden),
[data-lookbook-results]:not([hidden]):not(.is-hidden) {
	display: block;
}

.lookbook-loading {
	display: flex;
	justify-content: center;
	padding: 2rem 0;
}

.lookbook-loading[hidden] {
	display: none;
}

.lookbook-loading::after {
	content: "";
	width: 28px;
	height: 28px;
	border: 2px solid rgba(0, 0, 0, 0.12);
	border-top-color: var(--brand-primary, #1a1a1a);
	border-radius: 50%;
	animation: lookbook-spin 0.65s linear infinite;
}

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

/* Lookbook image carousel — premium furniture lookbook (Elementor HTML widget) */
.lookbook-slider[data-lookbook-carousel] {
	position: relative;
	max-width: 42rem;
	margin: 0 auto;
}

.lookbook-slider[data-lookbook-carousel] .lookbook-carousel__viewport {
	overflow: hidden;
	width: 100%;
	touch-action: pan-y pinch-zoom;
	background: #f4f2ef;
}

.lookbook-slider[data-lookbook-carousel] .lookbook-carousel__track {
	display: flex;
	transition: transform 0.55s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	will-change: transform;
}

.lookbook-slider[data-lookbook-carousel] .lookbook-slide {
	flex: 0 0 100%;
	position: relative;
	width: 100%;
	min-width: 0;
	cursor: pointer;
}

/* Uniform portrait frame — all source images crop to same ratio */
.lookbook-slider[data-lookbook-carousel] .lookbook-slide__media {
	position: relative;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	background: #eceae6;
}

.lookbook-slider[data-lookbook-carousel] .lookbook-slide img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	transition: transform 0.6s ease;
}

.lookbook-slider[data-lookbook-carousel] .lookbook-slide:hover img {
	transform: scale(1.02);
}

.lookbook-slider[data-lookbook-carousel] .plus-icon {
	position: absolute;
	bottom: 18%;
	left: 50%;
	transform: translateX(-50%);
	pointer-events: none;
	font-size: 1.125rem;
	font-weight: 300;
	line-height: 1;
	color: #fff;
	background: rgba(0, 0, 0, 0.28);
	width: 2.25rem;
	height: 2.25rem;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	backdrop-filter: blur(2px);
	transition: background-color 0.25s ease, transform 0.25s ease;
}

.lookbook-slider[data-lookbook-carousel] .lookbook-slide:hover .plus-icon {
	background: rgba(0, 0, 0, 0.42);
	transform: translateX(-50%) scale(1.05);
}

.lookbook-slider[data-lookbook-carousel] .lookbook-carousel__prev,
.lookbook-slider[data-lookbook-carousel] .lookbook-carousel__next {
	position: absolute;
	top: 50%;
	z-index: 2;
	transform: translateY(-50%);
	appearance: none;
	border: none;
	background: rgba(255, 255, 255, 0.72);
	color: var(--brand-primary, #1a1a1a);
	width: 2.75rem;
	height: 2.75rem;
	border-radius: 50%;
	font-size: 1.125rem;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.08);
	transition: background-color 0.25s ease, box-shadow 0.25s ease;
}

.lookbook-slider[data-lookbook-carousel] .lookbook-carousel__prev {
	left: 1rem;
}

.lookbook-slider[data-lookbook-carousel] .lookbook-carousel__next {
	right: 1rem;
}

.lookbook-slider[data-lookbook-carousel] .lookbook-carousel__prev:hover:not(:disabled),
.lookbook-slider[data-lookbook-carousel] .lookbook-carousel__next:hover:not(:disabled),
.lookbook-slider[data-lookbook-carousel] .lookbook-carousel__prev:focus-visible,
.lookbook-slider[data-lookbook-carousel] .lookbook-carousel__next:focus-visible {
	background: rgba(255, 255, 255, 0.95);
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.12);
}

.lookbook-slider[data-lookbook-carousel] .lookbook-carousel__prev:disabled,
.lookbook-slider[data-lookbook-carousel] .lookbook-carousel__next:disabled {
	opacity: 0.3;
	cursor: not-allowed;
}

.lookbook-slider[data-lookbook-carousel] .lookbook-carousel__prev[hidden],
.lookbook-slider[data-lookbook-carousel] .lookbook-carousel__next[hidden] {
	display: none;
}

.lookbook-slider[data-lookbook-carousel] .lookbook-carousel__dots {
	display: flex;
	justify-content: center;
	gap: 0.625rem;
	margin-top: 1.25rem;
}

.lookbook-slider[data-lookbook-carousel] .lookbook-carousel__dots[hidden] {
	display: none;
}

.lookbook-slider[data-lookbook-carousel] .lookbook-carousel__dot {
	appearance: none;
	width: 0.4375rem;
	height: 0.4375rem;
	padding: 0;
	border: none;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.18);
	cursor: pointer;
	transition: background-color 0.25s ease, transform 0.25s ease;
}

.lookbook-slider[data-lookbook-carousel] .lookbook-carousel__dot.is-active {
	background: var(--brand-primary, #1a1a1a);
	transform: scale(1.3);
}

.lookbook-slider[data-lookbook-carousel] .lookbook-carousel__dot:focus-visible {
	outline: 1px solid var(--brand-primary, #1a1a1a);
	outline-offset: 3px;
}

.lookbook-slide {
	cursor: pointer;
	border: none;
	background: transparent;
	padding: 0;
	font: inherit;
	color: inherit;
}

.lookbook-slider[data-lookbook-carousel] .lookbook-slide.is-active .lookbook-slide__media {
	box-shadow: inset 0 0 0 2px var(--brand-primary, #1a1a1a);
}

.lookbook-slide.is-active {
	outline: none;
}

.lookbook-products-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
	gap: 2rem 1.5rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.lookbook-empty {
	grid-column: 1 / -1;
	margin: 0;
	padding: 3rem 0;
	text-align: center;
	color: var(--brand-secondary, #6b6b6b);
	font-size: 0.9375rem;
	letter-spacing: 0.02em;
}

.lookbook-card {
	margin: 0;
}

.lookbook-card__link {
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	color: inherit;
	transition: opacity 0.3s ease;
}

.lookbook-card__link:hover,
.lookbook-card__link:focus-visible {
	opacity: 0.88;
}

.lookbook-card__image {
	display: block;
	width: 100%;
	aspect-ratio: 1;
	object-fit: cover;
	background: #f4f2ef;
}

.lookbook-card__body {
	padding: 1rem 0 0;
	text-align: center;
}

.lookbook-card__title {
	margin: 0 0 0.4rem;
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.lookbook-card__price {
	font-size: 0.8125rem;
	color: var(--brand-secondary, #6b6b6b);
	letter-spacing: 0.02em;
}

.lookbook-card__price .amount {
	font-weight: 600;
	color: var(--brand-primary, #1a1a1a);
}

.lookbook-pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	margin-top: 1.75rem;
	padding-top: 1.25rem;
	border-top: 1px solid rgba(0, 0, 0, 0.06);
}

.lookbook-pagination[hidden] {
	display: none;
}

.lookbook-pagination__prev,
.lookbook-pagination__next {
	appearance: none;
	border: 1px solid rgba(0, 0, 0, 0.15);
	background: transparent;
	color: var(--brand-primary, #1a1a1a);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	padding: 0.6rem 1rem;
	cursor: pointer;
	transition: background-color 0.2s ease, border-color 0.2s ease;
}

.lookbook-pagination__prev:hover:not(:disabled),
.lookbook-pagination__next:hover:not(:disabled),
.lookbook-pagination__prev:focus-visible,
.lookbook-pagination__next:focus-visible {
	background: rgba(0, 0, 0, 0.04);
	border-color: var(--brand-primary, #1a1a1a);
}

.lookbook-pagination__prev:disabled,
.lookbook-pagination__next:disabled {
	opacity: 0.35;
	cursor: not-allowed;
}

.lookbook-pagination__status {
	font-size: 0.875rem;
	color: var(--brand-secondary, #6b6b6b);
	min-width: 7rem;
	text-align: center;
}

@media (min-width: 768px) {
	.lookbook-products-grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

/* ==========================================================================
   Variant / Hot / CTA product carousel — horizontal scroll engine
   Covers all three container variants used across the site:
     .hot-carousel-lens-container  (hot-deals widget)
     .cta-lens-wrapper             (CTA section widget)
     .variant-products             (featured products widget)
   ========================================================================== */

/* Outer row: prev button | scrollable track | next button */
.variant-products,
.cta-lens-wrapper,
.hot-carousel-lens-container {
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
}

/* Scrollable viewport — primary fix for Bug 1.
   overflow: hidden clips the content so only 4 cards are visible;
   JS scrollLeft mutations still work on overflow:hidden elements.
   flex: 1 1 0 + min-width: 0 lets the track shrink inside the flex row. */
.variant-products .cta-viewport-track,
.cta-lens-wrapper .cta-viewport-track,
.hot-carousel-lens-container .hot-carousel-viewport-window {
	flex: 1 1 0;
	min-width: 0;
	overflow: hidden;
}

/* Bug 2 fix — widen the intermediate div.woocommerce that WooCommerce inserts
   between the scrollable track and ul.products. Without this, div.woocommerce
   collapses to track width, making scrollWidth equal clientWidth so
   scrollLeft changes have no visible effect. */
.variant-products .cta-viewport-track .woocommerce,
.cta-lens-wrapper .cta-viewport-track .woocommerce,
.hot-carousel-lens-container .hot-carousel-viewport-window .woocommerce {
	width: max-content;
	min-width: 100%;
}

/* Bug 3 fix — override WooCommerce grid to a single nowrap row.
   !important is intentional: WooCommerce's own stylesheet applies
   flex-wrap:wrap at high specificity which would re-wrap cards into a grid. */
.variant-products .cta-viewport-track ul.products,
.cta-lens-wrapper .cta-viewport-track ul.products,
.hot-carousel-lens-container .hot-carousel-viewport-window ul.products {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	width: max-content !important;
	gap: 20px !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

/* Each product card — fixed width prevents cards from collapsing.
   260px suits a 4-column layout at ~1280px screen width.
   Tune this value if cards look too narrow or too wide on your screen:
   target = (track clientWidth - (3 × 20px gap)) ÷ 4 */
.variant-products .cta-viewport-track ul.products > li.product,
.cta-lens-wrapper .cta-viewport-track ul.products > li.product,
.hot-carousel-lens-container .hot-carousel-viewport-window ul.products > li.product {
	flex: 0 0 260px;
	width: 260px;
	box-sizing: border-box;
}

/* Nav buttons — ensure they don't flex-grow and have a pointer cursor */
.variant-products .cta-prev,
.variant-products .cta-next,
.cta-lens-wrapper .cta-prev,
.cta-lens-wrapper .cta-next,
.hot-carousel-lens-container .hot-nav-prev-arrow,
.hot-carousel-lens-container .hot-nav-next-arrow {
	flex: 0 0 auto;
	appearance: none;
	cursor: pointer;
}

@media (prefers-reduced-motion: reduce) {
	.variant-products .cta-viewport-track,
	.cta-lens-wrapper .cta-viewport-track,
	.hot-carousel-lens-container .hot-carousel-viewport-window {
		scroll-behavior: auto;
	}
}

/* ==========================================================================
   Mobile carousel — overrides for viewports ≤ 767px

   Desktop uses flex-row buttons + overflow:hidden.
   Mobile needs block layout (buttons as overlays) + overflow-x:auto to
   enable scroll-snap. These two modes are mutually exclusive, so they
   live in a separate media query rather than modifying the rules above.
   ========================================================================== */

@media (max-width: 767px) {

	/* Switch from flex-row to block so buttons can be absolutely positioned.
	   Without this, buttons consume ~108px of a 375px viewport, leaving
	   only ~251px for the track — narrower than the 260px card width. */
	.variant-products,
	.cta-lens-wrapper,
	.hot-carousel-lens-container {
		display: block;
	}

	/* Track fills the full block width.
	   Switch to overflow-x:auto so scroll-snap can activate — snap only
	   works on actual scroll containers, not overflow:hidden elements.
	   Scrollbar is hidden visually on both Firefox and WebKit. */
	.variant-products .cta-viewport-track,
	.cta-lens-wrapper .cta-viewport-track,
	.hot-carousel-lens-container .hot-carousel-viewport-window {
		flex: none;
		width: 100%;
		overflow-x: auto;
		overflow-y: hidden;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
	}

	.variant-products .cta-viewport-track::-webkit-scrollbar,
	.cta-lens-wrapper .cta-viewport-track::-webkit-scrollbar,
	.hot-carousel-lens-container .hot-carousel-viewport-window::-webkit-scrollbar {
		display: none;
	}

	/* Buttons become absolute overlays on the track edges, vertically
	   centred to sit at the card image midpoint. */
	.variant-products .cta-prev,
	.variant-products .cta-next,
	.cta-lens-wrapper .cta-prev,
	.cta-lens-wrapper .cta-next,
	.hot-carousel-lens-container .hot-nav-prev-arrow,
	.hot-carousel-lens-container .hot-nav-next-arrow {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		z-index: 10;
	}

	.variant-products .cta-prev,
	.cta-lens-wrapper .cta-prev,
	.hot-carousel-lens-container .hot-nav-prev-arrow {
		left: 8px;
	}

	.variant-products .cta-next,
	.cta-lens-wrapper .cta-next,
	.hot-carousel-lens-container .hot-nav-next-arrow {
		right: 8px;
	}

	/* Cards: 85vw each.
	   On 375px: card ≈ 319px, track = 375px → 1 full card + 56px peek of
	   the next, giving a clear scroll affordance.
	   scroll-snap-align:start snaps the card's leading edge to the track's
	   left edge, correcting any imprecise JS scroll amounts automatically. */
	.variant-products .cta-viewport-track ul.products > li.product,
	.cta-lens-wrapper .cta-viewport-track ul.products > li.product,
	.hot-carousel-lens-container .hot-carousel-viewport-window ul.products > li.product {
		flex: 0 0 85vw;
		width: 85vw;
		scroll-snap-align: start;
	}
}

/* ── Astra parent override: brand buttons on ALL pages ─────────────────────
   The existing button block above uses html body.woocommerce which only fires
   on WooCommerce pages. These selectors cover homepage shortcodes, related
   products, upsells, and Astra's own button classes that Astra's CSS layer
   would otherwise colour blue.
   ───────────────────────────────────────────────────────────────────────── */
html body .woocommerce a.button,
html body .woocommerce button.button,
html body .woocommerce input.button,
html body .woocommerce ul.products li.product a.button,
html body .woocommerce ul.products li.product .add_to_cart_button,
html body .woocommerce .related ul.products li.product a.button,
html body .woocommerce .upsells ul.products li.product a.button,
html body .ast-button,
html body .ast-btn,
html body .wc-block-cart__submit-button,
html body .wc-block-checkout__submit-button,
html body .elementor-widget-woocommerce-product-add-to-cart .elementor-button {
	background-color: #0C2835 !important;
	border-color:     #0C2835 !important;
	color:            #ffffff !important;
	border-radius:    var(--wc-button-radius, 2px) !important;
	font-weight:      600 !important;
	letter-spacing:   1.5px !important;
	text-transform:   uppercase !important;
	transition:
		background-color 0.35s ease,
		border-color     0.35s ease,
		box-shadow       0.35s ease,
		transform        0.25s ease !important;
}

html body .woocommerce a.button:hover,
html body .woocommerce button.button:hover,
html body .woocommerce input.button:hover,
html body .woocommerce ul.products li.product a.button:hover,
html body .woocommerce ul.products li.product .add_to_cart_button:hover,
html body .woocommerce .related ul.products li.product a.button:hover,
html body .woocommerce .upsells ul.products li.product a.button:hover,
html body .ast-button:hover,
html body .ast-btn:hover,
html body .wc-block-cart__submit-button:hover,
html body .wc-block-checkout__submit-button:hover {
	background-color: #ffffff !important;
	border-color:     #0C2835 !important;
	color:            #0C2835 !important;
	box-shadow:       0 4px 15px rgba(0, 0, 0, 0.12) !important;
	transform:        translateY(-1px) !important;
}

/* ── [recent_products] and shortcode buttons on non-WooCommerce pages ───────
   body.woocommerce is absent on regular pages, so Block 1 above doesn't fire.
   These selectors cover shortcode output (.add_to_cart_button) anywhere.
   ─────────────────────────────────────────────────────────────────────────── */
html body .woocommerce .add_to_cart_button,
html body .woocommerce a.add_to_cart_button,
html body [class*="woocommerce"] .add_to_cart_button {
	background-color: #0C2835 !important;
	border-color:     #0C2835 !important;
	color:            #ffffff !important;
	border-radius:    var(--wc-button-radius, 2px) !important;
	font-weight:      600 !important;
	letter-spacing:   1.5px !important;
	text-transform:   uppercase !important;
	transition:
		background-color 0.35s ease,
		border-color     0.35s ease,
		box-shadow       0.35s ease,
		transform        0.25s ease !important;
}

html body .woocommerce .add_to_cart_button:hover,
html body .woocommerce a.add_to_cart_button:hover,
html body [class*="woocommerce"] .add_to_cart_button:hover,
html body .woocommerce .add_to_cart_button:focus-visible,
html body .woocommerce a.add_to_cart_button:focus-visible,
html body [class*="woocommerce"] .add_to_cart_button:focus-visible {
	background-color: #ffffff !important;
	border-color:     #0C2835 !important;
	color:            #0C2835 !important;
	box-shadow:       0 4px 15px rgba(0, 0, 0, 0.12) !important;
	transform:        translateY(-1px) !important;
}