/* Red Elephant Imports, design tokens taken from the Lovable build */
:root {
	--ink: #161616;
	--red: #c80111;
	--red-dark: #a3000d;
	--paper: #f5f4f0;
	--line: #e0ddd8;
	--card: #ffffff;
	--muted: #636363;
	--font-display: "Big Shoulders Display", "Arial Narrow", sans-serif;
	--font-sans: "Inter", system-ui, sans-serif;
	--font-mono: "IBM Plex Mono", ui-monospace, monospace;
	--wrap: 80rem;
	--gutter: clamp(16px, 3vw, 32px);
	--header-h: 72px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--paper);
	color: var(--ink);
	font-family: var(--font-sans);
	font-size: 16px;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
.screen-reader-text, .skip-link:not(:focus) { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip-link:focus { position: fixed; top: 8px; left: 8px; z-index: 100; background: var(--ink); color: #fff; padding: 8px 12px; }
:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; }

.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gutter); }

/* ---------- Type ---------- */
.display {
	font-family: var(--font-display);
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: -0.01em;
	line-height: 0.95;
	margin: 0;
}
.display--hero { font-size: clamp(3rem, 8vw, 6.5rem); font-weight: 900; }
.display--xl { font-size: clamp(3rem, 6vw, 5rem); font-weight: 900; }
.display--lg { font-size: clamp(2.25rem, 4vw, 3.5rem); }
.red { color: var(--red); }
.eyebrow {
	font-family: var(--font-mono);
	font-size: 0.75rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--muted);
	margin: 0 0 0.75rem;
}
.eyebrow--red, .tagline { color: var(--red); }
.tagline {
	font-family: var(--font-mono);
	font-size: 0.875rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	margin: 0.75rem 0 1rem;
}
.lead { font-size: 1.0625rem; color: #4a4a4a; max-width: 36rem; margin: 0 0 1.5rem; }
.mono, .mono-figure { font-family: var(--font-mono); }
.mono-figure { font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
.small { font-size: 0.8125rem; }
.spec { font-family: var(--font-mono); font-size: 0.8125rem; color: var(--muted); margin: 0.5rem 0 0; }
.stock-line { font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); margin: 1rem 0 0; }
.draft-note { font-family: var(--font-mono); font-size: 0.75rem; color: var(--muted); border-left: 3px solid var(--red); padding-left: 0.75rem; margin-top: 2rem; }

/* ---------- Buttons and chips ---------- */
.btn, .button, button.button, a.button, input.button, #place_order, .wc-block-components-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-height: 44px;
	padding: 0.625rem 1.25rem;
	border: 1px solid transparent;
	border-radius: 0;
	font-family: var(--font-sans);
	font-weight: 600;
	font-size: 0.9375rem;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .15s, color .15s, border-color .15s;
}
.btn--red, .button, button.button, a.button, input.button, #place_order, .single_add_to_cart_button, .wc-block-components-button {
	background: var(--red);
	color: #fff;
}
.btn--red:hover, .button:hover, #place_order:hover, .single_add_to_cart_button:hover { background: var(--red-dark); color: #fff; }
/* Beat WooCommerce's own button colours */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit,
.woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt,
.woocommerce ul.products li.product .button, .woocommerce div.product form.cart .button {
	background: var(--red); color: #fff; border-radius: 0; font-weight: 600; font-family: var(--font-sans);
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce ul.products li.product .button:hover {
	background: var(--red-dark); color: #fff;
}
.woocommerce button.button:disabled, .woocommerce button.button.disabled { background: var(--red); opacity: .5; }
.woocommerce ul.products li.product .button { margin: 0; }
.btn--light { background: #fff; color: var(--ink); border-color: var(--line); }
.btn--light:hover { border-color: var(--ink); }
.btn--outline { background: transparent; color: var(--ink); border-color: var(--line); }
.btn--outline:hover { border-color: var(--ink); background: #fff; }
.btn--dark { background: var(--ink); color: #fff; }
.btn-row { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.button.added::after { content: " ✓"; }
a.added_to_cart { display: none; }

.stamp {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	background: var(--red);
	color: #fff;
	font-family: var(--font-mono);
	font-size: 0.75rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	padding: 0.5rem 0.75rem;
}
.stamp--dark { background: rgba(22,22,22,.85); }
.stamp-row { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1.75rem; }

.chip {
	display: inline-block;
	padding: 0.5rem 0.9rem;
	border: 1px solid var(--line);
	background: #fff;
	font-family: var(--font-mono);
	font-size: 0.75rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
}
.chip:hover { border-color: var(--ink); }
.chip.is-active { background: var(--ink); border-color: var(--ink); color: #fff; }
.filter-bar { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 1.5rem 0 2rem; }

/* ---------- Header ---------- */
.topbar { background: var(--ink); color: #fff; font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase; }
.topbar__inner { display: flex; justify-content: space-between; gap: 1rem; padding-block: 0.5rem; }
@media (max-width: 760px) { .topbar__hide-sm { display: none; } .topbar__inner { justify-content: center; } }
.site-header { position: sticky; top: 0; z-index: 50; background: #fff; border-bottom: 1px solid var(--line); transition: box-shadow .2s; }
.site-header.is-scrolled { box-shadow: 0 2px 14px rgba(0,0,0,.07); }
.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-header { top: 46px; } }
.header-inner { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: clamp(1rem, 3vw, 2.5rem); min-height: 76px; }
.brand { display: flex; align-items: center; gap: 0.625rem; text-decoration: none; }
.brand-logo { width: 44px; height: 44px; object-fit: contain; }
.brand-name { display: flex; flex-direction: column; font-family: var(--font-display); font-weight: 900; font-size: 1.5rem; line-height: 0.88; text-transform: uppercase; }
.header-search { display: flex; align-items: center; gap: 0.5rem; height: 48px; padding: 0 0 0 1rem; border: 2px solid var(--ink); background: #fff; max-width: 680px; width: 100%; justify-self: center; }
.header-search:focus-within { border-color: var(--red); }
.header-search svg { flex: none; color: var(--muted); }
.header-search input[type=search] { flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: transparent; font-size: 0.9375rem; }
.header-search__btn { height: 100%; padding: 0 1.25rem; border: 0; background: var(--ink); color: #fff; font-weight: 600; cursor: pointer; }
.header-search__btn:hover { background: var(--red); }
.header-actions { display: flex; align-items: center; gap: 0.5rem; }
.icon-btn { position: relative; display: inline-grid; place-items: center; width: 44px; height: 44px; background: none; border: 0; cursor: pointer; text-decoration: none; }
.icon-btn:hover { color: var(--red); }
.cart-link { position: relative; display: inline-flex; align-items: center; gap: 0.5rem; height: 48px; padding: 0 1rem; background: var(--red); color: #fff; text-decoration: none; font-weight: 600; }
.cart-link:hover { background: var(--red-dark); color: #fff; }
.cart-count { min-width: 22px; height: 22px; padding: 0 6px; background: #fff; color: var(--red); font-family: var(--font-mono); font-size: 0.75rem; line-height: 22px; text-align: center; font-weight: 600; }
.cart-count.is-empty { display: inline-block; opacity: .85; }
.nav-toggle { display: none; }

.primary-nav { border-top: 1px solid var(--line); background: #fff; }
.primary-nav .menu { display: flex; gap: 0; list-style: none; margin: 0; padding: 0; }
.primary-nav .menu > li { position: relative; }
.primary-nav a { display: block; padding: 0.95rem 1.1rem; font-family: var(--font-display); font-weight: 800; font-size: 1.0625rem; letter-spacing: 0.02em; text-transform: uppercase; text-decoration: none; }
.primary-nav .menu > li:first-child > a { padding-left: 0; }
.primary-nav a:hover, .primary-nav .current-menu-item > a { color: var(--red); }
.primary-nav .is-hot > a { color: var(--red); }
.primary-nav .is-sale { margin-left: auto; }
.primary-nav .is-sale > a { color: #fff; background: var(--red); padding-inline: 1.1rem; }
.primary-nav .is-sale > a:hover { background: var(--red-dark); color: #fff; }
.primary-nav .menu-item-has-children > a::after { content: ""; display: inline-block; width: 6px; height: 6px; margin-left: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-3px) rotate(45deg); }
.primary-nav .sub-menu { list-style: none; margin: 0; padding: 0.5rem 0; position: absolute; top: 100%; left: 0; min-width: 240px; background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--red); box-shadow: 0 14px 30px rgba(0,0,0,.08); opacity: 0; visibility: hidden; transform: translateY(6px); transition: .15s; z-index: 5; }
.primary-nav .sub-menu a { font-family: var(--font-sans); font-weight: 500; font-size: 0.9375rem; text-transform: none; letter-spacing: 0; padding: 0.625rem 1.1rem; }
.primary-nav li:hover > .sub-menu, .primary-nav li:focus-within > .sub-menu, .primary-nav li.is-open > .sub-menu { opacity: 1; visibility: visible; transform: none; }

@media (max-width: 1080px) {
	.header-inner { grid-template-columns: auto 1fr auto; min-height: 64px; gap: 0.5rem; }
	.nav-toggle { display: inline-grid; }
	.brand { justify-self: start; }
	.header-search { grid-column: 1 / -1; grid-row: 2; max-width: none; margin-bottom: 0.75rem; }
	.cart-link__label { display: none; }
	.cart-link { padding: 0 0.75rem; }
	.primary-nav { display: none; position: absolute; left: 0; right: 0; top: 100%; border-bottom: 1px solid var(--line); max-height: calc(100vh - 140px); overflow: auto; }
	.nav-open .primary-nav { display: block; }
	.primary-nav .menu { flex-direction: column; }
	.primary-nav .menu > li:first-child > a { padding-left: 0; }
	.primary-nav a { padding: 0.9rem 0; border-bottom: 1px solid var(--line); font-size: 1.25rem; }
	.primary-nav .is-sale { margin-left: 0; }
	.primary-nav .is-sale > a { padding-inline: 0.75rem; margin-top: 0.75rem; display: inline-block; }
	.primary-nav .sub-menu { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: 0; display: none; padding: 0 0 0 1rem; }
	.primary-nav li.is-open > .sub-menu { display: block; }
	.primary-nav .sub-menu a { padding: 0.7rem 0; }
}

/* ---------- Hero ---------- */
.hero { padding: clamp(2.5rem, 6vw, 5rem) 0; background: var(--paper); border-bottom: 1px solid var(--line); overflow: hidden; }
.hero__inner { display: grid; grid-template-columns: 6fr 5fr; gap: clamp(1.5rem, 4vw, 4rem); align-items: center; }
.hero__text { min-width: 0; }
.hero .lead { color: #3d3d3d; margin-top: 1.5rem; }
.hero .tagline + .lead { margin-top: 0; }
.hero__media { background: #fff; border: 1px solid var(--line); aspect-ratio: 7 / 5; display: grid; place-items: center; overflow: hidden; }
.hero__media img { width: 100%; height: 100%; object-fit: contain; }
.hero--brand .display--hero { font-size: clamp(3rem, 7vw, 5.5rem); }
@media (max-width: 860px) {
	.hero__inner { grid-template-columns: 1fr; }
	.hero__media { order: -1; aspect-ratio: 16 / 10; }
}

/* ---------- Brand blocks ---------- */
.brand-block { padding: clamp(4rem, 8vw, 7rem) 0; border-top: 1px solid var(--line); }
.brand-block:first-of-type { border-top: 0; }
.brand-block__head { display: grid; grid-template-columns: 5fr 7fr; gap: clamp(2rem, 5vw, 4rem); align-items: stretch; margin-bottom: 2.5rem; }
.range-image { position: relative; display: grid; place-items: center; min-height: 320px; background: #fff; border: 1px solid var(--line); overflow: hidden; }
.range-image img { width: 100%; height: 100%; max-height: 440px; object-fit: contain; transition: transform .4s; }
.range-image:hover img { transform: scale(1.02); }
.range-image .stamp { position: absolute; top: 12px; right: 12px; }
@media (max-width: 860px) {
	.brand-block__head { grid-template-columns: 1fr; }
	.range-image { min-height: 220px; }
}

/* ---------- Accessory tiles on brand pages ---------- */
.acc-tiles { padding: clamp(3rem, 6vw, 5rem) 0; background: #fff; border-top: 1px solid var(--line); }
.acc-tiles__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 2rem; }
.acc-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
.acc-grid > li { border: 1px solid var(--line); }
.acc-tile { display: flex; flex-direction: column; height: 100%; background: #fff; padding: 1rem; text-decoration: none; transition: background .15s; }
.acc-tile:hover { background: var(--paper); }
.acc-tile__img { display: grid; place-items: center; aspect-ratio: 1; margin-bottom: 1rem; }
.acc-tile__img img { width: 100%; height: 100%; object-fit: contain; }
.acc-tile__name { font-size: 1.5rem; }
.acc-tile__meta { font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--red); margin-top: 0.5rem; }
.chip--link { border-color: var(--red); color: var(--red); }
.chip--link:hover { background: var(--red); color: #fff; border-color: var(--red); }

/* ---------- Product grid and cards ---------- */
ul.products { list-style: none; margin: 0; padding: 0 1px 1px 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; }
ul.products > li { border: 1px solid var(--line); margin: 0 -1px -1px 0 !important; }
ul.products::before, ul.products::after { display: none !important; }
.woocommerce ul.products li.product, ul.products li.card { width: auto !important; margin: 0 !important; float: none !important; }
@media (max-width: 1100px) { ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 820px) { ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { ul.products { grid-template-columns: 1fr; } }

.card { background: var(--card); display: flex; flex-direction: column; }
.card__media { position: relative; display: block; aspect-ratio: 1; background: #fff; overflow: hidden; border-bottom: 1px solid var(--line); }
.card__media img { width: 100%; height: 100%; object-fit: contain; transition: transform .4s; }
.card:hover .card__media img { transform: scale(1.03); }
/* Keeps tall photos (paddles, rackets) whole inside the square card. */
.woocommerce ul.products li.product a.card__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; margin: 0; }
.card__placeholder { position: absolute; inset: 0; display: flex; align-items: flex-end; padding: 10px; background: linear-gradient(160deg, #f0efec, #d3d2ce); }
.card__badge { position: absolute; top: 10px; left: 10px; }
.card__body { padding: 1.25rem 1rem 1.25rem; display: flex; flex-direction: column; flex: 1; }
.card__body .eyebrow { margin-bottom: 0.25rem; }
.card__title { font-size: 1.375rem; }
.card__title a { text-decoration: none; }
.card__title a:hover { color: var(--red); }
.card__buy { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem; margin-top: auto; padding-top: 1.25rem; }
.card__from { font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); margin-right: 0.15rem; }
.card__price { font-size: 1.1875rem; white-space: nowrap; }
.card__price del { color: var(--muted); font-size: 0.875rem; }
.card__price ins { text-decoration: none; color: var(--red); }
.card__buy .button { padding: 0.5rem 0.9rem; font-size: 0.875rem; min-height: 40px; }

/* ---------- USP strip ---------- */
.usp { padding: clamp(3rem, 6vw, 5rem) 0; border-top: 1px solid var(--line); }
.usp-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.usp-item { border-top: 2px solid var(--red); padding-top: 1.5rem; }
.usp-item h3 { font-size: 1.75rem; }
.usp-item p { color: #4a4a4a; margin: 0.75rem 0 0; }
@media (max-width: 760px) { .usp-grid { grid-template-columns: 1fr; } }

/* ---------- Scoreboard ---------- */
.scoreboard { padding: clamp(3rem, 6vw, 5rem) 0; background: var(--ink); color: #fff; }
.scoreboard .eyebrow { color: rgba(255,255,255,.6); }
.scoreboard .lead { color: rgba(255,255,255,.75); margin-top: 1rem; }
.scoreboard__rows { border-top: 1px solid rgba(255,255,255,.15); }
.scoreboard__row { display: grid; grid-template-columns: 1fr 1fr auto; align-items: center; gap: 1rem; padding: 1.25rem 0; border-bottom: 1px solid rgba(255,255,255,.15); }
.scoreboard__row .display { font-size: 2rem; }
.scoreboard__row .eyebrow { margin: 0; }
.scoreboard__row .mono-figure { font-size: 1.5rem; }
.scoreboard__row.is-ours .display, .scoreboard__row.is-ours .mono-figure { color: #ff4a57; }
.scoreboard .draft-note { color: rgba(255,255,255,.6); }
@media (max-width: 600px) { .scoreboard__row { grid-template-columns: 1fr auto; } .scoreboard__row .eyebrow { grid-column: 1 / -1; order: 3; } }

/* ---------- Shop section ---------- */
.shop-section { padding: clamp(3rem, 6vw, 5rem) 0; }
.wc-wrap { padding-top: 2.5rem; padding-bottom: 5rem; }
.page-title { margin: 0 0 2rem; }
.woocommerce-pagination ul { display: flex; gap: 0.25rem; list-style: none; padding: 0; margin: 2rem 0 0; }
.woocommerce-pagination a, .woocommerce-pagination span { display: grid; place-items: center; min-width: 44px; height: 44px; border: 1px solid var(--line); background: #fff; text-decoration: none; font-family: var(--font-mono); }
.woocommerce-pagination .current { background: var(--ink); color: #fff; }
.woocommerce-result-count, .woocommerce-ordering { font-family: var(--font-mono); font-size: 0.8125rem; color: var(--muted); margin-bottom: 1.5rem; }
.woocommerce-ordering select { padding: 0.5rem; border: 1px solid var(--line); background: #fff; }

/* ---------- Single product ---------- */
.crumbs { font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); display: flex; gap: 0.5rem; margin-bottom: 2rem; }
.crumbs a { text-decoration: none; }
.crumbs a:hover { color: var(--red); }
.single-product div.product { display: grid; grid-template-columns: 7fr 5fr; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.single-product div.product .woocommerce-product-gallery { width: auto !important; float: none !important; margin: 0; position: relative; background: #ecebe8; }
.single-product div.product .summary { width: auto !important; float: none !important; margin: 0; position: sticky; top: calc(var(--header-h) + 24px); }
.single-product .product_title { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: clamp(2.25rem, 4vw, 3.25rem); line-height: 0.95; margin: 0; }
.woocommerce div.product p.price, .woocommerce div.product span.price, .single-product .summary .price { font-family: var(--font-mono); font-size: 1.75rem; margin: 1.5rem 0 0; color: var(--ink); }
.woocommerce div.product .woocommerce-variation-price .price { font-size: 1.25rem; margin: 0 0 1rem; }
.woocommerce ul.products li.product .price { color: var(--ink); font-size: 1.1875rem; margin: 0; }
.single-product .summary .stock-line { margin-top: 0.5rem; }
.product-desc { color: #3d3d3d; margin: 1.5rem 0; }
.single-product form.cart { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: stretch; margin: 1.5rem 0; }
.single-product form.cart .quantity input { width: 72px; height: 48px; text-align: center; border: 1px solid var(--line); background: #fff; font-family: var(--font-mono); }
.single-product form.cart .single_add_to_cart_button { min-height: 48px; flex: 1; }
.single-product form.variations_form { display: block; }
.variations { width: 100%; border-collapse: collapse; margin-bottom: 1rem; }
.variations th { text-align: left; font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); padding: 0 0 0.5rem; display: block; }
.variations td { display: block; padding: 0 0 1rem; }
.variations select { width: 100%; min-height: 48px; padding: 0 0.75rem; border: 1px solid var(--line); background: #fff; }
.reset_variations { font-family: var(--font-mono); font-size: 0.75rem; }
.woocommerce-variation-add-to-cart { display: flex; gap: 0.75rem; }
.facts { margin: 2rem 0 0; border-top: 1px solid var(--line); }
.facts div { display: flex; justify-content: space-between; gap: 1rem; padding: 0.875rem 0; border-bottom: 1px solid var(--line); }
.facts dt { font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); }
.facts dd { margin: 0; text-align: right; }
.related.products { grid-column: 1 / -1; margin-top: 4rem; }
.related.products > h2 { font-family: var(--font-display); font-weight: 800; text-transform: uppercase; font-size: clamp(2rem, 4vw, 3rem); margin: 0 0 1.5rem; }
.woocommerce-product-gallery__trigger { position: absolute; top: 12px; right: 12px; z-index: 2; }
@media (max-width: 860px) {
	.single-product div.product { grid-template-columns: 1fr; }
	.single-product div.product .summary { position: static; }
}

/* ---------- Prose pages ---------- */
.prose-wrap { padding-top: 3.5rem; padding-bottom: 5rem; }
.prose { max-width: 46rem; }
.prose h2 { font-family: var(--font-display); font-weight: 800; text-transform: uppercase; font-size: 1.75rem; margin: 2.5rem 0 0.75rem; }
.prose p, .prose li { color: #333; }
.list-item { border-bottom: 1px solid var(--line); padding: 1.5rem 0; }

/* ---------- WooCommerce forms, notices, cart, checkout ---------- */
.woocommerce-message, .woocommerce-info, .woocommerce-error, .wc-block-components-notice-banner {
	list-style: none; margin: 0 0 1.5rem; padding: 1rem 1.25rem;
	background: #fff; border: 1px solid var(--line); border-left: 3px solid var(--ink);
	display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: space-between;
}
.woocommerce-error { border-left-color: var(--red); }
.woocommerce-message .button { order: 2; }
.woocommerce form .form-row { margin: 0 0 1rem; }
.woocommerce form .form-row label { display: block; font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); margin-bottom: 0.375rem; }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .woocommerce form .form-row select, .select2-container .select2-selection--single {
	width: 100%; min-height: 48px; padding: 0.625rem 0.875rem; border: 1px solid var(--line); border-radius: 0; background: #fff;
}
.select2-container .select2-selection--single .select2-selection__rendered { line-height: 26px; padding: 0; }
.select2-container .select2-selection--single .select2-selection__arrow { height: 46px; }
.woocommerce form .form-row.re-optin label { text-transform: none; letter-spacing: 0; font-family: var(--font-sans); font-size: 0.875rem; color: var(--ink); display: flex; gap: 0.5rem; align-items: flex-start; }
table.shop_table { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--line); margin-bottom: 2rem; }
table.shop_table th, table.shop_table td { padding: 1rem; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; }
table.shop_table th { font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); font-weight: 500; }
table.shop_table img { width: 72px; }
table.shop_table .product-remove a { font-size: 1.5rem; text-decoration: none; color: var(--red); }
.cart-collaterals .cart_totals { max-width: 28rem; margin-left: auto; }
.cart_totals h2, #order_review_heading, .woocommerce-billing-fields h3, .woocommerce-shipping-fields h3, .woocommerce-additional-fields h3 { font-family: var(--font-display); font-weight: 800; text-transform: uppercase; font-size: 1.75rem; margin: 0 0 1rem; }
.wc-proceed-to-checkout .checkout-button { width: 100%; min-height: 52px; font-size: 1rem; }
.coupon { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.coupon input { min-height: 44px; padding: 0 0.75rem; border: 1px solid var(--line); }
.woocommerce-checkout .col2-set { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.woocommerce-checkout .col2-set .col-1, .woocommerce-checkout .col2-set .col-2 { width: auto; float: none; }
#payment { background: #fff; border: 1px solid var(--line); padding: 1.25rem; }
#payment ul.payment_methods { list-style: none; padding: 0; margin: 0 0 1rem; }
#payment ul.payment_methods li { padding: 0.75rem 0; border-bottom: 1px solid var(--line); }
#payment .payment_box { font-size: 0.875rem; color: var(--muted); padding: 0.5rem 0 0 1.5rem; }
#place_order { width: 100%; min-height: 52px; font-size: 1rem; margin-top: 1rem; }
.woocommerce-account .woocommerce { display: grid; grid-template-columns: 240px 1fr; gap: 2.5rem; }
.woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--line); }
.woocommerce-MyAccount-navigation a { display: block; padding: 0.875rem 0; border-bottom: 1px solid var(--line); text-decoration: none; font-family: var(--font-mono); font-size: 0.8125rem; letter-spacing: 0.1em; text-transform: uppercase; }
.woocommerce-MyAccount-navigation .is-active a { color: var(--red); }
@media (max-width: 860px) {
	.woocommerce-checkout .col2-set, .woocommerce-account .woocommerce { grid-template-columns: 1fr; }
	table.shop_table_responsive thead { display: none; }
	table.shop_table_responsive tr td { display: flex; justify-content: space-between; }
	table.shop_table_responsive tr td::before { content: attr(data-title); font-family: var(--font-mono); font-size: 0.75rem; text-transform: uppercase; color: var(--muted); }
}

/* ---------- Footer ---------- */
.site-footer { background: var(--ink); color: #fff; padding: 4.5rem 0 2rem; margin-top: 0; }
.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.3fr; gap: 2.5rem; }
.site-footer .eyebrow { color: rgba(255,255,255,.55); }
.footer-logo { width: 56px; height: 56px; object-fit: contain; background: #fff; margin-bottom: 1.25rem; }
.footer-title { font-family: var(--font-display); font-weight: 800; text-transform: uppercase; font-size: 2.25rem; line-height: 0.95; margin: 0 0 1rem; }
.footer-brand .mono { color: rgba(255,255,255,.7); max-width: 16rem; }
.footer-links { list-style: none; margin: 0; padding: 0; }
.footer-links li { margin-bottom: 0.5rem; }
.footer-links a { text-decoration: none; }
.footer-links a:hover { color: #ff4a57; }
.footer-biz p { margin: 0 0 0.5rem; color: rgba(255,255,255,.7); word-break: break-word; }
.footer-biz a { text-decoration: none; }
.footer-base { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; margin-top: 3.5rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.12); }
.footer-base .eyebrow { margin: 0; }
@media (max-width: 900px) { .footer-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .footer-grid { grid-template-columns: 1fr; } }

/* WooCommerce overrides for notices and payment box */
.woocommerce-info::before, .woocommerce-message::before, .woocommerce-error::before { display: none; }
.woocommerce-info, .woocommerce-message, .woocommerce-error { padding-left: 1.25rem !important; border-top: 1px solid var(--line) !important; }
.woocommerce-checkout #payment { background: #fff; border-radius: 0; }
.woocommerce-checkout #payment div.payment_box { background: var(--paper); }
.woocommerce-checkout #payment div.payment_box::before { display: none; }
.woocommerce form .form-row.woocommerce-invalid input.input-text { border-color: var(--red); }
@media (max-width: 1240px) and (min-width: 1081px) { .primary-nav a { padding-inline: 0.8rem; font-size: 1rem; } }
@media (max-width: 1160px) and (min-width: 1081px) { .primary-nav a { padding-inline: 0.6rem; font-size: 0.9375rem; } }

/* Free delivery progress on cart and checkout */
.free-bar { background: #fff; border: 1px solid var(--line); padding: 1rem 1.25rem; margin: 0 0 1.5rem; }
.free-bar p { margin: 0 0 0.75rem; }
.free-bar__track { display: block; height: 6px; background: var(--line); }
.free-bar__track span { display: block; height: 100%; background: var(--red); transition: width .3s; }

/* Complete your kit (cart and checkout) */
.kit { background: #fff; border: 1px solid var(--line); padding: 1.25rem; margin: 0 0 2rem; }
.kit .eyebrow { margin-bottom: 0.25rem; }
.kit__title { font-size: 1.75rem; margin: 0 0 1rem; }
.kit__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 0.75rem; }
.kit__item { display: grid; grid-template-columns: 64px 1fr auto; gap: 0.75rem; align-items: center; padding: 0.5rem; border: 1px solid var(--line); background: var(--paper); }
.kit__img img { width: 64px; height: 64px; object-fit: contain; background: #fff; }
.kit__body { display: flex; flex-direction: column; gap: 0.25rem; min-width: 0; }
.kit__name { font-weight: 600; font-size: 0.875rem; line-height: 1.3; text-decoration: none; }
.kit__name:hover { color: var(--red); }
.kit__price { font-size: 0.875rem; }
.woocommerce .kit a.button.kit__add { min-height: 36px; padding: 0.375rem 0.875rem; font-size: 0.8125rem; }
.woocommerce .kit a.button.kit__add--choose { background: var(--ink); }
.woocommerce .kit a.button.kit__add.is-added { background: #2f7d32; }
.kit a.added_to_cart { display: none; }
.woocommerce-checkout .kit { grid-column: 1 / -1; }

/* WhatsApp chat button */
.wa-chat {
	position: fixed; right: 20px; bottom: calc(20px + env(safe-area-inset-bottom, 0px)); z-index: 60;
	display: inline-flex; align-items: center; gap: 0.5rem;
	height: 56px; padding: 0 18px 0 16px; border-radius: 28px;
	background: var(--red); color: #fff; text-decoration: none; font-weight: 600; font-size: 0.9375rem;
	box-shadow: 0 8px 24px rgba(200,1,17,.35); transition: background .15s, transform .15s;
}
.wa-chat:hover { background: var(--red-dark); color: #fff; transform: translateY(-2px); }
.wa-chat:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
@media (max-width: 600px) { .wa-chat { width: 56px; padding: 0; justify-content: center; } .wa-chat__label { display: none; } }
.admin-bar .wa-chat { bottom: calc(20px + env(safe-area-inset-bottom, 0px)); }

/* Footer social links */
.social-title { margin-top: 1.5rem; }
.social { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.social__link { display: inline-block; padding: 0.375rem 0.75rem; border: 1px solid rgba(255,255,255,.25); font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase; text-decoration: none; }
.social__link:hover { border-color: #ff4a57; color: #ff4a57; }
.social__link.is-placeholder { opacity: .55; border-style: dashed; }

/* =========================================================
   Homepage: padel court hero
   ========================================================= */
.court-hero {
	position: relative; isolation: isolate; overflow: hidden;
	min-height: max(560px, calc(100svh - 150px)); max-height: 980px;
	background: #07080a; color: #fff; display: flex; align-items: center;
}
.court-hero__scene { position: absolute; inset: 0; z-index: -2; }
.court-svg { width: 100%; height: 100%; display: block; }
.court-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(4,5,7,.82) 0%, rgba(4,5,7,.55) 34%, rgba(4,5,7,0) 62%); pointer-events: none; }
.court-hero__content { position: relative; width: 100%; padding-block: clamp(2.5rem, 7vh, 5rem); }
.court-hero__eyebrow { display: inline-flex; align-items: center; gap: 0.6rem; font-family: var(--font-mono); font-size: 0.8125rem; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(255,255,255,.8); margin: 0 0 1.25rem; }
.pulse { width: 8px; height: 8px; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 0 rgba(200,1,17,.7); animation: re-pulse 2.4s infinite; }
@keyframes re-pulse { 0% { box-shadow: 0 0 0 0 rgba(200,1,17,.6); } 70% { box-shadow: 0 0 0 12px rgba(200,1,17,0); } 100% { box-shadow: 0 0 0 0 rgba(200,1,17,0); } }
.court-hero__title { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; line-height: 0.86; letter-spacing: -0.01em; font-size: clamp(3.75rem, 11vw, 10rem); margin: 0; max-width: 9.5ch; text-wrap: balance; text-shadow: 0 4px 40px rgba(0,0,0,.35); }
.court-hero__title span { color: #ff2433; display: inline-block; font-size: 0.62em; line-height: 0.95; margin-top: 0.12em; }
.court-hero__lead { max-width: 30rem; margin: 1.5rem 0 2rem; font-size: clamp(1.0625rem, 1.4vw, 1.25rem); line-height: 1.5; color: rgba(255,255,255,.88); }
.court-hero__ctas { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.btn--xl { min-height: 56px; padding: 0 1.75rem; font-size: 1rem; font-family: var(--font-display); font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; font-size: 1.125rem; }
.btn--ghost { background: rgba(255,255,255,.08); color: #fff; border: 2px solid rgba(255,255,255,.85); backdrop-filter: blur(6px); }
.btn--ghost:hover { background: #fff; color: var(--ink); }
.court-hero__note { margin: 1.25rem 0 0; font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,.65); }
.court-hero__caption { position: absolute; right: var(--gutter); bottom: 14px; margin: 0; font-family: var(--font-mono); font-size: 0.6875rem; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(255,255,255,.55); }

/* Rackets stand on the court in the foreground */
.court-hero__rackets { position: absolute; z-index: -1; right: max(3vw, calc((100vw - 80rem) / 2)); bottom: 2%; height: 76%; width: min(44vw, 640px); pointer-events: none; }
.racket { position: absolute; bottom: 4%; height: 88%; width: auto; filter: drop-shadow(0 30px 28px rgba(0,0,0,.55)); will-change: transform; }
.racket--front { right: 34%; height: 90%; transform: rotate(-9deg); transform-origin: 50% 100%; animation: re-float 7s ease-in-out infinite; }
.racket--back { right: 2%; height: 80%; bottom: 10%; transform: rotate(11deg); transform-origin: 50% 100%; animation: re-float-b 8s ease-in-out infinite; filter: drop-shadow(0 24px 24px rgba(0,0,0,.5)) brightness(.96); }
.court-hero__shadow { position: absolute; left: 6%; right: 0; bottom: 3%; height: 9%; background: radial-gradient(closest-side, rgba(0,0,0,.55), rgba(0,0,0,0)); }
.court-hero__ball { position: absolute; bottom: 5%; right: 26%; width: clamp(34px, 3.4vw, 52px); aspect-ratio: 1; border-radius: 50%;
	background: radial-gradient(circle at 34% 30%, #f7ff9e 0 12%, #d8ef2a 38%, #a8c414 78%, #7f9510 100%);
	box-shadow: 0 10px 16px rgba(0,0,0,.45), inset -3px -4px 8px rgba(0,0,0,.18); }
.court-hero__ball::before { content: ""; position: absolute; inset: 14% -8% 14% 38%; border: 2px solid rgba(255,255,255,.75); border-color: rgba(255,255,255,.75) transparent rgba(255,255,255,.75) rgba(255,255,255,.75); border-radius: 50%; }
@keyframes re-float { 0%, 100% { transform: rotate(-9deg) translateY(0); } 50% { transform: rotate(-8deg) translateY(-10px); } }
@keyframes re-float-b { 0%, 100% { transform: rotate(11deg) translateY(0); } 50% { transform: rotate(10deg) translateY(-7px); } }
.court-sheen { animation: re-sheen 9s ease-in-out 1s infinite; }
@keyframes re-sheen { 0% { transform: skewX(-18deg) translateX(0); } 40%, 100% { transform: skewX(-18deg) translateX(2400px); } }
.court-hero__content > * { animation: re-rise .7s both; }
.court-hero__content > *:nth-child(2) { animation-delay: .08s; } .court-hero__content > *:nth-child(3) { animation-delay: .16s; } .court-hero__content > *:nth-child(4) { animation-delay: .24s; }
@keyframes re-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

@media (max-width: 860px) {
	.court-hero { flex-direction: column; align-items: stretch; min-height: calc(100svh - 150px); max-height: none; }
	.court-hero::after { background: linear-gradient(180deg, rgba(4,5,7,.78) 0%, rgba(4,5,7,.45) 45%, rgba(4,5,7,0) 70%); }
	.court-hero__content { padding-block: 2rem 0; }
	.court-hero__title { font-size: clamp(3.4rem, 17vw, 5.5rem); }
	.court-hero__lead { margin: 1rem 0 1.25rem; font-size: 1rem; }
	.court-hero__rackets { position: relative; order: 2; left: auto; right: auto; bottom: auto; z-index: 0; margin: 1.25rem auto 0; width: min(94vw, 460px); height: clamp(260px, 42vh, 380px); flex: none; }
	.court-hero__content { order: 1; }
	.racket--front { right: 38%; }
	.court-hero__note { display: none; }
	.court-hero__caption { left: 0; right: 0; text-align: center; }
	.btn--xl { flex: 1 1 auto; justify-content: center; min-height: 52px; font-size: 1rem; padding: 0 1rem; }
}
@media (prefers-reduced-motion: reduce) {
	.racket--front, .racket--back, .court-sheen, .pulse, .court-hero__content > * { animation: none !important; }
}

/* Section scaffolding */
.home-sec { padding-block: clamp(3.5rem, 8vw, 6.5rem); }
.sec-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 2rem; }
.sec-title { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: clamp(2.5rem, 6vw, 4.75rem); line-height: 0.9; margin: 0; }
.sec-link { font-family: var(--font-display); font-weight: 800; text-transform: uppercase; font-size: 1.125rem; letter-spacing: 0.03em; color: var(--red); text-decoration: none; }
.sec-link:hover { text-decoration: underline; }

/* Shop padel: category cards with a court surface */
.shop-padel { background: #fff; }
.cat-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.cat-card { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: 420px; overflow: hidden; text-decoration: none; color: #fff; background: #1d3a55; isolation: isolate; }
.cat-card__court { position: absolute; inset: 0; z-index: -2;
	background:
		linear-gradient(180deg, rgba(255,255,255,0) 58%, rgba(0,0,0,.72) 100%),
		linear-gradient(90deg, transparent calc(50% - 1px), rgba(255,255,255,.55) calc(50% - 1px) calc(50% + 1px), transparent calc(50% + 1px)) 0 0 / 100% 62% no-repeat,
		linear-gradient(0deg, transparent calc(38% - 1px), rgba(255,255,255,.55) calc(38% - 1px) calc(38% + 1px), transparent calc(38% + 1px)),
		radial-gradient(120% 90% at 50% 10%, #3a6286 0%, #23405c 55%, #142638 100%); }
.cat-card__img { position: absolute; inset: 7% 12% 40% 12%; z-index: -1; display: grid; place-items: center; }
.cat-card__img img { max-width: 100%; max-height: 100%; object-fit: contain; background: #fff; padding: 8%; box-shadow: 0 18px 30px rgba(0,0,0,.35); transition: transform .45s cubic-bezier(.2,.7,.2,1); }
.cat-card--cutout .cat-card__img { inset: 4% 16% 36% 16%; }
.cat-card--cutout .cat-card__img img { background: none; padding: 0; box-shadow: none; filter: drop-shadow(0 22px 22px rgba(0,0,0,.5)); transform: rotate(-8deg); }
.cat-card:hover .cat-card__img img { transform: translateY(-8px) scale(1.03); }
.cat-card--cutout:hover .cat-card__img img { transform: rotate(-4deg) translateY(-8px) scale(1.03); }
.cat-card__text { display: flex; flex-direction: column; gap: 0.25rem; padding: 1.25rem; }
.cat-card__name { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: 2rem; line-height: 0.95; }
.cat-card__sub { font-size: 0.875rem; color: rgba(255,255,255,.8); }
.cat-card__cta { margin-top: 0.75rem; align-self: flex-start; font-family: var(--font-display); font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em; background: var(--red); padding: 0.55rem 0.9rem; transition: background .15s, gap .15s; display: inline-flex; gap: 0.4rem; }
.cat-card:hover .cat-card__cta { background: #fff; color: var(--red); gap: 0.7rem; }
@media (max-width: 1080px) { .cat-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } .cat-card { min-height: 360px; } }
@media (max-width: 520px) { .cat-cards { grid-template-columns: 1fr 1fr; gap: 8px; } .cat-card { min-height: 270px; } .cat-card__img { inset: 6% 10% 46% 10%; } .cat-card--cutout .cat-card__img { inset: 4% 16% 42% 16%; } .cat-card__name { font-size: 1.375rem; } .cat-card__sub { display: none; } .cat-card__text { padding: 0.875rem; } .cat-card__cta { font-size: 0.875rem; padding: 0.4rem 0.6rem; } }

/* Shop by brand */
.brands { background: var(--paper); }
.brand-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 1080px) and (min-width: 761px) { .brand-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.brand-card { display: flex; flex-direction: column; align-items: flex-start; gap: 0.5rem; height: 100%; padding: 2rem; background: #fff; border: 1px solid var(--line); text-decoration: none; transition: border-color .15s, transform .2s; }
.brand-card:hover { border-color: var(--ink); transform: translateY(-3px); }
.brand-card__mark { display: flex; align-items: center; min-height: 72px; }
.brand-card__mark img { max-height: 64px; width: auto; }
.brand-card__word { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: clamp(2.25rem, 4vw, 3.25rem); line-height: 1; letter-spacing: 0.01em; }
.brand-card__line { color: var(--muted); }
.brand-card__cta { margin-top: auto; padding-top: 1rem; font-family: var(--font-display); font-weight: 800; text-transform: uppercase; color: var(--red); letter-spacing: 0.03em; }
@media (max-width: 760px) { .brand-cards { grid-template-columns: 1fr; } .brand-card { padding: 1.5rem; } }

/* Featured rackets */
.featured { background: #fff; }
.featured ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 820px) { .featured ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .featured ul.products { grid-template-columns: 1fr; } }

/* Why buy from us */
.why { background: var(--ink); color: #fff; }
.why .sec-title { margin-bottom: 2.5rem; }
.why-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem; }
.why-grid li { border-top: 3px solid var(--red); padding-top: 1.25rem; }
.why-grid h3 { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: 1.75rem; line-height: 0.95; margin: 0 0 0.75rem; }
.why-grid p { margin: 0; color: rgba(255,255,255,.75); }
@media (max-width: 960px) { .why-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .why-grid { grid-template-columns: 1fr; gap: 1.5rem; } }

/* Final call to action on a court surface */
.final-cta { position: relative; overflow: hidden; background: var(--red); color: #fff; padding-block: clamp(4rem, 10vw, 7rem); isolation: isolate; }
.final-cta__lines { position: absolute; inset: 0; z-index: -1; opacity: .22;
	background:
		linear-gradient(90deg, transparent calc(62% - 2px), #fff calc(62% - 2px) calc(62% + 2px), transparent calc(62% + 2px)),
		linear-gradient(0deg, transparent calc(50% - 2px), #fff calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)) 62% 0 / 38% 100% no-repeat; }
.final-cta__inner { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 2rem; }
.final-cta__title { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: clamp(3rem, 8vw, 6.5rem); line-height: 0.88; margin: 0; }
.final-cta__title span { color: var(--ink); }
.final-cta .btn--red { background: var(--ink); }
.final-cta .btn--red:hover { background: #000; }

/* Product cards: colour dots and hover */
.card__colours { display: flex; align-items: center; gap: 5px; margin-top: 0.75rem; }
.card__colours .dot { width: 14px; height: 14px; border-radius: 50%; border: 1px solid rgba(0,0,0,.18); }
.card__colours-n { margin-left: 4px; font-family: var(--font-mono); font-size: 0.6875rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.card { transition: box-shadow .2s; }
.card:hover { box-shadow: 0 10px 28px rgba(0,0,0,.08); z-index: 1; position: relative; }

/* Product page: available colours */
.single-product div.product .woocommerce-product-gallery { transition: opacity .25s; }
.single-product div.product .woocommerce-product-gallery.is-swapping img { opacity: .35; transition: opacity .22s; }
.single-product div.product .woocommerce-product-gallery img { transition: opacity .25s; }
.options-panel { grid-column: 1; margin-top: -1.5rem; }
.swatches { margin-top: 1.25rem; }
.swatches__title { margin-bottom: 0.625rem; color: var(--ink); font-weight: 500; }
.swatches__current { color: var(--muted); margin-left: 0.5rem; }
.swatches__row { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.swatch { position: relative; display: inline-grid; place-items: center; min-width: 44px; height: 44px; padding: 0; background: #fff; border: 1px solid var(--line); cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.swatch:hover { border-color: var(--ink); }
.swatch.is-active { border-color: var(--red); box-shadow: 0 0 0 2px var(--red); }
.swatch--colour.has-img { width: 72px; height: 72px; }
.swatch--colour.has-img img { width: 100%; height: 100%; object-fit: contain; padding: 4px; }
.swatch__dot { position: absolute; right: 4px; bottom: 4px; width: 12px; height: 12px; border-radius: 50%; border: 1px solid rgba(0,0,0,.2); }
.swatch__fill { width: 30px; height: 30px; border-radius: 50%; border: 1px solid rgba(0,0,0,.15); }
.swatch--text { padding: 0 0.9rem; }
.swatch__text { font-family: var(--font-mono); font-size: 0.8125rem; letter-spacing: 0.06em; }
.variations tr.is-swatched { display: none; }
.variations.is-all-swatched { margin-bottom: 0; }
@media (max-width: 860px) { .options-panel { margin-top: 0; } }

/* Sale page empty state */
.empty-sale { padding: 2rem 0; }
.single-product div.product > .woocommerce-product-gallery { grid-column: 1; grid-row: 1; }
.single-product div.product > .options-panel { grid-column: 1; grid-row: 2; }
.single-product div.product > .summary { grid-column: 2; grid-row: 1 / span 2; }
@media (max-width: 860px) { .single-product div.product > .woocommerce-product-gallery, .single-product div.product > .options-panel, .single-product div.product > .summary { grid-column: 1; grid-row: auto; } }

/* =========================================================
   Category court heroes: each page floats its own products on court
   ========================================================= */
.court-hero--cat { min-height: max(520px, calc(88svh - 150px)); max-height: 820px; }
.court-hero__products { position: absolute; z-index: -1; right: max(3vw, calc((100vw - 80rem) / 2)); bottom: 3%; height: 74%; width: min(46vw, 660px); pointer-events: none; --hero-scale: 1; }
.hero-prod { position: absolute; width: auto; height: auto; filter: drop-shadow(0 30px 28px rgba(0,0,0,.55)); will-change: transform; transform-origin: 50% 100%; }
.court-hero__products--1 .hero-prod--1 { right: 12%; bottom: 6%; max-width: calc(80% * var(--hero-scale)); max-height: calc(90% * var(--hero-scale)); animation: re-float-p 7s ease-in-out infinite; }
.court-hero__products--2 .hero-prod--1 { right: 36%; bottom: 4%; max-width: calc(62% * var(--hero-scale)); max-height: calc(88% * var(--hero-scale)); z-index: 2; animation: re-float-p 7s ease-in-out infinite; }
.court-hero__products--2 .hero-prod--2 { right: 0; bottom: 16%; max-width: calc(50% * var(--hero-scale)); max-height: calc(72% * var(--hero-scale)); filter: drop-shadow(0 24px 24px rgba(0,0,0,.5)) brightness(.95); animation: re-float-q 8s ease-in-out infinite; }
.court-hero__products--2 .hero-prod--1.is-tall { animation-name: re-float; }
.court-hero__products--2 .hero-prod--2.is-tall { animation-name: re-float-b; right: 4%; }
@keyframes re-float-p { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes re-float-q { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
.court-hero--cat .court-hero__title { font-size: clamp(3rem, 7.2vw, 6.75rem); max-width: 12ch; }
.court-hero--cat .court-hero__lead { max-width: 28rem; }

@media (max-width: 860px) {
	.court-hero--cat { min-height: 0; }
	.court-hero__products { position: relative; order: 2; right: auto; bottom: auto; z-index: 0; margin: 1rem auto 1.25rem; width: min(94vw, 460px); height: clamp(220px, 32vh, 300px); flex: none; }
	.court-hero--cat .court-hero__content { padding-bottom: 0; }
	.court-hero--cat .court-hero__title { font-size: clamp(2.9rem, 13vw, 4.75rem); }
}
@media (prefers-reduced-motion: reduce) { .hero-prod { animation: none !important; } }

/* Compact court banner: cart, checkout, account, policies, shop, search */
.court-banner { position: relative; isolation: isolate; overflow: hidden; background: #07080a; color: #fff; }
.court-banner__scene { position: absolute; inset: 0; z-index: -2; }
.court-banner__scene .court-svg { width: 100%; height: 100%; object-fit: cover; }
.court-banner::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(4,5,7,.86) 0%, rgba(4,5,7,.6) 45%, rgba(4,5,7,.2) 100%); }
.court-banner__inner { padding-block: clamp(2.5rem, 6vw, 4.5rem); }
.court-banner__title { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; line-height: 0.9; font-size: clamp(2.5rem, 6vw, 4.75rem); margin: 0; text-shadow: 0 4px 30px rgba(0,0,0,.35); }
.court-banner__sub { margin: 0.75rem 0 0; font-family: var(--font-mono); font-size: 0.8125rem; letter-spacing: 0.12em; text-transform: uppercase; color: #ff4a57; }
.court-banner + .wrap { padding-top: clamp(1.5rem, 4vw, 2.5rem); }

/* Back to school section on the Bags page */
.bts { padding-block: clamp(3rem, 7vw, 5.5rem) 0; }
.bts__band { position: relative; isolation: isolate; overflow: hidden; background: #0b1017; color: #fff; }
.bts__court { position: absolute; inset: 0; z-index: -1;
	background:
		linear-gradient(90deg, rgba(4,5,7,.9) 0%, rgba(4,5,7,.55) 45%, rgba(4,5,7,.1) 100%),
		linear-gradient(180deg, transparent 58%, rgba(255,255,255,.55) 58.3%, transparent 58.9%),
		linear-gradient(90deg, transparent 71.8%, rgba(255,255,255,.4) 72%, transparent 72.3%),
		radial-gradient(120% 90% at 75% 100%, #3a5f82 0%, #2c4a66 45%, #16263a 100%); }
.bts__inner { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: center; gap: 2rem; min-height: 460px; padding-block: clamp(2.5rem, 5vw, 4rem); }
.bts__title { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; line-height: 0.88; font-size: clamp(2.75rem, 6vw, 5.5rem); margin: 0; }
.bts__title span { color: #ff2433; font-size: 0.6em; display: inline-block; margin-top: 0.1em; }
.bts__lead { max-width: 30rem; margin: 1.25rem 0 1rem; font-size: 1.0625rem; line-height: 1.55; color: rgba(255,255,255,.88); }
.bts__points { list-style: none; padding: 0; margin: 0 0 1.75rem; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.bts__points li { font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; border: 1px solid rgba(255,255,255,.35); padding: 0.4rem 0.7rem; }
.bts__bags { position: relative; height: clamp(300px, 34vw, 440px); }
.bts__bag { position: absolute; bottom: 6%; width: auto; filter: drop-shadow(0 26px 24px rgba(0,0,0,.55)); }
.bts__bag--1 { left: 6%; max-height: 92%; max-width: 58%; z-index: 2; animation: re-float-p 7s ease-in-out infinite; }
.bts__bag--2 { right: 2%; bottom: 14%; max-height: 74%; max-width: 50%; filter: drop-shadow(0 22px 22px rgba(0,0,0,.5)) brightness(.95); animation: re-float-q 8s ease-in-out infinite; }
.bts__bags .court-hero__shadow { bottom: 2%; }
.bts__range { padding-block: clamp(2rem, 4vw, 3rem) 0; }
@media (max-width: 860px) {
	.bts__inner { grid-template-columns: 1fr; min-height: 0; }
	.bts__bags { height: 260px; }
	.bts__points { margin-bottom: 1.25rem; }
}
@media (prefers-reduced-motion: reduce) { .bts__bag { animation: none !important; } }

/* Racket cursor: mouse and trackpad only, never on touch screens. SVG stays sharp on retina, PNG is the fallback.
   Hotspot sits on the top edge of the racket head so clicks land where the eye expects. */
@media (hover: hover) and (pointer: fine) {
	html, body { cursor: url("../img/cursor/racket.svg") 4 4, url("../img/cursor/racket.png") 4 4, auto; }
	a, button, [role="button"], label, select, summary, .swatch, .chip, .btn, input[type="submit"], input[type="checkbox"], input[type="radio"], .woocommerce-product-gallery__trigger {
		cursor: url("../img/cursor/racket-hover.svg") 4 4, url("../img/cursor/racket-hover.png") 4 4, pointer;
	}
	input[type="text"], input[type="search"], input[type="email"], input[type="tel"], input[type="number"], input[type="password"], textarea, [contenteditable="true"] { cursor: text; }
	[disabled], .disabled { cursor: not-allowed; }
}

.topbar__ship { display: inline-flex; align-items: center; gap: 0.55rem; font-family: var(--font-body, Inter, system-ui, sans-serif); font-size: 0.875rem; font-weight: 600; letter-spacing: 0.01em; text-transform: none; white-space: nowrap; }
.topbar__ship svg { flex: none; }
