/*
Theme Name: Bosveld Brak
Description: Bosveld Brak brand theme. Child theme of Twenty Twenty-Five, styled for WooCommerce.
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.7
Text Domain: bosveld-brak
*/

/* ------------------------------------------------------------------
   Brand tokens. Colours come from theme.json; these are shortcuts.
------------------------------------------------------------------- */
:root {
	--br-black: #000;
	--br-base: var(--wp--preset--color--base);
	--br-sand: var(--wp--preset--color--contrast);
	--br-accent: var(--wp--preset--color--accent-1);
	--br-muted: var(--wp--preset--color--accent-4);
	--br-surface: var(--wp--preset--color--accent-3);
	--br-surface-dark: var(--wp--preset--color--accent-5);
	--br-line: var(--wp--preset--color--accent-6);
	--br-display: var(--wp--preset--font-family--oswald);
	--br-marker: var(--wp--preset--font-family--marker);
}

/* Ladies' range: pink replaces orange as the accent. */
body.br-ladies {
	--wp--preset--color--accent-1: var(--wp--preset--color--accent-2);
	--br-accent: var(--wp--preset--color--accent-2);
}

::selection { background: var(--br-accent); color: var(--br-base); }

/* ------------------------------------------------------------------
   Utilities
------------------------------------------------------------------- */
.br-marker {
	font-family: var(--br-marker);
	text-transform: none;
	letter-spacing: 0;
	font-weight: 400;
}
.br-muted { color: var(--br-muted); }
.br-accent { color: var(--br-accent); }

/* Three diagonal claw marks above a heading. */
.br-claw::before {
	content: "";
	display: block;
	width: 64px;
	height: 26px;
	margin: 0 auto 0.75rem;
	background:
		linear-gradient(115deg, transparent 42%, var(--br-accent) 43% 53%, transparent 54%) 0 0 / 22px 26px no-repeat,
		linear-gradient(115deg, transparent 42%, var(--br-accent) 43% 53%, transparent 54%) 20px 0 / 22px 26px no-repeat,
		linear-gradient(115deg, transparent 42%, var(--br-accent) 43% 53%, transparent 54%) 40px 0 / 22px 26px no-repeat;
}
.br-claw.has-text-align-left::before { margin-left: 0; }

/* Brush-stroke underline for slogans. */
.br-stroke {
	background: linear-gradient(100deg, transparent 2%, var(--br-accent) 3% 96%, transparent 97%) left 92% / 100% 0.18em no-repeat;
	padding-bottom: 0.15em;
}

/* ------------------------------------------------------------------
   Header
------------------------------------------------------------------- */
.br-header {
	background: var(--br-black);
	border-bottom: 1px solid var(--br-line);
	padding: 0.6rem var(--wp--style--root--padding-right, 1rem) 0.6rem var(--wp--style--root--padding-left, 1rem);
	position: sticky;
	top: 0;
	z-index: 50;
}
.admin-bar .br-header { top: var(--wp-admin--admin-bar--height, 32px); }
.br-brand { gap: 0.75rem; }
.br-brand .wp-block-site-title a { color: var(--br-sand); text-decoration: none; }
.br-brand .wp-block-site-title a:hover { color: var(--br-accent); }
.br-header__tools { gap: 1.25rem; }
.br-header .wp-block-navigation a { text-decoration: none; }
.br-header .wp-block-navigation a:hover,
.br-header .wp-block-navigation .current-menu-item > a { color: var(--br-accent); }
.br-header .wp-block-search__button,
.br-header .wc-block-mini-cart__button,
.br-header .wp-block-woocommerce-customer-account a {
	background: transparent;
	color: var(--br-sand);
	padding: 0.25rem;
	border: 0;
}
.br-header .wp-block-search__button svg { fill: currentColor; }

.br-header .wp-block-woocommerce-customer-account a,
.br-header .wp-block-woocommerce-customer-account svg { color: var(--br-sand) !important; }
.br-header .wp-block-woocommerce-customer-account a:hover,
.br-header .wp-block-woocommerce-customer-account a:hover svg,
.br-header .wc-block-mini-cart__button:hover,
.br-header .wp-block-search__button:hover { color: var(--br-accent) !important; }
.br-header .wp-block-search { margin: 0; align-self: center; }
.br-header .wp-block-search__input {
	background: var(--br-surface);
	color: var(--br-sand);
	border: 1px solid var(--br-line);
}
.br-header .wc-block-mini-cart__badge { background: var(--br-accent); color: var(--br-base); }
.wp-block-site-logo img { border-radius: 50%; }

@media (max-width: 599px) {
	.br-brand .wp-block-site-title { display: none; }
	.br-header__tools { gap: 0.6rem; }
}

/* Modern header: frosted glass, brand-gradient underline */
.br-header {
	background: transparent;
	border-bottom: 0;
	padding-top: 0.7rem;
	padding-bottom: 0.7rem;
}
/* The blur lives on a separate layer: backdrop-filter on the header itself would trap
   the full-screen phone menu inside the header bar. */
.br-header::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: rgba(0, 0, 0, 0.72);
	-webkit-backdrop-filter: saturate(150%) blur(14px);
	backdrop-filter: saturate(150%) blur(14px);
}
.br-header::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 2px;
	background: linear-gradient(90deg, transparent, #F26A1B 20%, #F26A1B 45%, #EC5A93 55%, #EC5A93 80%, transparent);
	opacity: 0.75;
}
.br-brand .wp-block-site-logo img { transition: transform 0.4s ease; }
.br-brand:hover .wp-block-site-logo img { transform: rotate(-10deg) scale(1.05); }

/* Desktop menu links: slanted bar slides in underneath */
.br-header .wp-block-navigation__container { gap: 1.6rem; }
.br-header .wp-block-navigation-item__content {
	position: relative;
	padding: 0.45rem 0.1rem !important;
	color: var(--br-sand);
	transition: color 0.2s ease;
}
.br-header .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 3px;
	background: var(--item-accent, #F26A1B);
	transform: skewX(-25deg) scaleX(0);
	transform-origin: left;
	transition: transform 0.25s ease;
}
.br-header .wp-block-navigation-item__content:hover,
.br-header .is-current > .wp-block-navigation-item__content { color: var(--item-accent, #F26A1B) !important; }
.br-header .wp-block-navigation-item__content:hover::after,
.br-header .is-current > .wp-block-navigation-item__content::after { transform: skewX(-25deg) scaleX(1); }
.br-header .wp-block-navigation-item:has(a[href*="/ladies/"]) { --item-accent: #EC5A93; }

/* "Shop" as a pill button */
.br-header .wp-block-navigation-item:has(> a[href="/shop/"]) > .wp-block-navigation-item__content {
	border: 1.5px solid #F26A1B;
	border-radius: 999px;
	padding: 0.4rem 1.05rem !important;
	color: #F26A1B;
	transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}
.br-header .wp-block-navigation-item:has(> a[href="/shop/"]) > .wp-block-navigation-item__content::after { display: none; }
.br-header .wp-block-navigation-item:has(> a[href="/shop/"]) > .wp-block-navigation-item__content:hover,
.br-header .is-current:has(> a[href="/shop/"]) > .wp-block-navigation-item__content {
	background: #F26A1B;
	color: var(--br-base) !important;
	box-shadow: 0 0 22px -4px rgba(242, 106, 27, 0.75);
}

/* Round icon buttons, divided from the menu */
.br-header .wp-block-search {
	border-left: 1px solid var(--br-line);
	padding-left: 1.1rem;
}
.br-header .wp-block-search__button,
.br-header .wp-block-woocommerce-customer-account a,
.br-header .wc-block-mini-cart__button {
	width: 40px;
	height: 40px;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	padding: 0 !important;
	transition: background 0.2s ease, color 0.2s ease;
}
.br-header .wp-block-search__button:hover,
.br-header .wp-block-woocommerce-customer-account a:hover,
.br-header .wc-block-mini-cart__button:hover { background: rgba(255, 255, 255, 0.08) !important; }
.br-header__tools { gap: 0.5rem 1rem; }
.br-header .wp-block-search__inside-wrapper { align-items: center; }

/* Keep the desktop menu on one line: drop the name text on mid-size screens,
   and switch to the menu button below 960px (WordPress's default switch is 600px). */
@media (max-width: 1240px) {
	.br-brand .wp-block-site-title { display: none; }
	.br-header .wp-block-navigation__container { gap: 1.15rem; }
}
@media (max-width: 960px) {
	.br-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex !important; }
	.br-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none !important; }
	.br-header .wp-block-search { border-left: 0; padding-left: 0; }
}

/* Phone menu overlay: big, left-aligned, with a brand bar on hover */
.wp-block-navigation__responsive-container.is-menu-open {
	background:
		radial-gradient(ellipse 80% 50% at 0% 0%, rgba(242, 106, 27, 0.18), transparent 70%),
		var(--br-base) !important;
	padding: 1.5rem 1.75rem !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	align-items: flex-start !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	align-items: flex-start !important;
	gap: 0.4rem !important;
	padding-top: 2.5rem;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	font-size: 2rem;
	letter-spacing: 0.04em;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	display: flex !important;
	align-items: center;
	gap: 0.75rem;
	padding: 0.2rem 0 !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content::before {
	content: "";
	width: 0;
	height: 4px;
	background: var(--item-accent, #F26A1B);
	transform: skewX(-25deg);
	transition: width 0.25s ease;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover::before,
.wp-block-navigation__responsive-container.is-menu-open .is-current > .wp-block-navigation-item__content::before { width: 1.6rem; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover,
.wp-block-navigation__responsive-container.is-menu-open .is-current > .wp-block-navigation-item__content { color: var(--item-accent, #F26A1B) !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:has(a[href*="/ladies/"]) { --item-accent: #EC5A93; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content::after { display: none; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:has(> a[href="/shop/"]) > .wp-block-navigation-item__content {
	border: 0;
	padding: 0.2rem 0 !important;
	background: none;
	box-shadow: none;
}

@media (prefers-reduced-motion: reduce) {
	.br-header *, .br-header *::after, .wp-block-navigation__responsive-container * { transition: none !important; }
}

/* ------------------------------------------------------------------
   Homepage: hero
------------------------------------------------------------------- */
.br-hero { margin-top: 0 !important; position: relative; background: var(--br-black); }
.br-hero figure { margin: 0; }
.br-hero img { width: 100%; height: auto; display: block; }
.br-hero-mobile { display: none; }
@media (max-width: 781px) {
	.br-hero-desktop { display: none; }
	.br-hero-mobile { display: block; }
}

.br-intro {
	padding: clamp(2.5rem, 6vw, 4.5rem) 1.25rem;
	text-align: center;
	background:
		radial-gradient(ellipse at top, rgba(242, 106, 27, 0.16), transparent 60%),
		var(--br-base);
	border-bottom: 1px solid var(--br-line);
}
.br-intro .br-intro__lead {
	font-size: clamp(2rem, 5.5vw, 3.6rem);
	line-height: 1.15;
	margin-bottom: 0.5rem;
	color: var(--br-sand);
}
.br-intro .br-intro__sub {
	font-family: var(--br-display);
	text-transform: uppercase;
	letter-spacing: 0.18em;
	color: var(--br-accent);
	font-size: clamp(0.85rem, 2vw, 1.05rem);
	margin-top: 0;
}

/* ------------------------------------------------------------------
   Homepage: sections
------------------------------------------------------------------- */
.br-section {
	padding-top: clamp(3rem, 7vw, 5.5rem);
	padding-bottom: clamp(3rem, 7vw, 5.5rem);
}
.br-section--dark { background: var(--br-surface-dark); }
.br-section__title { font-size: clamp(1.8rem, 4vw, 2.75rem); margin-bottom: 0.5rem; }
.br-section__lede { color: var(--br-muted); margin-top: 0; margin-bottom: 2.5rem; }

/* Category tiles */
.br-tiles.wp-block-columns {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.25rem;
}
@media (max-width: 900px) {
	.br-tiles.wp-block-columns { grid-template-columns: repeat(2, 1fr); gap: 0.85rem; }
}
.br-tile {
	background: var(--br-surface);
	border: 1px solid var(--br-line);
	overflow: hidden;
	transition: border-color 0.2s ease, transform 0.2s ease;
}
.br-tile:hover { border-color: var(--br-accent); transform: translateY(-3px); }
.br-tile figure { margin: 0; overflow: hidden; aspect-ratio: 1; }
.br-tile img { width: 100%; height: 100%; aspect-ratio: 1; object-fit: cover; transition: transform 0.4s ease; }
.br-tile:hover img { transform: scale(1.05); }
.br-tile .wp-block-heading { margin: 1rem 1rem 0.25rem; font-size: clamp(1.1rem, 2.2vw, 1.5rem); }
.br-tile .wp-block-heading a { color: var(--br-sand); text-decoration: none; }
.br-tile .wp-block-heading a::after { content: " →"; color: var(--br-accent); }
.br-tile .br-marker { margin: 0 1rem 1.1rem; color: var(--br-accent); font-size: 0.95rem; line-height: 1.3; }
.br-tile--ladies .br-marker { color: var(--wp--preset--color--accent-2); }
.br-tile--ladies:hover { border-color: var(--wp--preset--color--accent-2); }

/* For Her / For Him rows: each row recolours its own buttons, borders and glow. */
.br-range--her {
	--br-accent: var(--wp--preset--color--accent-2);
	--wp--preset--color--accent-1: var(--wp--preset--color--accent-2);
	--br-accent-rgb: 236, 90, 147;
	--br-watermark: "HER";
}
.br-range--him {
	--br-accent-rgb: 242, 106, 27;
	--br-watermark: "HIM";
}
.br-range {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	margin-top: clamp(2rem, 5vw, 3.5rem) !important;
	padding: clamp(1.5rem, 4vw, 2.75rem) clamp(1rem, 3vw, 2.25rem) clamp(1rem, 3vw, 1.75rem);
	border: 1px solid var(--br-line);
	border-top: 4px solid var(--br-accent);
	background:
		radial-gradient(ellipse 70% 90% at 0% 0%, rgba(var(--br-accent-rgb), 0.22), transparent 65%),
		linear-gradient(180deg, rgba(var(--br-accent-rgb), 0.06), transparent 40%),
		var(--br-base);
	box-shadow: 0 0 0 1px rgba(var(--br-accent-rgb), 0.08), 0 30px 60px -30px rgba(var(--br-accent-rgb), 0.35);
}
/* Giant outlined watermark behind the row */
.br-range::after {
	content: var(--br-watermark);
	position: absolute;
	z-index: -1;
	top: -0.12em;
	right: -0.04em;
	font-family: var(--br-display);
	font-weight: 700;
	font-size: clamp(7rem, 22vw, 17rem);
	line-height: 1;
	letter-spacing: -0.02em;
	color: transparent;
	-webkit-text-stroke: 2px rgba(var(--br-accent-rgb), 0.18);
	transform: rotate(-4deg);
	pointer-events: none;
}
.br-range__head {
	margin-bottom: clamp(1.25rem, 3vw, 2rem);
	gap: 0.75rem 2rem;
}
.br-range__title {
	font-family: var(--br-marker) !important;
	font-weight: 400 !important;
	text-transform: uppercase;
	letter-spacing: 0.01em !important;
	font-size: clamp(2.6rem, 7vw, 4.75rem) !important;
	line-height: 0.95 !important;
	color: var(--br-accent) !important;
	margin: 0 !important;
	display: inline-flex;
	align-items: center;
	gap: 0.35em;
	transform: rotate(-2.5deg);
	transform-origin: left bottom;
	text-shadow: 0 0 28px rgba(var(--br-accent-rgb), 0.45), 3px 3px 0 rgba(0, 0, 0, 0.6);
}
/* Claw marks before the title */
.br-range__title::before {
	content: "";
	flex: none;
	width: 0.85em;
	height: 0.75em;
	background:
		linear-gradient(115deg, transparent 40%, currentColor 41% 55%, transparent 56%) 0 0 / 0.32em 100% no-repeat,
		linear-gradient(115deg, transparent 40%, currentColor 41% 55%, transparent 56%) 0.27em 0 / 0.32em 100% no-repeat,
		linear-gradient(115deg, transparent 40%, currentColor 41% 55%, transparent 56%) 0.54em 0 / 0.32em 100% no-repeat;
}
.br-range__slogan {
	font-family: var(--br-display);
	text-transform: uppercase;
	letter-spacing: 0.22em;
	font-size: clamp(0.8rem, 1.6vw, 1rem);
	color: var(--br-sand);
	margin: 0.9rem 0 0 !important;
	display: flex;
	align-items: center;
	gap: 0.75rem;
}
.br-range__slogan::before {
	content: "";
	width: 2.5rem;
	height: 3px;
	background: var(--br-accent);
	transform: skewX(-30deg);
}
.br-range__link { margin: 0 !important; }
.br-range__link a {
	font-family: var(--br-display);
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-weight: 600;
	font-size: 0.9rem;
	color: var(--br-accent);
	text-decoration: none;
	border-bottom: 2px solid var(--br-accent);
	padding-bottom: 0.2rem;
}
.br-range__link a::after { content: " →"; }
.br-range__link a:hover { color: var(--br-sand); border-color: var(--br-sand); }
.br-range .wc-block-product-template .wc-block-product { background: rgba(28, 25, 23, 0.85); }
.br-range .wc-block-product-template .wc-block-product:hover {
	box-shadow: 0 0 24px -6px rgba(var(--br-accent-rgb), 0.6);
}
@media (max-width: 599px) {
	.br-range::after { font-size: 6.5rem; top: 0; }
	.br-range__head { flex-direction: column; align-items: flex-start !important; }
}

/* Shop page: low-key For Him / For Her sections (templates/archive-product.html).
   Category ID 29 = Men, 30 = Ladies; category pages use their own standard template. */
.br-shop-range { margin-top: clamp(1.5rem, 4vw, 2.5rem) !important; }
.br-shop-range + .br-shop-range { margin-top: clamp(2.5rem, 6vw, 4rem) !important; }
.br-shop-range--her {
	--br-accent: var(--wp--preset--color--accent-2);
	--wp--preset--color--accent-1: var(--wp--preset--color--accent-2);
}
.br-shop-range__head {
	gap: 0.5rem 1rem;
	padding-bottom: 0.6rem;
	margin-bottom: 1.25rem;
	border-bottom: 1px solid var(--br-line);
}
.br-shop-range__title {
	font-size: 1.05rem !important;
	letter-spacing: 0.18em !important;
	color: var(--br-sand) !important;
	margin: 0 !important;
	display: flex;
	align-items: center;
	gap: 0.6rem;
}
.br-shop-range__title::before {
	content: "";
	width: 1.1rem;
	height: 3px;
	background: var(--br-accent);
	transform: skewX(-30deg);
}
.br-shop-range__slogan {
	font-size: 0.85rem !important;
	color: var(--br-muted);
	margin: 0 !important;
	font-style: italic;
}

/* Coming soon page (templates/coming-soon.html), shown while the store is in private preview */
.br-soon {
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 3rem 1.25rem;
	background:
		radial-gradient(ellipse 60% 50% at 50% 35%, rgba(242, 106, 27, 0.2), transparent 70%),
		radial-gradient(ellipse 40% 40% at 50% 100%, rgba(236, 90, 147, 0.12), transparent 70%),
		var(--br-black);
	text-align: center;
}
.br-soon > * { margin-left: auto !important; margin-right: auto !important; }
.br-soon__logo img { box-shadow: 0 0 70px -10px rgba(242, 106, 27, 0.85); }
.br-soon__kicker {
	font-family: var(--br-display);
	text-transform: uppercase;
	letter-spacing: 0.4em;
	font-size: 0.9rem !important;
	color: var(--br-muted);
	margin: 2rem auto 0.5rem !important;
}
.br-soon__title { font-size: clamp(2.6rem, 8vw, 5rem) !important; margin: 0 auto !important; }
.br-soon__slogan {
	font-size: clamp(1.6rem, 4.5vw, 2.6rem) !important;
	color: #F26A1B;
	transform: rotate(-2deg);
	margin: 0.75rem auto !important;
}
.br-soon__text { color: var(--br-muted); margin-top: 0.5rem; }
.br-soon__login { margin-top: 2.5rem; font-size: 0.8rem; }
.br-soon__login a { color: var(--br-muted); }

/* Him / her buttons (used on the Our Story page) */
.br-btn-him .wp-block-button__link { background: #F26A1B !important; color: var(--br-base) !important; }
.br-btn-her .wp-block-button__link { background: #EC5A93 !important; color: var(--br-base) !important; }
.br-btn-him .wp-block-button__link,
.br-btn-her .wp-block-button__link { transition: transform 0.2s ease, box-shadow 0.2s ease; }
.br-btn-him .wp-block-button__link:hover { transform: translateY(-2px) rotate(-1deg); box-shadow: 0 10px 24px -8px rgba(242, 106, 27, 0.8); }
.br-btn-her .wp-block-button__link:hover { transform: translateY(-2px) rotate(1deg); box-shadow: 0 10px 24px -8px rgba(236, 90, 147, 0.8); }

/* ------------------------------------------------------------------
   Our Story (About page)
------------------------------------------------------------------- */
.br-about-hero {
	margin-top: 0 !important;
	padding: clamp(3rem, 8vw, 6rem) 1.25rem clamp(2.5rem, 6vw, 4.5rem);
	background:
		radial-gradient(ellipse 60% 70% at 85% 30%, rgba(242, 106, 27, 0.22), transparent 70%),
		repeating-linear-gradient(-45deg, transparent 0 22px, rgba(255, 255, 255, 0.018) 22px 23px),
		var(--br-base);
	border-bottom: 1px solid var(--br-line);
}
.br-about-hero__cols { align-items: center !important; gap: clamp(2rem, 6vw, 4.5rem) !important; }
.br-about-kicker {
	font-family: var(--br-display);
	text-transform: uppercase;
	letter-spacing: 0.32em;
	font-size: 0.85rem !important;
	font-weight: 600;
	color: var(--br-accent);
	display: flex;
	align-items: center;
	gap: 0.7rem;
	margin-bottom: 0.75rem;
}
.br-about-kicker::before {
	content: "";
	width: 34px;
	height: 18px;
	flex: none;
	background:
		linear-gradient(115deg, transparent 40%, currentColor 41% 55%, transparent 56%) 0 0 / 12px 100% no-repeat,
		linear-gradient(115deg, transparent 40%, currentColor 41% 55%, transparent 56%) 11px 0 / 12px 100% no-repeat,
		linear-gradient(115deg, transparent 40%, currentColor 41% 55%, transparent 56%) 22px 0 / 12px 100% no-repeat;
}
.br-about-title {
	font-weight: 700 !important;
	font-size: clamp(2.6rem, 6.5vw, 5.2rem) !important;
	line-height: 0.95 !important;
	letter-spacing: -0.005em !important;
	margin: 0 0 1.5rem !important;
}
.br-about-title__accent {
	display: inline-block;
	font-family: var(--br-marker);
	font-weight: 400;
	text-transform: none;
	color: var(--br-accent);
	transform: rotate(-4deg) translateY(0.05em);
	text-shadow: 0 0 30px rgba(242, 106, 27, 0.55), 3px 3px 0 #000;
}
.br-about-lead {
	font-size: clamp(1.1rem, 2vw, 1.35rem) !important;
	color: var(--br-muted);
	max-width: 32ch;
	border-left: 3px solid var(--br-accent);
	padding-left: 1rem;
}
/* Polaroid-style tilted photo */
.br-about-hero__img {
	margin: 0;
	background: var(--br-sand);
	padding: 0.6rem 0.6rem 2.2rem;
	transform: rotate(3deg);
	box-shadow: 14px 14px 0 rgba(242, 106, 27, 0.85), 0 30px 60px -20px #000;
	transition: transform 0.35s ease;
}
.br-about-hero__img:hover { transform: rotate(0deg) scale(1.02); }
.br-about-hero__img img { display: block; width: 100%; height: auto; }

/* "Ons is nie daai mense nie." stamp */
.br-about-stamp-wrap {
	margin-top: 0 !important;
	padding: clamp(3rem, 7vw, 5rem) 1rem;
	text-align: center;
	background: var(--br-black);
	overflow: hidden;
}
.br-about-stamp {
	display: block;
	width: fit-content;
	max-width: 100%;
	margin: 0 auto !important;
	font-family: var(--br-marker);
	font-size: clamp(2rem, 6.5vw, 5rem) !important;
	line-height: 1.1;
	color: var(--br-sand);
	padding: 0.35em 0.7em;
	border: 5px solid var(--br-accent);
	outline: 2px solid var(--br-accent);
	outline-offset: 6px;
	transform: rotate(-4deg);
	text-shadow: 0 0 24px rgba(242, 106, 27, 0.35);
	box-shadow: inset 0 0 40px rgba(242, 106, 27, 0.15);
}

/* Body sections */
.br-about-section {
	margin-top: 0 !important;
	padding: clamp(3rem, 7vw, 5rem) 1.25rem;
}
.br-about-section--dark { background: var(--br-surface-dark); }
.br-about-section p { font-size: clamp(1rem, 1.6vw, 1.15rem); color: var(--br-muted); }
.br-about-big {
	font-family: var(--br-display);
	font-weight: 600;
	text-transform: uppercase;
	font-size: clamp(1.6rem, 3.6vw, 2.6rem) !important;
	line-height: 1.15;
	color: var(--br-sand) !important;
	margin-bottom: 1.5rem;
}
.br-about-center { text-align: center; max-width: 24ch; margin: 2.5rem auto 0 !important; }
.br-hl {
	background: linear-gradient(100deg, transparent 1%, rgba(242, 106, 27, 0.9) 2% 97%, transparent 98%) left 88% / 100% 0.42em no-repeat;
	color: var(--br-sand);
	font-family: var(--br-marker);
	text-transform: none;
	font-weight: 400;
	padding: 0 0.1em;
}

/* "We're talking about…" stickers */
.br-about-section--dark .br-about-kicker { justify-content: center; margin-bottom: 2rem; }
.br-stickers {
	list-style: none;
	padding: 0 !important;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 1.1rem 1.25rem;
}
.br-stickers li {
	font-family: var(--br-marker);
	font-size: clamp(1.05rem, 2.2vw, 1.45rem);
	background: var(--br-sand);
	color: var(--br-base);
	padding: 0.5rem 1.1rem;
	border-radius: 4px;
	box-shadow: 5px 5px 0 #F26A1B;
	transform: rotate(var(--tilt, -2deg));
	transition: transform 0.2s ease;
}
.br-stickers li:nth-child(2) { --tilt: 2.5deg; }
.br-stickers li:nth-child(3) { --tilt: -1deg; background: #F26A1B; box-shadow: 5px 5px 0 var(--br-sand); }
.br-stickers li:nth-child(4) { --tilt: 3deg; }
.br-stickers li:nth-child(5) { --tilt: -2.5deg; }
.br-stickers li:last-child { --tilt: 1.5deg; background: #EC5A93; box-shadow: 5px 5px 0 var(--br-sand); }
.br-stickers li em { font-style: normal; }
.br-stickers li:hover { transform: rotate(0deg) scale(1.06); }

/* Wild dog */
.br-about-dog { align-items: center !important; gap: clamp(1.5rem, 5vw, 4rem) !important; }
.br-about-dog__logo { margin: 0; text-align: center; }
.br-about-dog__logo img {
	width: min(300px, 70vw);
	border-radius: 50%;
	box-shadow: 0 0 0 3px var(--br-line), 0 0 60px -10px rgba(242, 106, 27, 0.75);
	transition: transform 0.6s ease;
}
.br-about-dog__logo img:hover { transform: rotate(-8deg) scale(1.04); }
.br-about-h2 { font-size: clamp(1.8rem, 4vw, 3rem) !important; margin-bottom: 1rem; }
.br-about-scrawl {
	font-family: var(--br-marker);
	font-size: clamp(1.3rem, 2.6vw, 1.8rem) !important;
	line-height: 1.3;
	color: var(--br-accent) !important;
	transform: rotate(-1.5deg);
	margin-top: 1.25rem;
}

/* Orange statement band with slanted edges */
.br-about-band {
	margin-top: 0 !important;
	padding: clamp(4rem, 9vw, 6.5rem) 1.25rem;
	text-align: center;
	background: #F26A1B;
	color: var(--br-base);
	clip-path: polygon(0 4vw, 100% 0, 100% calc(100% - 4vw), 0 100%);
}
.br-about-band p { color: var(--br-base); margin-left: auto; margin-right: auto; }
.br-about-band__small {
	font-family: var(--br-display);
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-size: clamp(0.95rem, 2vw, 1.25rem) !important;
	text-decoration: line-through;
	text-decoration-thickness: 3px;
	opacity: 0.8;
	margin-bottom: 0.5rem;
}
.br-about-band__big {
	font-family: var(--br-display);
	font-weight: 700;
	text-transform: uppercase;
	font-size: clamp(2.2rem, 6vw, 4.6rem) !important;
	line-height: 0.95;
	max-width: 16ch;
	margin-top: 0;
	text-shadow: 4px 4px 0 rgba(0, 0, 0, 0.18);
}
.br-about-band__text {
	font-size: clamp(1.05rem, 2vw, 1.3rem) !important;
	font-weight: 500;
	max-width: 46ch;
	margin-top: 1.5rem;
}

/* "No …" rubber stamps */
.br-stamps {
	list-style: none;
	padding: 0 !important;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 1.5rem 2rem;
}
.br-stamps li {
	--stamp: #F26A1B;
	font-family: var(--br-display);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: clamp(1.1rem, 2.4vw, 1.6rem);
	color: var(--stamp);
	border: 3px solid var(--stamp);
	border-radius: 6px;
	padding: 0.5rem 1.1rem;
	transform: rotate(-5deg);
	box-shadow: inset 0 0 0 2px var(--br-base), inset 0 0 0 4px var(--stamp);
	opacity: 0.92;
}
.br-stamps li:nth-child(2) { --stamp: #EC5A93; transform: rotate(4deg); }
.br-stamps li:nth-child(3) { --stamp: var(--br-sand); transform: rotate(-2deg); }

/* Sign-off */
.br-about-signoff {
	margin-top: 0 !important;
	padding: clamp(3rem, 7vw, 5rem) 1.25rem clamp(3.5rem, 8vw, 6rem);
	text-align: center;
	background:
		radial-gradient(ellipse 50% 60% at 50% 30%, rgba(242, 106, 27, 0.18), transparent 70%),
		var(--br-black);
}
.br-about-signoff__logo { margin: 0 auto 1rem; }
.br-about-signoff__logo img { width: 140px; border-radius: 50%; box-shadow: 0 0 50px -8px rgba(242, 106, 27, 0.8); }
.br-about-signoff__name {
	font-family: var(--br-display);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.3em;
	font-size: clamp(1.4rem, 3vw, 2rem) !important;
	color: var(--br-sand);
	margin: 0 auto !important;
}
.br-about-signoff__slogan {
	font-size: clamp(1.6rem, 4vw, 2.6rem) !important;
	color: var(--br-accent);
	transform: rotate(-2deg);
	margin: 0.4rem auto 2rem !important;
}

@media (prefers-reduced-motion: reduce) {
	.br-about-hero__img, .br-stickers li, .br-about-dog__logo img { transition: none; }
}

/* Brand story */
.br-story { align-items: center !important; gap: clamp(1.5rem, 5vw, 4rem) !important; }
.br-story figure { margin: 0; }
.br-story img { border: 1px solid var(--br-line); }
.br-story__quote { font-size: clamp(1.5rem, 3.5vw, 2.4rem); line-height: 1.25; color: var(--br-accent); }

/* Trust strip: round pills (same style as the footer chips) */
.br-section--slim {
	padding-top: clamp(1.75rem, 4vw, 2.5rem);
	padding-bottom: clamp(1.75rem, 4vw, 2.5rem);
}
.br-trust { justify-content: center; gap: 0.75rem !important; }
.br-trust li {
	font-size: 0.88rem !important;
	color: var(--br-muted) !important;
	padding: 0.6rem 1.1rem 0.6rem 0.9rem !important;
	/* Text + links flow as one line (inline-flex would split each link into its own column). */
	display: inline-block !important;
	line-height: 1.5;
	border-radius: 1.5rem !important;
}
.br-trust li::before {
	display: inline-block;
	vertical-align: middle;
	margin: -2px 0.5rem 0 0;
}
.br-trust li strong {
	font-family: var(--br-display);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-weight: 600;
	color: var(--br-sand);
}
.br-trust a { color: var(--br-accent); }
.br-trust li:hover { border-color: var(--br-accent); }

/* ------------------------------------------------------------------
   Footer
------------------------------------------------------------------- */
.br-footer {
	--br-orange: var(--wp--preset--color--accent-1);
	--br-pink: var(--wp--preset--color--accent-2);
	position: relative;
	overflow: hidden;
	isolation: isolate;
	background:
		radial-gradient(ellipse 55% 60% at 0% 100%, rgba(242, 106, 27, 0.16), transparent 70%),
		radial-gradient(ellipse 45% 55% at 100% 100%, rgba(236, 90, 147, 0.12), transparent 70%),
		var(--br-black);
	margin-top: 0 !important;
	padding: 0 var(--wp--style--root--padding-right, 1rem) 1.25rem var(--wp--style--root--padding-left, 1rem);
	color: var(--br-sand);
	font-size: 0.95rem;
}
/* Orange-to-pink edge across the top */
.br-footer::before {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	height: 3px;
	background: linear-gradient(90deg, #F26A1B, #F26A1B 45%, #EC5A93 55%, #EC5A93);
}
body.br-ladies .br-footer { --br-orange: #F26A1B; }
.br-footer p,
.br-footer li { font-size: inherit; }

/* Columns */
.br-footer__grid {
	display: grid;
	grid-template-columns: 1.6fr 1fr 1fr 1fr;
	gap: 2.5rem;
	padding: clamp(2.5rem, 5vw, 3.5rem) 0 2rem;
}
.br-footer__grid > * { margin: 0 !important; }
@media (max-width: 900px) {
	.br-footer__grid { grid-template-columns: 1fr 1fr; gap: 2rem 1.5rem; }
	.br-footer__brand { grid-column: 1 / -1; }
}
.br-footer__brand-row { gap: 1rem; align-items: center; }
.br-footer__brand .wp-block-site-logo img { box-shadow: 0 0 0 2px var(--br-line), 0 0 30px -6px rgba(242, 106, 27, 0.6); }
.br-footer__slogan {
	font-size: 1.35rem !important;
	line-height: 1.2;
	color: #F26A1B;
	margin: 0 !important;
	transform: rotate(-2deg);
}
.br-footer__about { color: var(--br-muted); max-width: 34ch; margin: 1.1rem 0 1.4rem; }
.br-footer__heading {
	font-size: 0.8rem !important;
	letter-spacing: 0.24em !important;
	color: var(--br-muted) !important;
	margin: 0 0 1rem !important;
	display: flex;
	align-items: center;
	gap: 0.6rem;
}
.br-footer__heading::before {
	content: "";
	width: 1.1rem;
	height: 2px;
	background: #F26A1B;
	transform: skewX(-30deg);
}
.br-footer__links { list-style: none; padding: 0; margin: 0; }
.br-footer__links li { margin: 0 0 0.6rem; }
.br-footer__links a {
	color: var(--br-sand);
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	transition: color 0.2s ease, transform 0.2s ease;
}
.br-footer__links a::after {
	content: "→";
	opacity: 0;
	transform: translateX(-6px);
	transition: opacity 0.2s ease, transform 0.2s ease;
	color: #F26A1B;
}
.br-footer__links a:hover { color: #F26A1B; transform: translateX(3px); }
.br-footer__links a:hover::after { opacity: 1; transform: translateX(0); }

/* Round social buttons */
.br-footer .br-social { gap: 0.6rem !important; margin: 0; }
.br-footer .br-social .wp-social-link {
	background: transparent !important;
	color: var(--br-sand) !important;
	border: 1px solid var(--br-line);
	border-radius: 50%;
	transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}
.br-footer .br-social .wp-social-link a { padding: 0.6rem; }
.br-footer .br-social .wp-social-link svg { width: 1.15rem; height: 1.15rem; }
.br-footer .br-social .wp-social-link:hover {
	background: #F26A1B !important;
	border-color: #F26A1B;
	color: var(--br-base) !important;
	transform: translateY(-2px);
}

/* Info chips (footer + homepage trust strip) */
.br-chips,
.br-footer__chips {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	padding: 0 !important;
	margin: 0 auto !important;
}
.br-chips li,
.br-footer__chips li {
	font-size: 0.8rem !important;
	color: var(--br-sand);
	padding: 0.45rem 0.9rem 0.45rem 0.75rem;
	border: 1px solid var(--br-line);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.03);
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	transition: border-color 0.2s ease;
}
.br-chips li::before,
.br-footer__chips li::before {
	flex: none;
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #F26A1B;
	box-shadow: 0 0 8px #F26A1B;
}

/* Bottom bar */
.br-footer__bottom {
	border-top: 1px solid var(--br-line);
	margin-top: 2rem !important;
	padding-top: 1.1rem;
	font-size: 0.8rem;
	color: var(--br-muted);
	gap: 0.75rem;
	position: relative;
}
.br-footer__bottom p { margin: 0; }
.br-footer__top a {
	color: var(--br-sand);
	text-decoration: none;
	font-family: var(--br-display);
	text-transform: uppercase;
	letter-spacing: 0.15em;
}
.br-footer__top a:hover { color: #F26A1B; }

@media (prefers-reduced-motion: reduce) {
	.br-footer *, .br-footer *::after { transition: none !important; }
}

/* ------------------------------------------------------------------
   WooCommerce
------------------------------------------------------------------- */

/* Product cards */
.wc-block-product-template .wc-block-product,
.wc-block-product-template > li {
	background: var(--br-surface);
	border: 1px solid var(--br-line);
	padding-bottom: 0.5rem;
	transition: border-color 0.2s ease;
}
.wc-block-product-template .wc-block-product:hover,
.wc-block-product-template > li:hover { border-color: var(--br-accent); }
.wc-block-product-template .wp-block-post-title {
	font-family: var(--br-display);
	text-transform: uppercase;
	letter-spacing: 0.03em;
	font-weight: 600;
	padding: 0 0.75rem;
}
.wc-block-product-template .wp-block-post-title a { color: var(--br-sand); text-decoration: none; }
.wc-block-components-product-price,
.wc-block-components-product-price__value,
.woocommerce-Price-amount { color: var(--br-sand); font-weight: 600; }
.wc-block-components-product-image img { aspect-ratio: 1; object-fit: cover; }

/* Buttons rendered by WooCommerce (classic + blocks) */
.wc-block-components-product-button__button,
.single_add_to_cart_button,
.woocommerce .button,
.wc-block-components-button:not(.is-link),
.wc-block-mini-cart__footer-actions .wc-block-components-button {
	background: var(--br-accent) !important;
	color: var(--br-base) !important;
	font-family: var(--br-display) !important;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-weight: 600;
	border: 0 !important;
	border-radius: 2px !important;
}
.wc-block-components-product-button__button:hover,
.single_add_to_cart_button:hover,
.woocommerce .button:hover,
.wc-block-components-button:not(.is-link):hover {
	background: var(--br-sand) !important;
	color: var(--br-base) !important;
}
.wc-block-mini-cart__footer-actions .wc-block-mini-cart__footer-cart.outlined {
	background: transparent !important;
	color: var(--br-sand) !important;
	box-shadow: inset 0 0 0 1px var(--br-line) !important;
}

/* Single product */
.single-product .wp-block-post-title,
.wc-block-product .product_title { font-size: clamp(1.8rem, 4vw, 2.8rem); }
.woocommerce-product-gallery,
.wc-block-product-gallery-large-image,
.wp-block-woocommerce-product-image-gallery { background: var(--br-surface-dark); }
.woocommerce div.product form.cart .variations label,
.variations th.label label { font-family: var(--br-display); text-transform: uppercase; letter-spacing: 0.08em; color: var(--br-sand); }
.woocommerce div.product form.cart .reset_variations { color: var(--br-muted); }
.woocommerce-tabs .tabs a,
.wc-tabs a { color: var(--br-muted) !important; }
.woocommerce-tabs .tabs .active a,
.wc-tabs .active a { color: var(--br-sand) !important; }
.wc-block-components-product-sku,
.product_meta { color: var(--br-muted); font-size: 0.85rem; }
.product_meta a { color: var(--br-muted); }

/* Form fields (variation selects, quantity, cart, checkout, account) */
.woocommerce select,
.woocommerce input.input-text,
.woocommerce textarea,
.woocommerce .quantity .qty,
.wc-block-components-text-input input,
.wc-block-components-textarea,
.wc-blocks-components-select .wc-blocks-components-select__select,
.wc-block-components-quantity-selector,
.wc-block-components-quantity-selector input,
.wp-block-search__input {
	background-color: var(--br-surface) !important;
	color: var(--br-sand) !important;
	border: 1px solid var(--br-line) !important;
	border-radius: 2px !important;
}
.woocommerce select option { background: var(--br-surface); color: var(--br-sand); }
.wc-block-components-text-input label,
.wc-blocks-components-select .wc-blocks-components-select__label,
.wc-block-components-quantity-selector__button { color: var(--br-muted) !important; }
.wc-block-components-text-input input:focus,
.wc-blocks-components-select__select:focus,
.woocommerce select:focus,
.woocommerce input.input-text:focus {
	border-color: var(--br-accent) !important;
	box-shadow: 0 0 0 1px var(--br-accent) !important;
	outline: none;
}
.wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"],
.wc-block-components-radio-control__input {
	background: var(--br-surface) !important;
	border-color: var(--br-muted) !important;
}
.wc-block-components-checkbox .wc-block-components-checkbox__mark { fill: var(--br-sand); }
.wc-block-components-radio-control__input:checked::before { background: var(--br-accent) !important; }

/* Cart / checkout panels */
.wc-block-components-radio-control-accordion-option,
.wc-block-components-radio-control__option,
.wc-block-checkout__shipping-method-option,
.wc-block-components-sidebar .wc-block-components-panel,
.wc-block-components-totals-wrapper { border-color: var(--br-line) !important; }
.wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control-accordion-option--checked-option-highlighted,
.wc-block-components-radio-control--highlight-checked label.wc-block-components-radio-control__option--checked-option-highlighted {
	box-shadow: inset 0 0 0 2px var(--br-accent) !important;
}
.wc-block-checkout__sidebar,
.wc-block-cart__sidebar .wc-block-components-sidebar-layout__sidebar,
.wp-block-woocommerce-checkout-order-summary-block {
	background: var(--br-surface-dark);
	border-color: var(--br-line) !important;
}
.wc-block-components-order-summary-item__quantity {
	background: var(--br-accent) !important;
	color: var(--br-base) !important;
	border-color: var(--br-accent) !important;
}
.wc-block-components-address-card,
.wc-block-components-notice-banner { background: var(--br-surface) !important; color: var(--br-sand) !important; }
.wc-block-components-formatted-money-amount { color: inherit; }
.wc-block-components-checkout-step__description,
.wc-block-components-checkout-step__heading-content,
.wc-block-checkout__terms { color: var(--br-muted); }

/* Mini-cart drawer */
.wc-block-components-drawer,
.wc-block-mini-cart__drawer .components-modal__content { background: var(--br-base) !important; color: var(--br-sand) !important; }
.wc-block-components-drawer__close { color: var(--br-sand) !important; }

/* Notices */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.wc-block-components-notice-banner {
	background: var(--br-surface) !important;
	color: var(--br-sand) !important;
	border-color: var(--br-accent) !important;
}

.wc-block-components-notice-banner .wc-forward,
.woocommerce-message .wc-forward {
	background: transparent !important;
	color: var(--br-accent) !important;
	opacity: 1 !important;
	text-decoration: underline;
}
.wc-block-components-notice-banner svg { fill: var(--br-accent); background: transparent; }

/* Breadcrumbs, result count, sorting */
.woocommerce-breadcrumb,
.wc-block-breadcrumbs,
.woocommerce-result-count,
.wc-block-product-results-count { color: var(--br-muted); font-size: 0.85rem; }
.woocommerce-breadcrumb a,
.wc-block-breadcrumbs a { color: var(--br-muted); }

/* Sale / stock badges */
.wc-block-components-product-sale-badge,
.onsale { background: var(--br-accent) !important; color: var(--br-base) !important; border: 0 !important; }
.stock.in-stock { color: #7FCB8F; }
.stock.out-of-stock { color: #F28B82; }

/* Tables (size guide, account orders) */
.wp-block-table table,
.woocommerce table.shop_table { border-color: var(--br-line); }
.wp-block-table th,
.wp-block-table td,
.woocommerce table.shop_table th,
.woocommerce table.shop_table td { border-color: var(--br-line) !important; }
.wp-block-table thead { background: var(--br-surface); border-bottom: 2px solid var(--br-accent); }

/* Keyboard focus visible everywhere */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible {
	outline: 2px solid var(--br-accent);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.br-tile, .br-tile img { transition: none; }
	.br-tile:hover, .br-tile:hover img { transform: none; }
}