/* ==========================================================================
   KELVONAA · base: fonts, tokens, reset, type, LED, buttons, wrap band, forms
   ========================================================================== */

@font-face { font-family: "Saira Extra Condensed"; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/saira-600.woff2) format("woff2"); }
@font-face { font-family: "Saira Extra Condensed"; font-style: normal; font-weight: 800; font-display: swap; src: url(../fonts/saira-800.woff2) format("woff2"); }
@font-face { font-family: "Saira Extra Condensed"; font-style: normal; font-weight: 900; font-display: swap; src: url(../fonts/saira-900.woff2) format("woff2"); }
@font-face { font-family: "Archivo"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/archivo.woff2) format("woff2"); }
@font-face { font-family: "Doto"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/doto.woff2) format("woff2"); }

@property --w { syntax: "<percentage>"; inherits: false; initial-value: 0%; }

:root {
	--bg: #F2EDE3;
	--surface: #FBF8F2;
	--ink: #0D0D0F;
	--ink2: #3F3B35;
	--muted: #625D55;
	--line: #D6CDBD;
	--board: #121214;
	--board2: #1E1E22;
	--board-text: #B9B2A5;
	--led: #FFB020;
	--red: #D21F26;
	--red-hi: #E0262B;
	--blue: #1F44E0;
	--ok: #1E7A3C;
	--err: #B3141B;

	--f-display: "Saira Extra Condensed", "Arial Narrow", "Roboto Condensed", sans-serif;
	--f-text: "Archivo", "Helvetica Neue", Arial, sans-serif;
	--f-led: "Doto", ui-monospace, "SFMono-Regular", Menlo, monospace;

	--band: -7deg;
	--ease: cubic-bezier(.65, 0, .2, 1);
	--gut: clamp(16px, 4vw, 56px);
	--max: 1480px;
	--head: 68px;
	--notch: 12px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--head) + 16px); }
body {
	margin: 0;
	background: var(--bg);
	color: var(--ink);
	font: 400 16px/1.6 var(--f-text);
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	overflow-x: clip;
}
img, video, svg { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 3px; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
::selection { background: var(--red); color: var(--surface); }
h1, h2, h3, h4 { margin: 0; font-family: var(--f-display); font-weight: 900; line-height: .9; text-transform: uppercase; letter-spacing: .005em; }
p { margin: 0 0 1em; }
ul, ol { margin: 0; padding: 0; }
.main { display: block; min-height: 60vh; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
.skip { position: absolute; left: 8px; top: -60px; z-index: 100; background: var(--ink); color: var(--surface); padding: 10px 14px; font-weight: 700; }
.skip:focus { top: 8px; }

/* LED scoreboard digits */
.led {
	font-family: var(--f-led);
	font-weight: 900;
	font-size: .95em;
	letter-spacing: .08em;
	line-height: 1;
	text-transform: uppercase;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}
.led--amber { color: var(--led); }

/* Buttons: notched right edge, a wrap band sweeps across on hover */
.btn {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5em;
	min-height: 52px;
	padding: 12px 30px 12px 24px;
	border: 0;
	background: var(--ink);
	color: var(--surface);
	font: 800 clamp(19px, 1.5vw, 22px)/1 var(--f-display);
	letter-spacing: .05em;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	clip-path: polygon(0 0, 100% 0, calc(100% - var(--notch)) 100%, 0 100%);
	transition: color .3s var(--ease);
}
.btn::before {
	content: "";
	position: absolute;
	z-index: -1;
	inset: -40% -20%;
	background: var(--sweep, var(--red));
	transform: translateX(-105%) rotate(var(--band));
	transition: transform .45s var(--ease);
}
.btn:hover::before, .btn:focus-visible::before { transform: translateX(0) rotate(var(--band)); }
.btn--red { background: var(--red); --sweep: var(--ink); }
.btn--blue { background: var(--blue); color: #fff; --sweep: var(--ink); }
.btn--ink { --sweep: var(--red); }
.btn--accent { background: var(--red); --sweep: var(--ink); }
.btn--ghost { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 2px var(--ink); --sweep: var(--ink); }
.btn--ghost:hover { color: var(--surface); }
.btn--line { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 2px var(--ink); --sweep: var(--ink); }
.btn--line:hover { color: var(--surface); }
.btn--wide { width: 100%; }
.btn[disabled], .btn.is-busy { opacity: .6; pointer-events: none; }

/* Wrap band divider: a canvas strip laid across the page with ink fragments */
.band { position: relative; z-index: 3; overflow-x: clip; height: clamp(54px, 7vw, 92px); margin: clamp(-30px, -2vw, -14px) 0; pointer-events: none; }
.band__strip {
	position: absolute;
	left: -6%;
	right: -6%;
	top: 50%;
	height: clamp(38px, 4.4vw, 60px);
	transform: translateY(-50%) rotate(-2.4deg);
	background:
		repeating-linear-gradient(90deg, rgba(0,0,0,.05) 0 1px, transparent 1px 4px),
		repeating-linear-gradient(0deg, rgba(0,0,0,.05) 0 1px, transparent 1px 4px),
		var(--band-c, var(--bg));
	box-shadow: 0 1px 0 rgba(0,0,0,.15), 0 -1px 0 rgba(0,0,0,.1);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}
.band__ink { position: absolute; width: 38%; height: 260%; top: -80%; left: 4%; fill: var(--band-ink, var(--ink)); opacity: .92; transform: rotate(8deg); }
.band__ink--2 { left: 58%; width: 30%; transform: scaleX(-1) rotate(4deg); opacity: .8; }
.band__text { position: relative; font: 900 clamp(22px, 2.6vw, 36px)/1 var(--f-display); letter-spacing: .3em; color: var(--band-text, var(--ink)); text-transform: uppercase; }
.band--red { --band-c: var(--red); --band-ink: var(--ink); }
.band--blue { --band-c: var(--blue); --band-ink: #F7F4EE; }
.band--canvas { --band-c: var(--surface); }

/* Print swatch: cloth colour with an ink slash */
.swatch {
	display: inline-block;
	flex: none;
	width: 18px;
	height: 18px;
	background: linear-gradient(-52deg, transparent 36%, var(--ink) 37% 60%, transparent 61%) var(--cloth);
	box-shadow: inset 0 0 0 1px rgba(0,0,0,.35);
}

/* Section heads */
.rd { padding: clamp(56px, 8vw, 128px) var(--gut); max-width: var(--max); margin: 0 auto; }
.round-head { margin-bottom: clamp(24px, 3.4vw, 48px); }
.round-head__meta { display: flex; align-items: center; gap: 14px; margin: 0 0 14px; font: 700 13px/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.round-head__meta .led { background: var(--board); color: var(--led); padding: 7px 9px 6px; font-size: 15px; }
.round-head__title { font-size: clamp(44px, 7.4vw, 116px); line-height: .84; max-width: 15ch; }
.round-head--lede { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, .6fr); gap: 0 clamp(24px, 4vw, 64px); align-items: end; }
.round-head--lede .round-head__meta { grid-column: 1 / -1; }
.round-head__lede { margin: 0; padding-left: 18px; border-left: 4px solid var(--red); font-size: 17px; color: var(--ink2); max-width: 44ch; }
@media (max-width: 800px) { .round-head--lede { grid-template-columns: minmax(0, 1fr); } .round-head__lede { margin-top: 18px; } }
.rd__lede { max-width: 58ch; font-size: 18px; color: var(--ink2); margin: -12px 0 clamp(28px, 4vw, 52px); }

/* Reveal on scroll: content slides out from under the band */
.js .rv { opacity: 0; transform: translate(-28px, 3px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.js .rv.in { opacity: 1; transform: none; }

/* Forms (shared by contact, withdrawal, WooCommerce) */
.kv-form, .woocommerce form { --field: var(--surface); }
.kv-field { margin: 0 0 18px; }
.kv-field label, .woocommerce form .form-row label { display: block; margin: 0 0 6px; font: 700 13px/1.3 var(--f-text); letter-spacing: .08em; text-transform: uppercase; color: var(--ink2); }
.kv-optional, .woocommerce form .form-row .optional { font-weight: 500; text-transform: none; letter-spacing: 0; color: var(--muted); }
input[type="text"], input[type="email"], input[type="tel"], input[type="password"], input[type="number"], input[type="date"], input[type="search"], textarea, select {
	width: 100%;
	min-height: 50px;
	padding: 12px 14px;
	border: 2px solid var(--ink);
	border-radius: 0;
	background: var(--surface);
	color: var(--ink);
	font: 400 16px/1.4 var(--f-text);
	appearance: none;
}
select { padding-right: 40px; background-image: linear-gradient(45deg, transparent 50%, var(--ink) 50%), linear-gradient(135deg, var(--ink) 50%, transparent 50%); background-position: calc(100% - 20px) 50%, calc(100% - 14px) 50%; background-size: 6px 6px; background-repeat: no-repeat; }
textarea { min-height: 150px; resize: vertical; }
input:focus, textarea:focus, select:focus { outline: 3px solid var(--blue); outline-offset: 0; }
.kv-hp { position: absolute; left: -9999px; }
.kv-form__legal { font-size: 14px; color: var(--muted); }
.kv-form__row { display: flex; flex-wrap: wrap; gap: 12px; }
.kv-notice { padding: 14px 18px; border-left: 6px solid var(--ok); background: var(--surface); margin: 0 0 20px; }
.kv-notice--err { border-color: var(--err); color: var(--err); }
.kv-notice--ok { border-color: var(--ok); }
.kv-steps { list-style: none; display: flex; gap: 8px; margin: 0 0 24px; counter-reset: s; }
.kv-steps li { counter-increment: s; flex: 1; padding: 10px 12px; background: var(--line); font: 800 18px/1 var(--f-display); text-transform: uppercase; letter-spacing: .04em; color: var(--ink2); }
.kv-steps li::before { content: counter(s, decimal-leading-zero) " "; font-family: var(--f-led); }
.kv-steps .is-current { background: var(--board); color: var(--led); }
.kv-steps .is-done { background: var(--ink2); color: var(--surface); }
.kv-summary { background: var(--surface); border: 2px solid var(--ink); padding: 20px 22px; margin: 0 0 20px; }
.kv-summary dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 18px; margin: 0; }
.kv-summary dt { font-weight: 700; }
.kv-summary dd { margin: 0; }

/* Spec tables */
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.spec-table { width: 100%; border-collapse: collapse; font-size: 15px; min-width: 420px; }
.spec-table th, .spec-table td { text-align: left; padding: 12px 14px; border-bottom: 1px solid var(--line); vertical-align: top; }
.spec-table thead th { font: 800 15px/1.1 var(--f-display); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); border-bottom: 2px solid var(--ink); }
.spec-table tbody th .led { font-size: 17px; color: var(--red); }
.table-note { font-size: 14px; color: var(--muted); margin-top: 12px; max-width: 70ch; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
	.js .rv { opacity: 1; transform: none; }
}
/* ==========================================================================
   Scoreboard header + language / delivery panel
   ========================================================================== */

.board {
	position: sticky;
	top: 0;
	z-index: 60;
	background: var(--board);
	color: var(--bg);
	box-shadow: 0 1px 0 #000;
}
.admin-bar .board { top: 32px; }
.board__row {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: stretch;
	height: var(--head);
	max-width: 1680px;
	margin: 0 auto;
}
.board__logo { display: flex; align-items: center; padding: 0 22px 0 var(--gut); color: var(--bg); background: linear-gradient(90deg, #000 0, var(--board) 100%); }
.board__logo svg { width: clamp(132px, 11vw, 168px); height: auto; }

.board__nav { display: flex; align-items: stretch; }
.board__nav ul { list-style: none; display: flex; align-items: stretch; margin: 0; }
.board__nav li { display: flex; }
.cell {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	padding: 0 clamp(10px, 1.2vw, 20px);
	border-left: 1px solid var(--board2);
	text-decoration: none;
	color: var(--bg);
	transition: background .2s;
}
.cell__n { font-size: 11px; color: var(--led); opacity: .75; }
.cell__l { font: 800 clamp(16px, 1.25vw, 19px)/1 var(--f-display); letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.cell::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--red-hi); transform: scaleX(0); transform-origin: left; transition: transform .3s var(--ease); }
.cell:hover { background: var(--board2); }
.cell:hover::after, .cell.is-current::after { transform: scaleX(1); }
.cell.is-current { background: var(--board2); }
.cell.is-current .cell__n { opacity: 1; }
.board__menu-acct { display: none; }

.board__panels { display: flex; align-items: stretch; }
.panel {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	gap: 5px;
	padding: 0 16px;
	border: 0;
	border-left: 1px solid var(--board2);
	background: transparent;
	color: var(--bg);
	text-decoration: none;
	cursor: pointer;
}
.panel:hover { background: var(--board2); }
.panel__k { font: 600 10px/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--board-text); white-space: nowrap; }
.panel .led { font-size: 17px; }
.panel--round .led { font-size: 22px; }
.panel--acct { align-items: center; }
.panel--bag { min-width: 84px; background: #000; }
.led--score { font-size: 26px !important; color: var(--red-hi); text-shadow: 0 0 12px rgba(224, 38, 43, .45); }
.board__burger { display: none; }
.board__split { display: flex; height: 4px; }
.board__split i { flex: 1; background: var(--red); }
.board__split i + i { background: var(--blue); }

@media (max-width: 1180px) {
	.panel--round { display: none; }
	.panel__k { display: none; }
	.cell { padding: 0 10px; }
}
@media (max-width: 980px) {
	:root { --head: 60px; }
	.board__row { grid-template-columns: 1fr auto; }
	.board__logo { padding-left: 16px; }
	.board__nav {
		position: fixed;
		inset: calc(var(--head) + 4px) 0 0;
		z-index: 59;
		flex-direction: column;
		background: var(--board);
		padding: 8px 0 32px;
		overflow-y: auto;
		transform: translateX(100%);
		visibility: hidden;
		transition: transform .35s var(--ease), visibility 0s .35s;
	}
	.menu-open .board__nav { transform: none; visibility: visible; transition: transform .35s var(--ease); }
	.board__nav ul { flex-direction: column; }
	.cell { flex-direction: row; align-items: baseline; gap: 16px; padding: 18px 20px; border-left: 0; border-bottom: 1px solid var(--board2); }
	.cell__n { font-size: 16px; }
	.cell__l { font-size: 34px; }
	.cell::after { top: 0; bottom: 0; right: auto; width: 6px; height: auto; transform: scaleY(0); }
	.board__menu-acct { display: block; margin: 20px; color: var(--bg); font: 700 15px/1 var(--f-text); letter-spacing: .1em; text-transform: uppercase; }
	.panel--acct { display: none; }
	.panel { padding: 0 12px; }
	.panel--bag { min-width: 64px; align-items: center; }
	.board__burger {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 60px;
		border: 0;
		border-left: 1px solid var(--board2);
		background: var(--red);
		cursor: pointer;
	}
	.board__burger span:first-child, .board__burger span:first-child::before, .board__burger span:first-child::after { display: block; width: 24px; height: 3px; background: var(--surface); position: relative; transition: transform .3s var(--ease), background .2s; }
	.board__burger span:first-child::before, .board__burger span:first-child::after { content: ""; position: absolute; left: 0; }
	.board__burger span:first-child::before { top: -8px; }
	.board__burger span:first-child::after { top: 8px; }
	.menu-open .board__burger span:first-child { background: transparent; }
	.menu-open .board__burger span:first-child::before { transform: translateY(8px) rotate(45deg); }
	.menu-open .board__burger span:first-child::after { transform: translateY(-8px) rotate(-45deg); }
	.menu-open { overflow: hidden; }
}
@media (max-width: 782px) { .admin-bar .board { top: 46px; } }
@media (max-width: 400px) {
	.board__logo svg { width: 118px; }
	.panel--locale .led { font-size: 14px; }
}

/* Language / delivery dialog */
.locale {
	width: min(760px, calc(100vw - 24px));
	max-height: calc(100vh - 40px);
	padding: clamp(22px, 4vw, 40px);
	border: 0;
	border-top: 6px solid var(--red);
	background: var(--board);
	color: var(--bg);
	box-shadow: 0 0 0 1px #000, 0 30px 80px rgba(0,0,0,.5);
}
.locale::backdrop { background: rgba(13, 13, 15, .7); }
.locale__title { font-size: clamp(34px, 5vw, 52px); margin: 0 40px 24px 0; }
.locale__close { position: absolute; top: 12px; right: 12px; margin: 0; }
.locale__close button { width: 44px; height: 44px; border: 1px solid var(--board2); background: transparent; color: var(--bg); font-size: 28px; line-height: 1; cursor: pointer; }
.locale__cols { display: grid; grid-template-columns: 1fr 1.2fr; gap: 32px; }
.locale h3 { font: 700 12px/1 var(--f-text); letter-spacing: .14em; color: var(--board-text); margin: 0 0 14px; }
.locale__langs ul { list-style: none; display: grid; gap: 2px; }
.locale__langs a { display: flex; gap: 14px; align-items: center; padding: 11px 12px; text-decoration: none; background: var(--board2); font-weight: 600; }
.locale__langs a:hover { background: #2a2a30; }
.locale__langs a[aria-current] { background: var(--red); }
.locale__langs .led { color: var(--led); width: 2.2em; }
.locale__langs a[aria-current] .led { color: var(--surface); }
.locale__ship p { color: var(--board-text); font-size: 14px; }
.locale__ship select { margin: 0 0 14px; background-color: var(--board2); color: var(--bg); border-color: #3a3a42; background-image: linear-gradient(45deg, transparent 50%, var(--bg) 50%), linear-gradient(135deg, var(--bg) 50%, transparent 50%); }
.locale__ship .btn { --sweep: var(--red); background: var(--bg); color: var(--ink); }
.locale__ship .btn:hover { color: var(--surface); }
@media (max-width: 640px) { .locale__cols { grid-template-columns: minmax(0, 1fr); } }
/* ==========================================================================
   Hero: wrap it, see it. Copy on canvas, the fists on black; a band crosses both.
   ========================================================================== */

.hero {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
	min-height: min(calc(100svh - var(--head) - 4px), 960px);
	background: var(--bg);
	overflow: hidden;
}
.hero__copy {
	position: relative;
	z-index: 3;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: clamp(28px, 3.6vw, 60px) clamp(16px, 3vw, 48px) clamp(28px, 3.6vw, 56px) var(--gut);
}
.hero__kicker { display: flex; align-items: center; gap: 14px; font: 700 13px/1.2 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ink2); }
.hero__kicker .led { background: var(--board); padding: 7px 9px 6px; font-size: 15px; }
.hero__title {
	font-size: clamp(76px, 11vw, 196px);
	line-height: .78;
	letter-spacing: -.012em;
	margin: 6px 0 clamp(22px, 2.4vw, 36px);
}
.hero__l1, .hero__l2 { display: block; }
.hero__l2 {
	position: relative;
	display: inline-block !important;
	margin: .06em 0 0 .32em;
	padding: .07em .16em 0 .12em;
	color: var(--surface);
	background: repeating-linear-gradient(90deg, rgba(0,0,0,.1) 0 1px, transparent 1px 5px), var(--red);
	transform: rotate(var(--band));
	transform-origin: left bottom;
	clip-path: polygon(0 0, 100% 0, calc(100% - .14em) 100%, 0 100%);
}
.hero__sub { max-width: 34ch; font-size: clamp(17px, 1.35vw, 21px); line-height: 1.45; color: var(--ink2); margin-bottom: 28px; }
.hero__cta { display: flex; flex-wrap: wrap; gap: 12px; }
.hero__facts { display: flex; gap: 0; margin: clamp(22px, 2.4vw, 36px) 0 0; border-top: 2px solid var(--ink); max-width: 520px; }
.hero__facts div { flex: 1; padding: 12px 14px 0 0; }
.hero__facts div + div { padding-left: 14px; border-left: 1px solid var(--line); }
.hero__facts dt { font: 600 11px/1.2 var(--f-text); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.hero__facts dd { margin: 4px 0 0; font: 900 clamp(26px, 2.4vw, 36px)/1 var(--f-display); text-transform: uppercase; }

.hero__fig { position: relative; z-index: 1; background: #050505; min-height: 100%; }
.hero__fig .wrapfx { position: absolute; inset: 0; }
.hero__fig .wrapfx__frame { position: absolute; inset: 0; aspect-ratio: auto; }
.hero__caption { position: absolute; z-index: 4; right: 18px; top: 18px; margin: 0; display: flex; gap: 10px; align-items: center; color: var(--bg); font: 700 12px/1 var(--f-text); letter-spacing: .1em; text-transform: uppercase; writing-mode: vertical-rl; }
.hero__caption .led { color: var(--led); }
.hero__caption a { text-decoration: none; }
.hero__caption a:hover { text-decoration: underline; }

/* -------- wrap-to-reveal figure -------- */
.wrapfx { position: relative; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.wrapfx__frame { position: relative; overflow: hidden; aspect-ratio: 928 / 1152; background: #050505; }
.wrapfx__base, .wrapfx__layer { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 35%; pointer-events: none; }
.wrapfx__ink { position: absolute; inset: 0; }
.wrapfx__ink .wrapfx__layer { clip-path: polygon(0 0, 0 0, 0 0); will-change: clip-path; }
.wrapfx.is-static .wrapfx__ink .wrapfx__layer { clip-path: none; }
.wrapfx__flash { position: absolute; inset: 0; background: radial-gradient(circle at 50% 45%, rgba(255,255,255,.55), transparent 60%); opacity: 0; pointer-events: none; }
.wrapfx.is-ready .wrapfx__flash { animation: kv-flash .9s var(--ease); }
@keyframes kv-flash { 0% { opacity: 0; } 15% { opacity: 1; } 100% { opacity: 0; } }

.gauge {
	position: absolute;
	z-index: 4;
	left: clamp(14px, 2vw, 28px);
	bottom: calc(clamp(14px, 2vw, 28px) + 64px);
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 12px;
	background: rgba(18, 18, 20, .88);
	border: 1px solid #000;
	backdrop-filter: blur(4px);
}
.gauge__cells { display: flex; gap: 4px; }
.gauge__cells i { width: 14px; height: 22px; background: #2a2a2f; transform: skewX(-7deg); transition: background .15s; }
.gauge__cells i.on { background: var(--led); box-shadow: 0 0 10px rgba(255, 176, 32, .55); }
.wrapfx.is-ready .gauge__cells i { background: var(--red-hi); box-shadow: 0 0 10px rgba(224, 38, 43, .6); }
.gauge__count { color: var(--led); font-size: 17px; min-width: 3.2ch; }

.hold {
	position: absolute;
	z-index: 4;
	left: clamp(14px, 2vw, 28px);
	bottom: clamp(14px, 2vw, 28px);
	min-width: 228px;
	height: 56px;
	padding: 0 26px;
	border: 0;
	background: var(--bg);
	color: var(--ink);
	font: 900 22px/1 var(--f-display);
	letter-spacing: .08em;
	text-transform: uppercase;
	cursor: pointer;
	overflow: hidden;
	isolation: isolate;
	clip-path: polygon(0 0, 100% 0, calc(100% - var(--notch)) 100%, 0 100%);
	touch-action: none;
	-webkit-touch-callout: none;
	user-select: none;
}
.hold__fill { position: absolute; inset: 0; z-index: -1; background: var(--red); transform-origin: left; transform: scaleX(var(--p, 0)); }
.hold.is-holding, .wrapfx.is-ready .hold { color: var(--surface); }
.hold__label { position: relative; }

/* Mobile hero: picture first, title rides up onto the dark lower edge of the photo */
@media (max-width: 900px) {
	.hero { grid-template-columns: minmax(0, 1fr); min-height: 0; }
	.hero__fig { order: -1; height: 64svh; min-height: 420px; }
	.hero__fig .wrapfx__base, .hero__fig .wrapfx__layer { object-position: 50% 30%; }
	.hero__copy { padding-top: 0; margin-top: -21vw; }
	.hero__title { color: var(--ink); order: 1; }
	.hero__kicker { order: 2; margin: 0 0 14px; }
	.hero__sub, .hero__cta, .hero__facts { order: 3; }
	.hero__l1 { color: var(--bg); text-shadow: 0 2px 24px rgba(0,0,0,.6); }
	.hero__l2 { margin-left: .1em; }
	.hero__cta { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
	.hero__cta .btn { padding: 12px 18px 12px 14px; font-size: 18px; }
	.gauge { bottom: calc(23vw + 64px); }
	.hold { bottom: 23vw; min-width: 0; }
	.hero__caption { top: 12px; right: 10px; }
}
@media (max-width: 480px) {
	.hero__cta { grid-template-columns: minmax(0, 1fr); }
	.hero__facts dd { font-size: 24px; }
	.gauge__cells i { width: 11px; height: 18px; }
}
/* ==========================================================================
   Home rounds
   ========================================================================== */

/* Ticker: scoreboard crawl */
.ticker { position: relative; z-index: 4; background: var(--board); color: var(--bg); overflow: hidden; border-top: 1px solid #000; }
.ticker__track { display: flex; width: max-content; animation: kv-crawl 46s linear infinite; }
.ticker:hover .ticker__track { animation-play-state: paused; }
.ticker__set { display: flex; }
.ticker__item { display: flex; align-items: center; gap: 22px; padding: 15px 22px; font: 800 18px/1 var(--f-display); letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
.ticker__item::before { content: ""; width: 9px; height: 9px; background: var(--led); box-shadow: 0 0 8px var(--led); transform: skewX(-7deg); }
.ticker__item:nth-child(3n+2)::before { background: var(--red-hi); box-shadow: 0 0 8px var(--red-hi); }
.ticker__item:nth-child(3n)::before { background: #5d7bff; box-shadow: 0 0 8px #5d7bff; }
@keyframes kv-crawl { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .ticker__track { animation: none; flex-wrap: wrap; width: auto; } .ticker__set[aria-hidden] { display: none; } .ticker__set { flex-wrap: wrap; } .ticker__item { white-space: normal; } }

/* Shared: press / hover reveal with wrap stripes (mask grows band by band) */
.duo__wrapped, .card__alt, .wall__wrapped {
	-webkit-mask-image: repeating-linear-gradient(-7deg, #000 0 var(--w), transparent var(--w) 12.5%);
	mask-image: repeating-linear-gradient(-7deg, #000 0 var(--w), transparent var(--w) 12.5%);
	transition: --w .7s var(--ease);
}
[data-press] { -webkit-touch-callout: none; user-select: none; -webkit-user-select: none; }
@media (hover: hover) {
	[data-press]:hover .duo__wrapped, [data-press]:hover .card__alt, [data-press]:hover .wall__wrapped,
	.card__media:hover .card__alt { --w: 12.6%; }
}
[data-press].is-pressed .duo__wrapped, [data-press].is-pressed .card__alt, [data-press].is-pressed .wall__wrapped,
[data-press]:focus-visible .duo__wrapped, [data-press]:focus-visible .wall__wrapped { --w: 12.6%; }

/* RD 01 roll vs wrapped: four off-grid tiles */
.duo { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(14px, 2vw, 28px); align-items: start; }
.duo__item { position: relative; }
.duo__item--1 { grid-column: 1 / span 4; }
.duo__item--2 { grid-column: 5 / span 3; margin-top: clamp(40px, 8vw, 120px); }
.duo__item--3 { grid-column: 8 / span 3; margin-top: clamp(-10px, 2vw, 30px); }
.duo__item--4 { grid-column: 11 / span 2; margin-top: clamp(60px, 12vw, 180px); }
.duo__media { position: relative; display: block; aspect-ratio: 4 / 5; overflow: hidden; background: var(--surface); }
.duo__roll, .duo__wrapped { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.duo__hint { position: absolute; right: 10px; bottom: 10px; padding: 6px 10px 5px; background: var(--board); color: var(--led); font: 900 13px/1 var(--f-led); letter-spacing: .1em; text-transform: uppercase; transition: opacity .3s; }
.is-pressed .duo__hint { opacity: 0; }
.duo__title { font-size: clamp(28px, 3vw, 44px); margin: 14px 0 4px; }
.duo__title a { text-decoration: none; }
.duo__item .price { font: 800 20px/1 var(--f-display); }
@media (max-width: 800px) {
	.duo { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
	.duo__item--1, .duo__item--2, .duo__item--3, .duo__item--4 { grid-column: auto; margin-top: 0; }
	.duo__item--2, .duo__item--4 { margin-top: 48px; }
}

/* RD 02 red corner / blue corner: two panels split by the band angle */
.corners { display: grid; grid-template-columns: 58fr 42fr; min-height: clamp(380px, 46vw, 640px); }
.corner { position: relative; display: block; overflow: hidden; color: var(--surface); text-decoration: none; isolation: isolate; }
.corner--red { background: var(--red); clip-path: polygon(0 0, 100% 0, calc(100% - 7vw) 100%, 0 100%); }
.corner--blue { background: var(--blue); margin-left: -7vw; clip-path: polygon(7vw 0, 100% 0, 100% 100%, 0 100%); }
.corner__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; filter: grayscale(1) contrast(1.15); transition: filter .6s var(--ease), transform .8s var(--ease); z-index: -1; }
.corner:hover .corner__img { filter: grayscale(0) contrast(1.05); transform: scale(1.03); }
.corner__body { position: absolute; left: clamp(36px, 5vw, 76px); right: 9vw; bottom: clamp(24px, 3vw, 44px); display: flex; flex-direction: column; gap: 8px; }
.corner--blue .corner__body { left: 9vw; right: clamp(36px, 4vw, 64px); align-items: flex-end; text-align: right; }
.corner__tag { align-self: flex-start; background: var(--board); color: var(--led); padding: 7px 10px 6px; font: 900 14px/1 var(--f-led); letter-spacing: .12em; text-transform: uppercase; }
.corner--blue .corner__tag { align-self: flex-end; }
.corner__title { font: 900 clamp(48px, 6.6vw, 104px)/.84 var(--f-display); text-transform: uppercase; text-shadow: 0 2px 30px rgba(0,0,0,.35); }
.corner__count { font: 700 14px/1 var(--f-text); letter-spacing: .12em; text-transform: uppercase; }
.corner__count .led { font-size: 22px; }
.corners__cats { list-style: none; display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; margin-top: 18px; border: 2px solid var(--ink); }
.corners__cats li + li { border-left: 2px solid var(--ink); }
.corners__cats a { display: flex; flex-direction: column; gap: 6px; padding: 16px 18px; text-decoration: none; height: 100%; }
.corners__cats a > span:first-child { font: 900 24px/1 var(--f-display); text-transform: uppercase; }
.corners__cats .is-red a > span:first-child::before { content: ""; display: inline-block; width: 10px; height: 10px; background: var(--red); margin-right: 8px; vertical-align: .1em; }
.corners__cats .is-blue a > span:first-child::before { content: ""; display: inline-block; width: 10px; height: 10px; background: var(--blue); margin-right: 8px; vertical-align: .1em; }
.corners__from { font-size: 14px; color: var(--muted); }
.corners__cats a:hover { background: var(--ink); color: var(--surface); }
.corners__cats a:hover .corners__from { color: var(--board-text); }
@media (max-width: 800px) {
	.corners { grid-template-columns: minmax(0, 1fr); }
	.corner { min-height: 300px; }
	.corner--red { clip-path: polygon(0 0, 100% 0, 100% calc(100% - 9vw), 0 100%); }
	.corner--blue { margin: -9vw 0 0; clip-path: polygon(0 9vw, 100% 0, 100% 100%, 0 100%); }
	.corner__body, .corner--blue .corner__body { left: 24px; right: 24px; }
	.corners__cats { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
	.corners__cats li + li { border-left: 0; }
	.corners__cats li { border-bottom: 2px solid var(--ink); }
	.corners__cats li:nth-child(even) { border-left: 2px solid var(--ink); }
	.corners__cats li:last-child { border-bottom: 0; }
}

/* RD 03 kit builder */
.kit__tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.kit__tab {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 48px;
	padding: 8px 18px 8px 12px;
	border: 2px solid var(--ink);
	background: transparent;
	font: 900 22px/1 var(--f-display);
	letter-spacing: .04em;
	text-transform: uppercase;
	cursor: pointer;
}
.kit__tab .swatch { width: 24px; height: 24px; }
.kit__tab[aria-selected="true"] { background: var(--ink); color: var(--surface); }
.kit__tab:hover { background: var(--board2); color: var(--surface); }
.kit__panel { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); background: var(--board); color: var(--bg); }
.kit__panel[hidden] { display: none; }
.kit__fig { position: relative; margin: 0; min-height: 100%; }
.kit__img { width: 100%; height: 100%; object-fit: cover; }
.kit__fig figcaption { position: absolute; left: 16px; top: 16px; background: var(--board); color: var(--led); padding: 8px 10px 7px; font-size: 15px; }
.kit__form { padding: clamp(22px, 3vw, 40px); display: flex; flex-direction: column; }
.kit__items { list-style: none; counter-reset: k; }
.kit__item { display: grid; grid-template-columns: 72px 1fr; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--board2); counter-increment: k; }
.kit__thumb img { width: 72px; height: 72px; object-fit: cover; background: var(--bg); }
.kit__name { display: block; font: 800 21px/1.05 var(--f-display); text-transform: uppercase; letter-spacing: .02em; text-decoration: none; margin-bottom: 8px; }
.kit__name::before { content: counter(k, decimal-leading-zero) " "; font: 900 14px/1 var(--f-led); color: var(--led); }
.kit__name:hover { text-decoration: underline; }
.kit__fixed { margin: 0; font-size: 14px; color: var(--board-text); }
.opts { border: 0; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.opt { position: relative; }
.opt input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.opt span { display: inline-block; min-width: 54px; padding: 8px 12px; text-align: center; border: 1px solid #3a3a42; font: 900 14px/1 var(--f-led); letter-spacing: .06em; text-transform: uppercase; }
.opt input:checked + span { background: var(--led); color: var(--ink); border-color: var(--led); }
.opt input:focus-visible + span { outline: 3px solid #5d7bff; outline-offset: 2px; }
.kit__total { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 20px 0 6px; }
.kit__total > span { font: 700 13px/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--board-text); }
.kit__total strong { font: 900 clamp(34px, 3.4vw, 48px)/1 var(--f-display); color: var(--surface); }
.kit__total .kv-cur { font-size: .5em; color: var(--board-text); }
.kit__small { font-size: 13px; color: var(--board-text); }
.kit__form .btn { margin-top: auto; }
.kit__msg { margin: 12px 0 0; min-height: 1.4em; font-size: 15px; }
.kit__msg a { color: var(--led); font-weight: 700; }
@media (max-width: 900px) {
	.kit__panel { grid-template-columns: minmax(0, 1fr); }
	.kit__fig { aspect-ratio: 3 / 2; }
	.kit__tabs { flex-wrap: nowrap; overflow-x: auto; margin-right: calc(var(--gut) * -1); padding-right: var(--gut); scrollbar-width: none; }
	.kit__tab { flex: none; }
}

/* RD 04 ritual */
.ritual { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 72px); align-items: start; }
.rd--ritual .round-head { margin-left: auto; max-width: 900px; text-align: right; }
.rd--ritual .round-head__meta { justify-content: flex-end; }
.rd--ritual .round-head__title { margin-left: auto; }
@media (max-width: 900px) { .rd--ritual .round-head { text-align: left; margin-left: 0; } .rd--ritual .round-head__meta { justify-content: flex-start; } .rd--ritual .round-head__title { margin-left: 0; } }
.ritual__media { position: relative; }
.ritual__video, .ritual__img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; background: #000; }
.ritual__bell { position: absolute; width: 34%; right: -6%; bottom: -16%; aspect-ratio: 4 / 5; object-fit: cover; border: 8px solid var(--bg); transform: rotate(4deg); }
.ritual__steps { list-style: none; counter-reset: r; display: grid; gap: 18px; }
.ritual__steps li { counter-increment: r; position: relative; padding-left: 64px; font-size: 17px; color: var(--ink2); }
.ritual__steps li::before { content: counter(r, decimal-leading-zero); position: absolute; left: 0; top: -2px; width: 48px; padding: 7px 0 6px; text-align: center; background: var(--board); color: var(--led); font: 900 17px/1 var(--f-led); }
.ritual__steps strong { display: block; font: 900 26px/1 var(--f-display); text-transform: uppercase; color: var(--ink); margin-bottom: 4px; }
.ritual__note { margin-top: 22px; font-size: 14px; color: var(--muted); border-top: 1px solid var(--line); padding-top: 14px; }
@media (max-width: 900px) {
	.ritual { grid-template-columns: minmax(0, 1fr); }
	.ritual__bell { width: 36%; right: 4%; bottom: -12%; }
	.ritual__copy { margin-top: 40px; }
}

/* RD 05 print wall */
.wall { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: clamp(150px, 17vw, 260px); grid-auto-flow: dense; gap: 10px; }
.wall__tile a { position: relative; display: block; height: 100%; overflow: hidden; background: var(--surface); }
.wall__tile--0 { grid-column: span 2; grid-row: span 2; }
.wall__tile--2, .wall__tile--6 { grid-row: span 2; }
.wall__tile--4 { grid-column: span 2; }
.wall__flat, .wall__wrapped { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.wall__name { position: absolute; left: 0; bottom: 12px; display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px 6px 10px; background: var(--bg); font: 900 20px/1 var(--f-display); text-transform: uppercase; letter-spacing: .04em; clip-path: polygon(0 0, 100% 0, calc(100% - 8px) 100%, 0 100%); }
@media (max-width: 700px) {
	.wall { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 44vw; gap: 6px; }
	.wall__tile--4 { grid-column: span 2; }
	.wall__name { font-size: 16px; }
}

/* RD 06 sizes on the board */
.rd--sizes { max-width: none; background: var(--board); color: var(--bg); padding-bottom: clamp(48px, 6vw, 88px); }
.sizes-mini { max-width: var(--max); margin: 0 auto; }
.sizes-mini .round-head__meta { color: var(--board-text); }
.sizes-mini .round-head__meta .led { background: var(--red); color: var(--surface); }
.rd--sizes .spec-table th, .rd--sizes .spec-table td { border-color: var(--board2); }
.rd--sizes .spec-table thead th { color: var(--board-text); border-color: var(--bg); }
.rd--sizes .spec-table tbody th .led { color: var(--led); }
.rd--sizes .table-note { color: var(--board-text); }
.rd--sizes .btn { margin-top: 18px; background: var(--bg); color: var(--ink); }
.rd--sizes .btn:hover { color: var(--surface); }
/* ==========================================================================
   The ring (shop / category) and product cards
   ========================================================================== */

.ring-head { max-width: var(--max); margin: 0 auto; padding: clamp(36px, 5vw, 72px) var(--gut) clamp(20px, 3vw, 36px); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px 40px; align-items: end; }
.ring-head__meta { grid-column: 1 / -1; margin: 0; }
.ring-head__meta .led { background: var(--board); color: var(--led); padding: 7px 10px 6px; font-size: 15px; }
.ring-head__title { font-size: clamp(72px, 12vw, 200px); line-height: .8; }
.ring-head__intro { margin: 0; font-size: 18px; color: var(--ink2); max-width: 48ch; }
.chips { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px; margin-top: 18px; }
.chip { display: inline-flex; align-items: center; gap: 10px; padding: 9px 12px 8px 14px; border: 2px solid var(--ink); text-decoration: none; font: 900 19px/1 var(--f-display); letter-spacing: .04em; text-transform: uppercase; }
.chip .led { font-size: 13px; color: var(--muted); }
.chip--red { border-left: 8px solid var(--red); }
.chip--blue { border-left: 8px solid var(--blue); }
.chip:hover { background: var(--board2); color: var(--surface); }
.chip.is-current { background: var(--ink); color: var(--surface); }
.chip.is-current .led, .chip:hover .led { color: var(--led); }
@media (max-width: 800px) {
	.ring-head { grid-template-columns: minmax(0, 1fr); }
	.chips { flex-wrap: nowrap; overflow-x: auto; margin-right: calc(var(--gut) * -1); padding-right: var(--gut); scrollbar-width: none; }
	.chip { flex: none; }
}

/* The ring: canvas floor, four posts, three ropes on each side */
.ring {
	--rope: 5px;
	--pad: clamp(26px, 3vw, 44px);
	position: relative;
	margin: 0 var(--gut) clamp(48px, 6vw, 96px);
	padding: calc(var(--pad) + 14px);
	max-width: calc(var(--max) - 2 * var(--gut));
}
@media (min-width: 1480px) { .ring { margin-left: auto; margin-right: auto; } }
.ring::before, .ring::after, .ring__ropes {
	content: "";
	position: absolute;
	pointer-events: none;
	z-index: 2;
}
.ring::before, .ring::after { left: calc(var(--pad) / 2); right: calc(var(--pad) / 2); height: calc(var(--rope) * 5); background: linear-gradient(var(--red-hi) 0 var(--rope), transparent var(--rope) calc(var(--rope) * 2), #f7f4ee calc(var(--rope) * 2) calc(var(--rope) * 3), transparent calc(var(--rope) * 3) calc(var(--rope) * 4), var(--blue) calc(var(--rope) * 4)); }
.ring::before { top: calc(var(--pad) / 2 - var(--rope)); }
.ring::after { bottom: calc(var(--pad) / 2 - var(--rope)); }
.ring__ropes { top: calc(var(--pad) / 2); bottom: calc(var(--pad) / 2); width: calc(var(--rope) * 5); background: linear-gradient(90deg, var(--red-hi) 0 var(--rope), transparent var(--rope) calc(var(--rope) * 2), #f7f4ee calc(var(--rope) * 2) calc(var(--rope) * 3), transparent calc(var(--rope) * 3) calc(var(--rope) * 4), var(--blue) calc(var(--rope) * 4)); }
.ring__ropes--l { left: calc(var(--pad) / 2 - var(--rope)); }
.ring__ropes--r { right: calc(var(--pad) / 2 - var(--rope)); transform: scaleX(-1); }
.ring__post { position: absolute; z-index: 3; width: var(--pad); height: var(--pad); background: var(--surface); box-shadow: inset 0 0 0 3px var(--ink); }
.ring__post--tl { left: 0; top: 0; background: var(--red); box-shadow: inset 0 0 0 3px #000, 0 6px 0 rgba(0,0,0,.25); }
.ring__post--tr { right: 0; top: 0; }
.ring__post--bl { left: 0; bottom: 0; }
.ring__post--br { right: 0; bottom: 0; background: var(--blue); box-shadow: inset 0 0 0 3px #000, 0 6px 0 rgba(0,0,0,.25); }
.ring__canvas {
	position: relative;
	padding: clamp(24px, 3.6vw, 56px);
	background: url(../img/canvas.webp) 0 0 / 420px repeat, #EFE8DA;
	box-shadow: inset 0 0 0 1px rgba(0,0,0,.08), inset 0 0 120px rgba(80, 60, 30, .12);
}
.ring__center { margin: clamp(30px, 4vw, 60px) calc(clamp(24px, 3.6vw, 56px) * -1); }
.ring__center .band { margin: 0; }

.zone__head { position: relative; display: grid; grid-template-columns: auto 1fr; gap: 6px 18px; align-items: center; margin-bottom: clamp(24px, 3vw, 40px); }
.zone__pad { grid-row: span 2; width: clamp(54px, 6vw, 84px); aspect-ratio: 1; background: var(--red); box-shadow: inset 0 -10px 0 rgba(0,0,0,.2), 6px 6px 0 var(--ink); }
.zone--blue .zone__head { grid-template-columns: 1fr auto; text-align: right; }
.zone--blue .zone__pad { grid-column: 2; grid-row: 1 / span 2; background: var(--blue); box-shadow: inset 0 -10px 0 rgba(0,0,0,.2), -6px 6px 0 var(--ink); }
.zone--blue .zone__title, .zone--blue .zone__sub { grid-column: 1; grid-row: auto; }
.zone__title { font-size: clamp(48px, 7vw, 112px); line-height: .82; }
.zone--red .zone__title { color: var(--red); }
.zone--blue .zone__title { color: var(--blue); }
.zone__sub { margin: 0; color: var(--ink2); max-width: 52ch; }
.zone--blue .zone__sub { justify-self: end; }
.zone__cat + .zone__cat { margin-top: clamp(40px, 5vw, 72px); }
.zone__label { display: flex; align-items: center; gap: 12px; margin: 0 0 18px; font-size: clamp(26px, 2.6vw, 38px); }
.zone__label span:first-child { background: var(--ink); color: var(--surface); padding: 6px 16px 5px 12px; clip-path: polygon(0 0, 100% 0, calc(100% - 10px) 100%, 0 100%); }
.zone__label .led { font-size: 17px; color: var(--muted); }
.zone--blue .zone__label { justify-content: flex-end; }
.zone--blue .zone__label span:first-child { background: var(--blue); }
.zone--red .zone__label span:first-child { background: var(--red); }

/* Off-grid card layout: large / medium / small cards, every other card dropped a little */
.lay { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(18px, 2.2vw, 32px) clamp(14px, 1.8vw, 26px); grid-auto-flow: dense; align-items: start; }
.card--l { grid-column: span 5; }
.card--m { grid-column: span 4; }
.card--s { grid-column: span 3; }
.lay > .card:nth-child(4n+2) { margin-top: clamp(20px, 4vw, 64px); }
.lay > .card:nth-child(4n+3) { margin-top: clamp(-6px, 1vw, 14px); }
.zone--blue .lay { direction: rtl; }
.zone--blue .lay > * { direction: ltr; }
.lay--same { margin-top: 10px; }
.lay--same .card--l { grid-column: span 4; }
.lay--same .card--m { grid-column: span 4; }
@media (max-width: 1100px) {
	.card--l { grid-column: span 6; }
	.card--m, .card--s { grid-column: span 6; }
	.lay > .card:nth-child(4n+2) { margin-top: 40px; }
}
@media (max-width: 700px) {
	.ring { --pad: 18px; margin: 0 0 48px; padding: calc(var(--pad) + 6px); --rope: 3px; }
	.ring__canvas { padding: 18px 12px 26px; }
	.ring__center { margin: 30px -12px; }
	.lay { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 22px 10px; }
	.card--l { grid-column: span 2; }
	.card--m, .card--s { grid-column: span 1; }
	.lay > .card:nth-child(4n+2) { margin-top: 0; }
	.lay > .card:nth-child(odd):not(.card--l) { margin-top: 26px; }
	.zone__head, .zone--blue .zone__head { grid-template-columns: auto 1fr; text-align: left; }
	.zone--blue .zone__pad { grid-column: 1; }
	.zone--blue .zone__title, .zone--blue .zone__sub { grid-column: 2; justify-self: start; }
	.zone--blue .zone__label { justify-content: flex-start; }
	.zone--blue .lay { direction: ltr; }
}

/* Card */
.card { position: relative; min-width: 0; }
.card__media { position: relative; display: block; aspect-ratio: 1; overflow: hidden; background: var(--surface); outline: 2px solid transparent; outline-offset: 4px; transition: outline-color .2s; }
.card--l .card__media { aspect-ratio: 1; }
.card__media:hover { outline-color: var(--ink); }
.card__img, .card__alt { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.card__alt { z-index: 1; }
.card__code { position: absolute; z-index: 2; left: 0; top: 0; }
.card__code .led { display: block; background: var(--board); color: var(--led); padding: 6px 8px 5px; font-size: 14px; }
.card--gloves .card__code .led, .card--wraps .card__code .led { box-shadow: inset 0 -3px 0 var(--red-hi); }
.card--ropes .card__code .led, .card--towels .card__code .led, .card--shorts .card__code .led { box-shadow: inset 0 -3px 0 #5d7bff; }
.card__body { padding-top: 12px; display: grid; gap: 4px; }
.card__title { font-size: clamp(20px, 1.7vw, 26px); line-height: .98; letter-spacing: .01em; }
.card--l .card__title { font-size: clamp(26px, 2.4vw, 38px); }
.card__title a { text-decoration: none; }
.card__title a:hover { text-decoration: underline; text-decoration-thickness: 2px; }
.card__meta { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 13px; color: var(--muted); }
.card .price { font: 900 22px/1 var(--f-display); letter-spacing: .02em; }
.price .kv-cur { font-size: .62em; color: var(--muted); letter-spacing: .06em; }
.price del { opacity: .55; margin-right: 6px; }
.price ins { text-decoration: none; }
/* ==========================================================================
   Product page
   ========================================================================== */

.pdp { max-width: var(--max); margin: 0 auto; padding: 18px var(--gut) clamp(40px, 5vw, 80px); display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 0 clamp(24px, 4vw, 64px); align-items: start; }
.crumbs { grid-column: 1 / -1; display: flex; gap: 10px; align-items: center; margin-bottom: 16px; font: 700 12px/1 var(--f-text); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.crumbs a { text-decoration: none; }
.crumbs a:hover { color: var(--ink); text-decoration: underline; }

.pdp__media { position: sticky; top: calc(var(--head) + 24px); }
.pdp__stage { position: relative; aspect-ratio: 1; background: var(--surface); overflow: hidden; }
.pdp__stage > video, .pdp__stage > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; visibility: hidden; transition: opacity .35s var(--ease); }
.pdp__stage > .is-active { opacity: 1; visibility: visible; }
.no-js .pdp__stage > img:first-of-type { opacity: 1; visibility: visible; }
.pdp__code { position: absolute; left: 0; top: 0; z-index: 2; }
.pdp__code .led { display: block; background: var(--board); color: var(--led); padding: 8px 10px 7px; font-size: 17px; }
.pdp--red .pdp__code .led { box-shadow: inset 0 -4px 0 var(--red-hi); }
.pdp--blue .pdp__code .led { box-shadow: inset 0 -4px 0 #5d7bff; }
.pdp__thumbs { list-style: none; display: flex; gap: 8px; margin-top: 10px; overflow-x: auto; scrollbar-width: none; }
.thumb { position: relative; display: block; width: 84px; height: 84px; padding: 0; border: 2px solid transparent; background: var(--surface); cursor: pointer; flex: none; }
.thumb img { width: 100%; height: 100%; object-fit: cover; }
.thumb.is-active { border-color: var(--ink); }
.thumb:hover { border-color: var(--muted); }
.thumb__play { position: absolute; inset: 0; margin: auto; width: 28px; height: 28px; background: var(--red); clip-path: polygon(30% 20%, 80% 50%, 30% 80%); }

.buy { background: var(--surface); border: 2px solid var(--ink); padding: clamp(20px, 2.6vw, 36px); position: relative; }
.buy::before { content: ""; position: absolute; left: -2px; right: -2px; top: -2px; height: 8px; background: var(--red); }
.pdp--blue .buy::before { background: var(--blue); }
.buy__corner { display: flex; align-items: center; justify-content: space-between; margin: 0 0 14px; }
.buy__tag { font: 700 12px/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--red); }
.pdp--blue .buy__tag { color: var(--blue); }
.buy__corner .led { background: var(--board); color: var(--led); padding: 6px 8px 5px; font-size: 14px; }
.buy__title { font-size: clamp(42px, 4.6vw, 76px); line-height: .84; margin: 0 0 14px; }
.buy__print { display: flex; align-items: center; gap: 10px; margin: 0 0 16px; font: 700 13px/1 var(--f-text); letter-spacing: .1em; text-transform: uppercase; color: var(--ink2); }
.buy__print .swatch { width: 24px; height: 24px; }
.buy__price { margin: 0 0 16px; }
.buy__price .price { font: 900 clamp(36px, 3.2vw, 48px)/1 var(--f-display); }
.buy__story { color: var(--ink2); font-size: 16px; }
.buy__story p:last-child { margin-bottom: 0; }
.buy__form { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--line); }
.buy__assure { list-style: none; margin-top: 18px; display: grid; gap: 8px; font-size: 14px; }
.buy__assure li { display: flex; gap: 10px; align-items: center; }
.buy__assure li::before { content: ""; width: 8px; height: 8px; background: var(--led); box-shadow: 0 0 0 2px var(--board); flex: none; }

/* Variation form */
.variations { width: 100%; border-collapse: collapse; margin-bottom: 8px; }
.variations tr { display: block; margin-bottom: 14px; }
.variations th, .variations td { display: block; padding: 0; text-align: left; }
.variations th label { display: block; margin-bottom: 8px; font: 700 12px/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ink2); }
.vbtns { display: flex; flex-wrap: wrap; gap: 6px; }
.vbtn { min-width: 64px; min-height: 46px; padding: 8px 14px; border: 2px solid var(--ink); background: transparent; font: 900 17px/1 var(--f-led); letter-spacing: .06em; text-transform: uppercase; cursor: pointer; }
.vbtn:hover { background: var(--line); }
.vbtn[aria-pressed="true"] { background: var(--ink); color: var(--led); }
.vbtn:disabled { opacity: .35; text-decoration: line-through; cursor: not-allowed; }
.js .variations select.has-btns { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.single_variation_wrap .woocommerce-variation-price { margin: 4px 0 10px; }
.single_variation_wrap .woocommerce-variation-price .price { font: 900 30px/1 var(--f-display); }
.woocommerce-variation-availability p { margin: 0 0 8px; font-size: 14px; color: var(--ok); }
.woocommerce-variation-add-to-cart, form.cart:not(.variations_form) { display: flex; gap: 10px; align-items: stretch; flex-wrap: wrap; }
.quantity { display: flex; }
.quantity .qty { width: 76px; min-height: 56px; text-align: center; font: 900 20px/1 var(--f-display); -moz-appearance: textfield; }
.quantity .qty::-webkit-inner-spin-button { -webkit-appearance: none; }
.single_add_to_cart_button, .woocommerce-variation-add-to-cart .button {
	flex: 1;
	min-height: 56px;
	border: 0;
	background: var(--red);
	color: var(--surface);
	font: 900 22px/1 var(--f-display);
	letter-spacing: .06em;
	text-transform: uppercase;
	cursor: pointer;
	clip-path: polygon(0 0, 100% 0, calc(100% - var(--notch)) 100%, 0 100%);
	transition: background .2s;
}
.single_add_to_cart_button:hover { background: var(--ink); }
.single_add_to_cart_button.disabled, .single_add_to_cart_button:disabled { background: var(--muted); cursor: not-allowed; }

/* Hold box (hand wraps) */
.holdbox { display: grid; grid-template-columns: 112px 1fr; gap: 14px; align-items: center; margin: 18px 0 0; padding: 12px; background: var(--board); color: var(--bg); }
.holdbox__media { position: relative; display: block; aspect-ratio: 4 / 5; overflow: hidden; background: var(--surface); }
.holdbox__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.holdbox__text { margin: 0; font-size: 14px; color: var(--board-text); }
.holdbox__text strong { display: block; color: var(--bg); font: 900 21px/1 var(--f-display); text-transform: uppercase; margin-bottom: 4px; }

/* Specs */
.pdp-specs { max-width: var(--max); margin: 0 auto; padding: clamp(32px, 4vw, 64px) var(--gut); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: clamp(24px, 4vw, 64px); border-top: 2px solid var(--ink); }
.pdp-h { display: flex; align-items: center; gap: 12px; font-size: clamp(32px, 3.4vw, 52px); margin-bottom: 18px; }
.pdp-h .led { font-size: 15px; background: var(--board); color: var(--led); padding: 6px 8px 5px; }
.facts { margin: 0; border-top: 2px solid var(--ink); }
.facts div { display: grid; grid-template-columns: minmax(120px, .8fr) 1.2fr; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.facts dt { font: 700 12px/1.4 var(--f-text); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.facts dd { margin: 0; font-weight: 500; }
.pdp-specs__text { font-size: 17px; color: var(--ink2); padding-top: 4px; }
.pdp-specs__text h3 { font-size: 30px; margin: 1.2em 0 .4em; color: var(--ink); }
.pdp-specs__text ul { padding-left: 1.2em; margin-bottom: 1em; }
.pdp-specs__sizes { grid-column: 1 / -1; }

.gpsr { max-width: var(--max); margin: 0 auto clamp(40px, 6vw, 90px); padding: 20px var(--gut) 0; font-size: 14px; color: var(--muted); }
.gpsr__h { font-size: 20px; color: var(--ink2); margin-bottom: 8px; letter-spacing: .06em; }
.gpsr p { max-width: 90ch; margin-bottom: 6px; }

@media (max-width: 900px) {
	.pdp { grid-template-columns: minmax(0, 1fr); padding-top: 12px; }
	.pdp__media { position: relative; top: 0; margin: 0 calc(var(--gut) * -1) 18px; }
	.pdp__thumbs { padding: 0 var(--gut); }
	.pdp-specs { grid-template-columns: minmax(0, 1fr); }
	.buy { border-width: 2px 0 0; padding: 22px 0 0; background: transparent; }
	.buy::before { left: 0; right: 0; }
}
/* ==========================================================================
   Pages: help & legal documents, story, kits, sizes, contact, 404
   ========================================================================== */

.pg { max-width: var(--max); margin: 0 auto; padding: clamp(32px, 5vw, 72px) var(--gut) clamp(56px, 7vw, 110px); }
.page__head { margin-bottom: clamp(26px, 4vw, 52px); max-width: 1100px; }
.page__head--wide { max-width: none; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 0 48px; align-items: end; }
.page__head--wide .page__kicker { grid-column: 1 / -1; }
.page__kicker { margin: 0 0 14px; }
.page__kicker .led { background: var(--board); color: var(--led); padding: 7px 10px 6px; font-size: 15px; }
.page__title { font-size: clamp(54px, 9vw, 150px); line-height: .82; }
.pg--doc .page__title, .pg--shop .page__title { font-size: clamp(48px, 7vw, 112px); }
.page__updated { margin: 14px 0 0; font-size: 14px; color: var(--muted); }
.page__lede { font-size: 18px; }

.pg--doc { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 0 clamp(28px, 5vw, 80px); }
.pg--doc .page__head { grid-column: 1 / -1; }
.doc-index { position: sticky; top: calc(var(--head) + 24px); align-self: start; }
.doc-index ol { list-style: none; border-top: 2px solid var(--ink); }
.doc-index a { display: flex; gap: 12px; align-items: baseline; padding: 11px 0; border-bottom: 1px solid var(--line); text-decoration: none; font: 800 20px/1.05 var(--f-display); text-transform: uppercase; letter-spacing: .02em; color: var(--ink2); }
.doc-index .led { font-size: 13px; color: var(--muted); }
.doc-index a:hover { color: var(--ink); }
.doc-index a[aria-current] { color: var(--red); }
.doc-index a[aria-current] .led { color: var(--red); }
@media (max-width: 900px) {
	.pg--doc { grid-template-columns: minmax(0, 1fr); }
	.doc-index { position: static; margin-bottom: 28px; }
	.doc-index ol { display: flex; overflow-x: auto; gap: 0; border: 0; margin-right: calc(var(--gut) * -1); scrollbar-width: none; }
	.doc-index li { flex: none; }
	.doc-index a { padding: 10px 14px; border: 2px solid var(--ink); margin-right: 6px; font-size: 17px; }
	.doc-index a[aria-current] { background: var(--ink); color: var(--surface); }
	.page__head--wide { grid-template-columns: minmax(0, 1fr); }
}

/* Long-form text */
.prose { max-width: 74ch; font-size: 17px; line-height: 1.68; color: var(--ink2); }
.prose > :first-child { margin-top: 0; }
.prose h2 { font-size: clamp(30px, 3vw, 42px); line-height: .95; color: var(--ink); margin: 1.6em 0 .5em; padding-top: .5em; border-top: 2px solid var(--ink); }
.prose h3 { font-size: clamp(22px, 2vw, 28px); color: var(--ink); margin: 1.4em 0 .4em; letter-spacing: .02em; }
.prose p, .prose ul, .prose ol { margin: 0 0 1em; }
.prose ul, .prose ol { padding-left: 1.3em; }
.prose li { margin: .3em 0; }
.prose li::marker { color: var(--red); }
.prose a { color: var(--red); font-weight: 600; }
.prose a:hover { color: var(--ink); }
.prose strong { color: var(--ink); }
.prose table { width: 100%; border-collapse: collapse; margin: 1em 0 1.6em; font-size: 15px; display: block; overflow-x: auto; }
.prose th, .prose td { border-bottom: 1px solid var(--line); padding: 10px 12px; text-align: left; vertical-align: top; }
.prose thead th { font: 800 15px/1.1 var(--f-display); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); border-bottom: 2px solid var(--ink); }
.prose blockquote, .prose .box { margin: 1.2em 0; padding: 18px 22px; background: var(--surface); border-left: 6px solid var(--ink); }
.prose .box--form { border-left-color: var(--red); white-space: pre-line; font-size: 15px; }
.prose hr { border: 0; border-top: 1px solid var(--line); margin: 2em 0; }
.prose address { font-style: normal; }
.prose details { border: 2px solid var(--ink); margin: 10px 0; background: var(--surface); }
.prose summary { cursor: pointer; padding: 14px 18px; font: 800 21px/1.1 var(--f-display); text-transform: uppercase; color: var(--ink); list-style: none; display: flex; justify-content: space-between; gap: 12px; }
.prose summary::after { content: "+"; font-family: var(--f-led); color: var(--red); }
.prose details[open] summary::after { content: "–"; }
.prose details > :not(summary) { padding: 0 18px; }
.prose details > :last-child { padding-bottom: 16px; }
.prose .btn { color: var(--surface); text-decoration: none; }

/* Story */
.story__head { max-width: var(--max); margin: 0 auto; padding: clamp(32px, 5vw, 72px) var(--gut) 0; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); gap: 20px clamp(24px, 4vw, 60px); align-items: end; }
.story__head .page__kicker { grid-column: 1 / -1; }
.story__title { font-size: clamp(60px, 10vw, 168px); line-height: .8; }
.story__fig { margin: 0; }
.story__fig--a { transform: rotate(2deg); border: 10px solid var(--surface); box-shadow: 0 0 0 2px var(--ink); }
.story__fig--a img { aspect-ratio: 4 / 5; object-fit: cover; width: 100%; }
.story__body { margin: clamp(40px, 5vw, 80px) auto; padding: 0 var(--gut); }
.story__prints { max-width: var(--max); margin: 0 auto; padding: clamp(48px, 6vw, 96px) var(--gut); }
.prints { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.prints a { position: relative; display: block; text-decoration: none; background: var(--surface); }
.prints img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.prints__name { display: flex; align-items: center; gap: 8px; padding: 10px; font: 900 20px/1 var(--f-display); text-transform: uppercase; }
.prints__code { position: absolute; top: 0; left: 0; background: var(--board); color: var(--led); padding: 5px 7px; font-size: 12px; }
.prints a:hover .prints__name { background: var(--ink); color: var(--surface); }
.story__fig--b img { width: 100%; max-height: 70vh; object-fit: cover; }
@media (max-width: 800px) { .story__head { grid-template-columns: minmax(0, 1fr); } .story__fig--a { max-width: 70%; justify-self: end; } }

/* Kits page */
.kits-page { max-width: var(--max); margin: 0 auto; padding: clamp(32px, 5vw, 72px) var(--gut) clamp(56px, 7vw, 110px); }

/* Sizes page */
.sizes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(36px, 5vw, 72px) clamp(28px, 4vw, 64px); }
.sizes__block:first-child { grid-column: 1 / -1; }
.sizes__more { grid-column: 1 / -1; }
@media (max-width: 900px) { .sizes { grid-template-columns: minmax(0, 1fr); } }

/* Contact */
.contact { max-width: var(--max); margin: 0 auto; padding: clamp(32px, 5vw, 72px) var(--gut) clamp(56px, 7vw, 110px); }
.contact__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(28px, 4vw, 72px); align-items: start; }
.contact__board { background: var(--board); color: var(--bg); }
.contact__img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.contact__list { margin: 0; padding: 8px 24px 4px; }
.contact__list div { padding: 14px 0; border-bottom: 1px solid var(--board2); }
.contact__list dt { font: 700 11px/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--led); margin-bottom: 6px; }
.contact__list dd { margin: 0; font: 800 clamp(20px, 1.8vw, 26px)/1.15 var(--f-display); letter-spacing: .02em; word-break: break-word; }
.contact__list a { text-decoration: none; }
.contact__list a:hover { text-decoration: underline; }
.contact__wd { padding: 16px 24px 22px; margin: 0; }
.contact__wd a { color: var(--bg); font-weight: 700; }
.contact__main .prose { margin-bottom: 26px; }
.contact__main .kv-form { max-width: 640px; }
@media (max-width: 900px) { .contact__grid { grid-template-columns: minmax(0, 1fr); } }

/* 404 */
.nf { max-width: 900px; margin: 0 auto; padding: clamp(60px, 10vw, 140px) var(--gut); text-align: center; }
.nf__score { display: flex; justify-content: center; gap: 10px; margin-bottom: 24px; }
.nf__score .led { background: var(--board); color: var(--red-hi); font-size: clamp(64px, 12vw, 140px); padding: 14px 18px 10px; }
.nf__score .led--amber { color: var(--led); }
.nf__title { font-size: clamp(44px, 7vw, 96px); margin-bottom: 16px; }
.nf__text { color: var(--ink2); font-size: 18px; }
.nf__cta { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
/* ==========================================================================
   WooCommerce: notices, cart, checkout, account (styling only)
   ========================================================================== */

.woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-noreviews, .wc-block-components-notice-banner {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px 18px;
	margin: 0 0 22px;
	padding: 14px 18px;
	background: var(--board);
	color: var(--bg);
	border-left: 8px solid var(--ok);
	font-size: 15px;
}
.woocommerce-info { border-left-color: var(--led); }
.woocommerce-error { border-left-color: var(--red-hi); flex-direction: column; align-items: flex-start; }
.woocommerce-message a, .woocommerce-info a, .woocommerce-error a { color: var(--led); font-weight: 700; }
.woocommerce-message .button, .woocommerce-info .button { order: 2; background: var(--bg); color: var(--ink) !important; padding: 9px 16px; text-decoration: none; font: 800 17px/1 var(--f-display); text-transform: uppercase; letter-spacing: .05em; }
.pdp .woocommerce-notices-wrapper { grid-column: 1 / -1; }

.woocommerce .button, .woocommerce button.button, .woocommerce a.button, .woocommerce input.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 10px 22px;
	border: 0;
	background: var(--ink);
	color: var(--surface);
	font: 800 19px/1 var(--f-display);
	letter-spacing: .05em;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	clip-path: polygon(0 0, 100% 0, calc(100% - 10px) 100%, 0 100%);
}
.woocommerce .button:hover { background: var(--red); }
.woocommerce .button:disabled, .woocommerce .button.disabled { opacity: .5; cursor: not-allowed; }
.woocommerce .button.alt, .checkout-button, #place_order { background: var(--red) !important; color: var(--surface) !important; }
.checkout-button:hover, #place_order:hover { background: var(--ink) !important; }
.empty-note { font: 900 clamp(34px, 4vw, 56px)/1 var(--f-display); text-transform: uppercase; margin: 0 0 10px; }
.cart-empty.woocommerce-info { display: none; }
.return-to-shop { margin-top: 20px; }

/* Cart */
.woocommerce-cart-form { margin-bottom: 30px; }
table.shop_table { width: 100%; border-collapse: collapse; font-size: 15px; }
.shop_table th, .shop_table td { padding: 14px 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; }
.shop_table thead th { font: 800 15px/1 var(--f-display); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); border-bottom: 2px solid var(--ink); }
.shop_table .product-thumbnail img { width: 84px; height: 84px; object-fit: cover; background: var(--surface); }
.shop_table .product-name a { font: 800 21px/1.05 var(--f-display); text-transform: uppercase; text-decoration: none; }
.shop_table .product-name a:hover { text-decoration: underline; }
.shop_table .variation { display: grid; grid-template-columns: auto 1fr; gap: 2px 8px; margin: 6px 0 0; font-size: 13px; color: var(--muted); }
.shop_table .variation dd, .shop_table .variation p { margin: 0; }
.shop_table .product-remove a { display: inline-flex; width: 32px; height: 32px; align-items: center; justify-content: center; border: 2px solid var(--ink); text-decoration: none; font-size: 20px; line-height: 1; }
.shop_table .product-remove a:hover { background: var(--red); border-color: var(--red); color: var(--surface); }
.shop_table .product-subtotal, .shop_table .product-price { font: 800 19px/1 var(--f-display); }
.shop_table .actions { padding-top: 18px; }
.shop_table .actions .coupon { display: none; }
.shop_table .actions .button[name="update_cart"] { float: right; background: transparent; color: var(--ink); box-shadow: inset 0 0 0 2px var(--ink); }
.cart-collaterals { display: flex; justify-content: flex-end; }
.cart_totals { width: min(460px, 100%); background: var(--board); color: var(--bg); padding: 24px; }
.cart_totals h2 { font-size: 34px; margin-bottom: 14px; }
.cart_totals table th, .cart_totals table td { border-color: var(--board2); }
.cart_totals .order-total td, .cart_totals .order-total th { font: 900 26px/1 var(--f-display); text-transform: uppercase; }
.cart_totals .kv-cur { color: var(--board-text); }
.cart_totals .woocommerce-shipping-destination, .cart_totals .shipping-calculator-button { font-size: 13px; color: var(--board-text); }
.cart_totals .shipping-calculator-button { color: var(--led); }
.cart_totals ul#shipping_method { list-style: none; }
.wc-proceed-to-checkout .checkout-button { width: 100%; min-height: 58px; font-size: 24px; margin-top: 14px; }
.shipping-calculator-form { margin-top: 10px; }
.shipping-calculator-form p { margin-bottom: 8px; }
@media (max-width: 760px) {
	table.shop_table_responsive thead { display: none; }
	table.shop_table_responsive tr { display: grid; grid-template-columns: 84px 1fr auto; gap: 4px 12px; padding: 14px 0; border-bottom: 1px solid var(--line); }
	table.shop_table_responsive td { display: block; border: 0; padding: 0; }
	table.shop_table_responsive td.product-thumbnail { grid-row: 1 / span 4; }
	table.shop_table_responsive td.product-remove { grid-column: 3; grid-row: 1; }
	table.shop_table_responsive td.product-name { grid-column: 2; grid-row: 1; }
	table.shop_table_responsive td.product-price, table.shop_table_responsive td.product-quantity, table.shop_table_responsive td.product-subtotal { grid-column: 2 / span 2; display: flex; justify-content: space-between; align-items: center; }
	table.shop_table_responsive td[data-title]::before { content: attr(data-title); font: 700 11px/1 var(--f-text); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
	table.shop_table_responsive td.actions { grid-column: 1 / -1; }
	.shop_table .actions .button[name="update_cart"] { float: none; width: 100%; }
	.cart_totals table.shop_table_responsive tr { grid-template-columns: minmax(0, 1fr); }
	.cart_totals table.shop_table_responsive th { padding: 0; border: 0; font: 700 11px/1 var(--f-text); letter-spacing: .12em; text-transform: uppercase; color: var(--board-text); }
}

/* Checkout */
.kv-collect { margin: 0 0 24px; padding: 14px 18px; background: var(--surface); border-left: 6px solid var(--blue); font-size: 14px; color: var(--ink2); }
.kv-collect a { color: var(--blue); font-weight: 700; }
form.checkout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); grid-template-rows: auto 1fr; gap: 0 clamp(24px, 4vw, 56px); align-items: start; }
form.checkout > .woocommerce-NoticeGroup { grid-column: 1 / -1; }
#customer_details { grid-column: 1; grid-row: 1 / span 3; }
#customer_details.col2-set { display: block; }
#customer_details .col-2 { margin-top: 28px; }
#order_review_heading { grid-column: 2; grid-row: 1; align-self: start; margin: 0; padding: 22px 24px 0; background: var(--board); color: var(--bg); font-size: 34px; }
#order_review { grid-column: 2; grid-row: 2; background: var(--board); color: var(--bg); padding: 10px 24px 24px; position: sticky; top: calc(var(--head) + 20px); }
#order_review .shop_table th, #order_review .shop_table td { border-color: var(--board2); }
#order_review .order-total th, #order_review .order-total td { font: 900 24px/1 var(--f-display); text-transform: uppercase; }
#order_review .kv-cur { color: var(--board-text); }
#order_review .product-name { font-weight: 600; }
.woocommerce-billing-fields h3, .woocommerce-shipping-fields h3, .woocommerce-additional-fields h3 { font-size: 30px; margin: 0 0 16px; }
#ship-to-different-address { font: 800 19px/1.2 var(--f-display) !important; text-transform: uppercase; }
#ship-to-different-address label { display: flex; align-items: center; gap: 10px; }
.woocommerce form .form-row { margin: 0 0 16px; }
.woocommerce form .form-row-first, .woocommerce form .form-row-last { width: calc(50% - 8px); float: left; }
.woocommerce form .form-row-last { float: right; }
.woocommerce form .form-row-wide, .woocommerce form .form-row:not(.form-row-first):not(.form-row-last) { clear: both; }
.woocommerce-billing-fields__field-wrapper::after, .woocommerce-shipping-fields__field-wrapper::after { content: ""; display: table; clear: both; }
.woocommerce form .form-row .required { color: var(--red); text-decoration: none; }
.woocommerce-invalid input.input-text, .woocommerce-invalid select { border-color: var(--err); }
.select2-container .select2-selection--single { height: 50px !important; border: 2px solid var(--ink) !important; border-radius: 0 !important; background: var(--surface) !important; }
.select2-container .select2-selection--single .select2-selection__rendered { line-height: 46px !important; padding-left: 14px !important; }
.select2-container .select2-selection--single .select2-selection__arrow { height: 46px !important; }
.select2-dropdown { border: 2px solid var(--ink) !important; border-radius: 0 !important; }
#payment { margin-top: 18px; }
#payment ul.payment_methods { list-style: none; padding: 0; margin: 0 0 16px; }
#payment ul.payment_methods li { padding: 12px 0; border-bottom: 1px solid var(--board2); }
#payment .payment_box { padding: 12px 14px; margin-top: 10px; background: var(--board2); font-size: 14px; color: var(--board-text); }
#payment .woocommerce-notice, #payment .woocommerce-info { background: var(--board2); }
.woocommerce-terms-and-conditions-wrapper { font-size: 14px; color: var(--board-text); }
.woocommerce-terms-and-conditions-wrapper a { color: var(--led); }
.woocommerce-privacy-policy-text p { font-size: 13px; color: var(--board-text); }
.woocommerce-privacy-policy-text a { color: var(--led); }
.woocommerce-form__label-for-checkbox { display: flex !important; gap: 10px; align-items: flex-start; text-transform: none !important; letter-spacing: 0 !important; font: 500 14px/1.45 var(--f-text) !important; color: inherit !important; }
.woocommerce-form__label-for-checkbox input { margin-top: 3px; width: 18px; height: 18px; accent-color: var(--red); flex: none; }
.kv-duties { font-size: 13px; color: var(--board-text); margin: 10px 0 14px; }
.kv-duties a { color: var(--led); }
#place_order { width: 100%; min-height: 60px; font-size: 25px; }
.woocommerce-checkout-review-order-table .product-total { text-align: right; }
@media (max-width: 900px) {
	form.checkout { grid-template-columns: minmax(0, 1fr); }
	#order_review_heading, #order_review, #customer_details { grid-column: 1; grid-row: auto; }
	#order_review { position: static; margin-bottom: 20px; }
}
@media (max-width: 520px) { .woocommerce form .form-row-first, .woocommerce form .form-row-last { width: 100%; float: none; } }

/* Order received */
.woocommerce-order { max-width: 900px; }
.woocommerce-thankyou-order-received { font: 900 clamp(34px, 4vw, 56px)/1 var(--f-display); text-transform: uppercase; }
.woocommerce-order-overview { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 2px; margin: 20px 0; }
.woocommerce-order-overview li { background: var(--board); color: var(--board-text); padding: 14px; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; }
.woocommerce-order-overview strong { display: block; color: var(--bg); font: 800 20px/1.1 var(--f-display); margin-top: 6px; letter-spacing: .02em; }
.woocommerce-customer-details address { font-style: normal; padding: 16px; border: 2px solid var(--ink); }

/* Account */
.woocommerce-account .page__body { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 40px; }
.woocommerce-account:not(.logged-in) .page__body { display: block; }
.woocommerce-MyAccount-navigation ul { list-style: none; border-top: 2px solid var(--ink); }
.woocommerce-MyAccount-navigation a { display: block; padding: 12px 0; border-bottom: 1px solid var(--line); font: 800 20px/1 var(--f-display); text-transform: uppercase; text-decoration: none; }
.woocommerce-MyAccount-navigation .is-active a { color: var(--red); }
.u-columns, .woocommerce-account .col2-set { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; }
.woocommerce-form-login, .woocommerce-form-register { padding: 24px; border: 2px solid var(--ink); background: var(--surface); }
.woocommerce-form-login h2, .u-column1 h2, .u-column2 h2 { font-size: 34px; margin-bottom: 12px; }
.woocommerce-LostPassword { font-size: 14px; }
.woocommerce-orders-table .button { min-height: 36px; padding: 6px 12px; font-size: 15px; margin: 2px 4px 2px 0; }
@media (max-width: 800px) {
	.woocommerce-account .page__body, .u-columns, .woocommerce-account .col2-set { grid-template-columns: minmax(0, 1fr); }
}
/* ==========================================================================
   Scoreboard footer
   ========================================================================== */

.foot { background: var(--board); color: var(--bg); border-top: 6px solid #000; }
.foot__board { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr) minmax(0, 1fr); max-width: 1680px; margin: 0 auto; }
.foot__side { padding: clamp(28px, 3vw, 44px) var(--gut); position: relative; }
.foot__side--red { background: linear-gradient(180deg, var(--red) 0 10px, transparent 10px); }
.foot__side--blue { background: linear-gradient(180deg, var(--blue) 0 10px, transparent 10px); text-align: right; }
.foot__tag { font-size: clamp(36px, 3.6vw, 56px); line-height: .9; margin-bottom: 18px; }
.foot__side--red .foot__tag { color: var(--red-hi); }
.foot__side--blue .foot__tag { color: #6d88ff; }
.foot__score { list-style: none; display: grid; gap: 2px; }
.foot__score a { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 14px; background: var(--board2); text-decoration: none; font: 800 21px/1 var(--f-display); text-transform: uppercase; letter-spacing: .04em; }
.foot__side--blue .foot__score a { flex-direction: row-reverse; }
.foot__score .led { color: var(--led); font-size: 22px; }
.foot__score a:hover { background: #2a2a30; }
.foot__mid { padding: clamp(28px, 3vw, 44px) clamp(16px, 2vw, 32px); border-left: 1px solid var(--board2); border-right: 1px solid var(--board2); display: flex; flex-direction: column; align-items: center; text-align: center; background: radial-gradient(ellipse at 50% 0, #222228, var(--board) 70%); }
.foot__logo { color: var(--bg); }
.foot__logo svg { width: clamp(200px, 22vw, 320px); }
.foot__line { margin: 16px 0 22px; max-width: 34ch; color: var(--board-text); }
.foot__contact { list-style: none; width: 100%; max-width: 420px; display: grid; gap: 2px; }
.foot__contact li { display: flex; justify-content: space-between; gap: 12px; padding: 10px 14px; background: #000; font-size: 15px; text-align: right; }
.foot__k { font: 700 11px/1.8 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--led); text-align: left; }
.foot__contact a { text-decoration: none; word-break: break-all; }
.foot__contact a:hover { text-decoration: underline; }
.foot__stats { display: flex; flex-wrap: wrap; border-top: 1px solid var(--board2); border-bottom: 1px solid var(--board2); max-width: 1680px; margin: 0 auto; }
.foot__stats a { flex: 1 1 auto; padding: 16px 18px; text-align: center; text-decoration: none; font: 800 18px/1 var(--f-display); text-transform: uppercase; letter-spacing: .06em; border-right: 1px solid var(--board2); }
.foot__stats a:hover { background: var(--board2); }
.foot__stats .foot__withdraw { background: var(--bg); color: var(--ink); border-right: 0; }
.foot__stats .foot__withdraw:hover { background: var(--led); }
.foot__legal { max-width: 1680px; margin: 0 auto; padding: 22px var(--gut) 30px; display: grid; grid-template-columns: 1fr auto; gap: 10px 30px; font-size: 13px; color: var(--board-text); }
.foot__legal nav { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.foot__legal nav a { color: var(--bg); text-decoration: none; }
.foot__legal nav a:hover { text-decoration: underline; }
.foot__pay, .foot__op { grid-column: 1; margin: 0; }
.foot__locale { grid-column: 2; grid-row: 1 / span 3; align-self: start; display: inline-flex; gap: 10px; align-items: center; padding: 12px 16px; border: 1px solid #3a3a42; background: transparent; color: var(--bg); cursor: pointer; font-size: 13px; }
.foot__locale .led { color: var(--led); font-size: 16px; }
.foot__locale:hover { background: var(--board2); }
@media (max-width: 960px) {
	.foot__board { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
	.foot__mid { grid-column: 1 / -1; grid-row: 1; border: 0; border-bottom: 1px solid var(--board2); }
	.foot__legal { grid-template-columns: minmax(0, 1fr); }
	.foot__locale { grid-column: 1; grid-row: auto; justify-self: start; }
}
@media (max-width: 560px) {
	.foot__board { grid-template-columns: minmax(0, 1fr); }
	.foot__side--blue { text-align: left; }
	.foot__side--blue .foot__score a { flex-direction: row; }
	.foot__stats a { flex: 1 1 45%; border-bottom: 1px solid var(--board2); }
	.foot__stats .foot__withdraw { flex-basis: 100%; }
}
