/*
Theme Name: ArcadeZus
Theme URI: https://arcadezus.com/
Author: ArcadeZus
Author URI: https://arcadezus.com/
Description: WooCommerce storefront theme for ArcadeZus, a US home-arcade store. Deep-navy chrome with electric-blue and gold accents drawn from the ArcadeZus wordmark, over a light, readable product area. Self-hosted Geist typography, no third-party asset requests.
Version: 1.2.1
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: arcadezus
Tags: e-commerce, custom-menu, featured-images, translation-ready, accessibility-ready
*/

/* ==========================================================================
   1. Typography — self-hosted, no third-party requests
   ========================================================================== */

@font-face {
	font-family: 'Geist';
	src: url('assets/fonts/Geist-Variable.woff2') format('woff2-variations'),
	     url('assets/fonts/Geist-Variable.woff2') format('woff2');
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Geist Mono';
	src: url('assets/fonts/GeistMono-Variable.woff2') format('woff2-variations'),
	     url('assets/fonts/GeistMono-Variable.woff2') format('woff2');
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

/* ==========================================================================
   2. Design tokens
   ========================================================================== */

:root {
	/* Deep navy chrome, taken from the ArcadeZus wordmark background. */
	--ink: #0a1024;
	--ink-2: #141c38;
	--bone: #f4f5f8;
	--paper: #ffffff;

	/* Electric blue from the lightning, gold from the lettering. */
	--brand: #1e6bff;
	--brand-hi: #4d8cff;
	--brand-deep: #0b47c4;
	--gold: #f0b429;
	--gold-deep: #b47c0d;

	--text: #14161a;
	--muted: #5f6570;
	--on-dark: #ffffff;
	--on-dark-muted: rgba(255, 255, 255, 0.68);

	--line: rgba(10, 11, 13, 0.10);
	--line-strong: rgba(10, 11, 13, 0.18);
	--line-dark: rgba(255, 255, 255, 0.14);

	--lift-1: 0 1px 2px rgba(10, 11, 13, 0.04), 0 8px 24px -14px rgba(10, 11, 13, 0.10);
	--lift-2: 0 2px 4px rgba(10, 11, 13, 0.04), 0 22px 52px -26px rgba(10, 11, 13, 0.16);

	--r-lg: 16px;
	--r-md: 12px;
	--r-sm: 8px;

	--shell: 1280px;
	--gutter: clamp(18px, 4vw, 48px);
	--section-y: clamp(56px, 7vw, 96px);

	--ease: cubic-bezier(0.32, 0.72, 0, 1);
	--ease-out: cubic-bezier(0.16, 1, 0.3, 1);
	--dur: 520ms;
	--dur-fast: 320ms;

	--font: 'Geist', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--font-mono: 'Geist Mono', ui-monospace, 'SFMono-Regular', monospace;

	--header-h: 68px;
}

/* ==========================================================================
   3. Reset & base
   ========================================================================== */

*,
*::before,
*::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--header-h) + 20px);
}

body {
	margin: 0;
	background: var(--paper);
	color: var(--text);
	font-family: var(--font);
	font-size: 1rem;
	line-height: 1.65;
	font-weight: 400;
	font-synthesis-weight: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

body.menu-open { overflow: hidden; }

img, svg, video { max-width: 100%; height: auto; display: block; }

svg {
	fill: none;
	stroke: currentColor;
	stroke-width: 1.3;
	stroke-linecap: round;
	stroke-linejoin: round;
}

a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 0.22em; }

button, input, select, textarea { font: inherit; color: inherit; }

h1, h2, h3, h4, h5, h6 {
	margin: 0 0 0.5em;
	font-weight: 560;
	line-height: 1.14;
	letter-spacing: -0.028em;
	text-wrap: balance;
}

h1 { font-size: clamp(1.9rem, 3.5vw, 2.65rem); }
h2 { font-size: clamp(1.5rem, 2.5vw, 2rem); }
h3 { font-size: clamp(1.05rem, 1.5vw, 1.25rem); }

p { margin: 0 0 1.1em; }
p:last-child { margin-bottom: 0; }

::selection { background: var(--brand); color: #fff; }

/* Focus ring follows the current text colour, so it stays visible on light and
   dark surfaces without a loud accent outline appearing over content. */
:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
	border-radius: 4px;
}

/* The overlay itself receives focus when the menu opens; it must not draw a ring. */
.primary-navigation:focus,
.primary-navigation:focus-visible { outline: none; }

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.skip-link:focus {
	position: fixed;
	top: 12px; left: 12px;
	z-index: 500;
	width: auto; height: auto;
	clip: auto; margin: 0;
	padding: 12px 20px;
	background: var(--ink);
	color: #fff;
	border-radius: var(--r-sm);
	font-weight: 600;
}

/* ==========================================================================
   4. Layout primitives
   ========================================================================== */

.site-shell {
	width: 100%;
	max-width: var(--shell);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.section { padding-block: var(--section-y); }

.section__title {
	margin-bottom: clamp(24px, 3vw, 40px);
	font-size: clamp(1.4rem, 2.2vw, 1.85rem);
}

.section__title--center { text-align: center; }

/* ==========================================================================
   5. Buttons & links
   ========================================================================== */

.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 13px 30px;
	border: 0;
	border-radius: var(--r-sm);
	background: var(--ink);
	color: #fff;
	font-size: 0.9375rem;
	font-weight: 540;
	letter-spacing: -0.005em;
	text-decoration: none;
	cursor: pointer;
	transition: transform var(--dur-fast) var(--ease), background-color var(--dur-fast) var(--ease);
}

.button:hover { background: var(--ink-2); }
.button:active { transform: scale(0.985); }

.button--primary { background: var(--brand); }
.button--primary:hover { background: var(--brand-hi); }

.button--light { background: #fff; color: var(--ink); }
.button--light:hover { background: var(--bone); }

.button--secondary {
	background: transparent;
	color: var(--text);
	border: 1px solid var(--line-strong);
}
.button--secondary:hover { background: rgba(10, 11, 13, 0.04); }

.text-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 0.9375rem;
	font-weight: 520;
	color: var(--text);
	text-decoration: none;
	border-bottom: 1px solid var(--brand);
	padding-bottom: 2px;
	transition: color var(--dur-fast) var(--ease);
}

.text-link:hover { color: var(--brand-deep); }
.text-link--light { color: #fff; border-bottom-color: rgba(255, 255, 255, 0.5); }

/* ==========================================================================
   6. Promo bar
   ========================================================================== */

.promo-bar {
	background: var(--ink);
	color: rgba(255, 255, 255, 0.9);
	text-align: center;
	/* The header is the same navy, so a hairline keeps the two bands legible
	   as separate rows rather than one tall slab. */
	border-bottom: 1px solid rgba(255, 255, 255, 0.09);
}

.promo-bar p {
	margin: 0;
	padding-block: 9px;
	font-family: var(--font-mono);
	font-size: 0.625rem;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	line-height: 1.5;
}

/* ==========================================================================
   7. Header
   ========================================================================== */

/* The header runs dark. The brand artwork is gold-and-lightning drawn for a
   dark ground: on white it washes out and the removed backing plate leaves the
   letters looking ragged. Rather than restyle every child, the header
   re-declares the surface tokens for its own subtree, so the nav links, icons,
   hover fills, menu toggle and the full-screen mobile overlay all follow. The
   surface is --ink because that is also the colour of the backing plate baked
   into the logo art; any other navy leaves a visible box around the mark. */
.site-header {
	--paper: var(--ink);
	--text: #ffffff;
	--muted: rgba(255, 255, 255, 0.72);
	--line: rgba(255, 255, 255, 0.14);
	--bone: rgba(255, 255, 255, 0.10);
	--brand-deep: #7fb0ff;

	position: sticky;
	top: 0;
	z-index: 100;
	background: var(--paper);
	border-bottom: 1px solid var(--line);
	color: var(--text);
}

.site-header__inner {
	display: flex;
	align-items: center;
	gap: clamp(14px, 2.5vw, 36px);
	min-height: var(--header-h);
}

.site-branding__link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	text-decoration: none;
	color: var(--text);
}

/* The wordmark is about 7:1. Sized by height it would run into the nav, so the
   height is deliberately low and max-width is the real constraint. */
.site-header .site-branding__logo,
.site-footer .site-footer__logo img {
	width: auto;
	height: 34px;
	max-width: 250px;
	object-fit: contain;
}

.site-footer .site-footer__logo img { height: 40px; max-width: 290px; }

@media (max-width: 47.99rem) {
	.site-header .site-branding__logo { height: 28px; max-width: 200px; }
}

/* ---------------------------------------------------------------- wordmark
   Fallback lockup used until a logo is uploaded in the Customizer. It is
   markup rather than an image so it inherits the surrounding colour and reads
   on the white header and the navy footer without a second asset. */

.wordmark {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	color: inherit;
	line-height: 1;
	white-space: nowrap;
}

.wordmark__glyph {
	flex: none;
	width: 34px;
	height: 34px;
	fill: none;
	stroke-linecap: round;
}

.wordmark__glyph-plate { fill: var(--brand); stroke: none; }
.wordmark__glyph-ball  { fill: var(--gold); stroke: none; }

.wordmark__glyph-shaft,
.wordmark__glyph-base {
	stroke: #ffffff;
	stroke-width: 2.6;
}

.wordmark__text {
	font-size: 1.375rem;
	font-weight: 700;
	letter-spacing: -0.025em;
}

.wordmark__accent { color: var(--brand); }

.site-footer .wordmark { color: #ffffff; }
.site-footer .wordmark__accent { color: var(--gold); }

@media (max-width: 47.99rem) {
	.wordmark__glyph { width: 30px; height: 30px; }
	.wordmark__text { font-size: 1.1875rem; }
}

.custom-logo-link img { max-height: 40px; width: auto; }

.primary-navigation { margin-inline: auto; }

.primary-menu {
	display: flex;
	align-items: center;
	gap: 2px;
	margin: 0; padding: 0;
	list-style: none;
}

.primary-menu > .menu-item > a {
	display: block;
	padding: 8px 13px;
	border-radius: var(--r-sm);
	font-size: 0.875rem;
	font-weight: 470;
	color: var(--text);
	text-decoration: none;
	white-space: nowrap;
	transition: background-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}

.primary-menu > .menu-item > a:hover,
.primary-menu > .current-menu-item > a { background: var(--bone); }
.primary-menu > .current-menu-item > a { color: var(--brand-deep); }

.primary-menu .sub-menu {
	position: absolute;
	top: calc(100% - 4px);
	min-width: 232px;
	margin: 0; padding: 6px;
	list-style: none;
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	box-shadow: var(--lift-2);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-6px);
	transition: opacity var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease), visibility var(--dur-fast);
}

.primary-menu .menu-item-has-children { position: relative; }

.primary-menu .menu-item-has-children:hover > .sub-menu,
.primary-menu .menu-item-has-children:focus-within > .sub-menu {
	opacity: 1; visibility: visible; transform: translateY(0);
}

.primary-menu .sub-menu a {
	display: block;
	padding: 8px 12px;
	border-radius: var(--r-sm);
	font-size: 0.875rem;
	text-decoration: none;
	transition: background-color var(--dur-fast) var(--ease);
}

.primary-menu .sub-menu a:hover { background: var(--bone); }

.site-header__actions {
	display: flex;
	align-items: center;
	gap: 2px;
	margin-inline-start: auto;
}

.primary-navigation + .site-header__actions { margin-inline-start: 0; }

.site-header__action {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 9px 10px;
	border-radius: var(--r-sm);
	color: var(--text);
	text-decoration: none;
	transition: background-color var(--dur-fast) var(--ease);
}

.site-header__action:hover { background: var(--bone); }
.site-header__action svg { width: 19px; height: 19px; }

.site-header__cart-count.is-empty { display: none; }

.site-header__cart-count {
	position: absolute;
	top: 2px;
	right: 0;
	display: grid;
	place-items: center;
	min-width: 17px; height: 17px;
	padding-inline: 4px;
	border-radius: 999px;
	background: var(--brand);
	color: #fff;
	font-family: var(--font-mono);
	font-size: 0.5625rem;
	font-weight: 600;
	line-height: 1;
}

/* Hamburger */
.menu-toggle {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	margin-inline-start: auto;
	padding: 8px 14px 8px 11px;
	border: 1px solid var(--line-strong);
	border-radius: var(--r-sm);
	background: transparent;
	color: var(--text);
	font-size: 0.8125rem;
	font-weight: 500;
	cursor: pointer;
}

.menu-toggle:hover { background: var(--bone); }

.menu-toggle__icon { position: relative; width: 16px; height: 11px; flex: none; }

.menu-toggle__icon span {
	position: absolute;
	left: 0;
	width: 100%; height: 1.5px;
	border-radius: 2px;
	background: currentColor;
	transition: transform var(--dur) var(--ease);
}

.menu-toggle__icon span:first-child { top: 1px; }
.menu-toggle__icon span:last-child { bottom: 1px; }

.menu-toggle[aria-expanded='true'] .menu-toggle__icon span:first-child { transform: translateY(3.75px) rotate(45deg); }
.menu-toggle[aria-expanded='true'] .menu-toggle__icon span:last-child { transform: translateY(-3.75px) rotate(-45deg); }

@media (min-width: 64rem) { .menu-toggle { display: none; } }

.primary-navigation__account { display: none; }

/* Mobile overlay navigation */
@media (max-width: 63.99rem) {
	.site-branding,
	.menu-toggle,
	.site-header__actions { position: relative; z-index: 95; }

	/* Logo on the left; search, cart and Menu grouped together on the right. */
	.site-branding { margin-inline-end: auto; }
	.site-header__actions { order: 2; margin-inline-start: 0; gap: 0; }
	.menu-toggle { order: 3; margin-inline-start: 6px; }

	/* Account moves into the overlay so the bar stays to three controls. */
	.site-header__action--account { display: none; }

	.primary-navigation__account {
		display: inline-flex;
		align-items: center;
		gap: 10px;
		margin-top: 20px;
		padding: 14px 2px;
		font-size: 1rem;
		font-weight: 520;
		color: var(--muted);
		text-decoration: none;
	}

	.primary-navigation__account svg { width: 19px; height: 19px; }
	.primary-navigation__account:hover { color: var(--brand-deep); }

	.primary-navigation {
		position: fixed;
		inset: 0;
		z-index: 90;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		padding: calc(var(--header-h) + 32px) var(--gutter) 48px;
		background: var(--paper);
		opacity: 0;
		visibility: hidden;
		transition: opacity var(--dur) var(--ease), visibility var(--dur);
		overflow-y: auto;
		margin-inline: 0;
	}

	.primary-navigation.is-open { opacity: 1; visibility: visible; }

	.primary-menu { flex-direction: column; align-items: stretch; gap: 0; }

	.primary-menu > .menu-item > a {
		padding: 16px 2px;
		border-radius: 0;
		border-bottom: 1px solid var(--line);
		font-size: 1.25rem;
		font-weight: 520;
		letter-spacing: -0.02em;
	}

	.primary-menu > .menu-item > a:hover { background: transparent; color: var(--brand-deep); }

	.primary-menu > .menu-item { opacity: 0; transform: translate3d(0, 18px, 0); }

	.primary-navigation.is-open .primary-menu > .menu-item {
		opacity: 1;
		transform: translate3d(0, 0, 0);
		transition: opacity 420ms var(--ease-out), transform 520ms var(--ease-out);
	}

	.primary-navigation.is-open .primary-menu > .menu-item:nth-child(1) { transition-delay: 50ms; }
	.primary-navigation.is-open .primary-menu > .menu-item:nth-child(2) { transition-delay: 90ms; }
	.primary-navigation.is-open .primary-menu > .menu-item:nth-child(3) { transition-delay: 130ms; }
	.primary-navigation.is-open .primary-menu > .menu-item:nth-child(4) { transition-delay: 170ms; }
	.primary-navigation.is-open .primary-menu > .menu-item:nth-child(5) { transition-delay: 210ms; }
	.primary-navigation.is-open .primary-menu > .menu-item:nth-child(6) { transition-delay: 250ms; }
	.primary-navigation.is-open .primary-menu > .menu-item:nth-child(7) { transition-delay: 290ms; }

	.primary-menu .sub-menu {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		border: 0;
		box-shadow: none;
		padding: 4px 0 10px 2px;
	}
}

/* ==========================================================================
   8. Hero
   ========================================================================== */

/* Full-bleed split hero: copy panel on the left, photo filling the right edge
   to edge. No contained card, no gaps — the value strip sits flush beneath. */
.hero {
	display: grid;
	background: #edeeef;
}

.hero__inner {
	display: flex;
	align-items: center;
	padding: clamp(32px, 6vw, 56px) var(--gutter);
}

.hero__copy { width: 100%; }

.hero__media { min-width: 0; }

/* The hero photo is a catalogue cut-out on a white backdrop, not a lifestyle
   shot: cover would slice the top and bottom off the cabinet, and the white
   rectangle would seam against the grey plate. Contain keeps the whole machine
   in frame, and multiply drops its white ground into the plate behind it. */
.hero__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: 50% 50%;
	padding: clamp(20px, 3vw, 40px);
	mix-blend-mode: multiply;
}

.hero__eyebrow {
	margin: 0 0 10px;
	font-family: var(--font-mono);
	font-size: 0.625rem;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--muted);
}

.hero h1 {
	max-width: 16ch;
	margin-bottom: 18px;
	color: var(--text);
	font-weight: 560;
}

.hero__summary {
	max-width: 44ch;
	margin-bottom: 24px;
	color: var(--muted);
	font-size: 1rem;
}

@media (max-width: 61.99rem) {
	.hero__media { order: -1; }
	.hero__image { aspect-ratio: 4 / 3; height: auto; padding-bottom: 0; }
}

@media (min-width: 62rem) {
	.hero {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		/* Fix the row height so the square photo crops to the band instead of
		   stretching the whole hero to its own 1:1 proportions. */
		grid-template-rows: clamp(400px, 33vw, 520px);
		align-items: stretch;
	}

	.hero__media { overflow: hidden; padding-inline-end: var(--gutter); }

	/* Align the copy with the site shell instead of the raw viewport edge. */
	.hero__inner {
		justify-content: flex-end;
		padding-inline: var(--gutter) clamp(32px, 4vw, 64px);
	}

	.hero__copy { max-width: calc(var(--shell) / 2 - var(--gutter)); width: 100%; }
}

/* ==========================================================================
   9. Value strip
   ========================================================================== */

.value-strip {
	background: var(--brand);
	color: #fff;
	text-align: center;
}

.value-strip p {
	margin: 0;
	padding-block: 13px;
	font-size: 0.8125rem;
	font-weight: 520;
	letter-spacing: 0.02em;
}

/* ==========================================================================
   10. Category cards
   ========================================================================== */

.section--categories { background: var(--paper); }

.category-cards {
	display: grid;
	gap: clamp(12px, 1.6vw, 20px);
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width: 56rem) {
	.category-cards { grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); }
}

.category-card {
	display: block;
	text-decoration: none;
	color: var(--text);
}

.category-card__media {
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	background: var(--bone);
}

.category-card__media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: clamp(12px, 2vw, 24px);
	transition: transform var(--dur) var(--ease);
}

.category-card:hover .category-card__media img { transform: scale(1.04); }

.category-card__label {
	display: block;
	margin-top: 12px;
	font-size: 0.9375rem;
	font-weight: 540;
	letter-spacing: -0.015em;
}

.category-card:hover .category-card__label { color: var(--brand-deep); }

/* ==========================================================================
   11. Statement band
   ========================================================================== */

.section--statement { background: var(--bone); }

.statement-grid {
	display: grid;
	gap: clamp(24px, 4vw, 56px);
	align-items: center;
}

@media (min-width: 60rem) {
	.statement-grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); }
}

.statement-grid__text h2 { margin-bottom: 14px; }

.statement-grid__text p {
	max-width: 52ch;
	color: var(--muted);
	font-size: 1.0625rem;
	margin-bottom: 20px;
}

.statement-grid__media img {
	width: 100%;
	border-radius: var(--r-lg);
	object-fit: cover;
}

/* ==========================================================================
   12. Testimonials
   ========================================================================== */

.section--testimonials { background: var(--paper); }

.testimonial-grid {
	display: grid;
	gap: clamp(14px, 1.8vw, 22px);
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
}

.testimonial {
	margin: 0;
	padding: clamp(20px, 2.4vw, 28px);
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	background: var(--bone);
}

.testimonial__stars { display: flex; gap: 3px; margin-bottom: 14px; }

.testimonial__stars svg {
	width: 15px; height: 15px;
	fill: var(--brand);
	stroke: none;
}

.testimonial blockquote {
	margin: 0 0 14px;
	font-size: 0.9375rem;
	line-height: 1.6;
	color: var(--text);
}

.testimonial figcaption {
	font-size: 0.8125rem;
	font-weight: 540;
	color: var(--muted);
}

/* ==========================================================================
   13. Quality section
   ========================================================================== */

.section--quality { background: var(--paper); }

.quality-grid {
	display: grid;
	gap: clamp(28px, 4vw, 60px);
	align-items: center;
}

@media (min-width: 60rem) {
	.quality-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}

.quality-grid__text p {
	color: var(--muted);
	max-width: 54ch;
}

.quality-grid__text .button { margin-top: 12px; }

.quality-grid__media img {
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	border-radius: var(--r-lg);
	background: #edeeef;
}

/* ==========================================================================
   14. FAQ accordion
   ========================================================================== */

.section--faq { background: var(--bone); }

.accordion {
	display: grid;
	gap: 8px;
	max-width: 820px;
	margin-inline: auto;
}

.accordion details {
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	background: var(--paper);
}

.accordion summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	padding: 16px 20px;
	font-size: 0.9375rem;
	font-weight: 520;
	cursor: pointer;
	list-style: none;
}

.accordion summary::-webkit-details-marker { display: none; }

.accordion summary span { position: relative; width: 13px; height: 13px; flex: none; }

.accordion summary span::before,
.accordion summary span::after {
	content: '';
	position: absolute;
	top: 50%; left: 0;
	width: 100%; height: 1.5px;
	border-radius: 2px;
	background: var(--brand);
	transform: translateY(-50%);
	transition: transform var(--dur) var(--ease), opacity var(--dur-fast) var(--ease);
}

.accordion summary span::after { transform: translateY(-50%) rotate(90deg); }
.accordion details[open] summary span::after { transform: translateY(-50%) rotate(0deg); opacity: 0; }

.accordion details > p {
	margin: 0;
	padding: 0 20px 18px;
	font-size: 0.9375rem;
	color: var(--muted);
	max-width: 66ch;
}

/* ==========================================================================
   15. Page hero & content pages
   ========================================================================== */

.page-hero {
	background: var(--bone);
	border-bottom: 1px solid var(--line);
	padding-block: clamp(30px, 4vw, 52px);
}

.page-hero__inner { max-width: 74ch; }
.page-hero h1 { margin-bottom: 0; }
.page-hero p { color: var(--muted); max-width: 58ch; margin-top: 14px; }
.page-hero__description { color: var(--muted); margin-top: 14px; max-width: 58ch; }

.breadcrumbs {
	margin-bottom: 16px;
	font-family: var(--font-mono);
	font-size: 0.625rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--muted);
}

.breadcrumbs a { color: var(--text); text-decoration: none; }
.breadcrumbs a:hover { color: var(--brand-deep); }
.breadcrumbs span { margin-inline: 7px; opacity: 0.5; }

.page-hero .entry-meta {
	margin-bottom: 12px;
	font-family: var(--font-mono);
	font-size: 0.6875rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--muted);
}

.page-entry__body,
.single-entry__body,
.archive-layout { padding-block: clamp(36px, 5vw, 72px); }

.page-entry__featured,
.single-entry__featured { margin: 0 0 clamp(24px, 3.5vw, 44px); }

.page-entry__featured img,
.single-entry__featured img { border-radius: var(--r-lg); width: 100%; }

.prose {
	max-width: 74ch;
	font-size: 1.0625rem;
	line-height: 1.72;
	color: #24272d;
}

/* Cart and Checkout are store interfaces, not long-form articles. Give their
   WooCommerce blocks the full usable shell width on desktop. */
@media (min-width: 48.01rem) {
	body.woocommerce-cart .page-entry__body > .prose,
	body.woocommerce-checkout .page-entry__body > .prose {
		width: 100%;
		max-width: none;
		min-width: 0;
	}
}

.prose > *:first-child { margin-top: 0; }
.prose h2 { margin-top: 2em; margin-bottom: 0.5em; font-size: clamp(1.25rem, 2vw, 1.5rem); }
.prose h3 { margin-top: 1.6em; font-size: 1.125rem; }
.prose a { color: var(--brand-deep); }
.prose ul, .prose ol { padding-left: 1.25em; }
.prose li { margin-bottom: 0.45em; }
.prose strong { font-weight: 600; }

.prose table { width: 100%; border-collapse: collapse; margin: 1.5em 0; font-size: 0.9375rem; }
.prose th, .prose td { padding: 11px 13px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.prose th { font-weight: 560; background: var(--bone); }

.prose blockquote {
	margin: 1.5em 0;
	padding: 4px 0 4px 22px;
	border-left: 2px solid var(--brand);
	color: var(--muted);
}

.post-grid {
	display: grid;
	gap: clamp(14px, 2vw, 24px);
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 290px), 1fr));
}

.post-card {
	display: flex;
	flex-direction: column;
	margin: 0;
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	background: var(--paper);
	overflow: hidden;
	transition: box-shadow var(--dur) var(--ease);
}

.post-card:hover { box-shadow: var(--lift-2); }

.post-card__media { display: block; background: var(--bone); }
.post-card__media img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.post-card__placeholder { display: block; aspect-ratio: 16 / 10; background: var(--bone); }
.post-card__content { flex: 1; padding: clamp(18px, 2.2vw, 26px); }

.post-card__content .entry-meta {
	margin: 0 0 8px;
	font-family: var(--font-mono);
	font-size: 0.625rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--muted);
}

.post-card h2 { font-size: 1.125rem; margin-bottom: 8px; }
.post-card h2 a { text-decoration: none; }
.post-card h2 a:hover { color: var(--brand-deep); }
.post-card p { font-size: 0.9375rem; color: var(--muted); }

.post-navigation {
	display: grid;
	gap: 14px;
	padding-block: clamp(24px, 3.5vw, 48px);
	border-top: 1px solid var(--line);
}

@media (min-width: 44rem) { .post-navigation { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.post-navigation div { display: grid; gap: 5px; }
.post-navigation span {
	font-family: var(--font-mono);
	font-size: 0.625rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--muted);
}
.post-navigation a { font-weight: 520; text-decoration: none; }
.post-navigation a:hover { color: var(--brand-deep); }

.navigation.pagination { padding-top: 12px; }
.navigation.pagination .nav-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }

.navigation.pagination .page-numbers {
	display: grid;
	place-items: center;
	min-width: 40px; height: 40px;
	padding: 0 12px;
	border: 1px solid var(--line);
	border-radius: var(--r-sm);
	font-size: 0.875rem;
	text-decoration: none;
}

.navigation.pagination .page-numbers.current { background: var(--ink); color: #fff; border-color: var(--ink); }

.empty-state {
	padding: clamp(36px, 6vw, 72px);
	border: 1px dashed var(--line-strong);
	border-radius: var(--r-lg);
	text-align: center;
	background: var(--bone);
}

.empty-state p { color: var(--muted); margin: 0; }
.empty-state h2 { font-size: 1.4rem; }
.empty-state .search-form { max-width: 420px; margin: 20px auto; }

/* 404 */
.not-found { padding-block: clamp(56px, 8vw, 120px); }

.not-found__grid { display: grid; gap: clamp(28px, 4vw, 56px); align-items: start; }

@media (min-width: 56rem) {
	.not-found__grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); }
}

.not-found__grid > div > p { color: var(--muted); max-width: 46ch; }
.not-found__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-top: 24px; }

.not-found__search {
	padding: clamp(20px, 2.6vw, 30px);
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	background: var(--bone);
}

.not-found__search h2 { font-size: 1.0625rem; margin-bottom: 14px; }

.search-form { display: flex; gap: 8px; align-items: center; }
.search-form label { flex: 1; margin: 0; }
.search-form input[type='submit'] { flex: none; padding-inline: 22px; }

.commerce-main { background: var(--paper); }
.commerce-shell { padding-block: clamp(32px, 4.5vw, 68px); }

/* ==========================================================================
   16. Forms
   ========================================================================== */

input[type='text'],
input[type='email'],
input[type='url'],
input[type='password'],
input[type='search'],
input[type='number'],
input[type='tel'],
input[type='date'],
textarea,
select {
	width: 100%;
	padding: 12px 15px;
	border: 1px solid var(--line-strong);
	border-radius: var(--r-sm);
	background: var(--paper);
	font-size: 0.9375rem;
	line-height: 1.4;
	height: auto;
	transition: border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
}

input:focus, textarea:focus, select:focus {
	border-color: var(--brand);
	box-shadow: 0 0 0 3px rgba(0, 109, 251, 0.18);
	outline: none;
}

label { display: block; font-size: 0.875rem; font-weight: 510; margin-bottom: 6px; }

input[type='submit'],
button[type='submit'],
.wp-block-search__button {
	padding: 12px 26px;
	border: 0;
	border-radius: var(--r-sm);
	background: var(--ink);
	color: #fff;
	font-size: 0.9375rem;
	font-weight: 540;
	cursor: pointer;
	transition: background-color var(--dur-fast) var(--ease);
}

input[type='submit']:hover, button[type='submit']:hover { background: var(--brand); }

/* ==========================================================================
   17. WooCommerce

   WooCommerce ships its loop styles as `.woocommerce ul.products li.product …`.
   `:is(.woocommerce, body)` matches that specificity so these rules win on shop
   pages, and still matches the homepage loop, which has no .woocommerce wrapper.
   ========================================================================== */

.woocommerce-breadcrumb {
	margin-bottom: 22px;
	font-family: var(--font-mono);
	font-size: 0.625rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--muted);
}

.woocommerce-breadcrumb a { color: var(--text); text-decoration: none; }

.woocommerce-products-header__title,
.woocommerce-products-header h1 { margin-bottom: 8px; }

.woocommerce-result-count {
	font-family: var(--font-mono);
	font-size: 0.6875rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--muted);
	margin: 0;
}

.woocommerce-ordering select { width: auto; min-width: 210px; padding-block: 10px; }

.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-message {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 14px;
	margin: 0 0 24px;
	padding: 15px 20px;
	border: 1px solid var(--line);
	border-left: 3px solid var(--brand);
	border-radius: var(--r-sm);
	background: var(--bone);
	font-size: 0.9375rem;
	list-style: none;
}

.woocommerce-error { border-left-color: #c0392b; }
.woocommerce-message .button, .woocommerce-info .button { margin-inline-start: auto; }

/* Product loop */
:is(.woocommerce, body) ul.products {
	display: grid;
	gap: clamp(12px, 1.6vw, 22px);
	margin: 0; padding: 0;
	list-style: none;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width: 48rem) { :is(.woocommerce, body) ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 64rem) { :is(.woocommerce, body) ul.products { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

:is(.woocommerce, body) ul.products::before,
:is(.woocommerce, body) ul.products::after { content: none !important; }

:is(.woocommerce, body) ul.products li.product {
	position: relative;
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 0;
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	background: var(--paper);
	overflow: hidden;
	transition: box-shadow var(--dur) var(--ease), border-color var(--dur) var(--ease);
	width: auto !important;
	float: none !important;
	clear: none !important;
}

:is(.woocommerce, body) ul.products li.product:hover {
	box-shadow: var(--lift-2);
	border-color: var(--line-strong);
}

:is(.woocommerce, body) ul.products li.product > a.woocommerce-LoopProduct-link {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: 0;
	text-decoration: none;
	color: inherit;
}

:is(.woocommerce, body) ul.products li.product img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: contain;
	background: #fff;
	padding: clamp(12px, 2vw, 22px);
	margin: 0;
	transition: transform var(--dur) var(--ease);
}

:is(.woocommerce, body) ul.products li.product:hover img { transform: scale(1.035); }

:is(.woocommerce, body) ul.products li.product .arcadezus-loop-brand {
	display: block;
	padding: clamp(10px, 1.5vw, 14px) clamp(13px, 1.6vw, 18px) 0;
	font-family: var(--font-mono);
	font-size: 0.5625rem;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--muted);
}

:is(.woocommerce, body) ul.products li.product .woocommerce-loop-product__title {
	padding: 4px clamp(13px, 1.6vw, 18px) 0;
	font-size: 0.9375rem;
	font-weight: 520;
	line-height: 1.35;
	letter-spacing: -0.015em;
	color: var(--text);
	margin: 0 0 8px;
	/* The title is a flex item, and flexbox blockifies `-webkit-box`, which
	   silently disables -webkit-line-clamp. A fixed three-line box clips
	   reliably and keeps every price on the same baseline across a row. */
	display: block;
	height: calc(3 * 1.35em);
	overflow: hidden;
}

:is(.woocommerce, body) ul.products li.product .price {
	display: block;
	margin: auto 0 0;
	padding: 0 clamp(13px, 1.6vw, 18px) clamp(12px, 1.6vw, 16px);
	font-size: 1.0625rem;
	font-weight: 600;
	letter-spacing: -0.02em;
	color: var(--text);
}

:is(.woocommerce, body) ul.products li.product .price del { opacity: 0.45; font-weight: 400; margin-right: 6px; font-size: 0.85em; }
:is(.woocommerce, body) ul.products li.product .price ins { text-decoration: none; color: var(--brand); }

:is(.woocommerce, body) ul.products li.product .button,
:is(.woocommerce, body) ul.products li.product .added_to_cart {
	margin: 0 clamp(13px, 1.6vw, 18px) clamp(13px, 1.6vw, 18px);
	justify-content: center;
	padding: 11px 18px;
	font-size: 0.8125rem;
}

:is(.woocommerce, body) ul.products li.product .onsale,
.arcadezus-badge {
	position: absolute;
	top: 12px; left: 12px;
	z-index: 2;
	margin: 0;
	padding: 5px 10px;
	border-radius: var(--r-sm);
	background: var(--brand);
	color: #fff;
	font-family: var(--font-mono);
	font-size: 0.5625rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	line-height: 1;
	min-height: 0; min-width: 0;
}

/* Single product */
.woocommerce.single-product div.product {
	display: grid;
	gap: clamp(28px, 4vw, 60px);
	align-items: start;
}

@media (min-width: 64rem) {
	.woocommerce.single-product div.product { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
	.woocommerce.single-product div.product .woocommerce-product-gallery { position: sticky; top: calc(var(--header-h) + 24px); }
}

.woocommerce.single-product .woocommerce-product-gallery {
	width: 100% !important;
	float: none !important;
	margin: 0 !important;
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	background: #fff;
	overflow: hidden;
}

.woocommerce.single-product .woocommerce-product-gallery img { background: #fff; }

.woocommerce.single-product .flex-control-thumbs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 8px;
	padding: 0;
	list-style: none;
}

.woocommerce.single-product .flex-control-thumbs li { margin: 0; width: 76px !important; }

.woocommerce.single-product .flex-control-thumbs img {
	border: 1px solid var(--line);
	border-radius: var(--r-sm);
	background: #fff;
	opacity: 0.6;
	cursor: pointer;
	transition: opacity var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}

.woocommerce.single-product .flex-control-thumbs img:hover,
.woocommerce.single-product .flex-control-thumbs img.flex-active { opacity: 1; border-color: var(--brand); }

.woocommerce.single-product div.product .summary {
	width: 100% !important;
	float: none !important;
	margin: 0 !important;
}

.woocommerce.single-product .product_title { font-size: clamp(1.5rem, 2.6vw, 2.1rem); margin-bottom: 14px; }

.arcadezus-product-brand {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 12px;
	font-family: var(--font-mono);
	font-size: 0.625rem;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--muted);
}

.woocommerce.single-product div.product p.price,
.woocommerce.single-product div.product span.price {
	display: block;
	margin: 0 0 6px;
	font-size: clamp(1.4rem, 2.3vw, 1.85rem);
	font-weight: 620;
	letter-spacing: -0.03em;
	color: var(--text);
}

.woocommerce.single-product div.product p.price del { opacity: 0.4; font-weight: 400; font-size: 0.6em; }
.woocommerce.single-product div.product p.price ins { text-decoration: none; color: var(--brand); }

.woocommerce-product-details__short-description {
	margin: 18px 0 22px;
	padding-top: 20px;
	border-top: 1px solid var(--line);
	font-size: 0.9375rem;
	color: var(--muted);
}

.woocommerce.single-product .stock {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 18px;
	font-family: var(--font-mono);
	font-size: 0.6875rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	font-weight: 500;
}

.woocommerce.single-product .stock::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.woocommerce.single-product .stock.in-stock { color: #1a7f47; }
.woocommerce.single-product .stock.out-of-stock { color: #b3341f; }

.woocommerce.single-product form.cart {
	display: flex;
	flex-wrap: nowrap;
	align-items: stretch;
	width: 100%;
	gap: 12px;
	margin: 0 0 12px !important;
}

/* WooCommerce adds clearfix pseudo-elements to the cart form. In a flex
   container those become flex items and eat ~24px, leaving Add to cart short of
   the PayPal button's right edge. */
.woocommerce.single-product form.cart::before,
.woocommerce.single-product form.cart::after { content: none !important; display: none !important; }

.woocommerce.single-product form.cart .quantity { flex: none; margin: 0; }

.woocommerce.single-product form.cart .quantity input[type='number'] {
	width: 88px;
	height: 54px;
	padding: 0 10px;
	text-align: center;
	font-family: var(--font-mono);
}

.woocommerce.single-product form.cart .single_add_to_cart_button {
	flex: 1 1 auto;
	min-width: 0;
	height: 54px;
	justify-content: center;
	padding: 0 30px;
	border: 0;
	border-radius: var(--r-sm);
	background: var(--brand);
	color: #fff;
	font-size: 1rem;
	font-weight: 560;
	cursor: pointer;
	transition: background-color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);
}

.woocommerce.single-product form.cart .single_add_to_cart_button:hover { background: var(--brand-hi); }
.woocommerce.single-product form.cart .single_add_to_cart_button:active { transform: scale(0.985); }

/* PayPal's express buttons render outside the cart form, so pin them to the
   same width and spacing as the Add to cart row above. */
.woocommerce.single-product .summary [id*='ppc-button'],
.woocommerce.single-product .summary .ppcp-button-container,
.woocommerce.single-product .summary .paypal-buttons {
	width: 100% !important;
	max-width: none !important;
	min-height: 54px;
}

.woocommerce.single-product .summary [id*='ppc-button'] { margin: 0 0 22px; }

.arcadezus-assurance {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1px;
	margin: 0 0 22px;
	padding: 0;
	list-style: none;
	background: var(--line);
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	overflow: hidden;
}

@media (min-width: 40rem) { .arcadezus-assurance { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.arcadezus-assurance li {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 16px 14px;
	background: var(--paper);
	font-size: 0.75rem;
	line-height: 1.4;
	color: var(--muted);
}

.arcadezus-assurance svg { width: 18px; height: 18px; color: var(--brand); }
.arcadezus-assurance strong { display: block; font-size: 0.8125rem; font-weight: 540; color: var(--text); }

.product__shipping-note {
	margin: 0 0 16px;
	font-size: 0.8125rem;
	color: var(--muted);
}

.product__shipping-note a { color: var(--brand-deep); }

/* The description spans the full width below the buy column: long spec lists
   read badly in a narrow sticky column. */
.product__description {
	grid-column: 1 / -1;
	margin: clamp(40px, 5vw, 72px) 0 0;
	padding-top: clamp(26px, 3.4vw, 44px);
	border-top: 1px solid var(--line);
	font-size: 0.9375rem;
	line-height: 1.7;
	color: #24272d;
}

.product__description > p { max-width: 78ch; }
.product__description > *:first-child { margin-top: 0; }
.product__description img { display: none; }

/* Each section gets a real heading with a brand rule, not a caption. */
.product__description h2,
.product__description h3 {
	margin: 2.1em 0 1em;
	padding: 0 0 0 14px;
	border: 0;
	border-left: 3px solid var(--brand);
	font-family: var(--font);
	font-size: 1.0625rem;
	font-weight: 580;
	letter-spacing: -0.02em;
	text-transform: none;
	color: var(--text);
}

.product__description > h2:first-child,
.product__description > h3:first-child { margin-top: 0; }

/* Two columns so a 15-item feature list is eight rows, not fifteen. */
.product__description ul,
.product__description ol {
	max-width: 1000px;
	padding-left: 1.15em;
	margin: 0;
}

.product__description li {
	margin-bottom: 0.55em;
	break-inside: avoid;
	padding-left: 2px;
}

.product__description li::marker { color: var(--brand); }

@media (min-width: 48rem) {
	.product__description ul,
	.product__description ol { columns: 2; column-gap: clamp(32px, 4vw, 64px); }
}

.product__accordions { margin-top: 24px; max-width: none; }

.product__accordion-body {
	padding: 0 20px 18px;
	font-size: 0.9375rem;
	color: var(--muted);
}

.product__accordion-body p { margin: 0; }
.product__accordion-body table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.product__accordion-body th,
.product__accordion-body td { padding: 9px 0; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.product__accordion-body th { width: 42%; font-weight: 540; color: var(--text); }
.product__accordion-body p:last-child,
.product__accordion-body tr:last-child th,
.product__accordion-body tr:last-child td { border-bottom: 0; }

.product_meta {
	padding-top: 18px;
	border-top: 1px solid var(--line);
	font-size: 0.8125rem;
	color: var(--muted);
}

.product_meta > span { display: block; margin-bottom: 5px; }
.product_meta a { color: var(--text); }

/* Product tabs */
.woocommerce div.product .woocommerce-tabs { margin-top: clamp(40px, 5vw, 72px); grid-column: 1 / -1; }

.woocommerce div.product .woocommerce-tabs ul.tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
	margin: 0 0 24px !important;
	padding: 0 !important;
	list-style: none;
	border-bottom: 1px solid var(--line);
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs::after { content: none !important; }

.woocommerce div.product .woocommerce-tabs ul.tabs li {
	margin: 0; padding: 0;
	border: 0;
	background: none;
	border-radius: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { content: none !important; }

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	display: block;
	padding: 12px 18px;
	border-bottom: 2px solid transparent;
	font-size: 0.875rem;
	font-weight: 520;
	color: var(--muted);
	text-decoration: none;
	transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover { color: var(--text); border-bottom-color: var(--brand); }

.woocommerce div.product .woocommerce-tabs .panel { max-width: 78ch; font-size: 0.9375rem; line-height: 1.7; color: #24272d; }
.woocommerce div.product .woocommerce-tabs .panel h2 { font-size: 1.25rem; }
.woocommerce div.product .woocommerce-tabs .panel table { width: 100%; border-collapse: collapse; }
.woocommerce div.product .woocommerce-tabs .panel th,
.woocommerce div.product .woocommerce-tabs .panel td { padding: 11px 13px; border-bottom: 1px solid var(--line); text-align: left; }
.woocommerce div.product .woocommerce-tabs .panel th { font-weight: 550; width: 34%; }

/* Product reviews sit at the bottom of the page because the native tab strip
   is replaced by the custom description and specification layout above. */
.arcadezus-product-reviews {
	grid-column: 1 / -1;
	margin-top: clamp(48px, 6vw, 84px);
	padding-top: clamp(30px, 4vw, 48px);
	border-top: 1px solid var(--line);
}

.woocommerce.single-product .arcadezus-product-reviews #reviews {
	display: grid;
	gap: clamp(28px, 5vw, 64px);
	align-items: start;
}

@media (min-width: 64rem) {
	.woocommerce.single-product .arcadezus-product-reviews #reviews {
		grid-template-columns: minmax(0, 0.9fr) minmax(360px, 1.1fr);
	}
}

.woocommerce.single-product .arcadezus-product-reviews #comments,
.woocommerce.single-product .arcadezus-product-reviews #review_form_wrapper { min-width: 0; }

.woocommerce.single-product .arcadezus-product-reviews .woocommerce-Reviews-title,
.woocommerce.single-product .arcadezus-product-reviews .comment-reply-title {
	display: block;
	margin: 0 0 18px;
	font-size: clamp(1.35rem, 2.2vw, 1.75rem);
	font-weight: 620;
	line-height: 1.2;
	letter-spacing: -0.035em;
	color: var(--text);
}

.woocommerce.single-product .arcadezus-product-reviews .woocommerce-noreviews {
	max-width: 42ch;
	margin: 0;
	color: var(--muted);
}

.woocommerce.single-product .arcadezus-product-reviews #review_form_wrapper,
.woocommerce.single-product .arcadezus-product-reviews > #reviews > .woocommerce-verification-required {
	padding: clamp(20px, 3vw, 30px);
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	background: var(--bone);
}

.woocommerce.single-product .arcadezus-product-reviews .comment-notes,
.woocommerce.single-product .arcadezus-product-reviews .must-log-in,
.woocommerce.single-product .arcadezus-product-reviews .woocommerce-verification-required {
	font-size: 0.875rem;
	line-height: 1.6;
	color: var(--muted);
}

.woocommerce.single-product .arcadezus-product-reviews .must-log-in a,
.woocommerce.single-product .arcadezus-product-reviews .woocommerce-verification-required a { color: var(--brand-deep); }

.woocommerce.single-product .arcadezus-product-reviews #review_form .comment-form { margin-top: 22px; }
.woocommerce.single-product .arcadezus-product-reviews #review_form .comment-form > p { margin: 0 0 16px; }

.woocommerce.single-product .arcadezus-product-reviews #review_form .comment-form-rating {
	display: grid;
	gap: 8px;
	margin-bottom: 18px;
}

.woocommerce.single-product .arcadezus-product-reviews #review_form p.stars {
	margin: 0;
	font-size: 1.25rem;
	line-height: 1;
	color: var(--brand);
}

.woocommerce.single-product .arcadezus-product-reviews #review_form p.stars a { color: var(--brand); }

.woocommerce.single-product .arcadezus-product-reviews #review_form textarea {
	min-height: 148px;
	resize: vertical;
	background: var(--paper);
}

.woocommerce.single-product .arcadezus-product-reviews #review_form .form-submit { margin: 4px 0 0; }

.woocommerce.single-product .arcadezus-product-reviews #review_form .form-submit input {
	min-height: 48px;
	background: var(--brand);
}

.woocommerce.single-product .arcadezus-product-reviews #review_form .form-submit input:hover { background: var(--brand-deep); }

@media (min-width: 40rem) {
	.woocommerce.single-product .arcadezus-product-reviews #review_form .comment-form {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: 14px;
	}

	.woocommerce.single-product .arcadezus-product-reviews #review_form .comment-notes,
	.woocommerce.single-product .arcadezus-product-reviews #review_form .comment-form-rating,
	.woocommerce.single-product .arcadezus-product-reviews #review_form .comment-form-comment,
	.woocommerce.single-product .arcadezus-product-reviews #review_form .comment-form-cookies-consent,
	.woocommerce.single-product .arcadezus-product-reviews #review_form .logged-in-as,
	.woocommerce.single-product .arcadezus-product-reviews #review_form .must-log-in,
	.woocommerce.single-product .arcadezus-product-reviews #review_form .form-submit { grid-column: 1 / -1; }
}

@media (max-width: 39.99rem) {
	.woocommerce.single-product .arcadezus-product-reviews input,
	.woocommerce.single-product .arcadezus-product-reviews select,
	.woocommerce.single-product .arcadezus-product-reviews textarea { font-size: 1rem; }
}

.woocommerce.single-product .arcadezus-product-reviews ol.commentlist {
	display: grid;
	gap: 0;
	margin: 22px 0 0;
	padding: 0;
	list-style: none;
}

.woocommerce.single-product .arcadezus-product-reviews ol.commentlist > li {
	margin: 0;
	padding: 20px 0;
	border-bottom: 1px solid var(--line);
}

.woocommerce.single-product .arcadezus-product-reviews ol.commentlist > li:first-child { padding-top: 0; }

.woocommerce.single-product .arcadezus-product-reviews ol.commentlist li .comment_container {
	display: grid;
	grid-template-columns: 42px minmax(0, 1fr);
	gap: 14px;
}

.woocommerce.single-product .arcadezus-product-reviews ol.commentlist li img.avatar {
	position: static;
	float: none;
	width: 42px;
	height: 42px;
	margin: 0;
	padding: 0;
	border: 1px solid var(--line);
	border-radius: 50%;
	background: var(--bone);
}

.woocommerce.single-product .arcadezus-product-reviews ol.commentlist li .comment-text {
	margin: 0;
	padding: 0;
	border: 0;
	color: var(--text);
}

.woocommerce.single-product .arcadezus-product-reviews .comment-text .star-rating {
	float: none;
	margin: 0 0 8px;
	color: var(--brand);
}

.woocommerce.single-product .arcadezus-product-reviews .comment-text .meta {
	margin: 0 0 8px;
	font-size: 0.8125rem;
	color: var(--muted);
}

.woocommerce.single-product .arcadezus-product-reviews .comment-text .woocommerce-review__author {
	font-weight: 580;
	color: var(--text);
}

.woocommerce.single-product .arcadezus-product-reviews .comment-text .description { font-size: 0.9375rem; line-height: 1.7; }
.woocommerce.single-product .arcadezus-product-reviews .comment-text .description p { margin: 0; }
.woocommerce.single-product .arcadezus-product-reviews .clear { display: none; }

.related.products,
.upsells.products { grid-column: 1 / -1; margin-top: clamp(40px, 5vw, 72px); }
.related.products > h2, .upsells.products > h2 { margin-bottom: 24px; }

/* Sticky mobile buy bar */
.arcadezus-buybar {
	position: fixed;
	left: 0; right: 0; bottom: 0;
	z-index: 95;
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 10px var(--gutter) calc(10px + env(safe-area-inset-bottom));
	background: rgba(255, 255, 255, 0.97);
	border-top: 1px solid var(--line);
	box-shadow: 0 -6px 24px -18px rgba(10, 11, 13, 0.4);
	transform: translate3d(0, 110%, 0);
	transition: transform var(--dur) var(--ease);
}

.arcadezus-buybar.is-visible { transform: translate3d(0, 0, 0); }
.arcadezus-buybar__info { min-width: 0; flex: 1; }

.arcadezus-buybar__title {
	display: block;
	font-size: 0.75rem;
	color: var(--muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.arcadezus-buybar__price { display: block; font-size: 1rem; font-weight: 600; letter-spacing: -0.02em; }

.arcadezus-buybar__action {
	flex: none;
	padding: 12px 24px;
	border: 0;
	border-radius: var(--r-sm);
	background: var(--brand);
	color: #fff;
	font-size: 0.875rem;
	font-weight: 550;
	cursor: pointer;
	text-decoration: none;
}

@media (min-width: 64rem) { .arcadezus-buybar { display: none; } }
@media (max-width: 63.99rem) { body.single-product { padding-bottom: 84px; } }

/* Cart, checkout, account — classic markup */
.woocommerce table.shop_table {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	overflow: hidden;
	font-size: 0.9375rem;
}

.woocommerce table.shop_table th {
	padding: 14px 15px;
	background: var(--bone);
	font-family: var(--font-mono);
	font-size: 0.6875rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--muted);
	font-weight: 500;
	text-align: left;
	border: 0;
}

.woocommerce table.shop_table td { padding: 15px; border-top: 1px solid var(--line); vertical-align: middle; }
.woocommerce table.shop_table img { width: 60px; border-radius: var(--r-sm); background: #fff; }

.woocommerce .cart_totals,
.woocommerce-checkout-review-order,
.woocommerce-order,
.woocommerce-MyAccount-content {
	padding: clamp(20px, 2.6vw, 30px);
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	background: var(--bone);
}

.woocommerce .cart_totals h2,
.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
#order_review_heading { font-size: 1.125rem; }

@media (min-width: 62rem) {
	.woocommerce-checkout form.checkout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: clamp(26px, 3.2vw, 48px); align-items: start; }
	.woocommerce-checkout form.checkout > .col2-set { grid-column: 1; }
	.woocommerce-checkout form.checkout > #order_review_heading,
	.woocommerce-checkout form.checkout > #order_review { grid-column: 2; }
}

.woocommerce .quantity { display: inline-flex; }

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button.alt,
.woocommerce button.button.alt {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 12px 24px;
	border: 0;
	border-radius: var(--r-sm);
	background: var(--ink);
	color: #fff;
	font-size: 0.875rem;
	font-weight: 530;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: background-color var(--dur-fast) var(--ease);
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover { background: var(--brand); color: #fff; }

.woocommerce .checkout-button,
.woocommerce #place_order,
.woocommerce button.button.alt { background: var(--brand); }
.woocommerce .checkout-button:hover, .woocommerce #place_order:hover { background: var(--brand-hi); }

.woocommerce a.button.wc-backward { background: transparent; color: var(--text); border: 1px solid var(--line-strong); }

.woocommerce .woocommerce-form-login,
.woocommerce .woocommerce-form-coupon,
.woocommerce form.checkout_coupon {
	padding: clamp(18px, 2.4vw, 26px);
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	background: var(--bone);
}

.woocommerce-MyAccount-navigation ul {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0 0 24px;
	padding: 0;
	list-style: none;
}

.woocommerce-MyAccount-navigation a {
	display: block;
	padding: 9px 16px;
	border: 1px solid var(--line);
	border-radius: var(--r-sm);
	font-size: 0.875rem;
	text-decoration: none;
}

.woocommerce-MyAccount-navigation li.is-active a { background: var(--ink); color: #fff; border-color: var(--ink); }

.woocommerce nav.woocommerce-pagination ul {
	display: flex;
	gap: 6px;
	border: 0;
	margin: 40px 0 0;
	padding: 0;
	list-style: none;
	justify-content: center;
}

.woocommerce nav.woocommerce-pagination ul li { border: 0; margin: 0; overflow: visible; }

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	display: grid;
	place-items: center;
	min-width: 40px; height: 40px;
	padding: 0 12px;
	border: 1px solid var(--line);
	border-radius: var(--r-sm);
	font-size: 0.875rem;
	text-decoration: none;
}

.woocommerce nav.woocommerce-pagination ul li span.current { background: var(--ink); color: #fff; border-color: var(--ink); }

.woocommerce-store-notice, p.demo_store { display: none !important; }

/* ==========================================================================
   18. WooCommerce Blocks (Cart & Checkout)
   ========================================================================== */

.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout { margin-block: clamp(32px, 4.5vw, 64px); }

.wc-block-components-sidebar .wc-block-components-title,
.wc-block-cart__totals-title {
	font-family: var(--font-mono);
	font-size: 0.625rem !important;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--muted);
}

/* Only the outer sidebar gets the card treatment. The order-summary block sits
   inside it, so styling both produced a panel-inside-a-panel and doubled the
   padding, which crushed the product name to one word per line. */
.wc-block-components-sidebar,
.wc-block-cart__sidebar {
	padding: clamp(20px, 2.4vw, 28px);
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	background: var(--bone);
}

.wc-block-components-sidebar .wp-block-woocommerce-checkout-order-summary-block {
	padding: 0;
	border: 0;
	background: transparent;
}

/* The short description is noise in a narrow summary column. */
.wc-block-components-order-summary-item__description .wc-block-components-product-metadata { display: none; }

.wc-block-components-order-summary-item__description { min-width: 0; }

.wc-block-cart-item__product a.wc-block-components-product-name,
.wc-block-components-product-name {
	font-size: 0.9375rem;
	font-weight: 520;
	letter-spacing: -0.015em;
	color: var(--text);
	text-decoration: none;
}

.wc-block-cart-item__image img,
.wc-block-components-order-summary-item__image img { border-radius: var(--r-sm); background: #fff; }

.wc-block-components-totals-item__label { color: var(--muted); font-size: 0.9375rem; }
.wc-block-components-totals-item__value { font-weight: 550; color: var(--text); }

.wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
	font-size: 1.1875rem;
	font-weight: 620;
	letter-spacing: -0.025em;
	color: var(--text);
}

.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button,
.wc-block-components-button.contained {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 50px;
	padding: 13px 26px;
	border: 0;
	border-radius: var(--r-sm);
	background: var(--brand);
	color: #fff;
	font-family: var(--font);
	font-size: 1rem;
	font-weight: 560;
	transition: background-color var(--dur-fast) var(--ease);
}

.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover,
.wc-block-components-button.contained:hover { background: var(--brand-hi); color: #fff; }

.wc-block-components-text-input input[type='text'],
.wc-block-components-text-input input[type='email'],
.wc-block-components-text-input input[type='tel'],
.wc-block-components-text-input input[type='number'],
.wc-block-components-address-form input,
.wc-block-components-combobox input {
	border-radius: var(--r-sm);
	border-color: var(--line-strong);
	font-family: var(--font);
}

.wc-block-components-text-input.is-active input:focus,
.wc-block-components-address-form input:focus {
	border-color: var(--brand);
	box-shadow: 0 0 0 3px rgba(0, 109, 251, 0.18);
	outline: none;
}

.wc-block-components-quantity-selector { border-radius: var(--r-sm); border-color: var(--line-strong); }
.wc-block-components-notice-banner { border-radius: var(--r-sm); font-family: var(--font); }

/* On phones, let WooCommerce's own row separators define the summary instead
   of nesting coupons, shipping, total and payment actions inside one card. */
@media (max-width: 48rem) {
	body.woocommerce-cart .wc-block-components-sidebar.wc-block-cart__sidebar {
		padding: 0 !important;
		border: 0 !important;
		border-radius: 0 !important;
		background: transparent !important;
		overflow: visible !important;
	}

	body.woocommerce-cart .wc-block-cart__payment-options,
	body.woocommerce-cart .wc-block-cart__submit {
		margin-top: 14px;
		padding: 0 !important;
	}

	body.woocommerce-cart .wc-block-components-totals-coupon__form {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 8px;
		align-items: end;
	}

	body.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-text-input {
		min-width: 0;
	}

	body.woocommerce-cart .wc-block-components-totals-coupon__button.wc-block-components-button.contained {
		width: auto;
		min-height: 46px;
		padding: 11px 16px;
		flex: 0 0 auto;
		font-size: 0.875rem;
	}

}

@media (max-width: 21.25rem) {
	body.woocommerce-cart .wc-block-components-totals-coupon__form {
		grid-template-columns: 1fr;
	}

	body.woocommerce-cart .wc-block-components-totals-coupon__button.wc-block-components-button.contained {
		width: 100%;
	}
}

.wc-block-components-checkout-step__heading,
.wc-block-components-checkout-step__title {
	font-family: var(--font);
	font-size: 1.0625rem;
	font-weight: 560;
	letter-spacing: -0.02em;
}

/* WooCommerce Blocks product grid — used by the empty-cart cross-sell. It has
   its own markup, so the classic loop styles above never reached it. */
/* Woo lays this grid out with flex and a `max-width: 25%` per card. Overriding
   the container to CSS grid makes that percentage resolve against the cell
   instead of the row and collapses every card, so only the visuals are styled
   here — the column layout stays WooCommerce's. */
/* ========================================================================== 
   Checkout shell: WooCommerce remains responsible for every form and state.
   The composition borrows MechMax's dark-summary clarity without bypassing
   Woo orders, inventory, shipping, refunds, or gateway-hosted payment fields.
   ========================================================================== */

body.woocommerce-checkout { background: var(--bone); }

.site-header--checkout {
	position: relative;
	background: var(--paper);
}

.checkout-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	min-height: 76px;
}

.site-branding--checkout { margin: 0; }

.checkout-header__actions,
.checkout-header__secure,
.checkout-header__cart {
	display: flex;
	align-items: center;
}

.checkout-header__actions { gap: clamp(16px, 3vw, 32px); }

.checkout-header__secure {
	gap: 10px;
	color: var(--muted);
}

.checkout-header__secure > svg {
	width: 20px;
	height: 20px;
	color: var(--brand-deep);
	stroke-width: 1.7;
}

.checkout-header__secure span { display: grid; line-height: 1.25; }
.checkout-header__secure strong { color: var(--text); font-size: 0.8125rem; font-weight: 590; }
.checkout-header__secure small { margin-top: 2px; font-size: 0.6875rem; }

.checkout-header__cart {
	justify-content: center;
	gap: 7px;
	min-height: 44px;
	padding: 9px 14px;
	border: 1px solid var(--line-strong);
	border-radius: var(--r-sm);
	background: var(--paper);
	font-size: 0.8125rem;
	font-weight: 540;
	text-decoration: none;
	transition: border-color 200ms var(--ease), background-color 200ms var(--ease);
}

.checkout-header__cart:hover { border-color: var(--brand); background: rgba(0, 109, 251, 0.04); }
.checkout-header__cart svg { width: 16px; height: 16px; stroke-width: 1.8; }

.checkout-intro {
	padding-block: 36px 20px;
	background: var(--bone);
}

.checkout-intro__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: end;
	gap: 24px 48px;
	max-width: 1184px;
}

.checkout-intro__eyebrow {
	margin: 0 0 8px;
	font-family: var(--font-mono);
	font-size: 0.625rem;
	font-weight: 550;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--brand-deep);
}

.checkout-intro h1 { margin: 0; font-size: 2rem; }
.checkout-intro__copy > p:last-child { max-width: 64ch; margin: 10px 0 0; color: var(--muted); font-size: 0.9375rem; }

.checkout-intro__assurance {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 8px 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.checkout-intro__assurance li {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: var(--muted);
	font-size: 0.75rem;
	font-weight: 510;
	white-space: nowrap;
}

.checkout-intro__assurance svg {
	width: 17px;
	height: 17px;
	color: var(--brand-deep);
	stroke-width: 1.6;
}

body.woocommerce-checkout .page-entry__body--checkout {
	max-width: 1184px;
	padding-block: 18px 64px;
}

body.woocommerce-checkout .checkout-content {
	width: 100%;
	max-width: none;
	font-size: 1rem;
	line-height: 1.5;
	color: var(--text);
}

body.woocommerce-checkout .checkout-content > .wp-block-woocommerce-checkout { margin-block: 0; }

body.woocommerce-checkout .wc-block-components-sidebar-layout {
	display: flex !important;
	align-items: flex-start;
	gap: clamp(24px, 3vw, 44px);
	margin-bottom: 0;
}

body.woocommerce-checkout .wc-block-checkout__main,
body.woocommerce-checkout .wc-block-checkout__sidebar {
	min-width: 0;
	border-radius: var(--r-lg);
	box-shadow: var(--lift-1);
}

body.woocommerce-checkout .wc-block-checkout__main {
	padding: clamp(26px, 3.5vw, 44px) !important;
	border: 1px solid var(--line);
	background: var(--paper);
}

body.woocommerce-checkout .wc-block-checkout__sidebar {
	padding: clamp(24px, 3vw, 34px) !important;
	border: 1px solid var(--ink);
	background: var(--ink);
	color: var(--on-dark);
}

body.woocommerce-checkout .wc-block-checkout__sidebar :is(h2, h3, h4, strong),
body.woocommerce-checkout .wc-block-checkout__sidebar .wc-block-components-title,
body.woocommerce-checkout .wc-block-checkout__sidebar .wc-block-components-product-name,
body.woocommerce-checkout .wc-block-checkout__sidebar .wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
body.woocommerce-checkout .wc-block-checkout__sidebar .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
	color: var(--on-dark) !important;
}

body.woocommerce-checkout .wc-block-checkout__sidebar .wc-block-components-title {
	font-family: var(--font);
	font-size: 1.0625rem !important;
	font-weight: 590;
	letter-spacing: -0.02em;
	text-transform: none;
}

body.woocommerce-checkout .wc-block-checkout__sidebar :is(.wc-block-components-totals-item__label, .wc-block-components-product-metadata, .wc-block-components-order-summary-item__individual-price) {
	color: rgba(255, 255, 255, 0.68) !important;
}

body.woocommerce-checkout .wc-block-checkout__sidebar .wc-block-components-totals-item__value,
body.woocommerce-checkout .wc-block-checkout__sidebar .wc-block-components-product-price,
body.woocommerce-checkout .wc-block-checkout__sidebar a,
body.woocommerce-checkout .wc-block-checkout__sidebar button {
	color: rgba(255, 255, 255, 0.94) !important;
}

body.woocommerce-checkout .wc-block-checkout__sidebar :is(.wc-block-components-totals-wrapper, .wc-block-components-panel, .wc-block-components-order-summary-item, .wc-block-components-totals-footer-item) {
	border-color: rgba(255, 255, 255, 0.14) !important;
}

body.woocommerce-checkout .wc-block-checkout__sidebar .wc-block-components-order-summary-item__image img {
	background: var(--paper);
	border-radius: var(--r-sm);
}

body.woocommerce-checkout .wc-block-checkout__sidebar .wc-block-components-order-summary-item__quantity {
	background: var(--paper);
	color: var(--ink);
	box-shadow: 0 0 0 2px var(--ink);
}

body.woocommerce-checkout .wc-block-checkout__sidebar .wc-block-components-totals-coupon__form { padding-top: 12px; }

body.woocommerce-checkout .wc-block-checkout__sidebar .wc-block-components-totals-coupon__form input {
	background: var(--paper);
	color: var(--text);
}

body.woocommerce-checkout .wc-block-checkout__sidebar .wc-block-components-totals-coupon__button {
	border-color: rgba(255, 255, 255, 0.34) !important;
	background: transparent !important;
}

body.woocommerce-checkout .wc-block-checkout__sidebar .wc-block-components-totals-coupon__button:hover {
	border-color: var(--brand-hi) !important;
	background: rgba(255, 255, 255, 0.08) !important;
}

body.woocommerce-checkout .wc-block-checkout__sidebar .wc-block-components-validation-error {
	color: #ffb4a8 !important;
}

body.woocommerce-checkout .wc-block-components-checkout-step { margin-bottom: 28px; }
body.woocommerce-checkout .wc-block-components-checkout-step:last-of-type { margin-bottom: 0; }

body.woocommerce-checkout .wc-block-components-checkout-step__heading,
body.woocommerce-checkout .wc-block-components-checkout-step__title {
	font-size: 1.125rem;
	font-weight: 590;
}

body.woocommerce-checkout .wc-block-components-text-input input,
body.woocommerce-checkout .wc-block-components-address-form input,
body.woocommerce-checkout .wc-block-components-combobox input,
body.woocommerce-checkout .wc-block-components-combobox-control input {
	min-height: 52px;
	border: 1px solid var(--line-strong);
	background: var(--paper);
	font-size: 1rem;
}

body.woocommerce-checkout .wc-block-components-text-input input:focus,
body.woocommerce-checkout .wc-block-components-address-form input:focus,
body.woocommerce-checkout .wc-block-components-combobox input:focus,
body.woocommerce-checkout .wc-block-components-combobox-control input:focus {
	border-color: var(--brand);
	box-shadow: 0 0 0 3px rgba(0, 109, 251, 0.18);
	outline: none;
}

body.woocommerce-checkout .wc-block-components-text-input.has-error input,
body.woocommerce-checkout .wc-block-components-text-input.is-error input,
body.woocommerce-checkout .wc-block-components-combobox.is-error input {
	border-color: #b42318;
	box-shadow: 0 0 0 3px rgba(180, 35, 24, 0.14);
}

body.woocommerce-checkout .wc-block-components-validation-error { color: #9f1c13; }

body.woocommerce-checkout .wc-block-components-checkbox__input,
body.woocommerce-checkout input[type='checkbox'],
body.woocommerce-checkout input[type='radio'] {
	min-width: 20px;
	min-height: 20px;
	accent-color: var(--brand);
}

body.woocommerce-checkout .wc-block-components-radio-control-accordion-option,
body.woocommerce-checkout .wc-block-components-radio-control__option {
	border-color: var(--line-strong);
	border-radius: var(--r-sm);
}

body.woocommerce-checkout .wc-block-components-checkout-place-order-button {
	min-height: 54px;
	margin-top: 18px;
	font-weight: 620;
}

body.woocommerce-checkout .wc-block-components-checkout-place-order-button:disabled {
	opacity: 0.58;
	cursor: not-allowed;
}

body.woocommerce-checkout .wc-block-components-button.is-loading { cursor: wait; }
body.woocommerce-checkout .wc-block-components-notice-banner.is-error { border-color: #b42318; }
body.woocommerce-checkout .wc-block-components-notice-banner.is-success { border-color: #18794e; }

@media (min-width: 64rem) {
	body.woocommerce-checkout .wc-block-components-sidebar-layout { flex-direction: row-reverse; }
	body.woocommerce-checkout .wc-block-checkout__main { width: 64% !important; flex: 1 1 64%; }
	body.woocommerce-checkout .wc-block-checkout__sidebar {
		position: sticky;
		top: 24px;
		width: 36% !important;
		flex: 0 0 calc(36% - 22px);
	}
}

@media (max-width: 63.99rem) {
	.checkout-intro__inner { grid-template-columns: 1fr; align-items: start; }
	.checkout-intro__assurance { justify-content: flex-start; }

	body.woocommerce-checkout .wc-block-components-sidebar-layout {
		flex-direction: column !important;
		gap: 18px;
	}

	body.woocommerce-checkout .wc-block-checkout__main,
	body.woocommerce-checkout .wc-block-checkout__sidebar {
		width: 100% !important;
		flex: 0 0 auto;
		position: static;
	}

	body.woocommerce-checkout .wc-block-checkout__sidebar { order: -1; }
}

@media (max-width: 47.99rem) {
	.checkout-header__inner { min-height: 68px; gap: 14px; }
	.checkout-header__secure { gap: 7px; }
	.checkout-header__secure small { display: none; }
	.checkout-header__secure strong { font-size: 0.75rem; }
	.checkout-header__cart { padding-inline: 10px; }

	.checkout-intro { padding-block: 28px 14px; }
	.checkout-intro h1 { font-size: 1.75rem; }
	.checkout-intro__copy > p:last-child { font-size: 0.875rem; }
	.checkout-intro__assurance { display: grid; gap: 7px; }

	body.woocommerce-checkout .page-entry__body--checkout { padding-block: 12px 40px; }
	body.woocommerce-checkout .wc-block-components-sidebar-layout { gap: 12px; }
	body.woocommerce-checkout .wc-block-checkout__main,
	body.woocommerce-checkout .wc-block-checkout__sidebar {
		padding: 20px 16px !important;
		border-radius: var(--r-md);
		box-shadow: none;
	}

	body.woocommerce-checkout .wc-block-components-checkout-step { margin-bottom: 24px; }
	body.woocommerce-checkout .wc-block-components-checkout-step__heading,
	body.woocommerce-checkout .wc-block-components-checkout-step__title { font-size: 1.0625rem; }
	body.woocommerce-checkout :is(input, select, textarea, button) { font-size: 1rem; }
}

.checkout-footer {
	border-top: 1px solid var(--line);
	background: var(--paper);
	color: var(--muted);
}

.checkout-footer__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: start;
	gap: 22px 36px;
	padding-block: 30px;
}

.checkout-footer__support { display: grid; gap: 4px; font-size: 0.8125rem; }
.checkout-footer__support strong { color: var(--text); font-weight: 590; }
.checkout-footer a { color: inherit; text-decoration: none; }
.checkout-footer a:hover { color: var(--brand-deep); }

.checkout-footer__policies {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 8px 18px;
	font-size: 0.8125rem;
}

.checkout-footer__bottom {
	grid-column: 1 / -1;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding-top: 20px;
	border-top: 1px solid var(--line);
	font-size: 0.75rem;
}

.checkout-footer__bottom p { margin: 0; }
.checkout-footer .site-footer__payments-label { color: var(--muted); }
.checkout-footer .payment-mark { border: 1px solid var(--line); }
.payment-mark--stripe { color: #635bff; }

@media (max-width: 47.99rem) {
	.checkout-footer__inner { grid-template-columns: 1fr; gap: 18px; padding-block: 24px; }
	.checkout-footer__policies { justify-content: flex-start; }
	.checkout-footer__bottom { grid-column: 1; align-items: flex-start; }
	.checkout-footer .site-footer__payments { flex-wrap: wrap; }
}

.wc-block-grid__products {
	gap: clamp(12px, 1.6vw, 22px);
	margin: 0;
	padding: 0;
	list-style: none;
}

.wc-block-grid__product {
	margin: 0;
	padding: 0 0 clamp(13px, 1.6vw, 18px);
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	background: var(--paper);
	overflow: hidden;
	text-align: left;
	transition: box-shadow var(--dur) var(--ease);
}

.wc-block-grid__product:hover { box-shadow: var(--lift-2); }

.wc-block-grid__product-link { text-decoration: none; }

.wc-block-grid__product-image img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: contain;
	background: #fff;
	padding: clamp(12px, 2vw, 22px);
	margin: 0;
}

.wc-block-grid__product-title {
	padding: 0 clamp(13px, 1.6vw, 18px);
	margin: 0 0 8px;
	font-size: 0.9375rem;
	font-weight: 520;
	line-height: 1.35;
	letter-spacing: -0.015em;
	color: var(--text);
	text-decoration: none;
}

.wc-block-grid__product-title a { color: inherit; text-decoration: none; }
.wc-block-grid__product:hover .wc-block-grid__product-title { color: var(--brand-deep); }

.wc-block-grid__product-price {
	display: block;
	margin: 0 0 12px;
	padding: 0 clamp(13px, 1.6vw, 18px);
	font-size: 1.0625rem;
	font-weight: 600;
	letter-spacing: -0.02em;
	color: var(--text);
}

/* Woo's default block button is dark grey with a link-coloured label, which is
   unreadable. Give it the storefront's primary button treatment. */
.wc-block-grid__product-add-to-cart { margin: 0 clamp(13px, 1.6vw, 18px); }

.wc-block-grid__product-add-to-cart .wp-block-button__link,
.wc-block-grid__product .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 11px 18px;
	border: 0;
	border-radius: var(--r-sm);
	background: var(--brand);
	color: #fff;
	font-family: var(--font);
	font-size: 0.8125rem;
	font-weight: 540;
	text-decoration: none;
	transition: background-color var(--dur-fast) var(--ease);
}

.wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
.wc-block-grid__product .wp-block-button__link:hover { background: var(--brand-hi); color: #fff; }

.wc-block-grid__product-onsale {
	margin: 0;
	padding: 5px 10px;
	border: 0;
	border-radius: var(--r-sm);
	background: var(--brand);
	color: #fff;
	font-family: var(--font-mono);
	font-size: 0.5625rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

/* ==========================================================================
   19. Footer
   ========================================================================== */

.site-footer {
	background: var(--ink);
	color: var(--on-dark);
	padding-top: clamp(44px, 6vw, 76px);
}

.site-footer__grid {
	display: grid;
	gap: clamp(28px, 4vw, 64px);
	padding-bottom: clamp(36px, 5vw, 64px);
}

@media (min-width: 56rem) {
	.site-footer__grid { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.6fr); }
}

.site-footer__logo {
	display: inline-block;
	margin-bottom: 26px;
}


.site-footer__heading {
	margin-bottom: 16px;
	font-size: 1.0625rem;
	font-weight: 580;
	letter-spacing: -0.02em;
	color: #fff;
}

.site-footer__heading--lg { font-size: clamp(1.25rem, 2vw, 1.6rem); }

.site-footer__links { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }

.site-footer__links + .site-footer__links { margin-top: 10px; }

.site-footer__links a {
	font-size: 0.875rem;
	color: rgba(255, 255, 255, 0.74);
	text-decoration: none;
	transition: color var(--dur-fast) var(--ease);
}

.site-footer__links a:hover { color: var(--brand-hi); }

.site-footer__store p {
	margin: 0 0 12px;
	font-size: 0.875rem;
	line-height: 1.7;
	color: rgba(255, 255, 255, 0.74);
	max-width: 58ch;
}

.site-footer__store strong { color: #fff; font-weight: 560; }
.site-footer__store a { color: rgba(255, 255, 255, 0.74); text-decoration: none; }
.site-footer__store a:hover { color: var(--brand-hi); }

.site-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding-block: 22px;
	border-top: 1px solid var(--line-dark);
	font-size: 0.75rem;
	color: rgba(255, 255, 255, 0.5);
}

.site-footer__bottom p { margin: 0; }

/* Dedicated customer-support link. It opens WhatsApp only after the shopper
   chooses it, so the storefront does not load a third-party chat script. */



/* Keep support controls clear of cart payment and checkout actions. */
body.woocommerce-cart 
@media (max-width: 63.99rem) {
	body.single-product }

@media (max-width: 30rem) {
	
	
	body.single-product }

.site-footer__payments { display: flex; align-items: center; gap: 10px; }

.site-footer__payments-label {
	font-family: var(--font-mono);
	font-size: 0.5625rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.42);
}

/* Payment marks sit on a white chip, the way card logos normally appear. */
.payment-mark {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 28px;
	padding-inline: 10px;
	border-radius: 5px;
	background: #fff;
	line-height: 1;
}

.payment-mark svg {
	width: 15px;
	height: 15px;
	fill: currentColor;
	stroke: none;
	flex: none;
}

.payment-mark__word {
	font-size: 0.8125rem;
	font-weight: 650;
	letter-spacing: -0.02em;
}

/* Card brand marks: fixed-height white chips so every logo optically matches. */
.payment-mark--card {
	padding-inline: 8px;
	background: #fff;
}

.payment-mark--card svg {
	width: 40px;
	height: 15px;
	fill: none;
	stroke: none;
}

.payment-mark--card.payment-mark--discover svg { width: 46px; }

/* PayPal brand blue. */
.payment-mark--paypal { color: #003087; }

/* ==========================================================================
   20. Scroll reveals
   ========================================================================== */

.js [data-reveal] {
	opacity: 0;
	transform: translate3d(0, 18px, 0);
	transition: opacity 620ms var(--ease-out), transform 720ms var(--ease-out);
	transition-delay: var(--reveal-delay, 0ms);
}

.js [data-reveal].is-revealed { opacity: 1; transform: translate3d(0, 0, 0); }

/* ==========================================================================
   21. Reduced motion & print
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }

	*, *::before, *::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}

	.js [data-reveal] { opacity: 1; transform: none; }
	:is(.woocommerce, body) ul.products li.product:hover img,
	.category-card:hover .category-card__media img { transform: none; }
}

@media print {
	.promo-bar,
	.site-header,
	.site-footer,
	.arcadezus-buybar,
	
	body { color: #000; background: #fff; }
	.hero__image { display: none; }
	.hero h1, .hero__eyebrow { color: #000; }
}