/*
Theme Name: Sonar Store
Theme URI: https://sonartechnologies.com/
Author: Sonar Technologies
Description: A focused black and gold WooCommerce theme for the Sonar Technologies store.
Version: 1.2.2
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Requires at least: 6.6
Requires PHP: 7.4
Text Domain: sonar-store
*/

:root {
	--ink: #141414;
	--navy: #162331;
	--gold: #c88b28;
	--gold-dark: #8b5814;
	--gold-light: #f6e5bf;
	--paper: #fff;
	--wash: #f6f5f2;
	--line: #e5e2dc;
	--muted: #656565;
	--green: #267a52;
	/* Small print on the #111 footer, including the legal/ABN line. 7.76:1,
	   which clears WCAG AAA for small text; #999 was 6.63:1 (AA only). */
	--footer-muted: #a6a6a6;
	/* Quoted-stock badge, 8.27:1 on --gold-light. */
	--quoted-ink: #5a3a00;
	/* The visible boundary of every control the store draws one on: the search
	   field, the facet selects and price inputs, the checkout fields and the
	   newsletter email field. SC 1.4.11 governs it, and each sits between a
	   white fill and the surface behind it, so 3:1 has to hold against both:
	   3.67:1 on --paper, 3.36:1 on --wash and 3.40:1 on the newsletter panel.
	   The values it replaces were 1.69:1/1.55:1 (#cbc7bf), 1.97:1/1.81:1
	   (#bdb8af) and 2.30:1/2.14:1 (#bca97e) — a control with no visible edge. */
	--control-line: #8a857c;
	--radius: 16px;
	--shadow: 0 16px 40px rgba(29, 24, 16, 0.1);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
/* The system UI stack, deliberately: the theme loads no webfont, so naming one
   it does not ship only described an intent the store never rendered. */
body { margin: 0; background: var(--paper); color: var(--ink); font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; line-height: 1.6; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .18em; }
img { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid var(--gold-dark); outline-offset: 3px; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: -6rem; left: 1rem; z-index: 1000; border-radius: 999px; background: var(--ink); color: #fff; padding: .7rem 1rem; }
/* The link carries .screen-reader-text as well, and moving a 1x1 clipped box
   into view shows nothing. Every part of that clip has to be undone here or the
   first tab stop on every page focuses something the visitor cannot see. */
.skip-link:focus { top: 1rem; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; clip-path: none; white-space: nowrap; }
.shell { width: min(1240px, calc(100% - 40px)); margin-inline: auto; }
.site-main { min-height: 45vh; }
.utility-bar { background: var(--ink); color: #fff; font-size: .78rem; }
.utility-bar .shell { display: flex; min-height: 34px; align-items: center; justify-content: space-between; gap: 1rem; }
.utility-bar p { margin: 0; }
.utility-link { color: #ddd; }
.site-header { position: sticky; top: 0; z-index: 30; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.97); backdrop-filter: blur(14px); }
.header-row { display: grid; grid-template-columns: minmax(150px,210px) minmax(260px,1fr) auto; align-items: center; gap: 2rem; min-height: 88px; }
/* 68px against an 88px header row. The lockup stacks SONAR over NEXT, so its
   aspect is near 1.4:1 and height is what decides legibility: at the previous
   58px each word rendered about 19px tall and only 82px wide, adrift in a
   150-210px column. Capped again below 700px, where the row is 72px. */
.custom-logo { width: auto; max-height: 68px; }
.brand-text { color: var(--ink); font-size: 1.2rem; font-weight: 900; letter-spacing: -.025em; text-decoration: none; }
.brand-text span { color: var(--gold-dark); }
.site-search form { display: flex; min-height: 48px; border: 1px solid var(--control-line); border-radius: 12px; background: var(--wash); overflow: hidden; }
/* The focus ring is the only thing marking this control as focused, so it is
   held to SC 1.4.11's 3:1 against both neighbours. --gold is 2.92:1 on white
   and 2.68:1 on --wash and cannot be one; --gold-dark is 5.99:1 and 5.50:1. */
.site-search form:focus-within { border-color: var(--gold-dark); box-shadow: 0 0 0 3px rgba(139,88,20,.28); }
.site-search input[type=search] { min-width: 0; flex: 1; border: 0; outline: 0; background: transparent; padding: 0 1rem; }
.site-search button { border: 0; background: var(--gold); color: var(--ink); padding: 0 1.25rem; font-weight: 850; cursor: pointer; }
.header-actions { display: flex; align-items: center; gap: .6rem; }
.header-action { display: inline-flex; min-height: 42px; align-items: center; border: 1px solid var(--line); border-radius: 999px; background: #fff; padding: .6rem .9rem; font-weight: 750; text-decoration: none; white-space: nowrap; }
.header-action:hover { border-color: var(--gold); }
.primary-navigation { border-top: 1px solid var(--line); }
.primary-navigation .shell, .primary-navigation ul { display: flex; min-height: 50px; align-items: center; justify-content: center; gap: 2rem; margin-block: 0; padding-left: 0; list-style: none; }
.primary-navigation a { font-size: .9rem; font-weight: 750; text-decoration: none; }
.primary-navigation a:hover { color: var(--gold-dark); }
.mobile-navigation { display: none; }
.hero { position: relative; overflow: hidden; background: radial-gradient(circle at 78% 20%,rgba(200,139,40,.26),transparent 24rem),linear-gradient(118deg,#0f171f 0%,var(--navy) 62%,#25394c 100%); color: #fff; }
.hero::after { position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size: 44px 44px; content: ''; mask-image: linear-gradient(90deg,#000,transparent 84%); pointer-events: none; }
.hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1.08fr .92fr; min-height: 500px; align-items: center; gap: 3rem; padding-block: 4.5rem; }
.eyebrow { margin: 0 0 1rem; color: var(--gold-dark); font-size: .78rem; font-weight: 850; letter-spacing: .14em; text-transform: uppercase; }
.hero .eyebrow { color: #e8ba63; }
/* Sized for a heading that names what the store sells rather than a five-word
   slogan: at the old 5.2rem ceiling the current H1 ran to five lines. */
.hero h1 { max-width: 860px; margin: 0; font-size: clamp(2.2rem,4.2vw,3.5rem); line-height: 1.04; letter-spacing: -.04em; }
.hero-copy { max-width: 650px; margin: 1.5rem 0 0; color: #d9e0e6; font-size: 1.12rem; line-height: 1.7; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2rem; }
.button, .woocommerce a.button { color: var(--ink); }
.button, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .wp-element-button { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; border: 1px solid transparent; border-radius: 9px; background: var(--gold); color: var(--ink); padding: .72rem 1.15rem; font-weight: 850; text-decoration: none; cursor: pointer; }
.button-secondary { border-color: rgba(255,255,255,.35); background: rgba(255,255,255,.07); color: #fff; }
.button:hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover { background: #dda543; color: var(--ink); transform: translateY(-1px); }
.hero-console { position: relative; justify-self: end; width: min(430px,100%); border: 1px solid rgba(255,255,255,.18); border-radius: 28px; background: rgba(255,255,255,.96); box-shadow: 0 30px 80px rgba(0,0,0,.35); color: var(--ink); padding: 2rem; transform: rotate(1.5deg); }
.hero-console::before { position: absolute; top: 1.5rem; left: -1rem; border-radius: 999px; background: var(--gold); padding: .4rem .75rem; content: 'SONAR / READY'; font-size: .7rem; font-weight: 900; letter-spacing: .08em; }
.hero-console strong { display: block; margin: 2.5rem 0 1rem; font-size: 1.6rem; line-height: 1.2; }
.hero-console ul { display: grid; gap: .65rem; margin: 0; padding: 0; list-style: none; }
.hero-console li { display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--line); padding-top: .65rem; color: var(--muted); }
.hero-console li span { color: var(--green); font-size: .74rem; font-weight: 850; }
.trust-strip { border-bottom: 1px solid var(--line); }
.trust-grid { display: grid; grid-template-columns: repeat(4,1fr); }
.trust-item { border-right: 1px solid var(--line); padding: 1.1rem 1.2rem; }
.trust-item:last-child { border-right: 0; }
.trust-item strong, .trust-item span { display: block; }
.trust-item strong { font-size: .9rem; }
.trust-item span { margin-top: .2rem; color: var(--muted); font-size: .78rem; }
.section { padding-block: 5rem; }
.section-wash { background: var(--wash); }
.section-dark { background: var(--ink); color: #fff; }
.section-dark .eyebrow { color: #e8ba63; }
.section-head { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 2rem; }
.section h2, .page-title { margin: 0; font-size: clamp(2rem,3vw,3.15rem); line-height: 1.05; letter-spacing: -.04em; }
.section-intro { max-width: 650px; margin: .7rem 0 0; color: var(--muted); }
.text-link { color: var(--gold-dark); font-weight: 800; }
.category-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; }
.category-card { display: grid; min-height: 180px; align-content: space-between; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; padding: 1.3rem; text-decoration: none; transition: border-color 160ms ease,transform 160ms ease,box-shadow 160ms ease; }
.category-card:hover { border-color: var(--gold); box-shadow: var(--shadow); transform: translateY(-3px); }
.category-mark { display: inline-flex; width: fit-content; min-width: 52px; min-height: 34px; align-items: center; justify-content: center; border-radius: 7px; background: var(--gold-light); color: #71440b; padding: .3rem .5rem; font-size: .68rem; font-weight: 900; letter-spacing: .08em; }
.category-card h3 { margin: 1.35rem 0 .35rem; font-size: 1.18rem; }
.category-card p { margin: 0; color: var(--muted); font-size: .88rem; }
.campaign-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; }
.campaign-card { min-height: 270px; border: 1px solid #3b3b3b; border-radius: var(--radius); background: linear-gradient(145deg,#242424,#171717); padding: 1.5rem; }
.campaign-number { color: #80683c; font-size: 2rem; font-weight: 850; }
.campaign-card h3 { margin: 2rem 0 .6rem; font-size: 1.45rem; line-height: 1.2; }
.campaign-card p { color: #bbb; }
.campaign-card a { color: #e4b359; font-weight: 800; }
.editor-promo { border: 1px solid var(--line); border-radius: var(--radius); background: #fff; padding: clamp(1.4rem,4vw,3rem); }
.solution-panel { display: grid; grid-template-columns: 1fr 1fr; border-radius: 24px; background: var(--ink); color: #fff; overflow: hidden; }
.solution-copy { padding: clamp(2rem,5vw,4.5rem); }
.solution-copy p { color: #c9c9c9; }
.solution-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: #3b3b3b; }
.solution-cell { display: grid; min-height: 180px; align-content: end; background: linear-gradient(145deg,#2d3439,#12171b); padding: 1.5rem; }
.solution-cell span { color: #dfaa50; font-size: .74rem; font-weight: 850; text-transform: uppercase; }
.solution-cell strong { margin-top: .35rem; }
.newsletter-section { background: var(--gold-light); }
.newsletter-panel { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: clamp(2rem,6vw,6rem); }
.newsletter-provider { border: 1px solid rgba(113,68,11,.25); border-radius: var(--radius); background: rgba(255,255,255,.65); padding: 1.4rem; }
.newsletter-consent { color: var(--muted); font-size: .82rem; }
.newsletter-provider form { display: grid; gap: .75rem; }
.newsletter-provider input:not([type=checkbox]) { width: 100%; border: 1px solid var(--control-line); border-radius: 8px; background: #fff; padding: .8rem; }
.content-shell { padding-block: 4rem; }
.entry-card { border-bottom: 1px solid var(--line); padding-block: 1.5rem; }
.entry-title { margin-bottom: .4rem; }
.entry-title a { text-decoration: none; }
.pagination { margin-top: 2rem; }

/* WooCommerce owns all product, cart, checkout and payment markup. */
.woocommerce .woocommerce-breadcrumb { margin-bottom: 1.5rem; color: var(--muted); }
/* Wraps rather than counting columns: how many facets the bar carries depends
   on which archive it is on, and a fixed column count is wrong on one of them. */
.catalog-filters { display: flex; flex-wrap: wrap; align-items: end; gap: .75rem; margin: 0 0 1.5rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--wash); padding: 1rem; }
.catalog-filters label { display: grid; flex: 1 1 150px; gap: .3rem; color: var(--muted); font-size: .78rem; font-weight: 750; }
.catalog-filters select, .catalog-filters input[type=number] { min-height: 42px; border: 1px solid var(--control-line); border-radius: 8px; background: #fff; padding: .5rem .65rem; }
.catalog-filters .catalog-stock { display: flex; flex: 0 0 auto; min-height: 42px; align-items: center; gap: .4rem; color: var(--ink); white-space: nowrap; }
.catalog-filters button { min-height: 42px; border: 0; border-radius: 8px; background: var(--gold); padding: .5rem .9rem; font-weight: 850; cursor: pointer; }
.catalog-filters > a { min-height: 42px; align-content: center; color: var(--gold-dark); font-weight: 750; }
/* Its own line under the controls, whatever the bar wrapped to. */
.catalog-filters .catalog-note { flex: 1 1 100%; margin: 0; color: var(--muted); font-size: .78rem; }
.catalogue-recovery { margin-top: 1.5rem; }
.search-scope { margin: 0 0 1.25rem; }
.catalog-chips { margin: 0 0 1.25rem; }
.catalog-chips ul { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.catalog-chips a { display: inline-flex; min-height: 36px; align-items: center; gap: .45rem; border: 1px solid var(--line); border-radius: 999px; background: var(--wash); padding: .35rem .8rem; color: var(--ink); font-size: .82rem; font-weight: 750; text-decoration: none; }
.catalog-chips a:hover { border-color: var(--gold-dark); }
.catalog-chips a span[aria-hidden] { color: var(--gold-dark); font-weight: 900; }
/* WooCommerce's own stock line, re-worded for the catalogue's `call`
   availability by inc/stock.php. */
.sonar-quoted-stock { display: inline-block; border-radius: 8px; background: var(--gold-light); padding: .5rem .8rem; color: var(--quoted-ink); font-size: .88rem; font-weight: 750; }
.woocommerce ul.products { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1rem; }
.woocommerce ul.products::before, .woocommerce ul.products::after { display: none; }
.woocommerce ul.products li.product { display: flex; width: auto; min-width: 0; margin: 0; border: 1px solid var(--line); border-radius: 15px; flex-direction: column; background: #fff; overflow: hidden; transition: transform 160ms ease,box-shadow 160ms ease; }
.woocommerce ul.products li.product:hover { box-shadow: var(--shadow); transform: translateY(-3px); }
.woocommerce ul.products li.product a img { height: 220px; margin: 0; background: linear-gradient(145deg,#fff,#f3f1ec); object-fit: contain; padding: 1.4rem; }
.woocommerce ul.products li.product .woocommerce-loop-product__title { flex: 1; padding: 1rem 1rem .5rem; font-size: .98rem; line-height: 1.45; }
.woocommerce ul.products li.product .price { margin: 0; padding: 0 1rem; color: var(--ink); font-size: 1.15rem; font-weight: 850; }
/* The same badge on a grid tile, sized to sit under the price without
   competing with it. */
.woocommerce ul.products li.product .stock { margin: .55rem 1rem 0; padding: .4rem .6rem; font-size: .76rem; }
.woocommerce ul.products li.product .button { margin: 1rem; }
.woocommerce ul.products li.product a.added_to_cart { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; margin: -.5rem 1rem 1rem; border: 1px solid var(--ink); border-radius: 9px; background: var(--ink); color: #fff; padding: .65rem 1rem; font-weight: 850; text-decoration: none; }
.woocommerce ul.products li.product a.added_to_cart:hover { background: #333; color: #fff; transform: translateY(-1px); }
.woocommerce div.product form.cart .button { background: var(--gold); color: var(--ink); }
.woocommerce span.onsale { min-width: 0; min-height: 0; border-radius: 999px; background: var(--gold); color: var(--ink); padding: .35rem .6rem; line-height: 1.2; }
.woocommerce div.product { display: flow-root; }
.woocommerce div.product .product_title { letter-spacing: -.035em; }
.woocommerce div.product p.price, .woocommerce div.product span.price { color: var(--gold-dark); }
.woocommerce-message, .woocommerce-info, .woocommerce-error { border-top-color: var(--gold); background: var(--wash); }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .woocommerce select, .select2-container--default .select2-selection--single { min-height: 44px; border: 1px solid var(--control-line); border-radius: 8px; background: #fff; padding: .65rem; }
.woocommerce table.shop_table { border-color: var(--line); border-radius: 10px; }
.woocommerce-checkout-review-order, .woocommerce-cart-form, .cart_totals { border: 1px solid var(--line); border-radius: var(--radius); background: #fff; padding: 1.2rem; }
/* Not scoped to the checkout page: the Cart block renders the same address form
   in its shipping calculator, and functions.php forces AU on the strength of
   this control being invisible everywhere the customer meets it. */
#billing_country_field, #shipping_country_field, #calc_shipping_country_field, .wc-block-components-address-form__country { display: none; }
.woocommerce #payment { background: var(--wash); }
.woocommerce #payment div.payment_box { background: #eae7e0; }
.woocommerce #payment div.payment_box::before { border-bottom-color: #eae7e0; }
.wc-block-grid__products { gap: 1rem; margin: 0; }
.wc-block-grid__product { border: 1px solid var(--line); border-radius: 15px; background: #fff; padding-bottom: 1rem; overflow: hidden; }
.wc-block-grid__product-image img { height: 220px; background: linear-gradient(145deg,#fff,#f3f1ec); object-fit: contain; padding: 1.4rem; }
.wc-block-grid__product-title { padding-inline: 1rem; font-size: .98rem; line-height: 1.45; }
.wc-block-grid__product-price { padding-inline: 1rem; font-weight: 850; }
.wc-block-grid__product-add-to-cart .wp-block-button__link { border-radius: 9px; background: var(--gold); color: var(--ink); font-weight: 850; }
.site-footer { background: #111; color: #fff; padding: 4rem 0 1.5rem; }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 3rem; }
.footer-brand p { max-width: 420px; color: #aaa; }
.footer-heading { margin: 0 0 1rem; color: #e4b359; font-size: .82rem; text-transform: uppercase; }
.footer-menu { margin: 0; padding: 0; list-style: none; }
.footer-menu li { margin: .55rem 0; }
.footer-menu a { color: #c6c6c6; }
.footer-trust { margin-top: 2rem; border-top: 1px solid #333; padding-top: 1rem; }
.footer-trust ul { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; margin: 0; padding: 0; list-style: none; }
.footer-trust a { color: #c6c6c6; font-size: .82rem; }
.footer-base { display: flex; justify-content: space-between; gap: 1rem; margin-top: 3rem; border-top: 1px solid #333; padding-top: 1.25rem; color: var(--footer-muted); font-size: .76rem; }
.footer-legal { text-wrap: balance; }
.footer-gst { margin: .75rem 0 0; color: var(--footer-muted); font-size: .78rem; }
.payment-methods { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.payment-methods li { display: flex; align-items: center; border: 1px solid #333; border-radius: 6px; background: #fff; padding: .3rem .5rem; }
.payment-methods img { max-height: 22px; width: auto; }
.payment-method { color: var(--ink); font-size: .72rem; font-weight: 800; }

@media (max-width: 980px) {
	.header-row { grid-template-columns: 160px 1fr auto; gap: 1rem; }
	.header-actions .header-action:first-child { display: none; }
	.primary-navigation .shell, .primary-navigation ul { justify-content: flex-start; gap: 1.2rem; overflow-x: auto; }
	.hero-grid { grid-template-columns: 1fr; }
	.hero-console { display: none; }
	.woocommerce ul.products { grid-template-columns: repeat(2,minmax(0,1fr)); }
	.campaign-grid { grid-template-columns: 1fr; }
	.solution-panel, .newsletter-panel { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
	.shell { width: min(100% - 24px,1240px); }
	.primary-navigation { display: none; }
	/* The tagline goes rather than the support link: below this width the
	   utility bar is the only place a phone shopper can find a way to ask a
	   question before spending $2,400. */
	.utility-bar p { display: none; }
	.utility-bar .shell { justify-content: center; }
	.mobile-navigation { display: block; border-top: 1px solid var(--line); }
	.mobile-navigation summary { min-height: 48px; padding: .75rem 1rem; font-weight: 800; text-align: center; cursor: pointer; }
	.mobile-navigation nav { max-height: 60vh; border-top: 1px solid var(--line); background: var(--wash); overflow-y: auto; }
	.mobile-navigation ul { display: grid; gap: 0; margin: 0; padding: .5rem 0; list-style: none; }
	.mobile-navigation li + li { border-top: 1px solid var(--line); }
	.mobile-navigation a { display: block; padding: .8rem .25rem; font-weight: 750; text-decoration: none; }
	/* Kept sticky, and compacted to earn it. A 50-product category is thousands
	   of pixels of scroll on a phone and the search field is the way out of it;
	   static put that field at the top of the document and nowhere else. An
	   opened menu scrolls inside itself rather than filling the viewport. */
	.header-row { grid-template-columns: 1fr auto; min-height: 56px; }
	.custom-logo { max-height: 40px; }
	.site-search { grid-column: 1 / -1; margin-bottom: .5rem; }
	.site-search form { min-height: 44px; }
	.mobile-navigation summary { min-height: 44px; padding: .5rem 1rem; }
	.hero-grid { min-height: 500px; padding-block: 3.5rem; }
	.hero h1 { font-size: clamp(1.9rem,7.5vw,2.6rem); }
	.trust-grid { grid-template-columns: 1fr 1fr; }
	.section { padding-block: 3.5rem; }
	.section-head { align-items: start; flex-direction: column; }
	.category-grid { grid-template-columns: 1fr; }
	/* Two columns, not one: a tile is an image, a title, a price, a stock badge
	   and a button, so one column made a 50-product category around 19,000px of
	   scrolling. The tile is retuned for the narrower track below. */
	.woocommerce ul.products { grid-template-columns: repeat(2,minmax(0,1fr)); }
	.woocommerce ul.products[class*=columns-] li.product { float: none; width: 100%; margin: 0; }
	.woocommerce ul.products li.product a img { height: 150px; padding: .8rem; }
	.woocommerce ul.products li.product .woocommerce-loop-product__title { padding: .7rem .7rem .4rem; font-size: .9rem; }
	.woocommerce ul.products li.product .price { padding-inline: .7rem; font-size: 1.05rem; }
	.woocommerce ul.products li.product .stock { margin: .45rem .7rem 0; }
	.woocommerce ul.products li.product .button { margin: .7rem; }
	.woocommerce ul.products li.product a.added_to_cart { margin: -.35rem .7rem .7rem; }
	.wc-block-grid.has-4-columns .wc-block-grid__product { max-width: 50%; flex: 1 0 50%; }
	.wc-block-grid__product-image img { height: 150px; padding: .8rem; }
	.catalog-filters label { flex-basis: 100%; }
	.solution-cell { min-height: 140px; }
	.footer-grid { grid-template-columns: 1fr; }
	.footer-base { flex-direction: column; }
	.woocommerce-cart-form { overflow-x: auto; }
}
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { transition-duration: .01ms !important; }
}