/* ==========================================================================
   Revmint — "The Verdict" editorial theme + "Test Bench" score tiers
   ========================================================================== */

/* Belt-and-suspenders: clip any full-bleed (100vw) horizontal overflow without
   creating a scroll container (so position:sticky keeps working). */
html { overflow-x: clip; }

/* Anchor jumps (deep links, TOC, fragment restore) clear the sticky header.
   --br-header-h is set at runtime by theme.js to the REAL header height (it wraps
   to 2 rows on mid widths), with a static fallback for no-JS. */
html { scroll-padding-top: var(--br-header-h, 120px); }
@media ( max-width: 768px ) { html { scroll-padding-top: 0; } } /* header isn't sticky on mobile (JS also sets --br-header-h:0) */

body {
	color: var(--br-text);
	background: var(--br-bg);
	font-size: 18px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
a {
	color: var(--br-primary);
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
}
.entry-content h2 { font-size: 1.85rem; margin-top: 1.6em; }
.entry-content h3 { font-size: 1.35rem; margin-top: 1.4em; }
img { max-width: 100%; height: auto; }

/* GeneratePress lays out #content.site-content as a flexbox (content + sidebar).
   Our custom front-page / archive templates put content directly inside it, so
   make those blocks fill the row and stay centered (otherwise they shrink to
   content width and pin left, leaving an empty gap on the right). */
.br-home,
.br-archive {
	flex: 1 1 100%;
	width: 100%;
	min-width: 0;
}

/* Mono everywhere a measured number / score / spec value / label lives. */
.br-stars-num,
.br-rs-num,
.br-rs-out,
.br-rs-price,
.br-pb-price,
.br-btn-main,
.br-specs td,
.br-pagination .page-numbers,
.br-seal,
.br-kicker,
.br-card-cat,
.br-badge,
.br-rs-badge,
.br-rating-label,
.br-cat-count,
.br-card-link,
.br-section-more,
.br-toc-title,
.br-hero-trust {
	font-family: var(--br-font-mono);
}

/* Uppercase mono kicker above editorial headlines. */
.br-kicker {
	display: inline-block;
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--br-primary);
	margin-bottom: 10px;
}

/* ==========================================================================
   Header / masthead
   ========================================================================== */
.site-header {
	background: var(--br-surface);
	border-bottom: 1px solid var(--br-border);
}
.inside-header { padding: 12px 20px; }
.site-header .inside-header { align-items: center; }

.main-title,
.main-title a {
	font-weight: 700 !important;
	letter-spacing: -0.02em;
	color: var(--br-text) !important;
}
.main-title { font-size: 1.75rem !important; }
.site-description {
	color: var(--br-muted);
	font-family: var(--br-font-body);
	font-size: 0.92rem;
	margin-top: 2px;
}

/* Primary navigation — light bar, green active state, sticky */
.main-navigation,
.main-navigation .inside-navigation { background: var(--br-surface); }
.main-navigation { border: none; }
/* Stick the whole HEADER bar. The nav is nested inside #masthead, so making the
   nav itself position:sticky never pins (it scrolls away with the header) — so we
   stick the header instead. Desktop only: on mobile the toggle menu expands
   downward and a sticky header would cover the viewport. */
@media ( min-width: 769px ) {
	.site-header {
		position: sticky;
		top: 0;
		z-index: 100;
	}
}
.main-navigation .main-nav ul li a {
	color: var(--br-text);
	font-size: 0.96rem;
	font-weight: 600;
	padding: 10px 18px;
	text-transform: none;
}
.main-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li.current-menu-item a {
	color: var(--br-primary);
	background: transparent;
}
.main-navigation .main-nav ul li.current-menu-item a {
	box-shadow: inset 0 -3px 0 var(--br-primary);
}
.navigation-search input,
.main-navigation .menu-bar-item > a { color: var(--br-text); }

/* Mobile hamburger toggle — clearly visible, aligned to the right of the logo. */
.menu-toggle { color: var(--br-text); }
.menu-toggle .gp-icon { font-size: 1.4rem; }
.mobile-menu-control-wrapper { border: none; background: transparent; }

/* Slim trust / disclosure bar under the header. */
.br-topbar {
	background: var(--br-soft);
	border-bottom: 1px solid var(--br-border);
	color: var(--br-muted);
	font-size: 0.8rem;
	text-align: center;
	padding: 9px 16px;
	letter-spacing: 0.01em;
}
.br-topbar strong { color: var(--br-primary); font-weight: 700; }

/* ==========================================================================
   Star rating (gold)
   ========================================================================== */
.br-stars {
	display: inline-flex;
	align-items: center;
	gap: 1px;
	line-height: 1;
	white-space: nowrap;
}
.br-star { font-size: 1.02em; color: #ddd6c4; }
.br-star.is-full,
.br-star.is-half { color: var(--br-gold); }
.br-star.is-half {
	position: relative;
	background: linear-gradient(90deg, var(--br-gold) 50%, #ddd6c4 50%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.br-stars-num {
	margin-left: 7px;
	font-weight: 700;
	font-size: 0.82em;
	color: var(--br-text);
	-webkit-text-fill-color: var(--br-text);
}
.br-rating { display: inline-flex; align-items: center; gap: 8px; }
.br-rating-label {
	font-weight: 600;
	color: var(--br-muted);
	font-size: 0.78em;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

/* ==========================================================================
   CTA button — quiet green pill, mono label
   ========================================================================== */
.br-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	text-decoration: none !important;
	line-height: 1.2;
	padding: 14px 28px;
	border-radius: 999px;
	transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;
	box-shadow: var(--br-shadow);
	text-align: center;
}
.br-btn-body {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 2px;
	line-height: 1.2;
}
.br-btn-main {
	font-weight: 600;
	font-size: 0.92em;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}
.br-btn-sub {
	font-family: var(--br-font-body);
	font-size: 0.7em;
	font-weight: 500;
	text-transform: none;
	letter-spacing: 0;
	opacity: 0.85;
}
.br-btn--primary { background: var(--br-primary); color: #fff !important; }
.br-btn--primary:hover {
	background: var(--br-primary-dark);
	transform: translateY(-2px);
	box-shadow: var(--br-shadow-hover);
}
.br-btn--outline {
	background: transparent;
	color: var(--br-primary) !important;
	box-shadow: inset 0 0 0 2px var(--br-primary);
}
.br-btn--outline:hover { background: var(--br-primary); color: #fff !important; }

/* Amazon brand button — signature Amazon orange, dark text + dark smile.
   The familiar Amazon "Buy Now" color reads as a shop CTA and converts better
   than navy. Dark text/smile keep contrast on orange (AA-safe). */
.br-btn--amazon {
	background: linear-gradient(180deg, #ffb84d 0%, #ff9900 100%);
	color: #1a1a1a !important;
	border: 1px solid #e3870a;
	gap: 11px;
	padding: 13px 38px;
	border-radius: 10px;
}
.br-btn--amazon:hover {
	background: linear-gradient(180deg, #ffac31 0%, #f28800 100%);
	color: #1a1a1a !important;
	transform: translateY(-2px);
	box-shadow: var(--br-shadow-hover);
}
.br-btn--amazon .br-btn-main {
	font-family: var(--br-font-body);
	font-weight: 700;
	font-size: 1rem;
	text-transform: none;
	letter-spacing: 0;
	color: #1a1a1a;
}
.br-amz-icon { display: inline-flex; align-items: center; flex-shrink: 0; }
.br-amz-smile { display: block; width: 30px; height: auto; }

/* Large CTA variant — prominent in-content / end-of-article buy buttons */
.br-btn--lg { padding: 17px 40px; gap: 12px; }
.br-btn--lg .br-btn-main { font-size: 1.04em; }
.br-btn--lg.br-btn--amazon { padding: 17px 52px; gap: 13px; }
.br-btn--lg.br-btn--amazon .br-btn-main { font-size: 1.14rem; }
.br-btn--lg .br-amz-smile { width: 34px; }

/* Image buy button (when a custom button image is set in the Customizer).
   Self-contained — does NOT inherit .br-btn visuals. Centres in any block or
   flex-column parent (review CTA rail, btn-wrap, pros/cons CTA). */
.br-amz-imgbtn {
	display: block;
	width: fit-content;
	max-width: 260px;
	margin: 0 auto;
	line-height: 0;
	border-radius: 8px;
	overflow: hidden;
	transition: transform 0.14s ease, box-shadow 0.14s ease;
}
/* Reliable click tracking: make every click on a buy button land on the <a>
   itself (not its inner <img>/<span>), so any tracker — GTM Click Classes,
   GA, Ads — always sees the anchor's class + data-aff attributes. */
.amazon-affiliate-button * { pointer-events: none; }
.br-amz-imgbtn img { display: block; width: 100%; height: auto; }
.br-amz-imgbtn--lg { max-width: 340px; }
.br-compare .br-amz-imgbtn { max-width: 150px; }   /* keep the Buy column compact in comparison tables */
.br-amz-imgbtn:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.16); }

/* Sub-category quick links on a category archive. */
.br-subcats {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 26px;
}
.br-subcat {
	display: inline-block;
	font-family: var(--br-font-mono);
	font-size: 0.82rem;
	font-weight: 600;
	text-decoration: none;
	color: var(--br-text);
	background: var(--br-surface);
	border: 1px solid var(--br-border);
	border-radius: 999px;
	padding: 6px 16px;
	transition: background 0.14s ease, color 0.14s ease, border-color 0.14s ease;
}
.br-subcat:hover { background: var(--br-primary); color: #fff; border-color: var(--br-primary); }

/* Inline product image inside the article body (extra Amazon angles). */
.br-inline-fig {
	margin: 1.9em auto;
	max-width: 460px;
	text-align: center;
}
.br-inline-fig img {
	display: block;
	width: 100%;
	height: auto;
	background: #fff;
	border: 1px solid var(--br-border);
	border-radius: 12px;
	padding: 12px;
	box-sizing: border-box;
}
.br-inline-imglink { display: block; line-height: 0; }
.br-inline-imglink img { transition: transform 0.18s ease; }
.br-inline-imglink:hover img { transform: scale(1.02); box-shadow: var(--br-shadow-hover); }

/* Auto internal links to related reviews — slightly emphasized in prose. */
.entry-content .br-ilink { font-weight: 600; text-decoration-color: var(--br-gold); }

/* Price-drop / lowest-in-30-days badge (review summary). */
.br-price-badge {
	display: inline-block;
	margin: 4px 0 2px;
	padding: 3px 10px;
	border-radius: 999px;
	font-family: var(--br-font-mono);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	/* solid fill (not surface-dependent) + dark-green text → ≥4.5:1 on every skin. */
	background: #e7f4ec;
	color: #0b5e2a;
	border: 1px solid rgba(26, 127, 55, 0.35);
}

/* Sticky buy bar — single reviews; slides up once the main CTA scrolls past. */
.br-sticky-cta {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 200;
	background: var(--br-surface);
	border-top: 1px solid var(--br-border);
	box-shadow: 0 -6px 24px rgba(0, 0, 0, 0.10);
	transform: translateY(110%);
	transition: transform 0.28s ease;
	padding: 10px 16px;
	padding-bottom: max(10px, env(safe-area-inset-bottom));
}
.br-sticky-cta.is-on { transform: translateY(0); }
/* Reserve space while the bar is visible so it never covers the last content
   (author box / related / FTC disclosure). Toggled by theme.js. */
body.has-sticky-cta { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
@media ( max-width: 480px ) {
	body.has-sticky-cta { padding-bottom: calc(84px + env(safe-area-inset-bottom)); }
}
.br-sticky-inner { max-width: 1000px; margin: 0 auto; display: flex; align-items: center; gap: 14px; }
.br-sticky-img { width: 48px; height: 48px; object-fit: contain; border-radius: 8px; background: #fff; border: 1px solid var(--br-border); flex-shrink: 0; }
.br-sticky-meta { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.br-sticky-name { font-weight: 700; font-size: 0.95rem; color: var(--br-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.br-sticky-price { font-family: var(--br-font-mono); font-weight: 700; color: var(--br-primary); font-size: 0.95rem; }
.br-sticky-cta .br-btn { flex-shrink: 0; padding: 11px 24px; box-shadow: none; }
@media ( max-width: 480px ) {
	.br-sticky-name { font-size: 0.88rem; }
	.br-sticky-cta .br-btn { padding: 11px 18px; }
	.br-sticky-img { width: 42px; height: 42px; }
}

/* Standalone buy button in post content — centered */
.br-btn-wrap { text-align: center; margin: 2.4em 0; }

/* Repeated CTA after a pros/cons block */
.br-proscons-cta { text-align: center; margin: 1.4em 0 0.4em; }

/* Comparison-table buttons stay compact */
.br-compare .br-btn { padding: 9px 18px; }
.br-compare .br-btn--amazon { padding: 8px 16px; gap: 7px; }
.br-compare .br-amz-smile { width: 22px; }
.br-compare .br-btn--amazon .br-btn-main { font-size: 0.82rem; }

/* Gold pick seal / award flag */
.br-seal {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: var(--br-gold);
	color: #fff;
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 5px 11px;
	border-radius: 999px;
	box-shadow: 0 4px 12px rgba(181, 134, 47, 0.28);
}
.br-seal::before { content: "\2605"; font-size: 0.85em; line-height: 1; }

/* ==========================================================================
   Pros / Cons
   ========================================================================== */
.br-proscons { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 1.8em 0; }
.br-pros,
.br-cons {
	border: 1px solid var(--br-border);
	border-radius: var(--br-radius);
	padding: 20px 22px;
	background: var(--br-surface);
}
.br-pros { border-top: 3px solid var(--br-success); }
.br-cons { border-top: 3px solid var(--br-danger); }
.br-pros .br-pc-h,
.br-cons .br-pc-h {
	margin: 0 0 12px;
	font-size: 1.05em;
	font-weight: 700;
	font-family: var(--br-font-head);
	display: flex;
	align-items: center;
	gap: 8px;
}
.br-pros .br-pc-h::before { content: "\2713"; color: var(--br-success); }
.br-cons .br-pc-h::before { content: "\2715"; color: var(--br-danger); }
.br-pros ul,
.br-cons ul { margin: 0; padding: 0; list-style: none; }
.br-pros li,
.br-cons li { position: relative; padding-left: 26px; margin-bottom: 9px; font-size: 0.96em; }
.br-pros li::before { content: "\2713"; position: absolute; left: 0; top: 1px; color: var(--br-success); font-weight: 700; }
.br-cons li::before { content: "\2715"; position: absolute; left: 0; top: 1px; color: var(--br-danger); font-weight: 700; }

/* ==========================================================================
   Content-quality blocks: bottom line, key takeaways, buyer fit, basis
   ========================================================================== */
.br-bottom-line {
	margin: 1.4em 0;
	padding: 14px 18px;
	background: var(--br-soft);
	border-left: 4px solid var(--br-primary);
	border-radius: var(--br-radius-sm);
	font-size: 1.05em;
	line-height: 1.55;
	color: var(--br-text);
}
.br-bottom-line strong { font-family: var(--br-font-head); }

.br-takeaways {
	margin: 1.8em 0;
	border: 1px solid var(--br-border);
	border-radius: var(--br-radius);
	background: var(--br-surface);
	box-shadow: var(--br-shadow);
	padding: 20px 24px;
}
.br-takeaways-title {
	font-family: var(--br-font-head);
	font-weight: 700;
	font-size: 1.1em;
	margin-bottom: 12px;
	color: var(--br-text);
}
.br-takeaways ul { margin: 0; padding: 0; list-style: none; }
.br-takeaways li { position: relative; padding-left: 26px; margin-bottom: 10px; line-height: 1.5; }
.br-takeaways li:last-child { margin-bottom: 0; }
.br-takeaways li::before { content: "\2192"; position: absolute; left: 0; top: 0; color: var(--br-gold); font-weight: 700; }

.br-buyer-fit { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 1.8em 0; }
.br-fit-col {
	border: 1px solid var(--br-border);
	border-radius: var(--br-radius);
	padding: 20px 22px;
	background: var(--br-surface);
}
.br-fit-buy { border-top: 3px solid var(--br-success); }
.br-fit-skip { border-top: 3px solid var(--br-muted); }
.br-fit-col h3 {
	margin: 0 0 12px;
	font-size: 1.05em;
	font-family: var(--br-font-head);
	display: flex;
	align-items: center;
	gap: 8px;
}
.br-fit-buy h3::before { content: "\2713"; color: var(--br-success); }
.br-fit-skip h3::before { content: "\2715"; color: var(--br-muted); }
.br-fit-col ul { margin: 0; padding: 0; list-style: none; }
.br-fit-col li { position: relative; padding-left: 22px; margin-bottom: 9px; font-size: 0.96em; line-height: 1.45; }
.br-fit-buy li::before { content: "\2713"; position: absolute; left: 0; top: 1px; color: var(--br-success); }
.br-fit-skip li::before { content: "\2715"; position: absolute; left: 0; top: 1px; color: var(--br-muted); }

.br-basis {
	margin: 1em 0 1.6em;
	font-size: 0.88em;
	color: var(--br-muted);
	line-height: 1.55;
}

/* Author / reviewer box (E-E-A-T) */
.br-author-box { display: flex; gap: 16px; align-items: flex-start; margin: 2.6em 0 0; padding: 20px 22px; background: var(--br-soft); border: 1px solid var(--br-border); border-radius: var(--br-radius); }
.br-author-avatar { flex: 0 0 auto; width: 52px; height: 52px; border-radius: 50%; background: var(--br-primary); color: #fff; display: flex; align-items: center; justify-content: center; font-family: var(--br-font-head); font-weight: 700; font-size: 1.4rem; }
.br-author-body { min-width: 0; }
.br-author-name { font-family: var(--br-font-head); font-weight: 700; color: var(--br-text); }
.br-author-role { display: block; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--br-gold); margin-top: 2px; }
.br-author-bio { margin: 8px 0 0; font-size: 0.92rem; color: var(--br-muted); line-height: 1.55; }

/* Related reviews (internal links, end of article) */
.br-related { margin: 3em 0 1em; padding-top: 1.8em; border-top: 1px solid var(--br-border); }
.br-related-title { font-family: var(--br-font-head); font-size: 1.5rem; font-weight: 700; margin: 0 0 1.1em; color: var(--br-text); }

/* ==========================================================================
   Verdict box — editorial, gold rule
   ========================================================================== */
.br-verdict {
	border: 1px solid var(--br-border);
	border-top: 3px solid var(--br-gold);
	border-radius: var(--br-radius);
	background: var(--br-surface);
	padding: 24px 26px;
	margin: 2em 0;
	box-shadow: var(--br-shadow);
}
.br-verdict-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	flex-wrap: wrap;
	margin-bottom: 10px;
}
.br-verdict-title {
	margin: 0;
	font-family: var(--br-font-head);
	color: var(--br-text);
	font-size: 1.4em;
	font-weight: 700;
	line-height: 1.25;
}
.br-verdict-body p:last-child { margin-bottom: 0; }

/* ==========================================================================
   Product box
   ========================================================================== */
.br-product-box {
	position: relative;
	display: grid;
	grid-template-columns: 200px 1fr 220px;
	gap: 24px;
	align-items: center;
	border: 1px solid var(--br-border);
	border-radius: var(--br-radius);
	padding: 24px;
	margin: 2em 0;
	background: var(--br-surface);
	box-shadow: var(--br-shadow);
}
.br-badge {
	position: absolute;
	top: -12px;
	left: 24px;
	background: var(--br-gold);
	color: #fff;
	font-size: 0.68em;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	padding: 6px 13px;
	border-radius: 999px;
	box-shadow: 0 4px 12px rgba(181, 134, 47, 0.28);
}
.br-pb-media { display: flex; align-items: center; justify-content: center; }
.br-pb-media img { max-height: 170px; width: auto; object-fit: contain; }
.br-pb-name { margin: 0 0 8px; font-family: var(--br-font-head); font-size: 1.3em; font-weight: 700; }
.br-pb-highlights { font-size: 0.94em; color: var(--br-muted); }
.br-pb-highlights ul { margin: 8px 0 0; padding-left: 18px; }
.br-pb-cta { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.br-pb-price { font-size: 1.5em; font-weight: 700; color: var(--br-text); }

/* ==========================================================================
   Table of contents
   ========================================================================== */
.br-toc {
	border: 1px solid var(--br-border);
	border-left: 3px solid var(--br-primary);
	border-radius: var(--br-radius-sm);
	background: var(--br-surface);
	padding: 18px 24px;
	margin: 1.8em 0;
	max-width: 540px;
}
.br-toc-title {
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-size: 0.8rem;
	color: var(--br-muted);
	margin-bottom: 12px;
}
.br-toc ul { margin: 0; padding: 0; list-style: none; }
.br-toc li { margin: 6px 0; }
.br-toc li.br-toc-l3 { padding-left: 18px; font-size: 0.94em; }
.br-toc a { text-decoration: none; color: var(--br-text); border-bottom: 1px solid transparent; }
.br-toc a:hover { color: var(--br-primary); border-bottom-color: var(--br-primary); }

/* ==========================================================================
   Comparison table
   ========================================================================== */
.br-compare-wrap {
	overflow-x: auto;
	margin: 2em 0;
	border-radius: var(--br-radius);
	border: 1px solid var(--br-border);
}
.br-compare { width: 100%; border-collapse: collapse; min-width: 560px; margin: 0; }
.br-compare thead th {
	background: var(--br-ink);
	color: #fff;
	text-align: left;
	padding: 14px 16px;
	font-family: var(--br-font-mono);
	font-size: 0.8em;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}
.br-compare tbody td {
	padding: 14px 16px;
	border-top: 1px solid var(--br-border);
	vertical-align: middle;
	font-size: 0.95em;
}
.br-compare tbody tr:nth-child(even) { background: var(--br-soft); }
.br-compare .br-btn .br-btn-main { font-size: 0.78em; }

/* ==========================================================================
   Hero (homepage masthead)
   ========================================================================== */
.br-hero {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	background: var(--br-soft);
	border-bottom: 1px solid var(--br-border);
	padding: 66px 20px 58px;
	text-align: center;
	margin-bottom: 52px;
}
.br-hero-inner { max-width: 820px; margin: 0 auto; }
.br-hero-title {
	font-size: clamp(2.2rem, 5.2vw, 3.4rem);
	font-weight: 700;
	letter-spacing: -0.025em;
	line-height: 1.08;
	color: var(--br-text);
	margin: 0 0 16px;
}
.br-hero-sub {
	font-family: var(--br-font-body);
	font-size: 1.2rem;
	color: var(--br-muted);
	margin: 0 auto 20px;
	max-width: 640px;
}
.br-hero-trust {
	font-size: 0.82rem;
	font-weight: 500;
	letter-spacing: 0.02em;
	color: var(--br-muted);
	margin: 0;
}
.br-hero-trust strong { color: var(--br-primary); }

/* ==========================================================================
   Sections
   ========================================================================== */
.br-section { margin-bottom: 60px; }
.br-section-head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	margin-bottom: 26px;
	border-bottom: 1px solid var(--br-border);
	padding-bottom: 12px;
}
.br-section-head h2 { margin: 0; font-size: 1.7rem; font-weight: 700; color: var(--br-text); }
.br-section-more {
	font-weight: 600;
	font-size: 0.82rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	text-decoration: none;
}
.br-section-more:hover { text-decoration: underline; }

/* ==========================================================================
   Category grid — muted, brand-aligned tiles
   ========================================================================== */
.br-cat-0 { --c1:#1b4d3e; --c2:#2d6b54; }   /* forest */
.br-cat-1 { --c1:#1f4e5f; --c2:#2f7286; }   /* teal-slate */
.br-cat-2 { --c1:#6b4e1a; --c2:#8a6324; }   /* bronze/gold — darkened so white count/desc clears AA contrast */
.br-cat-3 { --c1:#4a3a63; --c2:#6f578f; }   /* plum */
.br-cat-4 { --c1:#7a3326; --c2:#a8503c; }   /* terracotta */
.br-cat-5 { --c1:#2c3e50; --c2:#46607a; }   /* slate */

.br-cat-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(168px, 1fr));
	gap: 16px;
}
.br-cat-card {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 158px;
	padding: 18px;
	border-radius: var(--br-radius);
	text-decoration: none !important;
	color: #fff !important;
	overflow: hidden;
	background: linear-gradient(150deg, var(--c1, var(--br-primary)), var(--c2, var(--br-primary-dark)));
	box-shadow: var(--br-shadow);
	transition: transform 0.14s ease, box-shadow 0.14s ease;
}
.br-cat-card:hover { transform: translateY(-3px); box-shadow: var(--br-shadow-hover); }
.br-cat-name { font-family: var(--br-font-head); font-weight: 700; font-size: 1.12rem; }
.br-cat-desc {
	font-size: 0.78rem;
	line-height: 1.4;
	color: rgba(255, 255, 255, 0.85);
	margin: 5px 0 7px;
}
.br-cat-count { font-size: 0.74rem; letter-spacing: 0.03em; opacity: 0.9; }

/* ==========================================================================
   Review card grid
   ========================================================================== */
.br-card-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
	gap: 28px;
}
.br-card {
	position: relative;
	display: flex;
	flex-direction: column;
	border: 1px solid var(--br-border);
	border-radius: var(--br-radius);
	overflow: hidden;
	background: var(--br-surface);
	box-shadow: var(--br-shadow);
	transition: transform 0.14s ease, box-shadow 0.14s ease, border-color 0.14s ease;
}
.br-card:hover {
	transform: translateY(-2px);
	box-shadow: var(--br-shadow-hover);
	border-color: var(--br-gold);
}
.br-card-media {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 4 / 3;
	background: linear-gradient(150deg, var(--c1, #6b6357), var(--c2, #44403a));
	overflow: hidden;
	text-decoration: none;
}
.br-card-media img { width: 100%; height: 100%; object-fit: cover; }
/* Real product photo: FILL the media box edge-to-edge (like the placeholder
   gradient cards) on a clean white backdrop — no white margins/frame. Amazon
   product shots are centered on white, so cover crops only the empty edges and
   keeps every card's image area identical regardless of source aspect ratio. */
.br-card-media.has-img {
	background: #fff;
}
.br-card-media.has-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	transition: transform 0.25s ease;
}
.br-card:hover .br-card-media.has-img img { transform: scale(1.04); }
.br-card-ph {
	color: #fff;
	font-family: var(--br-font-head);
	font-weight: 700;
	font-size: 1.3rem;
	letter-spacing: 0.01em;
	text-shadow: 0 2px 8px rgba(0,0,0,0.18);
	padding: 0 14px;
	text-align: center;
}
.br-card-cat {
	position: absolute;
	top: 12px;
	left: 12px;
	/* skin-aware so the label stays legible on dark skins (was a hardcoded near-white). */
	background: var(--br-soft);
	color: var(--br-text);
	font-size: 0.66rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	padding: 4px 10px;
	border-radius: 999px;
	border: 1px solid var(--br-border);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}
.br-card-seal { position: absolute; top: 12px; right: 12px; }
.br-card-body { display: flex; flex-direction: column; gap: 8px; padding: 20px; flex: 1; }
.br-card-rating { margin-bottom: 2px; }
.br-card-title {
	margin: 0;
	font-family: var(--br-font-head);
	font-size: 1.18rem;
	font-weight: 700;
	line-height: 1.3;
}
.br-card-title a { color: var(--br-text); text-decoration: none; }
.br-card-title a:hover { color: var(--br-primary); }
.br-card-excerpt { margin: 0; font-size: 0.94rem; color: var(--br-muted); flex: 1; }
.br-card-link {
	font-weight: 600;
	text-decoration: none;
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin-top: 4px;
}
.br-card-link:hover { text-decoration: underline; }

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer { background: var(--br-ink); }
.br-footer { background: var(--br-ink); color: #cfc9bd; padding: 58px 0 46px; }
.br-footer-inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px;
	display: grid;
	grid-template-columns: 1.9fr 1fr 1fr;
	gap: 48px;
}
.br-footer-logo {
	font-family: var(--br-font-head);
	font-weight: 700;
	font-size: 1.55rem;
	color: #fff;
	margin-bottom: 12px;
}
.br-footer-blurb { color: #cfc9bd; margin: 0 0 14px; font-size: 0.96rem; }
.br-footer-disc { color: #8f897d; font-size: 0.8rem; line-height: 1.6; margin: 0; }
.br-footer-col h4 {
	font-family: var(--br-font-mono);
	font-size: 0.74rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--br-gold);
	margin: 0 0 16px;
}
.br-footer-col ul { list-style: none; margin: 0; padding: 0; }
.br-footer-col li { margin-bottom: 9px; }
.br-footer-col a { color: #cfc9bd; text-decoration: none; font-size: 0.95rem; }
.br-footer-col a:hover { color: #fff; }
.br-footer-about p { color: #cfc9bd; font-size: 0.92rem; line-height: 1.65; margin: 0; }

/* Copyright bar */
.site-info { background: var(--br-ink); border-top: 1px solid rgba(255, 255, 255, 0.08); }
.inside-site-info { padding: 18px 20px; }
.site-info,
.site-info .copyright,
.copyright-bar { color: #8f897d !important; font-family: var(--br-font-body); font-size: 0.82rem; }
.site-info a { color: #cfc9bd; }
.site-info a:hover { color: #fff; }

/* Default buttons (search etc.) to match brand */
button:not(.br-btn),
input[type="submit"],
.wp-block-search__button {
	background: var(--br-primary) !important;
	border-radius: 8px !important;
}

/* Comfortable reading size on single posts */
.single .entry-content,
.page .entry-content { font-size: 1.05rem; }

/* ==========================================================================
   Single-product review summary (Verdict layout + Test Bench score chip)
   ========================================================================== */
/* ==========================================================================
   Single-product review summary — FINAL "Verdict Band" redesign (drop-in).
   Replaces the .br-rs block (theme.css ~670-748) AND its @media overrides
   (~1050-1054, ~1102-1107, ~1132). Keep the helper rules already at
   theme.css ~1137-1142 (.br-rs-imglink, .br-rs-asof) — they are reused.

   Root cause fixed: NO 3-track grid. The card is a vertical flex stack of
   full-width zones; only the verdict band splits into 2 generous halves, and
   pros/cons get their own full-width 1fr/1fr band — so nothing is ever
   subdivided below ~250px (the old middle column was ~188px in a 760 column).

   100% token-based. Skins (inc/skins.php) override surface/soft/border/text/
   muted/primary/gold/radius/fonts but NOT the score tiers, --br-success,
   --br-danger or --br-shadow — so the chip + glyph colors stay correct on the
   midnight dark skin, and white numerals sit only on saturated tier fills.
   ========================================================================== */

/* ---- Card shell: sectioned magazine box; zones meet on shared 1px borders -- */
.br-rs {
	display: flex;
	flex-direction: column;
	gap: 0;
	border: 1px solid var(--br-border);
	border-radius: var(--br-radius);
	background: var(--br-surface);
	box-shadow: var(--br-shadow);
	overflow: hidden;            /* keeps zone fills inside the rounded corners */
	margin: 0 0 2em;
}

/* ==========================================================================
   ZONE 1 — VERDICT BAND : facts | conversion rail
   ========================================================================== */
.br-rs-band {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 250px;   /* facts get the room; rail fixed */
	align-items: stretch;
}
/* No price → no rail: the score/verdict fills the whole row (avoids a lopsided
   or empty 250px panel now that the buy button lives only at the end). */
.br-rs-band--norail { grid-template-columns: 1fr; }

.br-rs-facts {
	display: flex;
	align-items: center;
	gap: 22px;
	padding: 32px 28px;
	min-width: 0;
}

/* compact thumbnail — a tidy product well beside the text, sized to balance the
   score+verdict stack. Tokenised fill (dark-safe; replaces old hardcoded #fff). */
.br-rs-media {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 108px;
	height: 108px;
	padding: 9px;
	border-radius: var(--br-radius-sm);
	background: var(--br-soft);
	border: 1px solid var(--br-border);
	overflow: hidden;
}
.br-rs-media img { max-width: 100%; max-height: 100%; object-fit: contain; }
.br-rs-ph {
	padding: 8px;
	text-align: center;
	font-family: var(--br-font-head);
	font-weight: 700;
	font-size: 0.78rem;
	line-height: 1.2;
	color: var(--br-muted);
}
/* (.br-rs-imglink hover/transition rules already exist at theme.css ~1137-1139) */

.br-rs-headwrap {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	gap: 9px;
	min-width: 0;
}

/* score row — colored chip is FOCAL POINT #1 */
.br-rs-score {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
}
.br-rs-num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 60px;
	padding: 7px 13px;
	border-radius: var(--br-radius-sm);
	font-family: var(--br-font-head);
	font-size: 1.9rem;
	font-weight: 700;
	line-height: 1;
	color: #fff;                                /* numerals sit on a saturated tier fill */
	background: var(--br-score-na);
	box-shadow: var(--br-shadow);
}
.br-tier-good .br-rs-num { background: var(--br-score-good); }
.br-tier-ok   .br-rs-num { background: var(--br-score-ok); }
.br-tier-bad  .br-rs-num { background: var(--br-score-bad); }

.br-rs-scoremeta {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}
.br-rs-badge {
	align-self: flex-start;
	font-family: var(--br-font-head);
	font-size: 0.74rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--br-text);
}
.br-tier-good .br-rs-badge { color: #0f7a37; }
.br-tier-ok   .br-rs-badge { color: #9a6210; }
.br-tier-bad  .br-rs-badge { color: var(--br-score-bad); }
.br-rs-out {
	font-family: var(--br-font-mono);
	font-size: 0.72rem;
	font-weight: 500;
	color: var(--br-muted);
	letter-spacing: 0.02em;
}
.br-rs-stars { display: inline-flex; align-items: center; }

/* OPTIONAL product name (drop in PHP when the H1 already shows the title) */
.br-rs-name {
	margin: 0;
	font-family: var(--br-font-head);
	font-size: 1.2rem;
	font-weight: 700;
	line-height: 1.25;
	color: var(--br-text);
}

.br-rs-verdict {
	margin: 0;
	font-family: var(--br-font-body);
	font-size: 1.02rem;
	font-weight: 500;
	line-height: 1.5;
	color: var(--br-text);
}

/* CONVERSION RAIL — FOCAL POINT #2; tinted, bordered; big price over full-width button */
.br-rs-cta {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: center;
	gap: 16px;
	padding: 28px 24px;
	background: var(--br-soft);
	border-left: 1px solid var(--br-border);
	text-align: center;
}
.br-rs-pricewrap { display: flex; flex-direction: column; gap: 3px; }
.br-rs-pricelabel {
	font-family: var(--br-font-mono);
	font-size: 0.66rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--br-muted);
}
.br-rs-price {
	font-family: var(--br-font-head);
	font-size: 2.15rem;
	font-weight: 700;
	line-height: 1.05;
	color: var(--br-text);
}
.br-rs-asof {
	font-family: var(--br-font-mono);
	font-size: 0.68rem;
	color: var(--br-muted);
	letter-spacing: 0.02em;
}

/* ==========================================================================
   ZONE 2 — FULL-WIDTH PROS / CONS (each side ~half of ~760px, no wrapping)
   ========================================================================== */
.br-rs-proscons {
	display: grid;
	grid-template-columns: 1fr 1fr;
	border-top: 1px solid var(--br-border);
}
.br-rs-col { padding: 18px 26px; min-width: 0; }
.br-rs-col + .br-rs-col { border-left: 1px solid var(--br-border); }  /* faint center rule */

/* PHP guard: when only one side exists, the band is single-column (no blank half) */
.br-rs-proscons--single { grid-template-columns: 1fr; }

.br-rs-pchead {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin: 0 0 9px;
	font-family: var(--br-font-head);
	font-size: 0.74rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}
.br-rs-pchead::before { font-size: 0.95em; line-height: 1; }
.br-rs-pchead--pro { color: var(--br-success); }
.br-rs-pchead--pro::before { content: "\2713"; }
.br-rs-pchead--con { color: var(--br-danger); }
.br-rs-pchead--con::before { content: "\2715"; }

.br-rs-pros,
.br-rs-cons {
	margin: 0;
	padding: 0;
	list-style: none;
	font-family: var(--br-font-body);
	font-size: 0.94rem;
}
.br-rs-pros li,
.br-rs-cons li {
	position: relative;
	padding-left: 22px;
	margin-bottom: 7px;
	line-height: 1.4;
	color: var(--br-text);
}
.br-rs-pros li:last-child,
.br-rs-cons li:last-child { margin-bottom: 0; }
.br-rs-pros li::before {
	content: "\2713";
	position: absolute;
	left: 0; top: 1px;
	color: var(--br-success);
	font-weight: 700;
}
.br-rs-cons li::before {
	content: "\2715";
	position: absolute;
	left: 0; top: 1px;
	color: var(--br-danger);
	font-weight: 700;
}

/* ==========================================================================
   ZONE 3 — SLIM DISCLOSURE STRIP (alternating soft fill closes the card)
   ========================================================================== */
.br-rs-foot {
	padding: 11px 26px;
	border-top: 1px solid var(--br-border);
	background: var(--br-soft);
}
.br-rs-note {
	font-family: var(--br-font-body);
	font-size: 0.72rem;
	line-height: 1.5;
	color: var(--br-muted);
}

/* ==========================================================================
   RESPONSIVE — graceful single-column stack; no tall square ever appears.
   ========================================================================== */

/* Tablet / narrow content: band collapses; CTA becomes a horizontal price+button row */
@media (max-width: 860px) {
	.br-rs-band { grid-template-columns: 1fr; }
	.br-rs-cta {
		border-left: none;
		border-top: 1px solid var(--br-border);
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		text-align: left;
		gap: 14px 20px;
	}
	.br-rs-pricewrap {
		flex-direction: row;
		align-items: baseline;
		flex-wrap: wrap;
		gap: 8px;
	}
}

/* Phone: full single-column stack; pros/cons divider switches center->top */
@media (max-width: 560px) {
	.br-rs-facts {
		align-items: flex-start;
		padding: 20px;
		gap: 16px;
	}
	.br-rs-media { width: 84px; height: 84px; }
	.br-rs-num { font-size: 1.6rem; min-width: 52px; }
	.br-rs-name { font-size: 1.08rem; }
	.br-rs-price { font-size: 1.7rem; }

	.br-rs-proscons { grid-template-columns: 1fr; }
	.br-rs-col { padding: 16px 20px; }
	.br-rs-col + .br-rs-col {
		border-left: none;
		border-top: 1px solid var(--br-border);
	}

	.br-rs-cta { flex-direction: column; align-items: stretch; text-align: left; }

	.br-rs-foot { padding: 11px 20px; }
}

/* ==========================================================================
   Specifications table
   ========================================================================== */
.br-specs {
	border: 1px solid var(--br-border);
	border-radius: var(--br-radius);
	overflow: hidden;
	margin: 2em 0;
	background: var(--br-surface);
}
.br-specs-title {
	background: var(--br-soft);
	color: var(--br-text);
	font-family: var(--br-font-head);
	font-weight: 700;
	font-size: 1.05rem;
	padding: 14px 20px;
	border-bottom: 1px solid var(--br-border);
}
.br-specs table { width: 100%; border-collapse: collapse; margin: 0; }
.br-specs th,
.br-specs td { padding: 13px 20px; border-top: 1px solid var(--br-border); text-align: left; font-size: 0.94rem; }
.br-specs tbody tr:first-child th,
.br-specs tbody tr:first-child td { border-top: none; }
.br-specs th { width: 42%; color: var(--br-muted); font-weight: 600; }
.br-specs td { color: var(--br-text); font-size: 0.9rem; }
.br-specs th, .br-specs td { overflow-wrap: anywhere; } /* long unbroken values never overflow */
.br-specs tr:nth-child(even) { background: var(--br-bg); }

/* ==========================================================================
   FAQ
   ========================================================================== */
.br-faq { margin: 2.4em 0; }
.br-faq-item {
	border: 1px solid var(--br-border);
	border-radius: var(--br-radius-sm);
	margin-bottom: 10px;
	background: var(--br-surface);
	overflow: hidden;
}
.br-faq-item summary {
	cursor: pointer;
	padding: 16px 20px;
	font-family: var(--br-font-head);
	font-weight: 600;
	font-size: 1.02rem;
	color: var(--br-text);
	list-style: none;
	position: relative;
	padding-right: 46px;
}
.br-faq-item summary::-webkit-details-marker { display: none; }
.br-faq-item summary::after {
	content: "+";
	position: absolute;
	right: 20px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 1.4rem;
	font-weight: 400;
	color: var(--br-primary);
}
.br-faq-item[open] summary::after { content: "\2013"; }
.br-faq-a { padding: 0 20px 18px; color: var(--br-text); }

/* Active (open) question — on-brand accent that adapts to the chosen skin
   (uses the skin's primary colour, so it always matches the site identity). */
.br-faq-item summary { transition: color 0.15s ease; }
.br-faq-item summary:hover { color: var(--br-primary); }
.br-faq-item[open] {
	border-color: var(--br-primary);
	box-shadow: inset 3px 0 0 0 var(--br-primary), 0 8px 22px rgba(0, 0, 0, 0.06);
}
.br-faq-item[open] summary { color: var(--br-primary); }
.br-faq-item[open] summary::after {
	color: var(--br-primary);
	font-weight: 600;
}
.br-faq-item[open] .br-faq-a {
	border-top: 1px solid var(--br-border);
	padding-top: 16px;
	/* Soft tint of the skin's primary colour — adapts to every design. */
	background: color-mix(in srgb, var(--br-primary) 6%, var(--br-surface));
}

/* ==========================================================================
   Archive pages
   ========================================================================== */
.br-archive { padding-top: 48px; }
.br-archive-head { margin-bottom: 32px; padding-bottom: 18px; border-bottom: 1px solid var(--br-border); }
.br-archive-title { margin: 0; font-size: 2.2rem; font-weight: 700; color: var(--br-text); }
.br-archive-desc {
	font-family: var(--br-font-body);
	font-size: 1rem;
	font-weight: 400;
	color: var(--br-muted);
	margin-top: 8px;
}
.br-pagination { margin-top: 38px; }
.br-pagination .page-numbers {
	display: inline-block;
	padding: 9px 15px;
	margin: 0 3px;
	border: 1px solid var(--br-border);
	border-radius: 8px;
	text-decoration: none;
	font-weight: 600;
	font-size: 0.9rem;
	color: var(--br-text);
}
.br-pagination .page-numbers.current { background: var(--br-primary); color: #fff; border-color: var(--br-primary); }
.br-pagination .page-numbers:hover { border-color: var(--br-primary); color: var(--br-primary); }
.br-pagination .page-numbers.current:hover { color: #fff; }

/* Single review: comfortable reading measure; wide components breathe.
   Header + meta share the content column so breadcrumb, title and body align. */
.single-post.no-sidebar .inside-article > .entry-content,
.single-post .entry-content,
.single-post .entry-header,
.page .entry-content,
.page .entry-header {
	max-width: 760px;
	margin-left: auto;
	margin-right: auto;
}
/* Static pages (About, Contact, Privacy, Terms): comfortable reading rhythm */
.page .entry-content h2 { font-size: 1.5rem; margin-top: 1.5em; }
.page .entry-content p,
.page .entry-content li { line-height: 1.7; }
.page .entry-content ul { margin: 1em 0; padding-left: 1.2em; }
.page .entry-content li { margin-bottom: 0.5em; }
.single-post .entry-content .br-rs,
.single-post .entry-content .br-specs,
.single-post .entry-content .br-compare-wrap { max-width: none; }

/* ==========================================================================
   Inline affiliate disclosure
   ========================================================================== */
.br-disclosure {
	font-family: var(--br-font-body);
	font-size: 0.82em;
	color: var(--br-muted);
	background: var(--br-soft);
	border-left: 3px solid var(--br-gold);
	padding: 11px 16px;
	border-radius: var(--br-radius-sm);
	margin: 0 0 1.6em;
}

/* ==========================================================================
   Breadcrumb (single reviews)
   ========================================================================== */
.br-crumbs {
	max-width: 760px;
	margin: 0 auto 22px;
	font-family: var(--br-font-mono);
	font-size: 0.74rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}
.br-crumbs ol {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 0;
}
.br-crumbs li { display: inline-flex; align-items: center; gap: 8px; color: var(--br-muted); }
.br-crumbs li + li::before { content: "\203A"; color: var(--br-muted); opacity: 0.55; }
.br-crumbs a { color: var(--br-primary); text-decoration: none; }
.br-crumbs a:hover { text-decoration: underline; }
.br-crumbs-current {
	max-width: 280px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ==========================================================================
   Article meta + post navigation
   ========================================================================== */
.entry-meta {
	font-family: var(--br-font-mono);
	font-size: 0.78rem;
	color: var(--br-muted);
	letter-spacing: 0.02em;
}
.entry-meta a { color: var(--br-primary); text-decoration: none; }
.entry-meta a:hover { text-decoration: underline; }
.single-post footer.entry-meta {
	max-width: 760px;
	margin: 28px auto 0;
	padding-top: 18px;
	border-top: 1px solid var(--br-border);
}

.post-navigation {
	max-width: 760px;
	margin: 28px auto 0;
	padding-top: 26px;
	border-top: 1px solid var(--br-border);
}
.post-navigation .nav-links { display: flex; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.post-navigation .nav-previous, .post-navigation .nav-next { max-width: 48%; }
.post-navigation .nav-next { margin-left: auto; text-align: right; }
.post-navigation a {
	color: var(--br-text);
	text-decoration: none;
	font-family: var(--br-font-head);
	font-weight: 700;
	line-height: 1.35;
}
.post-navigation a:hover { color: var(--br-primary); }

/* ==========================================================================
   Comments
   ========================================================================== */
.comments-area {
	max-width: 760px;
	margin: 52px auto 0;
	padding-top: 36px;
	border-top: 1px solid var(--br-border);
}
.comments-title,
.comment-reply-title {
	font-family: var(--br-font-head);
	font-weight: 700;
	font-size: 1.5rem;
	margin: 0 0 20px;
}
.comment-list { list-style: none; margin: 0 0 32px; padding: 0; }
.comment-body {
	border: 1px solid var(--br-border);
	border-radius: var(--br-radius);
	background: var(--br-surface);
	padding: 18px 22px;
	margin-bottom: 16px;
}
.comment-author .fn { font-family: var(--br-font-head); font-weight: 700; font-style: normal; color: var(--br-text); }
.comment-metadata, .comment-metadata a { color: var(--br-muted); font-size: 0.78rem; font-family: var(--br-font-mono); }
.comment-respond { background: var(--br-soft); border: 1px solid var(--br-border); border-radius: var(--br-radius); padding: 26px; }
.comment-form { margin-top: 4px; }
.comment-form .comment-notes,
.comment-form .comment-form-cookies-consent label { font-size: 0.85rem; color: var(--br-muted); }
.comment-form label { display: block; font-size: 0.82rem; font-weight: 600; color: var(--br-muted); margin-bottom: 5px; }
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
	width: 100%;
	background: var(--br-surface);
	border: 1px solid var(--br-border);
	border-radius: 8px;
	padding: 12px 14px;
	font-family: var(--br-font-body);
	font-size: 0.95rem;
	color: var(--br-text);
}
.comment-form input:focus,
.comment-form textarea:focus { border-color: var(--br-primary); outline: none; box-shadow: 0 0 0 3px rgba(27, 77, 62, 0.1); }
.comment-form .form-submit input[type="submit"] {
	background: var(--br-primary) !important;
	color: #fff !important;
	border: none !important;
	border-radius: 999px !important;
	padding: 13px 30px !important;
	font-family: var(--br-font-mono);
	text-transform: uppercase;
	font-size: 0.8rem;
	letter-spacing: 0.04em;
	cursor: pointer;
}
.comment-form .form-submit input[type="submit"]:hover { background: var(--br-primary-dark) !important; }

/* ==========================================================================
   Contact Form 7
   ========================================================================== */
.wpcf7-form p { margin: 0 0 16px; }
.wpcf7-form label { display: block; font-size: 0.9rem; font-weight: 600; color: var(--br-text); }
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="url"],
.wpcf7-form textarea {
	width: 100%;
	background: var(--br-surface);
	border: 1px solid var(--br-border);
	border-radius: 8px;
	padding: 12px 14px;
	margin-top: 6px;
	font-family: var(--br-font-body);
	font-size: 0.95rem;
	color: var(--br-text);
}
.wpcf7-form input:focus,
.wpcf7-form textarea:focus { border-color: var(--br-primary); outline: none; box-shadow: 0 0 0 3px rgba(27, 77, 62, 0.1); }
.wpcf7-form .wpcf7-submit {
	background: var(--br-primary) !important;
	color: #fff !important;
	border: none !important;
	border-radius: 999px !important;
	padding: 13px 34px !important;
	margin-top: 4px;
	font-family: var(--br-font-mono);
	text-transform: uppercase;
	font-size: 0.82rem;
	letter-spacing: 0.04em;
	cursor: pointer;
	width: auto;
}
.wpcf7-form .wpcf7-submit:hover { background: var(--br-primary-dark) !important; }
.wpcf7 .wpcf7-response-output { border-radius: 8px; margin: 14px 0 0 !important; font-size: 0.9rem; }
.wpcf7-not-valid-tip { color: var(--br-danger); font-size: 0.82rem; }

/* ==========================================================================
   Responsive
   ========================================================================== */

/* Tablet */
@media (max-width: 920px) {
	.br-product-box { grid-template-columns: 120px 1fr 150px; gap: 16px; }
	.br-section-head { flex-wrap: wrap; gap: 8px; }
}

/* Phone */
@media (max-width: 768px) {
	body { font-size: 17px; }
	/* The real nav bar is sticky on desktop, but on mobile it collapses to an
	   (empty) row that would sit on top of the hamburger — switch it back to
	   static and strip its chrome until the menu is actually opened. */
	#site-navigation.main-navigation { position: static !important; }
	#site-navigation.main-navigation:not(.toggled) { border: none; background: transparent; }
	#site-navigation.main-navigation.toggled { border-top: 1px solid var(--br-border); }
	#site-navigation.main-navigation.toggled .main-nav ul li a { padding: 12px 20px; }
	/* Pin the hamburger toggle to the top-right of the header, next to the logo. */
	.has-inline-mobile-toggle .inside-header { position: relative; align-items: center; }
	.has-inline-mobile-toggle .mobile-menu-control-wrapper {
		display: flex !important;
		position: absolute;
		top: 50%;
		right: 4px;
		transform: translateY(-50%);
		margin: 0;
		align-items: center;
		border: none;
		background: transparent;
		z-index: 5;
	}
	.mobile-menu-control-wrapper .menu-toggle {
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		color: #fff !important;
		background: var(--br-primary) !important;
		border-radius: 10px;
		font-size: 1.55rem;
		line-height: 1;
		padding: 11px 13px;
	}
	.mobile-menu-control-wrapper .menu-toggle:hover,
	.mobile-menu-control-wrapper .menu-toggle:focus { background: var(--br-primary-dark) !important; }
	.mobile-menu-control-wrapper .gp-icon svg { fill: #fff; width: 1em; height: 1em; }
	.entry-content h2 { font-size: 1.55rem; }
	.br-proscons { grid-template-columns: 1fr; }
	.br-buyer-fit { grid-template-columns: 1fr; }
	.br-product-box { grid-template-columns: 1fr; text-align: center; gap: 16px; }
	.br-pb-cta { align-items: stretch; }
	.br-hero { padding: 44px 18px 38px; margin-bottom: 34px; }
	.br-hero-sub { font-size: 1.08rem; }
	.br-section { margin-bottom: 42px; }
	.br-section-head h2 { font-size: 1.45rem; }
	.br-card-grid { gap: 20px; }
	.br-toc { max-width: none; }
	.br-footer { padding: 44px 0 36px; }
	.br-footer-inner { grid-template-columns: 1fr; gap: 32px; }
	.post-navigation .nav-links { flex-direction: column; }
	.post-navigation .nav-previous,
	.post-navigation .nav-next { max-width: 100%; }
	.post-navigation .nav-next { margin-left: 0; text-align: left; }
	.comment-respond { padding: 20px; }
	/* ---- mobile tap targets + table safety (audit) ---- */
	.br-pagination .page-numbers { padding: 13px 18px; font-size: 1rem; }
	.br-toc a { display: inline-block; padding: 4px 0; }
	.br-footer-col li { margin-bottom: 2px; }
	.br-footer-col a { display: inline-block; padding: 5px 0; }
	.br-specs { overflow-x: auto; }
	.br-specs th, .br-specs td { padding: 12px 15px; }
	.br-crumbs li, .br-crumbs-current { overflow-wrap: anywhere; }
}

/* Small phone */
@media (max-width: 480px) {
	.inside-header { padding: 16px; }
	.main-title { font-size: 1.45rem !important; }
	.br-topbar { font-size: 0.72rem; padding: 8px 12px; }
	.br-hero-title { font-size: 2rem; }
	.br-hero-trust { font-size: 0.72rem; line-height: 1.8; }
	.br-cat-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
	.br-cat-card { min-height: 96px; padding: 14px; }
	.br-cat-name { font-size: 1rem; }
	.br-card-grid { grid-template-columns: 1fr; }
	.br-section-head { flex-wrap: wrap; gap: 6px; }
	.br-btn { padding: 13px 20px; }
	.entry-content h2 { font-size: 1.4rem; }
}

/* Clickable affiliate product image (review summary) */
.br-rs-imglink { display:block; line-height:0; text-decoration:none; width:100%; height:100%; }
.br-rs-imglink img { transition: transform .15s ease; }
.br-rs-imglink:hover img { transform: scale(1.03); }

/* ==========================================================================
   Single reviews: the title leads. The featured image is HIDDEN here — product
   photos appear inline within the article instead (and the image is still used
   for cards, the review summary and the social/OG preview).
   ========================================================================== */
.single .featured-image,
.single .post-image,
.single .page-header-image,
.featured-image.page-header-image-single {
	display: none !important;
}

/* ==========================================================================
   Accessibility
   ========================================================================== */
/* Clear, consistent keyboard focus ring on every interactive element. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
.br-btn:focus-visible,
[tabindex]:focus-visible {
	outline: 3px solid var(--br-primary);
	outline-offset: 2px;
	border-radius: 3px;
}
.br-card:focus-within { outline: 3px solid var(--br-primary); outline-offset: 2px; }

/* Skip-link (provided by GeneratePress) — visible + reachable when focused. */
.skip-link:focus {
	position: fixed !important;
	left: 12px;
	top: 12px;
	z-index: 100000;
	width: auto;
	height: auto;
	padding: 10px 16px;
	background: var(--br-surface);
	color: var(--br-primary) !important;
	border-radius: 8px;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}

/* Screen-reader-only utility. */
.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Honour reduced-motion preferences. */
@media ( prefers-reduced-motion: reduce ) {
	*, *::before, *::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}
	.br-card:hover { transform: none; }
	.br-card:hover .br-card-media.has-img img,
	.br-rs-imglink:hover img,
	.br-amz-imgbtn:hover { transform: none; }
}