/*
 * OSA Arsenal — base utilities & component styles
 * Strictly black/white/paper. Brutalist catalog. Museum-curatorial.
 * Companion to theme.json — defines utility classes referenced from
 * patterns, block render templates, and WooCommerce overrides.
 */

:root {
	--osa-ink:         #0A0A0A;
	--osa-ink-2:       #1A1A1A;
	--osa-ink-3:       #2A2A2A;
	--osa-steel-1:     #5A5A5A;
	--osa-steel-2:     #8A8A8A;
	--osa-paper-edge:  #D9D9D9;
	--osa-paper-tint:  #EFEFEF;
	--osa-paper:       #FFFFFF;

	--osa-f-display:  'Archivo Black', 'Helvetica Neue', sans-serif;
	--osa-f-sans:     'Archivo', 'Helvetica Neue', sans-serif;
	--osa-f-mono:     'IBM Plex Mono', ui-monospace, 'Menlo', monospace;
	--osa-f-serif:    'Libre Caslon Text', 'Times New Roman', serif;
	--osa-f-serif-d:  'Instrument Serif', 'Libre Caslon Text', serif;
}

html,
body {
	background: var(--osa-paper);
	color: var(--osa-ink);
}

* { box-sizing: border-box; }

/* ===== Type utilities ===== */
.osa-display {
	font-family: var(--osa-f-display);
	font-weight: 900;
	letter-spacing: -0.01em;
	line-height: 0.95;
}
.osa-sans   { font-family: var(--osa-f-sans);    }
.osa-mono   { font-family: var(--osa-f-mono);    }
.osa-serif  { font-family: var(--osa-f-serif);   }
.osa-serif-d {
	font-family: var(--osa-f-serif-d);
	font-style: italic;
	line-height: 1.3;
}

.osa-caps {
	text-transform: uppercase;
	letter-spacing: 0.08em;
}
.osa-mono.osa-caps,
.osa-mono-caps {
	font-family: var(--osa-f-mono);
	text-transform: uppercase;
	letter-spacing: 0.18em;
}

/* ===== Hairline rules ===== */
.osa-hr,
.osa-hairline {
	border: 0;
	border-top: 1px solid var(--osa-ink);
	margin: 0;
}
.osa-hr-soft {
	border: 0;
	border-top: 1px solid var(--osa-paper-edge);
	margin: 0;
}

/* ===== B/W image placeholder ===== */
.osa-bw-img {
	position: relative;
	display: block;
	overflow: hidden;
	background:
		repeating-linear-gradient(45deg, var(--osa-paper-edge) 0 1px, transparent 1px 9px),
		var(--osa-paper-tint);
}
.osa-bw-img__label {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--osa-f-mono);
	font-size: 10px;
	color: var(--osa-steel-1);
	letter-spacing: 0.18em;
	text-transform: uppercase;
}
.osa-bw-img--ar-1-1   { aspect-ratio: 1 / 1;  }
.osa-bw-img--ar-4-3   { aspect-ratio: 4 / 3;  }
.osa-bw-img--ar-5-4   { aspect-ratio: 5 / 4;  }
.osa-bw-img--ar-3-4   { aspect-ratio: 3 / 4;  }
.osa-bw-img--ar-16-10 { aspect-ratio: 16 / 10; }
.osa-bw-img--ar-21-9  { aspect-ratio: 21 / 9; }
.osa-bw-img--flat {
	background: var(--osa-paper-tint);
}

/* ===== Logo ===== */
.osa-logo {
	display: block;
	image-rendering: auto;
	height: auto;
	max-width: 100%;
}

/* ===== LOT badge (overlay pill) ===== */
.osa-lot-badge {
	position: absolute;
	top: 10px;
	left: 10px;
	background: var(--osa-ink);
	color: var(--osa-paper);
	font-family: var(--osa-f-mono);
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	padding: 4px 7px;
	line-height: 1;
	z-index: 2;
}

/* ===== Grade chip ===== */
.osa-grade-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var(--osa-f-mono);
	font-weight: 700;
	letter-spacing: 0.06em;
	border: 1px solid var(--osa-ink);
	background: var(--osa-paper);
	color: var(--osa-ink);
	line-height: 1;
	white-space: nowrap;
}
.osa-grade-chip__pct { font-weight: 800; }
.osa-grade-chip__sep { opacity: 0.5; font-weight: 400; }
.osa-grade-chip__code,
.osa-grade-chip__name {
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--osa-steel-1);
}
.osa-grade-chip--sm {
	font-size: 11px;
	padding: 4px 8px;
}
.osa-grade-chip--md {
	font-size: 12px;
	padding: 5px 10px;
}
.osa-grade-chip--lg {
	flex-direction: column;
	align-items: center;
	gap: 2px;
	font-size: 18px;
	padding: 10px 16px 8px;
}
.osa-grade-chip--lg .osa-grade-chip__name {
	font-size: 9px;
	color: var(--osa-steel-1);
}
.osa-grade-chip--overlay {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 2;
}

/* ===== Condition scale (NRA 8-tier) ===== */
.osa-condition-scale {
	font-family: var(--osa-f-mono);
	border: 1px solid var(--osa-ink);
	background: var(--osa-paper);
}
.osa-condition-scale__title {
	font-size: 10px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--osa-steel-1);
	padding: 8px 12px;
	border-bottom: 1px solid var(--osa-paper-edge);
}
.osa-condition-scale__grid {
	display: grid;
	grid-template-columns: repeat(8, 1fr);
}
.osa-condition-scale__cell {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	padding: 12px 6px;
	border-right: 1px solid var(--osa-paper-edge);
	text-align: center;
	min-height: 70px;
}
.osa-condition-scale__cell:last-child { border-right: 0; }
.osa-condition-scale__cell-pct {
	font-size: 17px;
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--osa-ink);
	line-height: 1;
}
.osa-condition-scale__cell-code {
	font-size: 9px;
	font-weight: 600;
	letter-spacing: 0.18em;
	color: var(--osa-steel-1);
	text-transform: uppercase;
}
.osa-condition-scale__cell-label {
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--osa-paper);
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
}
.osa-condition-scale__cell--active {
	background: var(--osa-ink);
	color: var(--osa-paper);
	border-right-color: var(--osa-ink);
}
.osa-condition-scale__cell--active .osa-condition-scale__cell-pct {
	color: var(--osa-paper);
	font-size: 22px;
}
.osa-condition-scale__legend {
	display: flex;
	justify-content: space-between;
	padding: 8px 12px;
	font-size: 9px;
	color: var(--osa-steel-1);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	border-top: 1px solid var(--osa-paper-edge);
}

/* ===== Marquee / ticker strip (static, centered) ===== */
.osa-marquee {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	border-top: 1px solid var(--osa-ink);
	border-bottom: 1px solid var(--osa-ink);
	padding: 12px 24px;
	font-family: var(--osa-f-mono);
	font-size: 11px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--osa-ink);
}
.osa-marquee--invert {
	background: var(--osa-ink);
	color: var(--osa-paper);
}
.osa-marquee__track {
	display: inline-flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px 32px;
}
.osa-marquee__sep { opacity: 0.5; }

/* ===== Product card (compact, A variant) ===== */
.osa-card {
	display: flex;
	flex-direction: column;
	background: var(--osa-paper);
	border: 1px solid var(--osa-ink);
	text-decoration: none;
	color: inherit;
}
.osa-card__media {
	position: relative;
	border-bottom: 1px solid var(--osa-ink);
}
.osa-card__body {
	padding: 12px 14px 14px;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.osa-card__name {
	font-family: var(--osa-f-sans);
	font-weight: 800;
	font-size: 13px;
	line-height: 1.2;
	color: var(--osa-ink);
}
.osa-card__meta {
	font-family: var(--osa-f-mono);
	font-size: 10px;
	color: var(--osa-steel-1);
	letter-spacing: 0.1em;
	text-transform: uppercase;
}
.osa-card__price {
	margin-top: 4px;
	font-family: var(--osa-f-mono);
	font-weight: 600;
	font-size: 13px;
	color: var(--osa-ink);
}

/* ===== Catalog grid ===== */
.osa-catalog-grid {
	display: grid;
	gap: 0;
	border: 1px solid var(--osa-ink);
	margin-top: -1px; /* collapses borders if stacked */
}
.osa-catalog-grid > * {
	border-right: 1px solid var(--osa-ink);
	border-bottom: 1px solid var(--osa-ink);
	margin: 0 -1px -1px 0; /* collapse */
}
.osa-catalog-grid--cols-2 { grid-template-columns: repeat(2, 1fr); }
.osa-catalog-grid--cols-3 { grid-template-columns: repeat(3, 1fr); }
.osa-catalog-grid--cols-4 { grid-template-columns: repeat(4, 1fr); }
.osa-catalog-grid--cols-5 { grid-template-columns: repeat(5, 1fr); }
.osa-catalog-grid--cols-6 { grid-template-columns: repeat(6, 1fr); }

/* ===== Specs table ===== */
.osa-specs {
	width: 100%;
	border-collapse: collapse;
	font-family: var(--osa-f-mono);
	font-size: 13px;
}
.osa-specs th,
.osa-specs td {
	border-bottom: 1px solid var(--osa-paper-edge);
	padding: 9px 0;
	text-align: left;
	font-weight: 400;
	letter-spacing: 0.06em;
}
.osa-specs th {
	width: 40%;
	color: var(--osa-steel-1);
	text-transform: uppercase;
	font-weight: 500;
	letter-spacing: 0.14em;
}
.osa-specs td {
	color: var(--osa-ink);
	font-weight: 400;
}

/* ===== Footer (retail + dealer) ===== */
.osa-footer {
	background: var(--osa-ink);
	color: var(--osa-paper);
	padding: 56px 56px 24px;
}
.osa-footer__grid {
	display: grid;
	grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
	gap: 48px;
}
.osa-footer__brand .osa-footer__logo {
	height: 88px;
	width: auto;
	max-width: 100%;
	display: block;
}
.osa-footer__legal {
	font-family: var(--osa-f-mono);
	font-size: 11px;
	line-height: 1.6;
	color: var(--osa-steel-2);
	margin: 24px 0 0;
}
.osa-footer__heading {
	font-family: var(--osa-f-mono);
	font-size: 10px;
	letter-spacing: 0.2em;
	color: var(--osa-paper-edge);
	text-transform: uppercase;
	margin: 0 0 16px;
}
.osa-footer__list {
	list-style: none;
	padding: 0;
	margin: 0;
	font-family: var(--osa-f-sans);
	font-size: 13px;
	line-height: 1.9;
	color: var(--osa-paper);
}
.osa-footer__list a {
	color: inherit;
	text-decoration: none;
}
.osa-footer__list a:hover { color: var(--osa-paper-edge); }

.osa-footer__bar {
	display: flex;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	margin-top: 32px;
	padding-top: 18px;
	border-top: 1px solid var(--osa-ink-3);
	font-family: var(--osa-f-mono);
	font-size: 10px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--osa-steel-2);
}

@media (max-width: 900px) {
	.osa-footer { padding: 40px 24px 24px; }
	.osa-footer__grid {
		grid-template-columns: 1fr 1fr;
		gap: 32px;
	}
	.osa-footer__brand { grid-column: 1 / -1; }
	.osa-footer__bar { flex-direction: column; }
}

/* ===== Header sits flush at the top of the page =====
 * Zero out any inadvertent margin/padding that creeps in from WP wrappers
 * so the dark utility strip starts at y=0 (below admin bar when present)
 * and reaches edge-to-edge horizontally.
 */
html, body { margin: 0; }
body .wp-site-blocks {
	padding-top: 0;
	margin-top: 0;
}
.wp-site-blocks > header.wp-block-template-part,
.wp-site-blocks > header {
	margin-top: 0;
	margin-left: 0;
	margin-right: 0;
}
.osa-utility-strip { width: 100%; box-sizing: border-box; }

/* ===== Sticky header (Customizer toggle: osa_sticky_header) ===== */
body.osa-has-sticky-header .wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 50;
	background: var(--osa-paper);
}
body.osa-has-sticky-header.admin-bar .wp-site-blocks > header.wp-block-template-part {
	top: 32px;
}
@media screen and (max-width: 782px) {
	body.osa-has-sticky-header.admin-bar .wp-site-blocks > header.wp-block-template-part {
		top: 46px;
	}
}
/* On mobile the utility strip stacks to ~2 rows; sticking the whole header
   eats too much viewport while scrolling. Only stick the main header row
   (logo + hamburger + icons); utility strip scrolls away with content. */
@media (max-width: 900px) {
	body.osa-has-sticky-header .wp-site-blocks > header.wp-block-template-part {
		position: static;
	}
	body.osa-has-sticky-header .osa-header-row {
		position: sticky;
		top: 0;
		background: var(--osa-paper);
		border-bottom: 1px solid var(--osa-ink);
	}
	body.osa-has-sticky-header.admin-bar .osa-header-row {
		top: 46px;
	}
}

/* ===== Header utility strip (dark) ===== */
.osa-utility-strip {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 24px;
	padding: 9px 24px;
	background: var(--osa-ink);
	color: var(--osa-paper);
	font-family: var(--osa-f-mono);
	font-size: 10px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}
.osa-utility-strip__left {
	display: inline-flex;
	align-items: center;
	gap: 12px;
}
.osa-utility-strip__msg {
	color: var(--osa-paper-edge);
}
.osa-utility-strip__dealers {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}
.osa-utility-strip__arrow {
	display: inline-block;
	flex-shrink: 0;
	vertical-align: middle;
}
.osa-utility-strip__right {
	display: inline-flex;
	align-items: center;
	gap: 24px;
}
.osa-utility-strip__right a {
	color: var(--osa-paper-edge);
	text-decoration: none;
	letter-spacing: 0.18em;
	font-weight: 500;
}
.osa-utility-strip__right a:hover { color: var(--osa-paper); }
@media (max-width: 900px) {
	.osa-utility-strip { flex-direction: column; gap: 8px; padding: 8px 16px; }
	.osa-utility-strip__right { gap: 14px; flex-wrap: wrap; justify-content: center; }
}

/* ===== Retail header main row ===== */
.osa-header-row {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 32px;
	padding: 14px 24px;
	background: var(--osa-paper);
	position: relative;
}
/* Hamburger only renders on mobile (≤900px) — hidden on desktop. */
.osa-header-hamburger {
	display: none;
}
.osa-header-hamburger__icon--close { display: none; }
.osa-nav-open .osa-header-hamburger__icon--open  { display: none; }
.osa-nav-open .osa-header-hamburger__icon--close { display: block; }
.osa-nav-backdrop { display: none; }
/* Account link inside the mobile drawer — hidden on desktop (account is in icon row). */
.osa-main-nav__account-link { display: none; }
.osa-header-logo {
	display: inline-flex;
	align-items: center;
	min-width: 0;
}
.osa-header-logo .osa-logo {
	height: 56px;
	width: auto;
	display: block;
}
.osa-main-nav {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 20px;
	min-width: 0;
}
.osa-main-nav__link {
	font-family: var(--osa-f-sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--osa-ink);
	text-decoration: none;
	padding-bottom: 6px;
	border-bottom: 2px solid transparent;
	transition: border-color 0.15s ease;
	white-space: nowrap;
}
.osa-main-nav__link:hover,
.osa-main-nav__link.is-active {
	border-bottom-color: var(--osa-ink);
}
.osa-header-controls {
	display: flex;
	align-items: center;
	gap: 18px;
	flex-wrap: nowrap;
}
.osa-header-icon {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	color: var(--osa-ink);
	background: transparent;
	border: 0;
	padding: 0;
	cursor: pointer;
	text-decoration: none;
	transition: color 0.15s ease;
}
.osa-header-icon:hover { color: var(--osa-steel-1); }
.osa-header-icon svg {
	display: block;
	width: 22px;
	height: 22px;
}
.osa-header-icon__badge {
	position: absolute;
	top: -4px;
	right: -6px;
	min-width: 18px;
	height: 18px;
	padding: 0 5px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--osa-ink);
	color: var(--osa-paper);
	border-radius: 999px;
	font-family: var(--osa-f-mono);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1;
}
.osa-header-icon--cart:hover .osa-header-icon__badge { background: var(--osa-steel-1); }

/* Mobile header: hamburger | centered logo | controls + off-canvas nav drawer. */
@media (max-width: 900px) {
	.osa-header-row {
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 8px;
		padding: 12px 16px;
		text-align: initial;
		/* Sits above drawer (1000) + backdrop (999) so the hamburger/X stays tappable when drawer is open. */
		z-index: 1001;
	}
	.osa-header-hamburger {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 36px;
		height: 36px;
		background: transparent;
		border: 0;
		padding: 0;
		cursor: pointer;
		color: var(--osa-ink);
		flex: 0 0 auto;
	}
	.osa-header-hamburger:hover { color: var(--osa-steel-1); }
	/* Logo optically centered relative to viewport, independent of side controls' widths. */
	.osa-header-logo {
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		pointer-events: auto;
	}
	.osa-header-logo .osa-logo {
		height: 38px;
	}
	.osa-header-controls {
		gap: 14px;
		flex: 0 0 auto;
		flex-wrap: nowrap;
	}

	/* Nav becomes left-side off-canvas drawer. */
	.osa-main-nav {
		position: fixed;
		top: 0;
		left: 0;
		bottom: 0;
		width: 280px;
		max-width: 82vw;
		background: var(--osa-paper);
		border-right: 1px solid var(--osa-ink);
		display: flex;
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		flex-wrap: nowrap;
		gap: 0;
		padding: 72px 24px 32px;
		transform: translateX(-100%);
		transition: transform 0.25s ease;
		z-index: 1000;
		overflow-y: auto;
		will-change: transform;
	}
	.osa-main-nav__link {
		display: block;
		font-size: 14px;
		padding: 16px 0;
		border-bottom: 1px solid var(--osa-paper-edge);
		border-top: none;
		text-align: left;
		white-space: normal;
	}
	.osa-main-nav__link:hover,
	.osa-main-nav__link.is-active {
		border-bottom-color: var(--osa-ink);
	}

	/* Account link in drawer: same row styling as menu items, plus a stronger
	   divider above to separate "site nav" from "personal/account" zone. */
	.osa-main-nav__account-link {
		display: block;
		font-family: var(--osa-f-sans);
		font-size: 14px;
		font-weight: 700;
		letter-spacing: 0.14em;
		text-transform: uppercase;
		color: var(--osa-ink);
		text-decoration: none;
		padding: 16px 0;
		margin-top: 16px;
		border-top: 1px solid var(--osa-ink);
		border-bottom: 1px solid var(--osa-paper-edge);
		text-align: left;
	}
	.osa-main-nav__account-link:hover { color: var(--osa-steel-1); }

	/* Hide the header-row account icon on mobile — it's moved into the drawer above. */
	.osa-header-icon--account { display: none; }

	.osa-nav-open .osa-main-nav { transform: translateX(0); }

	.osa-nav-backdrop {
		display: block;
		position: fixed;
		inset: 0;
		background: rgba(10, 10, 10, 0.45);
		z-index: 999;
	}
	.osa-nav-backdrop[hidden] { display: none; }

	/* Lock body scroll while drawer is open. */
	html.osa-nav-open,
	html.osa-nav-open body { overflow: hidden; }
}

/* ===== Dealer status strip ===== */
.osa-dealer-strip {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 6px 20px;
	background: var(--osa-ink);
	color: var(--osa-steel-2);
	border-bottom: 1px solid var(--osa-ink-3);
	font-family: var(--osa-f-mono);
	font-size: 10px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}
.osa-dealer-strip__status {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.osa-dealer-strip__dot {
	width: 6px;
	height: 6px;
	background: var(--osa-paper);
	display: inline-block;
}

/* ===== WP block buttons (normalize fill vs outline to identical box) =====
 * WP core's is-style-outline applies a 2px border on the link without
 * compensating padding, leaving outline buttons ~3px shorter than fill.
 * Force same border-width / padding / box-sizing on both so they land on
 * the exact same baseline.
 */
.wp-block-button.is-style-fill .wp-block-button__link,
.wp-block-button.is-style-outline .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1.5px solid var(--osa-ink);
	border-radius: 0;
	padding: 12px 20px;
	box-sizing: border-box;
	font-family: var(--osa-f-mono);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	line-height: 1.1;
	min-height: 42px;
	white-space: nowrap;
	transition: background-color 0.15s ease, color 0.15s ease;
}
.wp-block-button.is-style-fill .wp-block-button__link {
	background: var(--osa-ink);
	color: var(--osa-paper);
}
.wp-block-button.is-style-fill .wp-block-button__link:hover {
	background: var(--osa-paper);
	color: var(--osa-ink);
}
.wp-block-button.is-style-outline .wp-block-button__link {
	background: var(--osa-paper);
	color: var(--osa-ink);
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: var(--osa-ink);
	color: var(--osa-paper);
}

/* ===== CTA / buttons ===== */
.osa-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 12px 20px;
	border: 1.5px solid var(--osa-ink);
	background: var(--osa-ink);
	color: var(--osa-paper);
	font-family: var(--osa-f-mono);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease;
}
.osa-btn:hover {
	background: var(--osa-paper);
	color: var(--osa-ink);
}
.osa-btn--outline {
	background: var(--osa-paper);
	color: var(--osa-ink);
}
.osa-btn--outline:hover {
	background: var(--osa-ink);
	color: var(--osa-paper);
}
.osa-btn--sm {
	padding: 7px 12px;
	font-size: 10px;
}

/* ===== Cart / Checkout block tweaks =====
 * Apply the brutalist palette to the WC block-based cart/checkout. We don't
 * try to redesign the WC blocks wholesale — just normalize borders, fonts,
 * and accents so they feel native.
 */
.wc-block-cart, .wc-block-checkout {
	font-family: var(--osa-f-sans);
	color: var(--osa-ink);
}
.wc-block-cart-item__product-name,
.wc-block-components-product-name {
	font-family: var(--osa-f-sans) !important;
	font-weight: 800 !important;
	color: var(--osa-ink) !important;
	text-decoration: none !important;
}
.wc-block-components-product-price__value,
.wc-block-components-formatted-money-amount,
.wc-block-components-totals-item__value {
	font-family: var(--osa-f-mono) !important;
	font-weight: 600 !important;
}
.wc-block-components-totals-item__label,
.wc-block-cart-items__header-product,
.wc-block-cart-items__header-total {
	font-family: var(--osa-f-mono) !important;
	font-size: 10px !important;
	letter-spacing: 0.22em !important;
	text-transform: uppercase !important;
	color: var(--osa-steel-1) !important;
}
.wc-block-components-button,
.wc-block-cart__submit-button,
.wc-block-checkout__actions_row button {
	border-radius: 0 !important;
	background: var(--osa-ink) !important;
	color: var(--osa-paper) !important;
	font-family: var(--osa-f-mono) !important;
	letter-spacing: 0.18em !important;
	text-transform: uppercase !important;
	font-weight: 600 !important;
	font-size: 11px !important;
	border: 1.5px solid var(--osa-ink) !important;
}
.wc-block-components-totals-wrapper,
.wc-block-cart-items > * + *,
.wc-block-components-order-summary-item {
	border-color: var(--osa-paper-edge) !important;
}
.wc-block-components-text-input input,
.wc-block-components-select select,
.wc-block-components-form .wc-block-components-text-input input {
	border-radius: 0 !important;
	border-color: var(--osa-ink) !important;
}
/* ===== Account header (above two-column WC area) ===== */
.osa-account-header {
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: 48px;
	align-items: end;
	padding: 8px 0 32px;
	border-bottom: 1px solid var(--osa-ink);
	margin-bottom: 32px;
}
.osa-account-header__since {
	font-size: 10px;
	letter-spacing: 0.22em;
	color: var(--osa-steel-1);
	margin: 0 0 8px;
}
.osa-account-header__name {
	font-family: var(--osa-f-display);
	font-size: 54px;
	letter-spacing: -0.005em;
	line-height: 1;
	margin: 0 0 8px;
	text-transform: none;
}
.osa-account-header__email {
	font-size: 11px;
	color: var(--osa-steel-1);
	letter-spacing: 0.1em;
	margin: 0;
}

/* ===== Stat row (4-up tile grid; used in account header + dealer pages) ===== */
.osa-stat-row {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	border: 1px solid var(--osa-ink);
}
.osa-stat-row--3 { grid-template-columns: repeat(3, 1fr); }
.osa-stat {
	padding: 18px 18px 16px;
	border-right: 1px solid var(--osa-ink);
}
.osa-stat:last-child { border-right: 0; }
.osa-stat__value {
	font-family: var(--osa-f-display);
	font-size: 32px;
	line-height: 1;
}
.osa-stat__label {
	display: block;
	font-family: var(--osa-f-mono);
	font-size: 10px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--osa-steel-1);
	margin-top: 8px;
}

/* ===== WooCommerce my-account: two-column body styled per design ===== */
.woocommerce-account .woocommerce-MyAccount-navigation {
	width: auto !important;
	float: none !important;
	margin: 0;
	border-right: 1px solid var(--osa-paper-edge);
	min-height: 320px;
	order: 1;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li {
	margin: 0;
	padding: 0;
	border-bottom: 1px solid var(--osa-paper-edge);
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
	display: block;
	padding: 14px 18px;
	font-family: var(--osa-f-sans);
	font-size: 13px;
	font-weight: 500;
	color: var(--osa-ink);
	text-decoration: none;
	letter-spacing: 0.04em;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
	background: var(--osa-paper-tint);
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a:hover {
	background: var(--osa-ink);
	color: var(--osa-paper);
	font-weight: 700;
}

.woocommerce-account .woocommerce-MyAccount-content {
	float: none !important;
	width: auto !important;
	padding: 0 0 0 32px;
	order: 2;
	min-width: 0;
}

/* Wrap WC's two-column flow in a CSS Grid for predictable layout. */
.woocommerce-account .woocommerce {
	display: grid;
	grid-template-columns: 220px 1fr;
	gap: 0;
}
.woocommerce-account .woocommerce > * { float: none !important; }

/* ===== Account sections (Recent Orders, Watch List, etc.) ===== */
.osa-account-section {
	margin-bottom: 48px;
}
.osa-account-section__head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	border-bottom: 1px solid var(--osa-ink);
	padding-bottom: 10px;
	margin-bottom: 16px;
}
.osa-account-section__heading {
	font-family: var(--osa-f-display);
	font-size: 18px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin: 0;
	line-height: 1;
}
.osa-account-section__link {
	font-size: 10px;
	letter-spacing: 0.22em;
	color: var(--osa-ink);
	text-decoration: none;
}
.osa-account-section__link:hover { color: var(--osa-steel-1); }
.osa-account-empty {
	font-family: var(--osa-f-mono);
	font-size: 12px;
	color: var(--osa-steel-1);
}

.osa-account-table {
	width: 100%;
	border-collapse: collapse;
	font-family: var(--osa-f-mono);
	font-size: 12px;
}
.osa-account-table thead th {
	text-align: left;
	font-size: 9px;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--osa-steel-1);
	padding: 6px 0 10px;
	border-bottom: 1px solid var(--osa-paper-edge);
}
.osa-account-table tbody td {
	padding: 10px 0;
	border-bottom: 1px solid var(--osa-paper-edge);
}
.osa-account-table__id {
	font-weight: 700;
	color: var(--osa-ink);
	text-decoration: none;
}
.osa-account-status { font-size: 10px; margin-right: 6px; color: var(--osa-steel-2); }
.osa-account-status--processing,
.osa-account-status--on-hold     { color: var(--osa-ink); }
.osa-account-status--completed   { color: var(--osa-ink); }

@media (max-width: 900px) {
	.osa-account-header {
		grid-template-columns: 1fr;
		gap: 24px;
	}
	.osa-account-header__name { font-size: 36px; }
	.woocommerce-account .woocommerce {
		grid-template-columns: 1fr;
	}
	.woocommerce-account .woocommerce-MyAccount-navigation {
		border-right: 0;
		border-bottom: 1px solid var(--osa-paper-edge);
		width: auto;
	}
	.woocommerce-account .woocommerce-MyAccount-content {
		padding: 24px 0 0;
	}
	.osa-stat-row { grid-template-columns: 1fr 1fr; }
	.osa-stat:nth-child(2) { border-right: 0; }
	.osa-stat:nth-child(1), .osa-stat:nth-child(2) { border-bottom: 1px solid var(--osa-ink); }
}

/* ===== Dealer pending banner ===== */
.osa-pending-banner {
	border: 1.5px solid var(--osa-ink);
	background: var(--osa-paper-tint);
	padding: 18px 22px;
	margin: 24px 0 32px;
}
.osa-pending-banner .osa-mono-caps {
	display: block;
	font-size: 10px;
	letter-spacing: 0.22em;
	color: var(--osa-ink);
	margin-bottom: 6px;
}
.osa-pending-banner p {
	margin: 0;
	font-family: var(--osa-f-mono);
	font-size: 12px;
	line-height: 1.55;
	color: var(--osa-ink-2);
}

/* ===== Admin price breakdown (Retail + all tiers) ===== */
.osa-admin-price {
	display: inline-flex;
	flex-direction: column;
	gap: 4px;
	font-family: var(--osa-f-mono);
	font-size: 13px;
	line-height: 1.3;
}
.osa-admin-price__row {
	display: grid;
	grid-template-columns: 72px auto;
	gap: 14px;
	align-items: baseline;
}
.osa-admin-price__label {
	color: var(--osa-steel-1);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}
.osa-admin-price__value {
	color: var(--osa-ink);
	font-weight: 600;
	font-size: 22px;
	letter-spacing: -0.01em;
	white-space: nowrap;
}
.osa-admin-price__value em {
	color: var(--osa-steel-1);
	font-style: normal;
	font-weight: 500;
	font-size: 11px;
	margin-left: 8px;
	letter-spacing: 0.12em;
	vertical-align: 0.15em;
}
/* Retail is the reference price — subdued so the tier price (dealer pays) reads as primary */
.osa-admin-price__row:first-child .osa-admin-price__value {
	color: var(--osa-steel-1);
	font-size: 15px;
	font-weight: 500;
	text-decoration: line-through;
	text-decoration-thickness: 1px;
}

/* ===== Dealer price block (TRADE | MAP | MARGIN) ===== */
.osa-dealer-price {
	display: inline-flex;
	align-items: baseline;
	gap: 10px;
	font-family: var(--osa-f-mono);
}
.osa-dealer-price__trade {
	font-weight: 700;
	font-size: 16px;
	color: var(--osa-ink);
}
.osa-dealer-price__map {
	font-size: 11px;
	color: var(--osa-steel-2);
}
.osa-dealer-price__margin {
	font-size: 10px;
	letter-spacing: 0.16em;
	background: var(--osa-ink);
	color: var(--osa-paper);
	padding: 2px 6px;
	text-transform: uppercase;
}

/* ===== Dealer tier card ===== */
.osa-tier-card {
	border: 1px solid var(--osa-ink);
	padding: 16px;
	background: var(--osa-paper);
}
.osa-tier-card__head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	margin-bottom: 12px;
}
.osa-tier-card__label {
	font-size: 10px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--osa-steel-1);
}
.osa-tier-card__current {
	font-family: var(--osa-f-mono);
	font-weight: 700;
	font-size: 14px;
	letter-spacing: 0.1em;
}
.osa-tier-card__bar {
	height: 6px;
	background: var(--osa-paper-edge);
	position: relative;
}
.osa-tier-card__bar-fill {
	height: 100%;
	background: var(--osa-ink);
}
.osa-tier-card__hint {
	font-family: var(--osa-f-mono);
	font-size: 11px;
	color: var(--osa-steel-1);
	margin: 10px 0 0;
}

.osa-stat--emphasis {
	background: var(--osa-ink);
	color: var(--osa-paper);
}
.osa-stat--emphasis .osa-stat__label {
	color: var(--osa-paper-edge);
}

/* ===== Dealer catalog table ===== */
.osa-dealer-table-wrap { width: 100%; }
.osa-dealer-filter-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	padding: 14px 0;
	border-bottom: 1px solid var(--osa-paper-edge);
	margin-bottom: 12px;
	font-family: var(--osa-f-mono);
	font-size: 10px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}
.osa-dealer-filter-bar__right {
	margin-left: auto;
	display: inline-flex;
	gap: 18px;
	align-items: center;
}
.osa-pill {
	display: inline-flex;
	align-items: center;
	border: 1px solid var(--osa-ink);
	padding: 5px 10px;
	font-size: 10px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	background: transparent;
	color: var(--osa-ink);
	cursor: pointer;
	text-decoration: none;
}
.osa-pill.is-active,
.osa-pill--solid,
.osa-pill:hover {
	background: var(--osa-ink);
	color: var(--osa-paper);
}
.osa-link { color: var(--osa-ink); text-decoration: underline; }

.osa-dealer-table {
	width: 100%;
	border-collapse: collapse;
	font-family: var(--osa-f-sans);
	font-size: 13px;
}
.osa-dealer-table thead th {
	background: var(--osa-ink);
	color: var(--osa-paper);
	font-family: var(--osa-f-mono);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	text-align: left;
	padding: 10px 8px;
	border-right: 1px solid var(--osa-ink-3);
}
.osa-dealer-table thead th:last-child { border-right: 0; }
.osa-dealer-table tbody td {
	border-bottom: 1px solid var(--osa-paper-edge);
	padding: 10px 8px;
	vertical-align: middle;
}
.osa-dealer-table tbody tr:hover { background: var(--osa-paper-tint); }
.osa-dealer-table .osa-num { text-align: right; white-space: nowrap; }
.osa-dealer-table .osa-bold { font-weight: 700; }
.osa-dealer-table .osa-muted { color: var(--osa-steel-2); }
.osa-dealer-table .osa-low { color: var(--osa-steel-1); }
.osa-dealer-table .osa-col-check { width: 32px; }
.osa-dealer-table .osa-col-img { width: 56px; }
.osa-prod-name a { color: var(--osa-ink); text-decoration: none; font-weight: 800; }
.osa-prod-sub { font-size: 10px; color: var(--osa-steel-2); letter-spacing: 0.12em; text-transform: uppercase; margin-top: 2px; }

.osa-dealer-bulkbar {
	position: sticky;
	bottom: 0;
	background: var(--osa-paper);
	border-top: 1px solid var(--osa-ink);
	padding: 14px 18px;
	display: flex;
	gap: 18px;
	align-items: center;
	z-index: 10;
}
.osa-dealer-bulkbar .osa-spacer { flex: 1; }

/* ===== Retail login + register grid ===== */
.osa-login-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	border: 1px solid var(--osa-ink);
}
.osa-login-card {
	padding: 22px 22px 20px;
	background: var(--osa-paper);
	border-right: 1px solid var(--osa-ink);
}
.osa-login-card:last-child { border-right: 0; }
.osa-login-card--invert {
	background: var(--osa-ink);
	color: var(--osa-paper);
}
.osa-login-card--invert .osa-login-card__eyebrow,
.osa-login-card--invert .osa-mono-caps {
	color: var(--osa-paper-edge);
}
.osa-login-card__eyebrow {
	font-size: 9px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--osa-steel-1);
	margin: 0 0 4px;
}
.osa-login-card__heading {
	font-family: var(--osa-f-display);
	font-size: 22px;
	letter-spacing: -0.005em;
	text-transform: uppercase;
	margin: 0 0 14px;
	line-height: 1;
}
.osa-login-card--invert .osa-login-card__heading { color: var(--osa-paper); }

.osa-form {
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.osa-form label {
	display: flex;
	flex-direction: column;
	gap: 0;
}
.osa-form label .osa-mono-caps {
	font-size: 9px;
	letter-spacing: 0.22em;
	color: var(--osa-steel-1);
	margin-bottom: 1px;
}
.osa-login-card--invert .osa-form label .osa-mono-caps { color: var(--osa-paper-edge); }
.osa-form input[type="text"],
.osa-form input[type="email"],
.osa-form input[type="password"] {
	font-family: var(--osa-f-mono);
	font-size: 13px;
	border: 1px solid var(--osa-ink);
	padding: 7px 10px;
	border-radius: 0;
	background: var(--osa-paper);
	color: var(--osa-ink);
	width: 100%;
}
.osa-login-card--invert .osa-form input {
	background: transparent;
	border-color: var(--osa-paper);
	color: var(--osa-paper);
}
.osa-form-row-2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 2px;
}
.osa-form-inline {
	flex-direction: row !important;
	align-items: center;
	gap: 8px !important;
	font-size: 12px;
}
.osa-form-foot {
	margin: 12px 0 0;
	font-size: 12px;
}
.osa-form-foot a { color: inherit; }
.osa-form-msg {
	background: var(--osa-paper-tint);
	border-left: 3px solid var(--osa-ink);
	padding: 10px 14px;
	font-family: var(--osa-f-mono);
	font-size: 12px;
	margin: 0 0 14px;
}

/* Invert button on dark card */
.osa-login-card--invert .osa-btn {
	background: var(--osa-paper);
	color: var(--osa-ink);
	border-color: var(--osa-paper);
}
.osa-login-card--invert .osa-btn:hover {
	background: transparent;
	color: var(--osa-paper);
}

.osa-login-foot {
	text-align: center;
	margin: 24px 0 0;
	font-size: 12px;
	color: var(--osa-steel-1);
}
.osa-login-foot a { color: var(--osa-ink); }

@media (max-width: 720px) {
	.osa-login-grid { grid-template-columns: 1fr; }
	.osa-login-card { border-right: 0; border-bottom: 1px solid var(--osa-ink); }
	.osa-login-card:last-child { border-bottom: 0; }
	.osa-form-row-2 { grid-template-columns: 1fr; }
}

/* ===== Dealer apply / login form ===== */
.osa-dealer-form {
	max-width: 720px;
	margin: 0 auto;
}
.osa-form-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px 18px;
}
.osa-form-grid label {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.osa-form-grid label .osa-mono-caps {
	font-size: 10px;
	letter-spacing: 0.22em;
	color: var(--osa-steel-1);
}
.osa-form-grid input,
.osa-form-grid select {
	font-family: var(--osa-f-mono);
	font-size: 14px;
	border: 1px solid var(--osa-ink);
	padding: 9px 11px;
	border-radius: 0;
	background: var(--osa-paper);
}
.osa-form-error {
	background: var(--osa-paper-tint);
	border-left: 3px solid var(--osa-ink);
	padding: 10px 14px;
	font-family: var(--osa-f-mono);
	font-size: 12px;
	margin-bottom: 18px;
}
.osa-dealer-form .login-username,
.osa-dealer-form .login-password,
.osa-dealer-form .login-remember,
.osa-dealer-form .login-submit {
	margin: 12px 0;
}
.osa-dealer-form input[type="text"],
.osa-dealer-form input[type="email"],
.osa-dealer-form input[type="password"] {
	font-family: var(--osa-f-mono);
	font-size: 14px;
	border: 1px solid var(--osa-ink);
	padding: 9px 11px;
	border-radius: 0;
	background: var(--osa-paper);
	width: 100%;
}

/* ===== Search overlay ===== */
.osa-search-overlay {
	position: fixed;
	inset: 0;
	background: rgba(10, 10, 10, 0.96);
	z-index: 99998;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
}
.osa-search-overlay[hidden] { display: none; }
.osa-search-overlay__form {
	width: min(720px, 100%);
	color: var(--osa-paper);
}
.osa-search-overlay__eyebrow {
	font-size: 10px;
	letter-spacing: 0.22em;
	color: var(--osa-paper-edge);
	margin: 0 0 14px;
	text-align: center;
}
.osa-search-overlay__input {
	width: 100%;
	font-family: var(--osa-f-display);
	font-size: 44px;
	background: transparent;
	color: var(--osa-paper);
	border: 0;
	border-bottom: 1.5px solid var(--osa-paper);
	padding: 12px 6px;
	text-align: center;
	letter-spacing: -0.005em;
	outline: none;
	border-radius: 0;
	caret-color: var(--osa-paper);
}
.osa-search-overlay__input::placeholder {
	color: var(--osa-steel-2);
	font-family: var(--osa-f-serif-d);
	font-style: italic;
	font-size: 22px;
	letter-spacing: 0;
}
.osa-search-overlay__hints {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 18px;
	font-size: 10px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--osa-steel-2);
}
.osa-search-overlay__hints a {
	color: var(--osa-paper);
	text-decoration: none;
	margin: 0 4px;
}
.osa-search-overlay__hints a:hover { text-decoration: underline; }
.osa-search-overlay__hints kbd {
	font-family: var(--osa-f-mono);
	background: transparent;
	border: 1px solid var(--osa-steel-1);
	padding: 1px 5px;
	font-size: 9px;
	color: var(--osa-paper-edge);
}
.osa-search-overlay__close {
	position: absolute;
	top: 18px;
	right: 24px;
	background: transparent;
	border: 0;
	color: var(--osa-paper);
	font-size: 32px;
	line-height: 1;
	cursor: pointer;
	padding: 4px 10px;
}
.osa-search-overlay__close:hover { color: var(--osa-paper-edge); }

@media (max-width: 720px) {
	.osa-search-overlay__input { font-size: 28px; }
	.osa-search-overlay__input::placeholder { font-size: 16px; }
	.osa-search-overlay__hints { flex-direction: column; gap: 8px; }
}

/* ===== Age gate ===== */
.osa-age-gate-backdrop {
	position: fixed;
	inset: 0;
	background: rgba(10, 10, 10, 0.96);
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	font-family: var(--osa-f-sans);
	color: var(--osa-paper);
}
.osa-age-gate-card {
	max-width: 520px;
	width: 100%;
	border: 1px solid var(--osa-paper);
	padding: 40px 32px;
	text-align: center;
}
.osa-age-gate-card h2 {
	font-family: var(--osa-f-display);
	font-size: 36px;
	text-transform: uppercase;
	letter-spacing: -0.005em;
	margin: 0 0 12px;
	color: var(--osa-paper);
}
.osa-age-gate-card p {
	font-family: var(--osa-f-serif-d);
	font-style: italic;
	font-size: 17px;
	line-height: 1.45;
	margin: 0 0 24px;
	color: var(--osa-paper-edge);
}
.osa-age-gate-actions {
	display: flex;
	gap: 12px;
	justify-content: center;
}
.osa-age-gate-actions .osa-btn--leave {
	background: transparent;
	color: var(--osa-paper);
	border-color: var(--osa-paper);
}

/* ===== WooCommerce nudges (Phase 1 surface only — Phase 2 expands) ===== */
.woocommerce-products-header__title {
	font-family: var(--osa-f-display);
	font-size: 64px;
	text-transform: uppercase;
	letter-spacing: -0.005em;
	line-height: 1;
}
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .woocommerce-Price-amount {
	font-family: var(--osa-f-mono);
	font-weight: 600;
	color: var(--osa-ink);
}

/* ===== Shop filter (FFL Core Product Filter plugin) ===== */

.osa-shop-layout {
	display: grid;
	grid-template-columns: 240px 1fr;
	gap: 32px;
	margin-top: 8px;
	align-items: start;
}
.osa-shop-main { min-width: 0; }
@media (max-width: 900px) {
	.osa-shop-layout { grid-template-columns: 1fr; gap: 24px; }
}

.osa-filter-sidebar { font-family: var(--osa-f-mono); }

.osa-filter-form {
	display: flex;
	flex-direction: column;
	gap: 28px;
}

.osa-filter-section__heading {
	font-family: var(--osa-f-mono);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.22em;
	color: var(--osa-ink);
	margin: 0 0 12px;
	padding-bottom: 6px;
	border-bottom: 1px solid var(--osa-ink);
}

.osa-filter-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.osa-filter-checkbox {
	position: relative;
	display: flex;
	align-items: center;
	gap: 10px;
	font-family: var(--osa-f-mono);
	font-size: 12px;
	line-height: 1.4;
	color: var(--osa-ink);
	cursor: pointer;
	user-select: none;
}
.osa-filter-checkbox input[type=checkbox] {
	position: absolute;
	left: 0;
	top: 0;
	opacity: 0;
	pointer-events: none;
}
.osa-filter-checkbox__box {
	flex-shrink: 0;
	width: 12px;
	height: 12px;
	border: 1.5px solid var(--osa-ink);
	background: transparent;
	transition: background 0.1s ease;
}
.osa-filter-checkbox input:checked + .osa-filter-checkbox__box {
	background: var(--osa-ink);
}
.osa-filter-checkbox:hover .osa-filter-checkbox__box {
	background: var(--osa-paper-edge);
}
.osa-filter-checkbox input:checked + .osa-filter-checkbox__box:hover {
	background: var(--osa-ink);
}
.osa-filter-checkbox__name { flex: 1; }
.osa-filter-count {
	flex-shrink: 0;
	font-size: 10px;
	color: var(--osa-steel-1);
	letter-spacing: 0.04em;
}

.osa-price-slider {
	padding: 8px 6px 4px;
}
.osa-price-slider__track {
	position: relative;
	width: 100%;
	height: 4px;
	background: var(--osa-paper-edge);
	margin: 18px 0 10px;
}
.osa-price-slider__fill {
	position: absolute;
	top: 0;
	bottom: 0;
	background: var(--osa-ink);
}
.osa-price-slider__handle {
	position: absolute;
	top: 50%;
	width: 14px;
	height: 14px;
	transform: translate(-50%, -50%);
	background: var(--osa-ink);
	border: none;
	border-radius: 0;
	padding: 0;
	cursor: grab;
	touch-action: none;
}
.osa-price-slider__handle:active { cursor: grabbing; }
.osa-price-slider__handle:focus-visible {
	outline: 2px solid var(--osa-ink);
	outline-offset: 2px;
}
.osa-price-slider__labels {
	display: flex;
	justify-content: space-between;
	font-family: var(--osa-f-mono);
	font-size: 11px;
	color: var(--osa-ink);
}
.osa-price-slider__nojs {
	display: flex;
	gap: 12px;
	margin-top: 8px;
	font-family: var(--osa-f-mono);
	font-size: 11px;
}
.osa-price-slider__nojs input[type=number] {
	width: 70px;
	border: 1px solid var(--osa-ink);
	background: transparent;
	padding: 4px 6px;
	font-family: var(--osa-f-mono);
	font-size: 11px;
}

.osa-filter-form__submit {
	background: var(--osa-ink);
	color: var(--osa-paper);
	border: none;
	padding: 12px 16px;
	font-family: var(--osa-f-mono);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.18em;
	cursor: pointer;
}

.osa-filter-toolbar {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	align-items: center;
	justify-content: space-between;
	padding: 14px 0;
	margin-bottom: 24px;
	border-top: 1px solid var(--osa-ink);
	border-bottom: 1px solid var(--osa-ink);
	font-family: var(--osa-f-mono);
	font-size: 11px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--osa-ink);
}
.osa-filter-toolbar__left,
.osa-filter-toolbar__right {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}
.osa-filter-toolbar__right { gap: 14px; }
.osa-filter-toolbar__sep { color: var(--osa-steel-2); }
.osa-filter-toolbar__count strong { font-weight: 600; letter-spacing: 0.04em; }

.osa-filter-toolbar__chips {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
	text-transform: none;
	letter-spacing: normal;
}
.osa-filter-toolbar__chips-empty em {
	font-style: normal;
	color: var(--osa-ink);
	letter-spacing: 0.18em;
	text-transform: uppercase;
}
.osa-filter-toolbar__chips-label {
	color: var(--osa-steel-1);
	letter-spacing: 0.18em;
	text-transform: uppercase;
}
.osa-filter-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 3px 8px 3px 10px;
	border: 1px solid var(--osa-ink);
	color: var(--osa-ink);
	background: transparent;
	text-decoration: none;
	font-size: 10px;
	line-height: 1.4;
	letter-spacing: 0.02em;
}
.osa-filter-chip:hover {
	background: var(--osa-ink);
	color: var(--osa-paper);
}
.osa-filter-chip__close {
	font-size: 14px;
	line-height: 1;
}

.osa-filter-toolbar__sort-label { color: var(--osa-steel-1); }
.osa-filter-sort__link {
	color: var(--osa-ink);
	text-decoration: none;
	border-bottom: 1px solid transparent;
	padding-bottom: 1px;
}
.osa-filter-sort__link:hover { border-bottom-color: var(--osa-ink); }
.osa-filter-sort__link.is-active {
	font-weight: 600;
	border-bottom-color: var(--osa-ink);
}

/* ============================================================== */
/* MOBILE + TABLET RESPONSIVE                                      */
/* Breakpoints: 1024 (tablet portrait), 768 (phablet),             */
/*              600 (phone), 480 (small phone)                     */
/* ============================================================== */

/* ---------- 1024px and below: tablet portrait ----------------- */
@media (max-width: 1024px) {
	main.wp-block-group { padding-left: 20px !important; padding-right: 20px !important; }

	/* Headline scaling — overrides inline font-size on H1/H2 only. */
	main [style*="font-size:64px"] { font-size: 44px !important; line-height: 1.05 !important; }
	main [style*="font-size:54px"] { font-size: 36px !important; }
	main [style*="font-size:48px"] { font-size: 32px !important; }
	main [style*="font-size:44px"] { font-size: 32px !important; }

	/* Shop / archive grid: 3 cols → 2 cols. */
	.wp-block-post-template.is-layout-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
	.osa-catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

/* ---------- 900px and below: existing breakpoint reinforced --- */
@media (max-width: 900px) {
	/* Dealer dashboards drop big side padding. */
	.wp-block-group[style*="padding-left:40px"] {
		padding-left: 20px !important;
	}
	.wp-block-group[style*="padding-right:40px"] {
		padding-right: 20px !important;
	}

	/* Filter toolbar: wrap chip row + sort row independently. */
	.osa-filter-toolbar { flex-direction: column; align-items: stretch; gap: 12px; }
	.osa-filter-toolbar__left,
	.osa-filter-toolbar__right { flex-wrap: wrap; }

	/* Dealer KPI row: tighten to 3 cols when 5 tiles overflow. */
	.osa-stat-row { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

/* ---------- 768px and below: phablet -------------------------- */
@media (max-width: 768px) {
	body { overflow-x: hidden; } /* defensive against rogue wide blocks */

	main.wp-block-group { padding-left: 16px !important; padding-right: 16px !important; }

	main [style*="font-size:96px"] { font-size: 52px !important; line-height: 1 !important; letter-spacing: -0.01em !important; }
	main [style*="font-size:64px"] { font-size: 32px !important; }
	main [style*="font-size:54px"] { font-size: 28px !important; }
	main [style*="font-size:48px"] { font-size: 24px !important; }
	main [style*="font-size:44px"] { font-size: 26px !important; }
	main [style*="font-size:36px"] { font-size: 22px !important; }
	main [style*="font-size:22px"] { font-size: 18px !important; }
	.osa-hero-headline { font-size: 52px !important; line-height: 1 !important; }

	/* Single product 2-col → stacked. WP's columns block stacks by default
	   below 782px; harden the inline flex-basis just in case. */
	.wp-block-columns.are-vertically-aligned-top > .wp-block-column {
		flex-basis: 100% !important;
		border-right: none !important;
	}

	/* Tighten product detail column padding once stacked. */
	.wp-block-column[style*="padding:32px"],
	.wp-block-column[style*="padding-left:32px"] {
		padding: 20px 0 !important;
	}

	/* Specs table: tighten cell padding + smaller font. */
	.osa-specs th, .osa-specs td { padding: 6px 10px; font-size: 13px; }

	/* Dealer pricing pill: stack the three values vertically. */
	.osa-dealer-price { flex-direction: column; align-items: flex-start; gap: 2px; }

	/* Dealer KPI tiles: 2 cols. */
	.osa-stat-row { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }

	/* OSA Catalog Details metabox grid — already mono-flex, just tighten label col. */
	.osa-meta-grid { grid-template-columns: 1fr !important; }

	/* Filter sidebar: when collapsed at < 900 it's already 1-col;
	   here make the sections more compact. */
	.osa-filter-section { margin-bottom: 24px; }
	.osa-filter-section__heading { font-size: 11px; margin-bottom: 8px; }
	.osa-filter-list { gap: 4px; }
	.osa-filter-checkbox { font-size: 13px; }

	/* WC cart + checkout: shrink default WC blocks. */
	.wp-block-woocommerce-cart-line-items-block .wc-block-cart-items {
		font-size: 14px;
	}
	.wc-block-components-product-name,
	.wc-block-components-product-metadata { font-size: 14px; }

	/* Forms (dealer apply, login): single-column grid. */
	.osa-dealer-form .osa-form-grid {
		grid-template-columns: 1fr !important;
	}
}

/* ---------- 600px and below: phone ---------------------------- */
@media (max-width: 600px) {
	main.wp-block-group { padding-left: 14px !important; padding-right: 14px !important; }

	main [style*="font-size:96px"] { font-size: 38px !important; line-height: 1 !important; letter-spacing: 0 !important; }
	main [style*="font-size:64px"] { font-size: 28px !important; letter-spacing: 0 !important; }
	main [style*="font-size:54px"] { font-size: 24px !important; }
	main [style*="font-size:48px"] { font-size: 22px !important; }
	main [style*="font-size:44px"] { font-size: 22px !important; }
	.osa-hero-headline { font-size: 38px !important; line-height: 1 !important; letter-spacing: 0 !important; }

	/* Shop / archive grid: 2 cols → 1 col. */
	.wp-block-post-template.is-layout-grid {
		grid-template-columns: 1fr !important;
	}
	.osa-catalog-grid { grid-template-columns: 1fr !important; }

	/* Filter toolbar sort links: smaller + tighter wrap. */
	.osa-filter-sort__link { font-size: 11px; }
	.osa-filter-toolbar { font-size: 10px; padding: 12px 0; }

	/* Specs table: full-width single column. */
	.osa-specs th { width: 40%; }

	/* Dealer KPI: 1 col on phones. */
	.osa-stat-row { grid-template-columns: 1fr !important; }

	/* Dealer catalog table: horizontal scroll wrapper. */
	.osa-dealer-catalog-table { overflow-x: auto; }
	.osa-dealer-catalog-table table { min-width: 720px; }

	/* Marquee ticker stays single-line, just shrink. */
	.osa-marquee { font-size: 11px; }

	/* Footer columns stack. */
	.wp-block-group.is-layout-flex.is-content-justification-space-between {
		flex-direction: column;
		align-items: flex-start !important;
		gap: 14px;
	}

	/* Product price block: stack price + add-to-cart vertically. */
	.wp-block-group[style*="justifyContent:space-between"][style*="flexWrap:nowrap"] {
		flex-wrap: wrap !important;
	}
}

/* ---------- 480px and below: very small phone ----------------- */
@media (max-width: 480px) {
	main.wp-block-group { padding-left: 12px !important; padding-right: 12px !important; }

	main [style*="font-size:64px"] { font-size: 24px !important; }
	main [style*="font-size:44px"] { font-size: 20px !important; }

	/* Tighten header utility row (above main nav). */
	.osa-mono-caps { letter-spacing: 0.12em !important; }
}

/* ---------- Touch-target hardening ---------------------------- */
@media (hover: none) and (pointer: coarse) {
	/* Ensure all interactive controls are at least 40×40 effective. */
	.osa-filter-checkbox__box { width: 14px; height: 14px; }
	.osa-filter-checkbox { min-height: 32px; }
	.osa-price-slider__handle { width: 22px; height: 22px; }
	.osa-filter-sort__link { padding: 4px 2px; }
}