/* =========================================================================
   Verslun (WooCommerce) — shop archive, single product, checkout skin.
   Palette-driven (Paper by default). Loaded only on Woo pages.
   Cart button + drawer live in theme.css (they appear site-wide).
   ========================================================================= */

.bk-shop { max-width: var(--maxw-wide, 1500px); margin: 0 auto; padding: 0 var(--pad-x); }

/* ---- Intro ---- */
.bk-shop-intro { padding: 150px 0 24px; }
.bk-shop-intro__eyebrow { display: block; font-family: var(--font-mono); font-size: 11px; letter-spacing: .34em; color: var(--muted); }
.bk-shop-intro__row { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 24px; margin-top: 16px; }
.bk-shop-intro__title { font-family: var(--font-serif); font-weight: 500; font-size: clamp(52px, 9vw, 148px); line-height: .86; letter-spacing: -.02em; margin: 0; color: var(--fg); }
.bk-shop-intro__lede { max-width: 400px; color: var(--muted); font-size: 16px; line-height: 1.75; margin: 0 0 10px; }

/* ---- Filter bar ---- */
/* Full-bleed wrapper: the border rules run edge-to-edge while the inner rows
   stay aligned to the product grid (max-width + --pad-x, matching .bk-shop). */
.bk-shop-filter { position: sticky; top: 0; z-index: 50; background: var(--bg); width: 100vw; margin-left: calc(50% - 50vw); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.bk-shop-filter__bar { max-width: var(--maxw-wide, 1500px); margin: 0 auto; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 18px; padding: 16px var(--pad-x); }
.bk-shop-filter__cats { display: flex; flex-wrap: wrap; gap: 8px; }
.bk-chip { font-family: var(--font-mono); font-size: 12px; letter-spacing: .08em; background: transparent; color: var(--fg); border: 1px solid var(--line); border-radius: 100px; padding: 9px 18px; cursor: pointer; transition: background .25s, color .25s, border-color .25s; }
.bk-chip:hover { border-color: var(--fg); color: var(--fg); }
.bk-chip.is-active { background: var(--fg); color: var(--bg); border-color: var(--fg); }
.bk-shop-filter__meta { display: flex; align-items: center; gap: 14px; }
.bk-shop-filter__count { font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; color: var(--muted); white-space: nowrap; }
.bk-shop-filter__sorts { display: flex; gap: 10px; }
.bk-sort { font-family: var(--font-mono); font-size: 11px; letter-spacing: .06em; background: none; border: none; border-bottom: 1px solid transparent; padding: 4px 2px; color: var(--muted); cursor: pointer; transition: color .25s, border-color .25s; }
.bk-sort:hover { color: var(--fg); }
.bk-sort.is-active { color: var(--fg); border-bottom-color: var(--accent); }
/* Clear-filters control (resets category + sort). */
.bk-sort--reset { color: var(--muted); opacity: .75; letter-spacing: .08em; }
.bk-sort--reset:hover { color: var(--accent); opacity: 1; }
/* Sub-chip row: internal divider aligned to content; hidden when empty. */
.bk-shop-filter__subs { max-width: var(--maxw-wide, 1500px); margin: 0 auto; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 14px var(--pad-x); border-top: 1px solid var(--line); }
.bk-shop-filter__subs:empty { display: none; }
.bk-shop-filter__subhead { font-family: var(--font-mono); font-size: 10px; letter-spacing: .16em; color: var(--muted); }
.bk-subchip { font-family: var(--font-mono); font-size: 11.5px; letter-spacing: .04em; background: transparent; color: var(--fg); border: 1px solid var(--line); border-radius: 100px; padding: 7px 15px; cursor: pointer; transition: background .25s, color .25s, border-color .25s; }
.bk-subchip:hover { border-color: var(--fg); }
.bk-subchip.is-active { background: var(--accent); color: #fff; border-color: var(--accent); }

/* ---- Grid ---- */
.bk-shop-grid-wrap { padding: 40px 0; }
.bk-shop-grid { transition: opacity .3s ease; }
.bk-shop-grid.is-loading { opacity: .45; pointer-events: none; }
/* Pager slide: two full-width panes on a 200%-wide track; JS animates the
   transform so one page slides out as the next slides in. */
.bk-shop-grid.is-sliding { overflow: hidden; }
.bk-shop-slide { display: flex; width: 200%; }
.bk-shop-slide.is-anim { transition: transform .6s cubic-bezier(.55, 0, .1, 1); }
.bk-shop-slide__pane { flex: 0 0 50%; width: 50%; }
.bk-shop-grid ul.products,
.related.products ul.products,
.upsells.products ul.products { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 26px; }
/* Kill WC's clearfix ::before/::after — as grid items they leave a phantom
   first/last cell that shifts the whole row. */
.bk-shop-grid ul.products::before, .bk-shop-grid ul.products::after,
.related.products ul.products::before, .related.products ul.products::after,
.upsells.products ul.products::before, .upsells.products ul.products::after { content: none; display: none; }

/* ---- Product card ---- */
/* Override WooCommerce's float-grid `width:22.05%` on li.product — inside our
   CSS grid that percentage resolves against each cell and collapses the card. */
body.woocommerce ul.products li.product,
body.woocommerce ul.products li.bk-product { display: flex; flex-direction: column; margin: 0; width: auto; float: none; }
.bk-product__media { position: relative; aspect-ratio: 1; overflow: hidden; background: var(--panel); border: 1px solid var(--line); }
.bk-product__link { position: absolute; inset: 0; display: block; }
.bk-product__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bk-product__img--single { position: absolute; inset: 0; }
/* Gallery hover-swap: two images side by side, slide on hover */
.vs-track { position: absolute; inset: 0; display: flex; width: 200%; height: 100%; transform: translateX(0); transition: transform .7s cubic-bezier(.55, 0, .1, 1); }
/* Extra specificity (0,4,0) so these win over WooCommerce core's
   `.woocommerce ul.products li.product a img` (0,3,4 → width:100%; height:auto)
   and the `position:absolute` inherited from theme.css `.bk-product__img`.
   Without this the images blow up to the 200% track width and render as a
   zoomed, upscaled crop. Scoped to WooCommerce product loops (shop grid +
   related/upsell) to leave the front-page teaser cards untouched. */
.bk-shop-grid .bk-product__media .vs-track .bk-product__img,
.related.products .bk-product__media .vs-track .bk-product__img,
.upsells.products .bk-product__media .vs-track .bk-product__img { position: static; flex: none; width: 50%; height: 100%; object-fit: cover; }
.bk-product__media.vs-card:hover .vs-track { transform: translateX(-50%); }
/* Keep the slide clean — cancel theme.css `.bk-product:hover .bk-product__img` scale. */
.bk-shop-grid .bk-product__media.vs-card:hover .vs-track .bk-product__img,
.related.products .bk-product__media.vs-card:hover .vs-track .bk-product__img,
.upsells.products .bk-product__media.vs-card:hover .vs-track .bk-product__img { transform: none; }
.bk-product__tag { position: absolute; top: 12px; left: 12px; z-index: 2; font-family: var(--font-mono); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; color: #fff; background: rgba(28, 24, 21, .72); padding: 4px 9px; }
.bk-product__sale { position: absolute; top: 12px; right: 12px; z-index: 2; font-family: var(--font-mono); font-size: 9px; letter-spacing: .1em; color: #fff; background: var(--accent); padding: 4px 9px; }
/* Out-of-stock badge — top-right, muted red. */
.bk-product__stock { position: absolute; top: 12px; right: 12px; z-index: 2; font-family: var(--font-mono); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; color: #fff; background: rgba(181, 73, 58, .92); padding: 4px 9px; }
.bk-product__add { position: absolute; right: 12px; bottom: 12px; z-index: 3; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; background: var(--fg); color: var(--bg); border: none; border-radius: 50%; cursor: pointer; box-shadow: 0 5px 16px rgba(0, 0, 0, .2); transition: transform .25s, background .25s, color .25s; }
.bk-product__add:hover { background: var(--accent); color: #fff; transform: scale(1.1); }
.bk-product__add.loading { opacity: .6; pointer-events: none; }
.bk-product__add-icon { display: flex; align-items: center; justify-content: center; }
/* Added state: swap the plus for a single tick (no "plus + tick" double glyph),
   then JS clears `.added` after a beat so the button reverts to the plus. */
.bk-product__add.added { background: var(--accent); color: #fff; }
.bk-product__add.added .bk-product__add-icon { display: none; }
.bk-product__add.added::after { content: '✓'; font-size: 17px; line-height: 1; }
/* WooCommerce appends a "View cart" link after the button — never wanted here. */
.bk-product__media .added_to_cart { display: none !important; }
.bk-product__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-top: 12px; }
.bk-product__name { font-family: var(--font-serif); font-size: 19px; line-height: 1.15; color: var(--fg); }
.bk-product__name:hover { color: var(--accent); }
.bk-product__meta { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-top: 4px; }
.bk-product__material { font-family: var(--font-mono); font-size: 11px; color: var(--muted); letter-spacing: .06em; }
.bk-product__price { font-family: var(--font-mono); font-size: 13px; color: var(--fg); white-space: nowrap; }
.bk-product__price del { color: var(--muted); opacity: .7; margin-right: 6px; }
.bk-product__price ins { text-decoration: none; }
.bk-shop-empty { font-family: var(--font-mono); font-size: 13px; letter-spacing: .06em; color: var(--muted); padding: 40px 0; }

/* ---- Pager ---- */
.bk-shop-pager { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 44px; }
.bk-page, .bk-page-arrow { min-width: 44px; height: 44px; padding: 0 12px; display: flex; align-items: center; justify-content: center; font-family: var(--font-mono); font-size: 12px; letter-spacing: .06em; background: transparent; color: var(--fg); border: 1px solid var(--line); border-radius: 100px; cursor: pointer; transition: background .25s, color .25s; }
.bk-page:hover, .bk-page-arrow:hover { background: var(--fg); color: var(--bg); }
.bk-page.is-active { background: var(--fg); color: var(--bg); border-color: var(--fg); }
.bk-page-arrow.is-disabled { opacity: .3; pointer-events: none; }
.bk-page-gap { font-family: var(--font-mono); font-size: 12px; color: var(--muted); padding: 0 2px; }

/* ---- Info band ---- */
.bk-shop-band { border-top: 1px solid var(--line); background: var(--panel); margin-top: 40px; }
.bk-shop-band__grid { max-width: var(--maxw-wide, 1500px); margin: 0 auto; padding: 90px 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 36px 60px; }
.bk-perk__k { font-family: var(--font-mono); font-size: 11px; letter-spacing: .16em; color: var(--accent); }
.bk-perk__t { font-family: var(--font-serif); font-size: 22px; margin-top: 10px; line-height: 1.2; color: var(--fg); }
.bk-perk__d { color: var(--muted); font-size: 14px; line-height: 1.65; margin: 8px 0 0; }

/* =========================================================================
   Single product
   ========================================================================= */
.bk-shop--single { padding-top: 120px; padding-bottom: 40px; }
.bk-single__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: start; }
.bk-single__gallery { position: sticky; top: 100px; }
/* Inline gallery: main stage + thumbnail rail (no zoom/lightbox). */
.bk-single__stage { position: relative; aspect-ratio: 1 / 1; border: 1px solid var(--line); background: var(--panel); overflow: hidden; }
.bk-single__stage-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bk-single__tag { position: absolute; top: 16px; left: 16px; z-index: 2; font-family: var(--font-mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--bg); background: var(--fg); padding: 7px 13px; }
.bk-single__thumbs { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 14px; }
.bk-single__thumb { width: 74px; height: 74px; padding: 0; border: 1px solid var(--line); background: var(--panel); cursor: pointer; overflow: hidden; transition: border-color .25s, opacity .25s; opacity: .7; }
.bk-single__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bk-single__thumb:hover { opacity: 1; }
.bk-single__thumb.is-active { border-color: var(--accent); opacity: 1; }
.bk-single__summary { padding-top: 6px; }
.bk-single__back { display: inline-block; font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; color: var(--muted); margin-bottom: 20px; }
.bk-single__back:hover { color: var(--accent); }
.bk-single__title { font-family: var(--font-serif); font-weight: 500; font-size: clamp(32px, 4.4vw, 60px); line-height: 1; margin: 0; color: var(--fg); }
.bk-single__pricing { display: flex; align-items: baseline; gap: 16px; margin-top: 16px; flex-wrap: wrap; }
.bk-single__price { font-family: var(--font-mono); font-size: 20px; color: var(--fg); }
.bk-single__price del { color: var(--muted); opacity: .7; margin-right: 8px; }
.bk-single__price ins { text-decoration: none; }
.bk-single__stock { font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; display: inline-flex; align-items: center; gap: 7px; }
.bk-single__stock::before { content: ""; width: 7px; height: 7px; border-radius: 50%; display: inline-block; }
.bk-single__stock.is-in { color: var(--muted); }
.bk-single__stock.is-in::before { background: var(--accent); }
.bk-single__stock.is-out { color: var(--muted); opacity: .8; }
.bk-single__stock.is-out::before { background: var(--muted); }
.bk-single__excerpt { margin-top: 18px; color: var(--muted); font-size: 15px; line-height: 1.75; }
.bk-single__specs { display: grid; grid-template-columns: 1fr 1fr; gap: 0 30px; margin-top: 26px; }
.bk-single__spec { display: flex; justify-content: space-between; border-top: 1px solid var(--line); padding: 11px 0; gap: 14px; }
.bk-single__spec-k { font-family: var(--font-mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.bk-single__spec-v { font-family: var(--font-mono); font-size: 11px; color: var(--fg); text-align: right; }
.bk-single__cart { margin-top: 30px; }
.bk-single__note { margin-top: 18px; font-family: var(--font-mono); font-size: 11px; letter-spacing: .04em; color: var(--muted); }
/* Mobile-only sticky add-to-cart bar — revealed in the ≤820 block. */
.bk-pdp-bar { display: none; }

/* Variation swatches (built by shop.js from the real WC selects) */
.bk-swatch-group { margin-bottom: 22px; }
.bk-swatch-group__label { display: block; font-family: var(--font-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-bottom: 10px; }
.bk-swatch-group__opts { display: flex; flex-wrap: wrap; gap: 10px; }
.bk-swatch { font-family: var(--font-sans); font-size: 14px; color: var(--fg); background: var(--panel); border: 1px solid var(--line); border-radius: 100px; padding: 10px 18px; cursor: pointer; transition: border-color .2s, background .2s, color .2s; display: inline-flex; align-items: center; gap: 9px; }
.bk-swatch:hover { border-color: var(--fg); }
.bk-swatch.is-selected { background: var(--fg); color: var(--bg); border-color: var(--fg); }
.bk-swatch.is-unavailable { opacity: .35; text-decoration: line-through; cursor: not-allowed; }
.bk-swatch__dot { width: 16px; height: 16px; border-radius: 50%; border: 1px solid rgba(0,0,0,.15); flex: none; }
/* Once enhanced, hide the native select but keep it accessible for WC's JS. */
.bk-swatch-group.is-enhanced .bk-swatch-group__select { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
/* Fallback (no JS): a usable styled select. */
.bk-swatch-group__select select { font-family: var(--font-sans); font-size: 14px; color: var(--fg); background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 9px 12px; }
.bk-variations .reset_variations { display: inline-block; font-family: var(--font-mono); font-size: 11px; color: var(--muted); margin-top: 4px; }
.bk-variations .reset_variations:hover { color: var(--accent); }

/* Add-to-cart form (simple + variable): qty stepper + circular add button */
.bk-single__cart .quantity { display: inline-flex; }
.bk-qty-stepper { align-items: center; border: 1px solid var(--line); border-radius: 100px; overflow: hidden; -webkit-user-select: none; user-select: none; }
.bk-qty-stepper__btn { width: 42px; height: 46px; background: none; border: none; font-size: 18px; color: var(--fg); cursor: pointer; line-height: 1; }
.bk-qty-stepper input.qty { width: 46px; height: 46px; text-align: center; background: transparent; border: none; font-family: var(--font-mono); font-size: 14px; color: var(--fg); -moz-appearance: textfield; }
.bk-qty-stepper input.qty::-webkit-outer-spin-button, .bk-qty-stepper input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.bk-single__cart form.cart { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 0; }
.bk-single__cart .woocommerce-variation-add-to-cart { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 6px; }
/* Circular icon add-to-cart button (matches the comp). Text kept for a11y. */
/* Qualified with .button.alt to outrank the shared WC button rule below. */
body.woocommerce .bk-single__cart .single_add_to_cart_button.button.alt { flex: none; width: 60px; height: 60px; padding: 0; font-size: 0; border: none; border-radius: 50%; cursor: pointer; background-color: var(--fg); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.7'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center; background-size: 22px; transition: opacity .3s, transform .2s; }
body.woocommerce .bk-single__cart .single_add_to_cart_button.button.alt:hover { transform: translateY(-1px); background-color: var(--accent); color: var(--bg); }
/* Disabled (variation not chosen) — on-brand instead of WooCommerce purple */
body.woocommerce .bk-single__cart .single_add_to_cart_button.button.alt.disabled,
body.woocommerce .bk-single__cart .single_add_to_cart_button.button.alt:disabled { opacity: .3; cursor: not-allowed; }
body.woocommerce .bk-single__cart .single_add_to_cart_button.button.alt.disabled:hover { transform: none; background-color: var(--fg); }
.bk-single__cart .single_add_to_cart_button.loading { opacity: .6; }
.bk-single .woocommerce-variation-price { font-family: var(--font-mono); font-size: 18px; margin: 6px 0 14px; }
.bk-single .woocommerce-variation-availability { font-family: var(--font-mono); font-size: 12px; color: var(--muted); }
.bk-single .onsale { position: absolute; top: 14px; left: 14px; z-index: 3; font-family: var(--font-mono); font-size: 9px; letter-spacing: .12em; color: #fff; background: var(--accent); padding: 5px 11px; }

/* Product tabs / related (kept, on-brand) */
.woocommerce-tabs { margin-top: 70px; border-top: 1px solid var(--line); padding-top: 30px; }
.woocommerce-tabs ul.tabs { list-style: none; display: flex; gap: 20px; padding: 0; margin: 0 0 24px; }
.woocommerce-tabs ul.tabs a { font-family: var(--font-mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.woocommerce-tabs ul.tabs li.active a { color: var(--fg); border-bottom: 1px solid var(--accent); padding-bottom: 4px; }
.woocommerce-tabs .panel { color: var(--muted); font-size: 15px; line-height: 1.75; }
.related.products > h2, .upsells.products > h2 { font-family: var(--font-serif); font-weight: 500; font-size: clamp(28px, 3vw, 42px); margin: 60px 0 26px; }
.related.products ul.products, .upsells.products ul.products { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 26px; }

/* =========================================================================
   Cart page + Checkout (standard flow, on-brand skin)
   ========================================================================= */
.woocommerce-cart .bk-section--narrow,
.woocommerce-checkout .bk-section--narrow { max-width: var(--maxw, 1300px); }
.woocommerce-checkout .bk-entry__title,
.woocommerce-cart .bk-entry__title { font-family: var(--font-serif); font-weight: 500; }

.woocommerce form .form-row label,
.woocommerce-checkout label { font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em; color: var(--muted); text-transform: uppercase; }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce-checkout input.input-text,
.woocommerce-checkout textarea,
.woocommerce-checkout select,
.select2-selection { background: transparent; border: none; border-bottom: 1px solid var(--line); padding: 12px 2px; font-family: var(--font-sans); font-size: 15px; color: var(--fg); border-radius: 0; }
.woocommerce form .form-row input.input-text:focus,
.woocommerce-checkout input.input-text:focus,
.woocommerce-checkout textarea:focus { outline: none; border-bottom-color: var(--fg); }
.woocommerce #payment, .woocommerce-checkout-review-order { background: var(--panel); border: 1px solid var(--line); border-radius: 16px; padding: 26px; }
.woocommerce table.shop_table { border-color: var(--line); }
.woocommerce table.shop_table th, .woocommerce table.shop_table td { border-color: var(--line); font-family: var(--font-sans); }
body.woocommerce #place_order,
body.woocommerce a.button, body.woocommerce button.button, body.woocommerce input.button,
body.woocommerce .button.alt, body.woocommerce a.button.alt, body.woocommerce button.button.alt, body.woocommerce input.button.alt,
body.woocommerce #respond input#submit { background: var(--fg); color: var(--bg); border: none; border-radius: 100px; font-family: var(--font-mono); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; padding: 15px 28px; cursor: pointer; transition: background .3s, color .3s; }
body.woocommerce #place_order:hover,
body.woocommerce a.button:hover, body.woocommerce button.button:hover, body.woocommerce input.button:hover,
body.woocommerce .button.alt:hover, body.woocommerce button.button.alt:hover { background: var(--accent); color: #fff; }
.woocommerce .cart_totals h2, .woocommerce-checkout h3 { font-family: var(--font-serif); font-weight: 500; }

.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-notices-wrapper .woocommerce-message {
	font-family: var(--font-sans); border-top: 2px solid var(--accent); background: var(--panel); color: var(--fg); border-radius: 8px;
}

/* =========================================================================
   Responsive (desktop-first; interim ≤820 baseline)
   ========================================================================= */
@media (max-width: 1100px) {
	.bk-shop-grid ul.products,
	.related.products ul.products,
	.upsells.products ul.products { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 820px) {
	.bk-shop-intro { padding: 120px 0 20px; }
	/* minmax(0,1fr) forces two truly equal tracks — plain 1fr is minmax(auto,1fr),
	   so a long product name / mono price string blows one column wider than the other. */
	.bk-shop-grid ul.products,
	.related.products ul.products,
	.upsells.products ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
	/* woocommerce-smallscreen.css pins `ul.products[class*="columns-"] li.product`
	   to width:48%;float:left — which, on our CSS grid, shrinks each card to ~half
	   its column (tiny, staggered images). Match that [class*="columns-"] hook so we
	   out-specify it and every card fills its column as one large, uniform square. */
	body.woocommerce ul.products[class*="columns-"] li.bk-product { width: 100%; float: none; }
	/* Drop the brand/material line on mobile cards — name + price is enough. */
	.bk-product__material { display: none; }
	.bk-shop-band__grid { grid-template-columns: 1fr; padding: 60px 0; }
	.bk-single__grid { grid-template-columns: 1fr; gap: 40px; }
	.bk-single__gallery { position: static; }
	.bk-single { padding-bottom: 96px; }

	/* Sticky mobile add-to-cart bar (safe-area aware). */
	.bk-pdp-bar {
		display: flex; align-items: center; gap: 12px;
		position: fixed; left: 0; right: 0; bottom: 0; z-index: 9400;
		padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
		background: var(--bg); border-top: 1px solid var(--line);
	}
	.bk-pdp-bar__info { display: flex; flex-direction: column; min-width: 0; flex: 1; }
	.bk-pdp-bar__title { font-family: var(--font-serif); font-weight: 500; font-size: 15px; line-height: 1.15; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--ink, var(--fg)); }
	.bk-pdp-bar__price { font-family: var(--font-mono); font-size: 12px; color: var(--muted); }
	.bk-pdp-bar__price .amount { color: var(--muted); }
	.bk-pdp-bar__qty { display: flex; align-items: center; border: 1px solid var(--line); border-radius: 100px; flex: none; }
	.bk-pdp-bar__qty button { width: 40px; height: 40px; background: none; border: none; font-size: 18px; line-height: 1; color: var(--ink, var(--fg)); cursor: pointer; }
	.bk-pdp-bar__qty span { min-width: 22px; text-align: center; font-family: var(--font-mono); font-size: 13px; }
	.bk-pdp-bar__add {
		flex: none; min-height: 44px; padding: 0 20px; border: none; border-radius: 100px;
		background: var(--ink, var(--fg)); color: var(--bg); cursor: pointer;
		font-family: var(--font-mono); font-size: 12px; letter-spacing: .12em; white-space: nowrap;
	}

	/* Filter bar: category chips + sub-chips become horizontal-scroll rows with
	   44px touch targets; meta/sort drop to their own full-width row. */
	.bk-shop-filter__bar { flex-direction: column; align-items: stretch; flex-wrap: nowrap; gap: 12px; padding: 12px var(--pad-x); }
	.bk-shop-filter__cats,
	.bk-shop-filter__subs {
		flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch;
		margin: 0 calc(var(--pad-x) * -1); padding: 0 var(--pad-x); scrollbar-width: none;
	}
	.bk-shop-filter__subs { padding: 12px var(--pad-x); }
	.bk-shop-filter__cats::-webkit-scrollbar,
	.bk-shop-filter__subs::-webkit-scrollbar { display: none; }
	.bk-shop-filter__meta { justify-content: space-between; }
	.bk-shop-filter__subhead { white-space: nowrap; }
	.bk-chip { min-height: 44px; padding: 0 18px; display: inline-flex; align-items: center; white-space: nowrap; }
	.bk-subchip { min-height: 40px; padding: 0 15px; display: inline-flex; align-items: center; white-space: nowrap; }
	.bk-sort { padding: 10px 2px; }

	/* Checkout + cart: collapse WC's two-column billing/order-review to one,
	   full-width touch buttons. Payment flow (Dropp/Borgun) is untouched. */
	.woocommerce-checkout #customer_details.col2-set,
	.woocommerce-checkout .col2-set .col-1,
	.woocommerce-checkout .col2-set .col-2 { float: none; width: 100%; }
	.woocommerce-checkout #order_review,
	.woocommerce-checkout #order_review_heading { float: none; width: 100%; }
	.woocommerce #payment,
	.woocommerce-checkout-review-order { padding: 20px; }
	body.woocommerce #place_order,
	body.woocommerce .wc-proceed-to-checkout a.checkout-button,
	body.woocommerce table.cart td.actions .button { width: 100%; text-align: center; min-height: 48px; }
	.woocommerce table.cart .product-thumbnail { display: none; }
}