/*
 * Bins Express theme styles. Mobile-first, no framework.
 * Contents: 1 tokens, 2 base, 3 layout, 4 header, 5 drawer, 6 buttons, 7 home, 8 products,
 *           9 pages, 10 footer, 11 motion.
 */

/* 1. Tokens ------------------------------------------------------------- */
@font-face {
	font-family: "Open Sans";
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	src: url("../fonts/open-sans-latin-var.woff2") format("woff2");
}

:root {
	--bx-green: #036928;
	--bx-green-700: #025420;
	--bx-green-900: #04321a;
	--bx-mint: #7cc68d;
	--bx-mint-100: #e6f4ea;
	--bx-mint-50: #f3faf5;
	--bx-ink: #12241a;
	--bx-muted: #4a5f53;
	--bx-line: #d6e4db;
	--bx-bg: #fbfdfb;
	--bx-white: #fff;
	--bx-focus: #0a58ca;
	--bx-radius: 18px;
	--bx-radius-sm: 12px;
	--bx-shadow: 0 1px 2px rgb(4 50 26 / 6%), 0 10px 28px rgb(4 50 26 / 8%);
	--bx-shadow-lift: 0 2px 4px rgb(4 50 26 / 8%), 0 18px 40px rgb(4 50 26 / 14%);
	--bx-font: "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--bx-wrap: 1240px;
	--bx-gutter: clamp(16px, 4vw, 32px);
}

/* 2. Base --------------------------------------------------------------- */
*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
	margin: 0;
	font: 400 1rem/1.6 var(--bx-font);
	color: var(--bx-ink);
	background: var(--bx-bg);
	-webkit-font-smoothing: antialiased;
}

img, svg { max-width: 100%; height: auto; }
img { display: block; }
a { color: var(--bx-green); text-underline-offset: 3px; }
a:hover { color: var(--bx-green-700); }
h1, h2, h3, h4 { line-height: 1.2; letter-spacing: -0.01em; }
p { margin: 0 0 1em; }

:focus-visible { outline: 3px solid var(--bx-focus); outline-offset: 2px; border-radius: 4px; }
.site-footer :focus-visible { outline-color: var(--bx-mint); }

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	margin: -1px; padding: 0; border: 0;
	overflow: hidden; clip-path: inset(50%);
	white-space: nowrap;
}
.skip-link:focus {
	position: fixed; z-index: 100; top: 8px; left: 8px;
	width: auto; height: auto; margin: 0; padding: 12px 18px;
	clip-path: none; background: var(--bx-white); color: var(--bx-green);
	font-weight: 700; border-radius: var(--bx-radius-sm); box-shadow: var(--bx-shadow);
}

/* 3. Layout ------------------------------------------------------------- */
.bx-container {
	width: 100%;
	max-width: var(--bx-wrap);
	margin-inline: auto;
	padding-inline: var(--bx-gutter);
}
.bx-main { padding-block: 24px 64px; min-height: 50vh; }

.section { padding-block: clamp(40px, 7vw, 80px); }
.section--tint { background: linear-gradient(180deg, var(--bx-mint-50), var(--bx-mint-100)); }
.section__head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
.section__title { margin: 0; font-size: clamp(1.5rem, 3.4vw, 2.1rem); font-weight: 800; }
.section__link { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.section__link:hover { text-decoration: underline; }

.placeholder-note {
	padding: 16px 20px; border: 2px dashed var(--bx-green); border-radius: var(--bx-radius-sm);
	background: var(--bx-white); color: var(--bx-green-900); font-weight: 600;
}

/* 4. Header ------------------------------------------------------------- */
.site-header {
	position: sticky; top: 0; z-index: 50;
	background: rgb(255 255 255 / 86%);
	-webkit-backdrop-filter: saturate(160%) blur(14px);
	backdrop-filter: saturate(160%) blur(14px);
	border-bottom: 1px solid var(--bx-line);
}
.topbar { background: var(--bx-green-900); color: #e6f2ea; font-size: 0.8125rem; }
.topbar__row { display: flex; gap: 20px; justify-content: flex-end; padding-block: 6px; }
.topbar__link { display: inline-flex; align-items: center; gap: 6px; color: inherit; text-decoration: none; }
.topbar__link:hover { color: var(--bx-white); text-decoration: underline; }
.topbar__link:last-child { display: none; }

.site-header__row {
	display: grid; align-items: center; gap: 10px 12px;
	grid-template-columns: auto 1fr auto;
	grid-template-areas: "toggle logo actions" "search search search";
	padding-block: 10px;
}
.nav-toggle { grid-area: toggle; }
.site-logo { grid-area: logo; justify-self: start; display: block; line-height: 0; }
.site-logo .site-logo__img { height: 58px; width: auto; max-width: none; }
.site-header__search { grid-area: search; }
.site-actions { grid-area: actions; display: flex; gap: 4px; }

.nav-toggle {
	display: none; align-items: center; gap: 8px; padding: 10px 14px;
	font: 600 0.9375rem var(--bx-font); color: var(--bx-ink);
	background: var(--bx-mint-100); border: 0; border-radius: 999px; cursor: pointer;
}
.js .nav-toggle { display: inline-flex; }
.nav-toggle:hover { background: var(--bx-mint); }
.nav-toggle__label { display: none; }

.action {
	position: relative; display: inline-flex; align-items: center; gap: 8px; padding: 10px 12px;
	color: var(--bx-ink); font-weight: 600; font-size: 0.9375rem; text-decoration: none; border-radius: 999px;
}
.action:hover { background: var(--bx-mint-100); color: var(--bx-green-900); }
.action__label { display: none; }
.basket-count {
	position: absolute; top: 2px; right: 0; min-width: 20px; height: 20px; padding-inline: 5px;
	display: grid; place-items: center; font-size: 0.75rem; font-weight: 700; line-height: 1;
	color: var(--bx-white); background: var(--bx-green); border-radius: 999px;
}
.basket-count.is-empty { display: none; }

.bx-search { display: flex; align-items: center; background: var(--bx-white); border: 1.5px solid var(--bx-line); border-radius: 999px; box-shadow: inset 0 1px 2px rgb(4 50 26 / 4%); transition: border-color 0.15s, box-shadow 0.15s; }
.bx-search:focus-within { border-color: var(--bx-green); box-shadow: 0 0 0 4px rgb(3 105 40 / 14%); }
.bx-search__input { flex: 1; min-width: 0; padding: 12px 18px; font: inherit; color: inherit; background: transparent; border: 0; }
.bx-search__input:focus { outline: none; }
.bx-search__btn { display: grid; place-items: center; width: 44px; height: 44px; margin: 3px; color: var(--bx-white); background: var(--bx-green); border: 0; border-radius: 50%; cursor: pointer; }
.bx-search__btn:hover { background: var(--bx-green-700); }

.category-bar { border-top: 1px solid var(--bx-line); background: rgb(255 255 255 / 60%); }
.category-bar .bx-container { padding-inline: 0; }
.category-bar__list {
	display: flex; gap: 8px; margin: 0; padding: 10px var(--bx-gutter); list-style: none;
	overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none;
}
.category-bar__list::-webkit-scrollbar { display: none; }
.category-bar__list li { scroll-snap-align: start; flex: none; }
.category-bar__list a {
	display: block; padding: 7px 16px; font-size: 0.9375rem; font-weight: 600; color: var(--bx-ink);
	text-decoration: none; background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: 999px; transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.category-bar__list a:hover { background: var(--bx-mint-100); border-color: var(--bx-mint); }
.category-bar__list .current-menu-item > a,
.category-bar__list .current-product_cat-ancestor > a { color: var(--bx-white); background: var(--bx-green); border-color: var(--bx-green); }

@media (min-width: 640px) {
	.nav-toggle__label, .action__label { display: inline; }
	.topbar__link:last-child { display: inline-flex; }
}
@media (min-width: 900px) {
	.site-header__row {
		grid-template-columns: auto auto minmax(0, 1fr) auto;
		grid-template-areas: "toggle logo search actions";
		gap: 20px;
	}
	.site-logo .site-logo__img { height: 74px; }
	.category-bar .bx-container { padding-inline: var(--bx-gutter); }
	.category-bar__list { padding-inline: 0; flex-wrap: wrap; }
}

/* 5. Drawer ------------------------------------------------------------- */
.drawer-backdrop { position: fixed; inset: 0; z-index: 90; background: rgb(4 50 26 / 55%); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.drawer {
	position: fixed; z-index: 100; top: 0; bottom: 0; left: 0; width: min(90vw, 400px);
	display: flex; flex-direction: column; background: var(--bx-white); box-shadow: var(--bx-shadow-lift);
}
.drawer[hidden], .drawer-backdrop[hidden] { display: none; }
.drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid var(--bx-line); }
.drawer__title { font-size: 1.125rem; font-weight: 800; }
.drawer__close { display: grid; place-items: center; width: 44px; height: 44px; color: var(--bx-ink); background: var(--bx-mint-100); border: 0; border-radius: 50%; cursor: pointer; }
.drawer__body { flex: 1; overflow-y: auto; padding: 12px 12px 32px; }
.drawer-open { overflow: hidden; }

.menu-tree { margin: 0; padding: 0; list-style: none; }
.menu-tree a { display: block; padding: 10px 12px; color: var(--bx-ink); font-weight: 600; text-decoration: none; border-radius: var(--bx-radius-sm); }
.menu-tree a:hover { background: var(--bx-mint-100); color: var(--bx-green-900); }
.menu-tree--sub { margin-left: 14px; padding-left: 8px; border-left: 2px solid var(--bx-mint-100); }
.menu-tree--sub a { font-weight: 400; padding-block: 7px; }

/* 6. Buttons ------------------------------------------------------------ */
.btn,
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit, .woocommerce a.button.alt, .woocommerce button.button.alt {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	padding: 12px 24px; font: 700 0.9375rem/1.2 var(--bx-font); color: var(--bx-white);
	text-decoration: none; background: var(--bx-green); border: 0; border-radius: 999px; cursor: pointer;
	transition: background 0.15s, transform 0.15s, box-shadow 0.15s;
}
.btn:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover { color: var(--bx-white); background: var(--bx-green-700); }
.btn--light { color: var(--bx-green-900); background: linear-gradient(135deg, #b4e5c0, var(--bx-mint)); box-shadow: 0 8px 24px rgb(124 198 141 / 35%); }
.btn--light:hover { color: var(--bx-green-900); background: linear-gradient(135deg, #c4ecce, #8fd09f); }

/* 7. Home --------------------------------------------------------------- */
.hero {
	position: relative; overflow: hidden; color: var(--bx-ink, #17231b);
	padding-block: clamp(32px, 6vw, 64px) clamp(28px, 4vw, 44px);
	background: var(--bx-mint-50);
}
.hero__grid { display: grid; gap: 28px; align-items: center; }
.hero__title { margin: 0 0 16px; font-size: clamp(2.1rem, 5.6vw, 3.6rem); font-weight: 800; line-height: 1.05; letter-spacing: -0.025em; color: var(--bx-green-900); }
.hero__accent { color: var(--bx-green); }
.hero__sub { max-width: 30em; margin: 0 0 28px; font-size: clamp(1.0625rem, 2.2vw, 1.25rem); }
.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 0; }
.btn--primary { color: var(--bx-white); background: var(--bx-green); }
.btn--primary:hover { color: var(--bx-white); background: var(--bx-green-700); }
.btn--outline { color: var(--bx-green); background: transparent; box-shadow: inset 0 0 0 2px var(--bx-green); }
.btn--outline:hover { color: var(--bx-white); background: var(--bx-green); }
.hero__panel { padding: 24px; background: var(--bx-white); border: 1px solid var(--bx-mint-100); border-radius: 24px; }
.hero__panel-title { margin: 0 0 14px; font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--bx-green-700); }
.hero__chips { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.hero__chips a {
	display: block; padding: 9px 16px; color: var(--bx-green-900); font-weight: 600; text-decoration: none;
	background: var(--bx-white); border: 1px solid #cfe3d5; border-radius: 999px; transition: background 0.15s, color 0.15s;
}
.hero__chips a:hover { color: var(--bx-white); background: var(--bx-green); border-color: var(--bx-green); }
.hero__media { overflow: hidden; border-radius: 24px; box-shadow: 0 20px 50px rgb(4 50 26 / 15%); }
.hero__media img { display: block; width: 100%; height: auto; }
@media (min-width: 900px) { .hero__grid { grid-template-columns: 0.8fr 1.2fr; gap: 40px; } }

.trust { position: relative; z-index: 2; margin-top: 0; padding-block: 0 clamp(20px, 3vw, 28px); background: var(--bx-mint-50); }
.trust__list { display: grid; gap: 10px; margin-block: 0; padding-block: 18px 0; list-style: none; }
.trust__item { display: flex; gap: 12px; align-items: center; }
.trust__icon { display: grid; flex: none; place-items: center; width: 28px; height: 28px; color: var(--bx-green); }
.trust__icon svg { width: 24px; height: 24px; }
.trust__title { display: block; font-weight: 700; line-height: 1.3; color: var(--bx-green-900); }
.trust__text { display: block; font-size: 0.9375rem; color: var(--bx-muted); }
@media (min-width: 760px) { .trust__list { grid-template-columns: repeat(3, 1fr); gap: 24px; } .trust__item { align-items: flex-start; } }

.cat-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin: 0; padding: 0; list-style: none; }
.cat-card {
	position: relative; display: flex; flex-direction: column; height: 100%; overflow: hidden; color: var(--bx-ink); text-decoration: none;
	background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: var(--bx-radius); box-shadow: var(--bx-shadow);
	transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
}
.cat-card:hover { color: var(--bx-ink); border-color: var(--bx-mint); box-shadow: var(--bx-shadow-lift); transform: translateY(-3px); }
.cat-card__media { display: grid; place-items: center; aspect-ratio: 4 / 3; padding: 14px; background: radial-gradient(80% 80% at 50% 30%, var(--bx-white), var(--bx-mint-50)); }
.cat-card .cat-card__img { width: 100%; height: 100%; object-fit: contain; }
.cat-card__body { display: block; padding: 14px 16px 18px; }
.cat-card__name { display: block; font-size: 1.0625rem; font-weight: 700; }
.cat-card__count { display: block; font-size: 0.875rem; color: var(--bx-muted); }
.cat-card__go { position: absolute; right: 12px; bottom: 14px; display: grid; place-items: center; width: 34px; height: 34px; color: var(--bx-green); background: var(--bx-mint-100); border-radius: 50%; transition: background 0.2s, color 0.2s; }
.cat-card:hover .cat-card__go { color: var(--bx-white); background: var(--bx-green); }
@media (min-width: 700px) {
	.cat-grid { grid-template-columns: repeat(3, 1fr); gap: 20px; }
	.cat-card__media { aspect-ratio: 16 / 11; }
}

.about__card {
	max-width: 880px; margin-inline: auto; padding: clamp(24px, 5vw, 48px); text-align: center;
	background: linear-gradient(160deg, var(--bx-white), var(--bx-mint-50)); border: 1px solid var(--bx-line); border-radius: 28px; box-shadow: var(--bx-shadow);
}
.about__card p { font-size: 1.0625rem; color: var(--bx-muted); }
.about__card .section__title { margin-bottom: 14px; }

.review-grid { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }
.review-card { display: flex; flex-direction: column; gap: 10px; padding: 24px; background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: var(--bx-radius); box-shadow: var(--bx-shadow); }
.review-card__icon { display: grid; place-items: center; width: 48px; height: 48px; color: var(--bx-green); background: var(--bx-mint-100); border-radius: 14px; }
.review-card__quote { margin: 0; }
.review-card__quote p { margin: 0; font-size: 1.0625rem; line-height: 1.6; }
.review-card__name { margin: auto 0 0; padding-top: 6px; font-weight: 700; color: var(--bx-green-900); }
@media (min-width: 760px) { .review-grid { grid-template-columns: repeat(3, 1fr); gap: 20px; } }

/* 8. Products (WooCommerce loops) -------------------------------------- */
.woocommerce ul.products,
.woocommerce-page ul.products { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin: 0 0 32px; padding: 0; list-style: none; }
.woocommerce ul.products::before, .woocommerce ul.products::after { display: none; }
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.woocommerce ul.products[class*="columns-"] li.product {
	float: none; width: auto; margin: 0; display: flex; flex-direction: column; padding: 12px 12px 16px; overflow: hidden;
	background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: var(--bx-radius); box-shadow: var(--bx-shadow);
	transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
}
.woocommerce ul.products li.product:hover { border-color: var(--bx-mint); box-shadow: var(--bx-shadow-lift); transform: translateY(-3px); }
.woocommerce ul.products li.product a { text-decoration: none; }
.woocommerce ul.products li.product a img { width: 100%; height: auto; max-height: 380px; aspect-ratio: 1; margin: 0 0 12px; overflow: hidden; object-fit: contain; border-radius: var(--bx-radius-sm); background: var(--bx-white); }
.woocommerce ul.products li.product .woocommerce-loop-product__title { padding: 0; font-size: 0.9375rem; font-weight: 700; line-height: 1.35; color: var(--bx-ink); }
.woocommerce ul.products li.product .price { display: block; margin: 6px 0 12px; font-size: 1.0625rem; font-weight: 800; color: var(--bx-green); }
.woocommerce ul.products li.product .price del { color: var(--bx-muted); font-weight: 400; }
.woocommerce ul.products li.product .price ins { text-decoration: none; }
.woocommerce ul.products li.product .button { width: 100%; margin-top: auto; }
.woocommerce span.onsale {
	top: 10px; left: 10px; right: auto; min-width: 0; min-height: 0; margin: 0; padding: 5px 12px;
	font-size: 0.75rem; font-weight: 800; line-height: 1.2; color: var(--bx-white); background: var(--bx-green); border-radius: 999px;
}
.woocommerce-price-suffix { font-size: 12px; font-weight: 400; color: var(--bx-muted); }
.woocommerce .widget_price_filter .ui-slider .ui-slider-range,
.woocommerce .widget_price_filter .ui-slider .ui-slider-handle { background-color: var(--bx-green); }

.woocommerce-breadcrumb { margin: 0 0 20px; font-size: 0.875rem; color: var(--bx-muted); }
.woocommerce-breadcrumb a { color: var(--bx-muted); }
.woocommerce-breadcrumb a:hover { color: var(--bx-green); }
.crumb-sep { margin-inline: 8px; opacity: 0.6; }

@media (min-width: 700px) {
	.woocommerce ul.products, .woocommerce-page ul.products { grid-template-columns: repeat(3, 1fr); gap: 20px; }
}
@media (min-width: 1020px) {
	.woocommerce ul.products, .woocommerce-page ul.products { grid-template-columns: repeat(4, 1fr); }
}

/* 8b. Shop archive: header, filters, toolbar, badges, pagination ------- */
.woocommerce-products-header { margin-bottom: 20px; }
.woocommerce-products-header .page-title { margin: 0 0 8px; font-size: clamp(1.75rem, 4.5vw, 2.6rem); font-weight: 800; }
.woocommerce-products-header .term-description { max-width: 70ch; color: var(--bx-muted); }
.woocommerce-products-header .term-description p:last-child { margin-bottom: 0; }

.filters-toggle { display: none; align-items: center; gap: 8px; min-height: 44px; padding: 0 18px; font: 700 0.9375rem var(--bx-font); color: var(--bx-green-900); background: var(--bx-mint-100); border: 1px solid var(--bx-mint); border-radius: 999px; cursor: pointer; }
.js .filters-toggle { display: inline-flex; }
.filters-toggle:hover { background: var(--bx-mint); }
.filters-toggle[aria-expanded="true"] { color: var(--bx-white); background: var(--bx-green); border-color: var(--bx-green); }
.filters__count { display: grid; place-items: center; min-width: 22px; height: 22px; padding-inline: 6px; font-size: 0.75rem; color: var(--bx-white); background: var(--bx-green); border-radius: 999px; }
.filters-toggle[aria-expanded="true"] .filters__count { color: var(--bx-green-900); background: var(--bx-white); }

.filters { margin-bottom: 16px; background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: var(--bx-radius); box-shadow: var(--bx-shadow); }
.js .filters:not(.is-open) { display: none; }
.filters__body { display: grid; gap: 18px; padding: 18px; }
.filter-group__title { margin: 0 0 8px; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--bx-muted); }
.filter-list { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }

.pill, .chip {
	display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 6px 14px; font-size: 0.875rem; font-weight: 600;
	color: var(--bx-ink); text-decoration: none; background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: 999px; transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.pill:hover, .chip:hover { color: var(--bx-green-900); background: var(--bx-mint-100); border-color: var(--bx-mint); }
.pill.is-active { color: var(--bx-white); background: var(--bx-green); border-color: var(--bx-green); }
.chip { min-height: 32px; padding: 3px 12px; background: var(--bx-mint-100); border-color: var(--bx-mint-100); }
.chip--clear { background: transparent; border-color: var(--bx-line); color: var(--bx-muted); }

.swatch { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; text-decoration: none; }
.swatch__dot { display: block; width: 26px; height: 26px; background: var(--sw, #ccc); border-radius: 50%; box-shadow: inset 0 0 0 1px rgb(0 0 0 / 22%); transition: transform 0.15s; }
.swatch__dot--none { background: transparent; box-shadow: none; border: 2px dashed var(--bx-muted); }
.swatch:hover .swatch__dot { transform: scale(1.12); }
.swatch.is-active .swatch__dot { box-shadow: inset 0 0 0 1px rgb(0 0 0 / 22%), 0 0 0 3px var(--bx-white), 0 0 0 5px var(--bx-green); }
.filter-group--swatches .filter-list { gap: 0; }

.filters__active { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-bottom: 14px; }
.filters__active-label { font-size: 0.875rem; font-weight: 700; color: var(--bx-muted); }
.filter-more { font-weight: 600; font-size: 0.875rem; }
.js .filter-group--pills:not(.is-expanded) .is-extra { display: none; }
.filter-group__more { margin: 8px 0 0; }

@media (min-width: 900px) {
	.filters__body { grid-template-columns: 1.5fr 1fr 1fr; align-items: start; }
	.filter-group--pills { grid-column: 1 / -1; }
}
@media (min-width: 1100px) {
	.filter-group--pills { grid-column: auto; }
}

.shop-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-bottom: 14px; }
.shop-toolbar .woocommerce-result-count { margin-right: auto; }
@media (max-width: 599px) { .shop-toolbar .woocommerce-result-count { order: 3; flex: 1 0 100%; margin-right: 0; } .shop-toolbar .filters-toggle { flex: 0 0 auto; } .shop-toolbar .woocommerce-ordering { flex: 1 1 0; min-width: 0; } .shop-toolbar .woocommerce-ordering select { width: 100%; padding-inline: 12px 32px; font-size: 0.875rem; } }
.woocommerce .woocommerce-result-count, .woocommerce-page .woocommerce-result-count { float: none; margin: 0; font-size: 0.9375rem; color: var(--bx-muted); }
.woocommerce .woocommerce-ordering, .woocommerce-page .woocommerce-ordering { float: none; margin: 0; }
.woocommerce .woocommerce-ordering select {
	min-height: 44px; padding: 8px 40px 8px 16px; font: 600 0.9375rem var(--bx-font); color: var(--bx-ink); background-color: var(--bx-white); border: 1px solid var(--bx-line); border-radius: 999px; cursor: pointer;
}

.woocommerce ul.products li.product { position: relative; }
.badge {
	display: inline-flex; align-items: center; gap: 4px; margin: 6px 0 0; padding: 3px 10px 3px 8px;
	font-size: 0.6875rem; font-weight: 800; line-height: 1.2; letter-spacing: 0.02em; color: var(--bx-green-900); background: var(--bx-mint-100); border: 1px solid var(--bx-mint); border-radius: 999px;
}
.badge--made { color: var(--bx-white); background: var(--bx-green); border-color: var(--bx-green); }
.woocommerce ul.products li.product span.onsale { top: 22px; right: auto; left: 22px; margin: 0; }

.woocommerce nav.woocommerce-pagination { margin: 8px 0 0; }
.woocommerce nav.woocommerce-pagination ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0; padding: 0; border: 0; }
.woocommerce nav.woocommerce-pagination ul li { float: none; margin: 0; overflow: visible; border: 0; }
.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span {
	display: grid; place-items: center; min-width: 44px; height: 44px; padding: 0 14px; font-weight: 600; color: var(--bx-ink); text-decoration: none; background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: 999px;
}
.woocommerce nav.woocommerce-pagination ul li a:hover, .woocommerce nav.woocommerce-pagination ul li a:focus { color: var(--bx-green-900); background: var(--bx-mint-100); border-color: var(--bx-mint); }
.woocommerce nav.woocommerce-pagination ul li span.current { color: var(--bx-white); background: var(--bx-green); border-color: var(--bx-green); }

.woocommerce-info, .woocommerce-message, .woocommerce-error { padding: 16px 20px; border-radius: var(--bx-radius-sm); }

/* 8c. Forms and notices (shared by product, basket, checkout, account) -- */
.woocommerce form .form-row { margin: 0 0 16px; padding: 0; }
.woocommerce form .form-row label { display: block; margin: 0 0 6px; font-size: 0.9375rem; font-weight: 600; line-height: 1.4; }
.woocommerce form .form-row .required, .woocommerce form .form-row abbr.required { color: #b42318; text-decoration: none; border: 0; }
.woocommerce form .form-row .optional { font-weight: 400; color: var(--bx-muted); }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-cart table.cart td.actions .coupon .input-text,
.woocommerce .quantity .qty {
	width: 100%; min-height: 48px; padding: 10px 14px; font: 400 1rem/1.4 var(--bx-font); color: var(--bx-ink);
	background: var(--bx-white); border: 1.5px solid #b9cdbf; border-radius: var(--bx-radius-sm); box-shadow: none;
	transition: border-color 0.15s, box-shadow 0.15s;
}
.woocommerce form .form-row textarea { min-height: 110px; }
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus,
.woocommerce .quantity .qty:focus,
.select2-container--open .select2-selection { border-color: var(--bx-green); outline: none; box-shadow: 0 0 0 4px rgb(3 105 40 / 16%); }
.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid select,
.woocommerce form .form-row.woocommerce-invalid .select2-selection { border-color: #b42318; }
.woocommerce form .form-row.woocommerce-validated input.input-text { border-color: #b9cdbf; }
.woocommerce form .form-row.woocommerce-invalid label { color: #8a1c13; }
.woocommerce form .form-row .description, .woocommerce form .form-row small { display: block; margin-top: 4px; font-size: 0.8125rem; color: var(--bx-muted); }
.woocommerce-input-wrapper { display: block; }
.woocommerce form .show-password-input { top: 0.8em; }

/* Country and county pickers (selectWoo) */
.select2-container .select2-selection--single { display: flex; align-items: center; height: 48px; background: var(--bx-white); border: 1.5px solid #b9cdbf; border-radius: var(--bx-radius-sm); }
.select2-container--default .select2-selection--single .select2-selection__rendered { flex: 1; padding: 0 14px; font: 400 1rem var(--bx-font); line-height: 1.4; color: var(--bx-ink); }
.select2-container--default .select2-selection--single .select2-selection__arrow { top: 0; height: 100%; right: 8px; }
.select2-dropdown { border: 1.5px solid var(--bx-green); border-radius: var(--bx-radius-sm); overflow: hidden; }
.select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option--highlighted[data-selected] { background: var(--bx-green); }
.select2-search--dropdown .select2-search__field { min-height: 40px; border-radius: 8px; }

/* Notices keep their role="alert" / status semantics; colour is never the only signal */
.woocommerce-message, .woocommerce-info, .woocommerce-error {
	display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin: 0 0 20px; padding: 14px 18px 14px 20px; list-style: none;
	font-weight: 600; color: var(--bx-ink); background: var(--bx-mint-50); border: 1px solid var(--bx-line); border-left: 6px solid var(--bx-green); border-radius: var(--bx-radius-sm);
}
.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before { position: static; flex: none; color: var(--bx-green); }
.woocommerce-info { background: #eef4fb; border-color: #cddcef; border-left-color: #1e5fbf; }
.woocommerce-info::before { color: #1e5fbf; }
.woocommerce-error { display: block; background: #fdeeed; border-color: #f3c7c3; border-left-color: #b42318; color: #5c140e; }
.woocommerce-error::before { display: none; }
.woocommerce-error li { margin: 0; padding: 4px 0; }
.woocommerce-error a { color: #8a1c13; font-weight: 700; }
.woocommerce-message .button, .woocommerce-info .button { order: 2; margin-left: auto; float: none; }
.woocommerce-NoticeGroup { margin-bottom: 8px; }
.woocommerce-store-notice, p.demo_store { color: var(--bx-white); background: var(--bx-green-900); }

/* 8d. Single product ---------------------------------------------------- */
.woocommerce div.product { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; }
.woocommerce div.product > * { grid-column: 1 / -1; min-width: 0; }
.woocommerce div.product div.images, .woocommerce div.product div.summary { float: none; width: auto; margin: 0; }
.woocommerce div.product span.onsale { top: 14px; left: 14px; right: auto; margin: 0; z-index: 3; }
.woocommerce div.product div.images { position: relative; }
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper { margin: 0; }
.woocommerce div.product div.images .woocommerce-product-gallery__image { background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: var(--bx-radius); overflow: hidden; box-shadow: var(--bx-shadow); }
.woocommerce div.product div.images img { width: 100%; height: auto; border-radius: 0; }
.woocommerce div.product div.images .woocommerce-product-gallery__image img { max-height: 280px; object-fit: contain; }
.woocommerce div.product div.images .woocommerce-product-gallery__trigger { top: 12px; right: 12px; width: 44px; height: 44px; background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: 50%; box-shadow: var(--bx-shadow); }
.woocommerce div.product div.images .flex-control-thumbs { display: flex; gap: 8px; margin: 10px 0 0; padding: 0 0 4px; overflow-x: auto; list-style: none; scrollbar-width: thin; }
.woocommerce div.product div.images .flex-control-thumbs li { flex: 0 0 62px; float: none; width: 62px; margin: 0; }
.woocommerce div.product div.images .flex-control-thumbs img { padding: 4px; background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: var(--bx-radius-sm); opacity: 0.75; cursor: pointer; transition: opacity 0.15s, border-color 0.15s; }
.woocommerce div.product div.images .flex-control-thumbs img:hover { opacity: 1; }
.woocommerce div.product div.images .flex-control-thumbs img.flex-active { opacity: 1; border-color: var(--bx-green); }

.woocommerce div.product .product_title { margin: 0 0 6px; font-size: clamp(1.45rem, 3.4vw, 2rem); font-weight: 800; line-height: 1.15; }
.woocommerce div.product p.price, .woocommerce div.product span.price { margin: 4px 0 16px; font-size: clamp(1.6rem, 4vw, 2rem); font-weight: 800; color: var(--bx-green); }
.woocommerce div.product p.price del, .woocommerce div.product span.price del { font-size: 1.1rem; font-weight: 400; color: var(--bx-muted); }
.woocommerce div.product p.price ins, .woocommerce div.product span.price ins { text-decoration: none; }
.woocommerce div.product .woocommerce-product-details__short-description { margin: 18px 0 8px; padding-top: 16px; color: var(--bx-muted); border-top: 1px solid var(--bx-line); }
/* Once a variation is chosen its own price shows above the button, so the range at the top steps aside. */
.woocommerce div.product div.summary:has(.single_variation .price) > p.price { display: none; }
.bulky-notice { display: flex; align-items: flex-start; gap: 10px; margin: 0 0 16px; padding: 12px 16px; font-weight: 600; color: #5b3a00; background: #fff6e0; border: 1px solid #f0d58a; border-radius: var(--bx-radius-sm); }
.bulky-notice .icon { flex: none; margin-top: 2px; }

.woocommerce div.product form.cart { margin: 0 0 20px; }
.woocommerce div.product form.cart .variations { width: 100%; margin: 0 0 16px; border: 0; }
.woocommerce div.product form.cart .variations tbody, .woocommerce div.product form.cart .variations tr, .woocommerce div.product form.cart .variations th, .woocommerce div.product form.cart .variations td { display: block; padding: 0; border: 0; }
.woocommerce div.product form.cart .variations tr { margin-bottom: 14px; }
.woocommerce div.product form.cart .variations th.label, .woocommerce div.product form.cart .variations label { margin-bottom: 6px; text-align: left; font-size: 0.9375rem; font-weight: 700; color: var(--bx-ink); }
.woocommerce div.product form.cart .variations select {
	width: 100%; min-height: 52px; padding: 10px 44px 10px 16px; font: 600 1rem var(--bx-font); color: var(--bx-ink); background-color: var(--bx-white);
	border: 1.5px solid #b9cdbf; border-radius: var(--bx-radius-sm); cursor: pointer;
}
.woocommerce div.product form.cart .variations select:focus { border-color: var(--bx-green); outline: none; box-shadow: 0 0 0 4px rgb(3 105 40 / 16%); }
.woocommerce div.product form.cart .reset_variations { display: inline-block; margin-top: 8px; font-size: 0.875rem; font-weight: 600; }
.woocommerce div.product form.cart .woocommerce-variation-price { margin-bottom: 12px; }
.woocommerce div.product form.cart .woocommerce-variation-description { color: var(--bx-muted); }
.woocommerce div.product form.cart .woocommerce-variation-availability { font-weight: 600; }
.woocommerce div.product form.cart .single_add_to_cart_button, .woocommerce div.product form.cart .quantity { margin: 0; }
.woocommerce div.product form.cart div.quantity { width: 96px; }
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart, .woocommerce div.product form.cart:not(.variations_form) { display: flex; flex-wrap: wrap; gap: 12px; align-items: stretch; }
.woocommerce div.product form.cart .single_add_to_cart_button { flex: 1 1 200px; min-height: 52px; font-size: 1.0625rem; }
.woocommerce div.product form.cart .single_add_to_cart_button.disabled, .woocommerce div.product form.cart .single_add_to_cart_button:disabled { opacity: 0.45; cursor: not-allowed; }
.woocommerce .quantity .qty { min-height: 52px; padding-inline: 8px; text-align: center; font-weight: 700; }
.woocommerce div.product .product_meta { display: grid; gap: 4px; padding-top: 16px; font-size: 0.875rem; color: var(--bx-muted); border-top: 1px solid var(--bx-line); }
.woocommerce div.product .product_meta > span { display: block; }
.woocommerce div.product .product_meta a { color: var(--bx-green); }

.product-sections { display: grid; gap: 10px; }
.product-section { background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: 14px; }
.product-section > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; font-size: 1.0625rem; font-weight: 800; list-style: none; cursor: pointer; border-radius: 14px; }
.product-section > summary::-webkit-details-marker { display: none; }
.product-section > summary::after { content: "+"; font-size: 1.5rem; font-weight: 400; line-height: 1; color: var(--bx-green); }
.product-section[open] > summary::after { content: "\2212"; }
.product-section > summary:hover { background: var(--bx-mint-50); }
.product-section__body { padding: 0 18px 18px; }
.product-section__body > :last-child { margin-bottom: 0; }
.product-section__body ul { padding-left: 1.2em; }
.woocommerce table.shop_attributes { width: 100%; border: 0; border-collapse: collapse; }
.woocommerce table.shop_attributes th, .woocommerce table.shop_attributes td { padding: 10px 12px; font-style: normal; border: 0; border-bottom: 1px solid var(--bx-line); background: transparent; }
.woocommerce table.shop_attributes th { width: 32%; text-align: left; color: var(--bx-muted); }
.woocommerce table.shop_attributes p { margin: 0; padding: 0; }
.woocommerce div.product .related > h2, .woocommerce div.product .up-sells > h2 { margin: 12px 0 18px; font-size: clamp(1.4rem, 3vw, 1.9rem); font-weight: 800; }

@media (min-width: 900px) {
	.woocommerce div.product { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); column-gap: 40px; align-items: start; }
	.woocommerce div.product div.images .woocommerce-product-gallery__image img { max-height: 460px; }
	.woocommerce div.product div.woocommerce-product-gallery { margin-top: 0; }
	.woocommerce div.product div.woocommerce-product-gallery { grid-column: 1; grid-row: 1 / span 2; align-self: start; }
	.woocommerce div.product div.summary { grid-column: 2; grid-row: 1; }
}

/* 8e. Basket ------------------------------------------------------------ */
.woocommerce-cart .bx-prose, .woocommerce-checkout .bx-prose, .woocommerce-account .bx-prose { max-width: none; }
.woocommerce-cart .woocommerce { display: grid; gap: 24px; align-items: start; }
.woocommerce-cart .woocommerce > .woocommerce-notices-wrapper, .woocommerce-cart .woocommerce > .woocommerce-message, .woocommerce-cart .woocommerce > .woocommerce-error { grid-column: 1 / -1; }
.woocommerce-cart table.shop_table { margin: 0; border: 0; border-collapse: separate; border-spacing: 0 12px; background: transparent; }
.woocommerce-cart table.shop_table th { padding: 6px 14px; font-size: 0.8125rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--bx-muted); background: transparent; border: 0; }
.woocommerce-cart table.cart td { padding: 14px; vertical-align: middle; background: var(--bx-white); border: 0; border-block: 1px solid var(--bx-line); }
.woocommerce-cart table.cart td:first-child { border-left: 1px solid var(--bx-line); border-radius: var(--bx-radius) 0 0 var(--bx-radius); }
.woocommerce-cart table.cart td:last-child { border-right: 1px solid var(--bx-line); border-radius: 0 var(--bx-radius) var(--bx-radius) 0; }
.woocommerce-cart table.cart td.actions { padding: 0; background: transparent; border: 0; }
.woocommerce-cart table.cart td.product-remove { width: 44px; padding-inline: 8px; }
.woocommerce a.remove { display: grid; place-items: center; width: 32px; height: 32px; margin: 0; font-size: 1.25rem; line-height: 1; color: #8a1c13 !important; background: #fdeeed; border-radius: 50%; }
.woocommerce a.remove:hover { color: var(--bx-white) !important; background: #b42318; }
.woocommerce-cart table.cart img { width: 72px; height: auto; border-radius: var(--bx-radius-sm); }
.woocommerce-cart table.cart td.product-name a { font-weight: 700; color: var(--bx-ink); text-decoration: none; }
.woocommerce-cart table.cart td.product-name a:hover { color: var(--bx-green); }
.woocommerce-cart table.cart td.product-name dl.variation { margin: 4px 0 0; font-size: 0.875rem; color: var(--bx-muted); }
.woocommerce-cart table.cart td.product-name dl.variation dt, .woocommerce-cart table.cart td.product-name dl.variation dd, .woocommerce-cart table.cart td.product-name dl.variation p { display: inline; margin: 0; }
.woocommerce-cart table.cart td.product-subtotal { font-weight: 800; color: var(--bx-green); }
.woocommerce-cart table.cart .quantity { width: 84px; }
.woocommerce-cart table.cart .quantity .qty { min-height: 44px; }
.woocommerce-cart table.cart td.actions .coupon { display: flex; flex-wrap: wrap; gap: 10px; float: none; padding: 6px 0 0; }
.woocommerce-cart table.cart td.actions .coupon .input-text { flex: 1 1 180px; width: auto; margin: 0; }
.woocommerce-cart table.cart td.actions > .button { float: none; margin-top: 12px; }
.woocommerce button.button:disabled, .woocommerce button.button[disabled] { opacity: 0.5; cursor: not-allowed; }
.woocommerce-cart .cart-collaterals { display: flex; flex-direction: column; gap: 24px; width: 100%; }
.woocommerce-cart .cart-collaterals .cart_totals { order: -1; }
.woocommerce-cart .cart-collaterals .cross-sells { float: none; width: 100%; margin: 0; }
.woocommerce-cart .cart-collaterals .cross-sells > h2 { margin: 0 0 12px; font-size: 1.125rem; font-weight: 800; }
.woocommerce-cart .cart-collaterals .cross-sells ul.products { grid-template-columns: repeat(2, 1fr); gap: 10px; }
.woocommerce-cart .cart-collaterals .cross-sells ul.products li.product { padding: 8px 8px 12px; }
.woocommerce-cart .cart-collaterals .cross-sells ul.products li.product .woocommerce-loop-product__title { font-size: 0.8125rem; }
.woocommerce-cart .cart-collaterals .cross-sells ul.products li.product .price { font-size: 0.9375rem; }
.woocommerce-cart .cart-collaterals .cross-sells ul.products li.product .button { padding: 10px 12px; font-size: 0.8125rem; }
.woocommerce-cart .cart-collaterals .cart_totals { float: none; width: 100%; padding: 22px; background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: var(--bx-radius); box-shadow: var(--bx-shadow); }
.woocommerce-cart .cart_totals h2 { margin: 0 0 12px; font-size: 1.25rem; font-weight: 800; }
.woocommerce-cart .cart_totals table.shop_table { border-spacing: 0; }
.woocommerce-cart .cart_totals table.shop_table th, .woocommerce-cart .cart_totals table.shop_table td { padding: 10px 0; font-size: 0.9375rem; text-transform: none; letter-spacing: 0; color: var(--bx-ink); background: transparent; border: 0; border-bottom: 1px solid var(--bx-line); }
.woocommerce-cart .cart_totals .order-total th, .woocommerce-cart .cart_totals .order-total td { font-size: 1.125rem; font-weight: 800; border-bottom: 0; }
.woocommerce ul#shipping_method { margin: 0; padding: 0; list-style: none; text-align: left; }
.woocommerce ul#shipping_method li { display: flex; align-items: flex-start; gap: 10px; margin: 0 0 8px; padding: 0; }
.woocommerce ul#shipping_method li label { display: inline; margin: 0; font-weight: 600; cursor: pointer; }
.woocommerce ul#shipping_method li input { flex: none; width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--bx-green); }
.woocommerce .woocommerce-shipping-destination, .woocommerce-shipping-calculator { margin: 8px 0 0; font-size: 0.875rem; color: var(--bx-muted); text-align: left; }
.woocommerce-cart .wc-proceed-to-checkout { padding: 12px 0 0; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button { display: flex; width: 100%; margin: 0; padding: 16px 24px; font-size: 1.0625rem; }
.woocommerce-cart .cart-empty { padding: 40px 24px; text-align: center; background: var(--bx-white); border: 1px dashed var(--bx-line); border-radius: var(--bx-radius); }
.woocommerce-cart .return-to-shop { text-align: center; }
@media (min-width: 900px) { .woocommerce-cart .woocommerce { grid-template-columns: minmax(0, 1fr) 380px; } .woocommerce-cart .cart-collaterals { position: sticky; top: 168px; } }
@media (max-width: 768px) {
	.woocommerce-cart table.shop_table_responsive { border-spacing: 0; }
	.woocommerce-cart table.shop_table_responsive thead { display: none; }
	.woocommerce-cart table.cart tr.cart_item { position: relative; display: block; margin: 0 0 12px; padding: 2px 14px; background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: var(--bx-radius); }
	.woocommerce-cart table.cart tr.cart_item td { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; text-align: right; background: transparent; border: 0; border-bottom: 1px solid var(--bx-line); border-radius: 0; }
	.woocommerce-cart table.cart tr.cart_item td:last-child { border-bottom: 0; }
	.woocommerce-cart table.cart tr.cart_item td::before { float: none; flex: none; font-weight: 700; color: var(--bx-muted); }
	.woocommerce-cart table.cart tr.cart_item td.product-remove { position: absolute; top: 10px; right: 10px; z-index: 1; width: auto; padding: 0; border: 0; }
	.woocommerce-cart table.cart tr.cart_item td.product-remove::before { display: none; }
	.woocommerce-cart table.cart tr.cart_item td.product-name { padding-right: 44px; text-align: left; }
	.woocommerce-cart table.cart tr.cart_item td.product-name::before { display: none; }
	.woocommerce-cart table.cart tr.cart_item td.product-name a { display: block; }
	.woocommerce-cart table.cart tr.cart_item td.product-quantity .quantity { margin: 0; }
	.woocommerce-cart table.cart tr:not(.cart_item) td.actions { display: block; padding: 0; border: 0; }
	.woocommerce-cart table.cart td.actions .coupon { flex-direction: column; }
	.woocommerce-cart table.cart td.actions .coupon .input-text { flex: none; }
	.woocommerce-cart table.cart td.actions .coupon .input-text, .woocommerce-cart table.cart td.actions .coupon .button, .woocommerce-cart table.cart td.actions > .button { width: 100%; }
}

/* 8f. Checkout ---------------------------------------------------------- */
.woocommerce-checkout .woocommerce-form-coupon-toggle, .woocommerce-checkout .woocommerce-form-login-toggle { margin-bottom: 4px; }
.woocommerce-checkout form.checkout_coupon, .woocommerce-checkout form.woocommerce-form-login { padding: 18px; margin: 0 0 20px; background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: var(--bx-radius); }
.woocommerce-checkout form.checkout { display: grid; gap: 24px; align-items: start; }
.woocommerce-checkout #customer_details { display: grid; gap: 20px; }
.woocommerce-checkout #customer_details .col-1, .woocommerce-checkout #customer_details .col-2 { float: none; width: 100%; padding: clamp(18px, 3vw, 28px); background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: var(--bx-radius); box-shadow: var(--bx-shadow); }
.woocommerce-checkout #customer_details .col-2:empty { display: none; }
.woocommerce-checkout form.checkout h3, .woocommerce-checkout #order_review_heading { margin: 0 0 16px; font-size: 1.25rem; font-weight: 800; }
.woocommerce-checkout .woocommerce-shipping-fields #ship-to-different-address { font-size: 1.125rem; }
.woocommerce-checkout .woocommerce-shipping-fields #ship-to-different-address label { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.woocommerce-checkout input[type="checkbox"], .woocommerce-checkout input[type="radio"] { width: 20px; height: 20px; margin: 0; accent-color: var(--bx-green); }
.woocommerce form .form-row.woocommerce-form__label-for-checkbox label, .woocommerce-checkout .woocommerce-form__label-for-checkbox { display: flex; align-items: flex-start; gap: 10px; font-weight: 400; }
.woocommerce-checkout #order_review_heading, .woocommerce-checkout #order_review { grid-column: 1; }
.woocommerce-checkout #order_review { padding: clamp(18px, 3vw, 28px); background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: var(--bx-radius); box-shadow: var(--bx-shadow); }
.woocommerce-checkout table.shop_table { margin: 0 0 18px; border: 0; border-collapse: collapse; }
.woocommerce-checkout table.shop_table th, .woocommerce-checkout table.shop_table td { padding: 10px 0; vertical-align: top; border: 0; border-bottom: 1px solid var(--bx-line); background: transparent; }
.woocommerce-checkout table.shop_table thead th { font-size: 0.8125rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--bx-muted); }
.woocommerce-checkout table.shop_table td.product-total, .woocommerce-checkout table.shop_table tfoot td { text-align: right; }
.woocommerce-checkout table.shop_table .order-total th, .woocommerce-checkout table.shop_table .order-total td { font-size: 1.125rem; font-weight: 800; border-bottom: 0; }
.woocommerce-checkout #payment { background: transparent; border-radius: 0; }
.woocommerce-checkout #payment ul.payment_methods { display: grid; gap: 10px; margin: 0 0 14px; padding: 0; border: 0; list-style: none; }
.woocommerce-checkout #payment ul.payment_methods li { padding: 14px 16px; background: var(--bx-mint-50); border: 1.5px solid var(--bx-line); border-radius: var(--bx-radius-sm); }
.woocommerce-checkout #payment ul.payment_methods li label { display: inline; font-weight: 700; cursor: pointer; }
.woocommerce-checkout #payment ul.payment_methods li input { vertical-align: middle; margin-right: 8px; }
.woocommerce-checkout #payment div.payment_box { margin: 12px 0 0; padding: 12px 14px; font-size: 0.9375rem; color: var(--bx-ink); background: var(--bx-white); border-radius: 10px; }
.woocommerce-checkout #payment div.payment_box::before { display: none; }
.woocommerce-checkout #payment div.form-row { padding: 0; }
.woocommerce-checkout .woocommerce-privacy-policy-text { margin-bottom: 14px; font-size: 0.875rem; color: var(--bx-muted); }
.woocommerce-checkout #place_order { display: flex; width: 100%; min-height: 56px; margin: 0; font-size: 1.125rem; }
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper { margin-bottom: 14px; }
@media (min-width: 1000px) {
	.woocommerce-checkout form.checkout { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); grid-template-rows: auto 1fr; column-gap: 32px; }
	.woocommerce-checkout #customer_details { grid-column: 1; grid-row: 1 / span 2; }
	.woocommerce-checkout #order_review_heading { grid-column: 2; grid-row: 1; margin-bottom: 0; align-self: end; }
	.woocommerce-checkout #order_review { grid-column: 2; grid-row: 2; position: sticky; top: 168px; }
}

/* WooCommerce's old clearfix pseudo-elements would become empty grid items and shift the columns. */
.woocommerce .col2-set::before, .woocommerce .col2-set::after, .woocommerce-page .col2-set::before, .woocommerce-page .col2-set::after,
.woocommerce .u-columns::before, .woocommerce .u-columns::after, .woocommerce-page .u-columns::before, .woocommerce-page .u-columns::after,
.woocommerce form.checkout::before, .woocommerce form.checkout::after { content: none; display: none; }

/* 8g. My account -------------------------------------------------------- */
.woocommerce-account .woocommerce { display: grid; gap: 24px; align-items: start; }
.woocommerce-account .woocommerce > .woocommerce-notices-wrapper { grid-column: 1 / -1; }
/* Plugins add clearfix pseudo-elements to .woocommerce; as grid items they take the first cell and push the columns out of order. */
.woocommerce-account .woocommerce::before, .woocommerce-account .woocommerce::after { content: none; display: none; }
.woocommerce-account .woocommerce-MyAccount-navigation { float: none; width: auto; }
.woocommerce-account .woocommerce-MyAccount-navigation ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.woocommerce-account .woocommerce-MyAccount-navigation a { display: block; padding: 10px 16px; font-weight: 600; color: var(--bx-ink); text-decoration: none; background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: 999px; }
.woocommerce-account .woocommerce-MyAccount-navigation a:hover { background: var(--bx-mint-100); border-color: var(--bx-mint); }
.woocommerce-account .woocommerce-MyAccount-navigation .is-active a { color: var(--bx-white); background: var(--bx-green); border-color: var(--bx-green); }
.woocommerce-account .woocommerce-MyAccount-content { float: none; width: auto; padding: clamp(18px, 3vw, 28px); background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: var(--bx-radius); box-shadow: var(--bx-shadow); }
.woocommerce-account .woocommerce-MyAccount-content > :last-child { margin-bottom: 0; }
.woocommerce-account table.shop_table { border: 0; border-collapse: collapse; }
.woocommerce-account table.shop_table th, .woocommerce-account table.shop_table td { padding: 12px 10px; border: 0; border-bottom: 1px solid var(--bx-line); }
.woocommerce-account .u-columns { display: grid; gap: 20px; }
.woocommerce-account .u-columns .u-column1, .woocommerce-account .u-columns .u-column2, .woocommerce-account .col-1, .woocommerce-account .col-2 { float: none; width: 100%; }
.woocommerce-account form.woocommerce-form-login, .woocommerce-account form.woocommerce-form-register, .woocommerce-account form.lost_reset_password, .woocommerce-account .woocommerce-EditAccountForm {
	padding: clamp(18px, 3vw, 28px); margin: 0; background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: var(--bx-radius); box-shadow: var(--bx-shadow);
}
.woocommerce-account .woocommerce h2 { margin: 0 0 14px; font-size: 1.4rem; font-weight: 800; }
.woocommerce-account .woocommerce > .woocommerce-notices-wrapper:empty, .woocommerce-cart .woocommerce > .woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-account .woocommerce-form-login .button, .woocommerce-account .woocommerce-form-register .button { width: 100%; min-height: 50px; }
.woocommerce-account .woocommerce-form-login__rememberme { display: flex; align-items: center; gap: 10px; font-weight: 400; }
.woocommerce-account .lost_password { margin: 14px 0 0; }
.woocommerce-account .woocommerce-Addresses { display: grid; gap: 16px; }
.woocommerce-account .woocommerce-Addresses .col-1, .woocommerce-account .woocommerce-Addresses .col-2 { padding: 16px; border: 1px solid var(--bx-line); border-radius: var(--bx-radius-sm); }
@media (min-width: 900px) {
	.woocommerce-account.logged-in .woocommerce { grid-template-columns: 240px minmax(0, 1fr); }
	.woocommerce-account.logged-in .woocommerce-MyAccount-navigation { grid-column: 1; grid-row: 1; }
	.woocommerce-account.logged-in .woocommerce-MyAccount-content { grid-column: 2; grid-row: 1; min-width: 0; }
	.woocommerce-account .woocommerce-MyAccount-navigation ul { flex-direction: column; }
	.woocommerce-account .u-columns, .woocommerce-account .woocommerce-Addresses { grid-template-columns: 1fr 1fr; }
}

/* Order received (thank-you) */
.woocommerce-order .woocommerce-thankyou-order-received { margin: 0 0 18px; padding: 14px 18px; font-size: 1.0625rem; font-weight: 700; color: var(--bx-green-900); background: var(--bx-mint-50); border: 1px solid var(--bx-line); border-left: 6px solid var(--bx-green); border-radius: var(--bx-radius-sm); }
.woocommerce ul.order_details { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin: 0 0 28px; padding: 0; list-style: none; }
.woocommerce ul.order_details li { float: none; margin: 0; padding: 14px 16px; font-size: 0.75rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--bx-muted); background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: var(--bx-radius-sm); }
.woocommerce ul.order_details li strong { display: block; margin-top: 4px; font-size: 1.0625rem; letter-spacing: 0; text-transform: none; color: var(--bx-ink); }
.woocommerce-order .woocommerce-order-details, .woocommerce-order .woocommerce-customer-details { margin-bottom: 28px; }
.woocommerce-order .woocommerce-order-details h2, .woocommerce-order .woocommerce-customer-details h2 { margin: 0 0 12px; font-size: 1.4rem; font-weight: 800; }
.woocommerce-order table.shop_table { border: 1px solid var(--bx-line); border-radius: var(--bx-radius-sm); border-collapse: separate; border-spacing: 0; overflow: hidden; background: var(--bx-white); }
.woocommerce-order table.shop_table th, .woocommerce-order table.shop_table td { padding: 12px 14px; border: 0; border-bottom: 1px solid var(--bx-line); }
.woocommerce-order table.shop_table tfoot tr:last-child th, .woocommerce-order table.shop_table tfoot tr:last-child td { border-bottom: 0; }
.woocommerce-order .woocommerce-columns--addresses { display: grid; gap: 16px; }
.woocommerce-order .woocommerce-columns--addresses .col-1, .woocommerce-order .woocommerce-columns--addresses .col-2 { float: none; width: 100%; }
.woocommerce-order address { padding: 14px 16px; font-style: normal; background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: var(--bx-radius-sm); }
@media (min-width: 760px) {
	.woocommerce ul.order_details { grid-template-columns: repeat(4, 1fr); }
	.woocommerce-order .woocommerce-columns--addresses { grid-template-columns: 1fr 1fr; }
}

/* Contact form (markup comes from the mu-plugin) */
.bx-contact { max-width: 680px; margin-top: 40px; padding: clamp(18px, 3vw, 28px); background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: var(--bx-radius); box-shadow: var(--bx-shadow); }
.bx-prose .bx-contact h2, .bx-contact h2 { margin: 0 0 16px; font-size: 1.4rem; font-weight: 800; }
.bx-form__row { margin: 0 0 16px; }
.bx-form label { display: block; margin: 0 0 6px; font-size: 0.9375rem; font-weight: 600; }
.bx-form__req, .bx-form__opt { font-weight: 400; color: var(--bx-muted); }
.bx-form input[type="text"], .bx-form input[type="email"], .bx-form input[type="tel"], .bx-form input[type="number"], .bx-form textarea {
	width: 100%; min-height: 48px; padding: 10px 14px; font: 400 1rem/1.4 var(--bx-font); color: var(--bx-ink); background: var(--bx-white);
	border: 1.5px solid #b9cdbf; border-radius: var(--bx-radius-sm); transition: border-color 0.15s, box-shadow 0.15s;
}
.bx-form textarea { min-height: 140px; resize: vertical; }
.bx-form input:focus, .bx-form textarea:focus { border-color: var(--bx-green); outline: none; box-shadow: 0 0 0 4px rgb(3 105 40 / 16%); }
.bx-form input[aria-invalid="true"], .bx-form textarea[aria-invalid="true"] { border-color: #b42318; }
.bx-form__error { display: block; margin-top: 6px; font-size: 0.875rem; font-weight: 600; color: #8a1c13; }
.bx-form__pair { display: grid; gap: 0 16px; }
.bx-form__note { margin: 0 0 16px; font-size: 0.875rem; color: var(--bx-muted); }
.bx-form__trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.bx-notice { margin: 0 0 20px; padding: 14px 18px; border: 1px solid var(--bx-line); border-left: 6px solid var(--bx-green); border-radius: var(--bx-radius-sm); background: var(--bx-mint-50); }
.bx-notice p, .bx-notice ul { margin: 0; }
.bx-notice ul { margin-top: 8px; padding-left: 1.2em; }
.bx-notice--error { color: #5c140e; background: #fdeeed; border-color: #f3c7c3; border-left-color: #b42318; }
.bx-notice--error a { color: #8a1c13; font-weight: 700; }
.bx-contact__alt { margin: 20px 0 0; padding-top: 18px; border-top: 1px solid var(--bx-line); }
.btn--whatsapp { margin-left: 8px; color: #06331a; background: #25d366; }
.btn--whatsapp:hover { color: #06331a; background: #1fbe5c; }
@media (min-width: 600px) { .bx-form__pair { grid-template-columns: 1fr 1fr; } }

/* 9. Pages -------------------------------------------------------------- */
.page-head { margin-bottom: 24px; }
.page-title { margin: 0; font-size: clamp(1.75rem, 4.5vw, 2.6rem); font-weight: 800; }
.page-meta { margin: 6px 0 0; font-size: 0.875rem; color: var(--bx-muted); }
.bx-prose { max-width: 860px; }
.bx-prose h2 { margin-top: 1.8em; font-size: 1.5rem; }
.bx-prose h3 { margin-top: 1.5em; font-size: 1.2rem; }
.bx-prose img { border-radius: var(--bx-radius-sm); }
.bx-prose table { width: 100%; border-collapse: collapse; }
.bx-prose th, .bx-prose td { padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--bx-line); }
.post-list { margin: 0 0 32px; padding: 0; list-style: none; }
.post-list__item { padding-block: 20px; border-bottom: 1px solid var(--bx-line); }
.post-list__title { margin: 0; font-size: 1.25rem; }
.pagination, .nav-links { display: flex; gap: 8px; flex-wrap: wrap; }
.page-numbers { padding: 8px 14px; color: var(--bx-ink); text-decoration: none; border: 1px solid var(--bx-line); border-radius: 999px; }
.page-numbers.current { color: var(--bx-white); background: var(--bx-green); border-color: var(--bx-green); }

/* 10. Footer ------------------------------------------------------------ */
.site-footer { margin-top: 0; color: #dcebe1; background: radial-gradient(60% 80% at 100% 0%, rgb(124 198 141 / 14%), transparent 60%), var(--bx-green-900); }
.site-footer a { color: #dcebe1; text-decoration: none; }
.site-footer a:hover { color: var(--bx-white); text-decoration: underline; }
.footer-reviews { padding-block: 32px; background: var(--bx-mint-50); color: var(--bx-ink); }
.widget__title { margin: 0 0 12px; font-size: 1.25rem; }
.footer-grid { display: grid; gap: 32px 24px; padding-block: 48px 32px; grid-template-columns: repeat(2, 1fr); }
.footer-brand { grid-column: 1 / -1; }
.footer-logo { display: inline-block; padding: 8px 14px; line-height: 0; background: var(--bx-white); border-radius: 16px; }
.site-footer .footer-logo img { height: 64px; width: auto; max-width: none; }
.footer-contact { display: grid; gap: 10px; margin: 20px 0 0; padding: 0; list-style: none; }
.footer-contact li { display: flex; align-items: flex-start; gap: 10px; }
.footer-contact .icon { flex: none; margin-top: 3px; color: var(--bx-mint); }
.footer-col__title { margin: 0 0 12px; font-size: 0.8125rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.footer-col__title a { color: var(--bx-mint); }
.footer-col__list { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.footer-bottom { border-top: 1px solid rgb(255 255 255 / 12%); font-size: 0.875rem; color: #b9d3c3; }
.footer-bottom__row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 24px; padding-block: 18px; }
.footer-bottom p { margin: 0; }
@media (min-width: 900px) {
	.footer-grid { grid-template-columns: 1.4fr repeat(5, 1fr); }
	.footer-brand { grid-column: auto; }
}

/* 11. Motion ------------------------------------------------------------ */
@media (prefers-reduced-motion: no-preference) {
	.hero__copy, .hero__panel, .hero__media { animation: bx-rise 0.7s cubic-bezier(0.2, 0.7, 0.2, 1) both; }
	.hero__panel, .hero__media { animation-delay: 0.12s; }
	.trust__item { animation: bx-rise 0.6s cubic-bezier(0.2, 0.7, 0.2, 1) both; }
	.trust__item:nth-child(2) { animation-delay: 0.08s; }
	.trust__item:nth-child(3) { animation-delay: 0.16s; }
}
@keyframes bx-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
	.cat-card:hover, .woocommerce ul.products li.product:hover { transform: none; }
}

/* 12. Help assistant (built by assets/js/help.js) ------------------------ */
.bx-help { position: fixed; right: 16px; bottom: 16px; z-index: 60; font-family: var(--bx-font); }
.bx-help__launcher {
	display: inline-flex; align-items: center; gap: 8px; padding: 12px 18px; font: 700 0.9375rem var(--bx-font); color: var(--bx-white);
	background: linear-gradient(135deg, var(--bx-green), var(--bx-green-700)); border: 0; border-radius: 999px; box-shadow: 0 10px 28px rgb(4 50 26 / 35%); cursor: pointer;
	transition: transform 0.15s, box-shadow 0.15s;
}
.bx-help__launcher:hover { transform: translateY(-2px); box-shadow: 0 14px 32px rgb(4 50 26 / 42%); }
.bx-help__panel {
	position: absolute; right: 0; bottom: calc(100% + 12px); display: flex; flex-direction: column; width: min(390px, calc(100vw - 32px)); height: min(580px, calc(100vh - 130px));
	overflow: hidden; background: var(--bx-white); border: 1px solid var(--bx-line); border-radius: 22px; box-shadow: var(--bx-shadow-lift);
}
.bx-help__panel[hidden] { display: none; }
.bx-help__panel:focus { outline: none; }
.bx-help__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; color: var(--bx-white); background: linear-gradient(135deg, var(--bx-green-900), var(--bx-green)); }
.bx-help__title { display: block; font-size: 1.0625rem; }
.bx-help__status { display: block; margin-top: 2px; font-size: 0.8125rem; color: #e6f4ea; }
.bx-help__status::before { content: ""; display: inline-block; width: 9px; height: 9px; margin-right: 7px; border-radius: 50%; background: #f0b429; }
.bx-help__status.is-open::before { background: #5fd68a; }
.bx-help__close { display: grid; place-items: center; width: 40px; height: 40px; color: var(--bx-white); background: rgb(255 255 255 / 16%); border: 0; border-radius: 50%; cursor: pointer; }
.bx-help__close:hover { background: rgb(255 255 255 / 28%); }
.bx-help__log { display: flex; flex: 1; flex-direction: column; gap: 10px; padding: 14px; overflow-y: auto; background: var(--bx-mint-50); }
.bx-help__msg { max-width: 94%; padding: 10px 14px; font-size: 0.9375rem; line-height: 1.5; border-radius: 16px; }
.bx-help__msg p { margin: 0 0 8px; }
.bx-help__msg > :last-child { margin-bottom: 0; }
.bx-help__msg--bot { align-self: flex-start; color: var(--bx-ink); background: var(--bx-white); border: 1px solid var(--bx-line); border-top-left-radius: 4px; }
.bx-help__msg--user { align-self: flex-end; color: var(--bx-white); background: var(--bx-green); border-top-right-radius: 4px; }
.bx-help__chips, .bx-help__links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.bx-help__chip {
	padding: 8px 14px; font: 600 0.875rem var(--bx-font); color: var(--bx-green-900); text-align: left; background: var(--bx-mint-100); border: 1px solid var(--bx-mint); border-radius: 999px; cursor: pointer;
}
.bx-help__chip:hover { background: var(--bx-mint); }
.bx-help__link { display: inline-block; padding: 9px 16px; font: 700 0.875rem var(--bx-font); color: var(--bx-white); text-decoration: none; background: var(--bx-green); border-radius: 999px; }
.bx-help__link:hover { color: var(--bx-white); background: var(--bx-green-700); }
.bx-help__form { display: flex; gap: 8px; padding: 12px; background: var(--bx-white); border-top: 1px solid var(--bx-line); }
.bx-help__input { flex: 1; min-width: 0; min-height: 44px; padding: 8px 16px; font: 400 1rem var(--bx-font); color: var(--bx-ink); background: var(--bx-white); border: 1.5px solid #b9cdbf; border-radius: 999px; }
.bx-help__input:focus { border-color: var(--bx-green); outline: none; box-shadow: 0 0 0 4px rgb(3 105 40 / 16%); }
.bx-help__send { min-height: 44px; padding: 0 18px; font: 700 0.9375rem var(--bx-font); color: var(--bx-white); background: var(--bx-green); border: 0; border-radius: 999px; cursor: pointer; }
.bx-help__send:hover { background: var(--bx-green-700); }
.drawer-open .bx-help { display: none; }
@media (max-width: 600px) {
	.bx-help { right: 12px; bottom: 12px; }
	.bx-help__panel { position: fixed; right: 8px; bottom: 72px; left: 8px; width: auto; height: min(72vh, 540px); }
}
@media (prefers-reduced-motion: no-preference) {
	.bx-help__panel:not([hidden]) { animation: bx-rise 0.22s ease-out both; }
	.bx-help__msg { animation: bx-rise 0.25s ease-out both; }
}
@media print { .bx-help { display: none; } }

/* 13. Shorter pages ------------------------------------------------------ */
/* Long descriptions show a few lines, with a "Read more" button added by nav.js.
   Only when JavaScript is running, so without it the full text is always there. */
.js .term-description { --clamp-lines: 3; }
.js .woocommerce-product-details__short-description { --clamp-lines: 4; }
.js .term-description, .js .woocommerce-product-details__short-description { max-height: calc(var(--clamp-lines) * 1.65em); overflow: hidden; }
.js .term-description.is-clamped:not(.is-expanded), .js .woocommerce-product-details__short-description.is-clamped:not(.is-expanded) {
	-webkit-mask-image: linear-gradient(#000 55%, transparent); mask-image: linear-gradient(#000 55%, transparent);
}
.js .is-expanded, .js .is-short { max-height: none; overflow: visible; }
.bx-readmore { margin: 2px 0 14px; padding: 6px 0; font: 700 0.9375rem var(--bx-font); color: var(--bx-green); text-decoration: underline; text-underline-offset: 3px; background: none; border: 0; cursor: pointer; }
.bx-readmore:hover { color: var(--bx-green-700); }

/* The header slides away when scrolling down and returns when scrolling up, so the page
   gets the whole screen. It is always shown near the top and whenever it has keyboard focus. */
.site-header { transition: transform 0.25s ease; }
.site-header.is-hidden { transform: translateY(-101%); }

/* 14. Review fixes: contrast and touch targets ---------------------------- */
.woocommerce .woocommerce-breadcrumb, .woocommerce .woocommerce-breadcrumb a, .woocommerce-breadcrumb .crumb-sep { color: var(--bx-muted); }
.woocommerce .woocommerce-breadcrumb a:hover { color: var(--bx-green); }
.woocommerce small.tax_label, .woocommerce small.includes_tax, .woocommerce .includes_tax { color: var(--bx-muted); font-weight: 400; }
.woocommerce button.button:disabled, .woocommerce button.button[disabled] { color: var(--bx-white); background: var(--bx-green); }
/* At least 24px, as WCAG 2.2 asks, for the small native controls on the basket, checkout and login. */
.woocommerce input[type="checkbox"], .woocommerce input[type="radio"], .woocommerce-form__input-checkbox { width: 24px; height: 24px; accent-color: var(--bx-green); }
.woocommerce form .show-password-input { top: 50%; width: 40px; height: 40px; margin-top: -20px; }
.woocommerce form.woocommerce-form-login .woocommerce-form-login__rememberme { gap: 12px; }


/* 15. Recycling packs ---------------------------------------------------- */
.btn--lg { padding: 16px 30px; font-size: 1.0625rem; }
.btn--light-solid { color: var(--bx-green-900); background: var(--bx-mint); }
.btn--light-solid:hover { color: var(--bx-green-900); background: #92d3a1; }
.pack-lead { max-width: 46em; margin: 0 0 24px; font-size: 1.0625rem; color: var(--bx-muted); }
.section--packs { background: var(--bx-white); }
.pack-grid { display: grid; gap: 20px; grid-template-columns: 1fr; }
@media (min-width: 700px) { .pack-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1040px) { .pack-grid { grid-template-columns: repeat(3, 1fr); } }
.pack-card { position: relative; display: flex; flex-direction: column; overflow: hidden; background: var(--bx-white); border: 1px solid var(--bx-mint-100); border-radius: 20px; }
.pack-card--popular { border: 2px solid var(--bx-green); }
.pack-card__badge { position: absolute; top: 12px; left: 12px; z-index: 1; padding: 5px 12px; font-size: 0.8125rem; font-weight: 700; color: var(--bx-white); background: var(--bx-green); border-radius: 999px; }
.pack-card .pack-card__media { position: relative; display: block; overflow: hidden; aspect-ratio: 16 / 10; background: var(--bx-white); }
.pack-card .pack-card__media .pack-card__img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; max-height: none; aspect-ratio: auto; margin: 0; object-fit: contain; padding: 12px; box-sizing: border-box; }
.pack-card__body { display: flex; flex: 1; flex-direction: column; gap: 10px; padding: 20px; }
.pack-card__tag { margin: 0; font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--bx-green-700); }
.pack-card__title { margin: 0; font-size: 1.25rem; }
.pack-card__title a { color: var(--bx-green-900); text-decoration: none; }
.pack-card__title a:hover { text-decoration: underline; }
.pack-card__text { margin: 0; color: var(--bx-muted); }
.pack-card__list { margin: 0; padding: 0; list-style: none; font-size: 0.9375rem; }
.pack-card__list li { position: relative; padding: 3px 0 3px 24px; }
.pack-card__list li::before { content: ""; position: absolute; left: 2px; top: 0.7em; width: 6px; height: 11px; border: solid var(--bx-green); border-width: 0 2.5px 2.5px 0; transform: translateY(-50%) rotate(45deg); }
.pack-card__foot { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 14px; border-top: 1px solid var(--bx-mint-100); }
.pack-card__price { display: flex; flex-direction: column; margin: 0; }
.pack-card__price-label { font-size: 0.8125rem; color: var(--bx-muted); }
.pack-card__price strong { font-size: 1.5rem; line-height: 1.2; color: var(--bx-green-900); }
.pack-card__save { font-size: 0.875rem; font-weight: 700; color: var(--bx-green-700); }
.pack-card--quote { color: var(--bx-white); background: var(--bx-green-900); border-color: var(--bx-green-900); justify-content: center; }
.pack-card--quote .pack-card__tag { color: var(--bx-mint); }
.pack-card--quote .pack-card__title, .pack-card--quote .pack-card__text { color: #e3f3e8; }
.pack-notices { margin-bottom: 16px; }

.pack-single { display: grid; gap: 28px; margin-top: 8px; }
@media (min-width: 900px) { .pack-single { grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; } }
.pack-single__media { background: var(--bx-white); border: 1px solid var(--bx-mint-100); border-radius: 20px; overflow: hidden; }
.pack-single__media { aspect-ratio: 4 / 3; }
.pack-single .pack-single__media img { display: block; aspect-ratio: auto; margin: 0; box-sizing: border-box; width: 100%; height: 100%; max-height: none; object-fit: contain; padding: 16px; }
.pack-single__title { margin: 4px 0 10px; font-size: clamp(1.75rem, 4vw, 2.5rem); line-height: 1.1; letter-spacing: -0.02em; color: var(--bx-green-900); }
.pack-single__lead { margin: 0 0 16px; font-size: 1.0625rem; color: var(--bx-muted); }
.pack-box { padding: 20px; background: var(--bx-mint-50); border: 1px solid var(--bx-mint-100); border-radius: 20px; }
.pack-table { width: 100%; border-collapse: collapse; font-size: 0.9375rem; }
.pack-table th, .pack-table td { padding: 10px 6px; text-align: left; border-bottom: 1px solid var(--bx-mint-100); vertical-align: top; }
.pack-table th { font-size: 0.8125rem; letter-spacing: 0.05em; text-transform: uppercase; color: var(--bx-muted); }
.pack-table th:last-child, .pack-table td:last-child { text-align: right; white-space: nowrap; }
.pack-table__flag { display: inline-block; margin-left: 6px; font-size: 0.8125rem; font-weight: 700; color: #8a1f11; }
.pack-box__total { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; margin-top: 16px; }
.pack-box__unavailable { margin: 0; font-weight: 600; }
.pack-steps { margin: 16px 0 0; padding: 0; list-style: none; font-size: 0.9375rem; color: var(--bx-muted); }
.pack-steps li { padding: 4px 0; }
.pack-content { margin-top: 36px; max-width: 46em; }

/* 16. Free delivery progress bar (basket) ---------------------------------- */
.delivery-bar { margin: 0 0 20px; padding: 14px 18px; background: var(--bx-mint-50); border: 1px solid var(--bx-mint-100); border-radius: var(--bx-radius-sm); }
.delivery-bar__text { margin: 0 0 10px; color: var(--bx-green-900); }
.delivery-bar__track { height: 8px; overflow: hidden; background: #d8eadd; border-radius: 999px; }
.delivery-bar__fill { display: block; height: 100%; background: var(--bx-green); border-radius: 999px; transition: width 0.4s ease; }
.delivery-bar--done .delivery-bar__fill { background: var(--bx-green-700); }
@media (prefers-reduced-motion: reduce) { .delivery-bar__fill { transition: none; } }

/* 17. Quotes for organisations --------------------------------------------- */
.bx-form select {
	display: block; width: 100%; padding: 12px 14px; font: inherit; color: var(--bx-ink); background: var(--bx-white);
	border: 1px solid var(--bx-line); border-radius: var(--bx-radius-sm);
}
.bx-form select:focus { border-color: var(--bx-green); outline: none; box-shadow: 0 0 0 4px rgb(3 105 40 / 16%); }
.bx-form select[aria-invalid="true"] { border-color: #b42318; }
.bx-quote__basket { margin: 0 0 20px; padding: 14px 18px; background: var(--bx-mint-50); border: 1px solid var(--bx-mint-100); border-radius: var(--bx-radius-sm); }
.bx-quote__basket ul { margin: 6px 0; padding-left: 20px; }
.bx-quote__basket p { margin: 0; }
.bx-quote-link { margin: 12px 0 0; text-align: center; }
.bx-quote-link a { display: block; padding: 12px 16px; font-weight: 700; color: var(--bx-green); text-decoration: none; border: 2px solid var(--bx-green); border-radius: 12px; }
.bx-quote-link a:hover { color: var(--bx-white); background: var(--bx-green); }

.quote-wrap { max-width: 900px; margin: 0 auto; }
.quote-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 0 0 16px; }
.quote-actions form { margin: 0; }
.quote-actions__note { margin: 0; font-weight: 600; color: #8a1f11; }
.quote-doc { padding: clamp(18px, 4vw, 36px); background: var(--bx-white); border: 1px solid var(--bx-mint-100); border-radius: 20px; box-shadow: var(--bx-shadow); }
.quote-doc__top { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px; padding-bottom: 18px; border-bottom: 3px solid var(--bx-green); line-height: 1.6; }
.quote-doc__brand { font-size: 1.25rem; color: var(--bx-green-900); }
.quote-doc__meta { color: var(--bx-muted); line-height: 1.6; }
.quote-doc__title { margin: 0 0 4px; font-size: 2rem; letter-spacing: -0.02em; color: var(--bx-green-900); }
.quote-doc__valid { display: inline-block; margin-top: 6px; padding: 4px 12px; font-size: 0.875rem; font-weight: 700; color: var(--bx-green-700); background: var(--bx-mint-100); border-radius: 999px; }
.quote-doc__cols { display: grid; gap: 20px; margin: 22px 0; }
@media (min-width: 640px) { .quote-doc__cols { grid-template-columns: 1fr 1fr; } }
.quote-doc__cols h3 { margin: 0 0 6px; font-size: 0.8125rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--bx-green-700); }
.quote-doc__cols p { margin: 0; line-height: 1.6; }
.quote-doc__table { width: 100%; border-collapse: collapse; font-size: 0.9375rem; }
.quote-doc__table th { padding: 10px 6px; font-size: 0.78rem; letter-spacing: 0.06em; text-align: left; text-transform: uppercase; color: var(--bx-muted); border-bottom: 2px solid var(--bx-mint-100); }
.quote-doc__table td { padding: 12px 6px; vertical-align: top; border-bottom: 1px solid var(--bx-mint-100); }
.quote-doc__table .r { text-align: right; white-space: nowrap; }
.quote-doc__totals { width: min(360px, 100%); margin: 18px 0 0 auto; }
.quote-doc__totals div { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; }
.quote-doc__totals dt, .quote-doc__totals dd { margin: 0; }
.quote-doc__saving dd { font-weight: 700; color: var(--bx-green-700); }
.quote-doc__grand { margin-top: 6px; padding-top: 12px !important; font-size: 1.3rem; font-weight: 800; color: var(--bx-green-900); border-top: 2px solid var(--bx-green-900); }
.quote-doc__foot { margin-top: 24px; padding-top: 14px; font-size: 0.85rem; line-height: 1.6; color: var(--bx-muted); border-top: 1px solid var(--bx-mint-100); }
@media print {
	.topbar, .site-header, .site-footer, .bx-help, .quote-actions, .quote-notices, .woocommerce-breadcrumb, .page-head { display: none !important; }
	body { background: #fff !important; }
	.bx-main { padding: 0 !important; max-width: none !important; }
	.quote-wrap { max-width: none; }
	.quote-doc { padding: 0; border: 0; box-shadow: none; }
}

/* 18. For business page ---------------------------------------------------- */
.hero__grid--single { grid-template-columns: 1fr; }
.bx-prose--wide { max-width: var(--bx-wrap); }
.bx-prose--wide > h2:first-child { margin-top: 0; }
.bx-cards { display: grid; gap: 16px; margin: 20px 0 8px; padding: 0; list-style: none; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.bx-cards li { padding: 20px; background: var(--bx-white); border: 1px solid var(--bx-mint-100); border-radius: var(--bx-radius-sm); }
.bx-cards strong { display: block; margin-bottom: 4px; color: var(--bx-green-900); }
.bx-cards p { margin: 0; font-size: 0.9375rem; color: var(--bx-muted); }
.business__cta { padding: clamp(24px, 5vw, 44px); color: var(--bx-white); background: var(--bx-green-900); border-radius: 24px; }
.business__cta .section__title { margin-bottom: 8px; color: var(--bx-white); }
.business__cta p { max-width: 40em; margin: 0 0 18px; color: #e3f3e8; }
.business__cta p:last-child { margin-bottom: 0; }

/* 19. Bin calculator ------------------------------------------------------- */
.calc { max-width: 900px; }
.calc__form { padding: clamp(18px, 4vw, 28px); background: var(--bx-mint-50); border: 1px solid var(--bx-mint-100); border-radius: 20px; }
.calc__checks { display: grid; gap: 4px; margin: 0 0 16px; padding: 0; border: 0; }
.calc__checks legend { margin-bottom: 6px; padding: 0; font-weight: 700; }
.calc .calc__check { display: flex; align-items: center; gap: 10px; min-height: 44px; margin: 0; font-weight: 400; }
.calc__check input { width: 20px; height: 20px; accent-color: var(--bx-green); }
.calc .calc__check--sub { padding-left: 30px; }
.calc .calc__check--sub select { width: auto; min-height: 40px; }
.calc__result { margin-top: 32px; }
.calc__result h2 { margin: 0 0 12px; }
.calc__table-wrap { overflow-x: auto; }
.calc__why { font-size: 0.875rem; color: var(--bx-muted); }
.calc__total { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; margin: 14px 0; padding: 14px 0; font-size: 1.0625rem; border-top: 2px solid var(--bx-green-900); }
.calc__total strong { font-size: 1.5rem; color: var(--bx-green-900); }
.calc__actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 14px; }
.calc__fine { margin: 0; font-size: 0.875rem; color: var(--bx-muted); }
.btn--outline-light { color: var(--bx-white); background: transparent; box-shadow: inset 0 0 0 2px var(--bx-mint); }
.btn--outline-light:hover { color: var(--bx-green-900); background: var(--bx-mint); }
.business__cta .btn { margin: 0 8px 8px 0; }