/*
Theme Name: Neon
Theme URI: https://seifweb.com
Author: SeifWeb
Author URI: https://seifweb.com
Description: متجر إلكترونيات وأجهزة ذكية على WooCommerce: هواتف ولابتوبات وصوتيات وساعات ذكية وألعاب وإكسسوارات، بجدول مواصفات لكل منتج، وتوصيل حسب الإمارة، واستلام من المعرض، والدفع عند الاستلام. عربي أولًا ومصمَّم للهاتف. An electronics and smart devices store for WooCommerce — specs tables, delivery by emirate, showroom pickup and cash on delivery — Arabic first and built for phones.
Version: 1.0.0
Requires at least: 6.5
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: neon
Tags: e-commerce, rtl-language-support, custom-logo, custom-menu
*/

/* ---------- Tokens: a clean tech showroom — charcoal bands, white product surfaces, cool grey panels, one electric blue ---------- */
:root {
	--ink: #0f1218;
	--ink-2: #353c4a;
	--muted: #5a6273;
	--line: #e3e7ee;
	--line-2: #cfd6e1;
	--bg: #ffffff;
	--panel: #eef1f6;
	--panel-2: #f6f8fb;
	--night: #0f1218;
	--night-2: #161a23;
	--night-3: #202634;
	--night-line: rgba(255, 255, 255, .1);
	--on-night: #e9edf4;
	--on-night-2: #a7b0bf;
	--accent: #2563ff;
	--accent-dark: #1748d6;
	--accent-ink: #1d4ed8;
	--accent-soft: #e6eeff;
	--accent-night: #7c9dff;
	--glow: rgba(37, 99, 255, .45);
	--ok: #16a34a;
	--ok-ink: #15803d;
	--sale: #e11d48;
	--sale-ink: #be123c;
	--sale-soft: #ffe4ea;
	--radius: 16px;
	--radius-sm: 10px;
	--radius-lg: 24px;
	--shadow: 0 1px 2px rgba(15, 18, 24, .05), 0 12px 32px rgba(15, 18, 24, .08);
	--shadow-lg: 0 24px 60px rgba(15, 18, 24, .16);
	--font: "IBM Plex Sans Arabic", system-ui, "Segoe UI", Tahoma, sans-serif;
	--display: "Noto Kufi Arabic", "IBM Plex Sans Arabic", system-ui, sans-serif;
	--mono: "IBM Plex Mono", "IBM Plex Sans Arabic", ui-monospace, monospace;
	--gutter: 16px;
	--header-h: 60px;
	--tabbar-h: 62px;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
	margin: 0; font-family: var(--font); font-size: 16px; line-height: 1.7; color: var(--ink); background: var(--bg);
	-webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
	padding-bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom));
}
body.no-scroll { overflow: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--accent-ink); }
h1, h2, h3, h4 { font-family: var(--display); line-height: 1.4; margin: 0 0 .5em; font-weight: 700; letter-spacing: 0; }
p { margin: 0 0 1em; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 6px; }
.site-footer :focus-visible, .ticker :focus-visible, .demo-bar :focus-visible, .hero :focus-visible, .why :focus-visible, .contact-card :focus-visible, .toast :focus-visible { outline-color: #fff; }
.screen-reader-text, .skip-link:not(:focus) { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.skip-link:focus { position: fixed; inset-inline-start: 12px; top: 12px; z-index: 100; background: var(--ink); color: #fff; padding: 10px 16px; border-radius: 10px; }
.container { width: 100%; max-width: 1320px; margin-inline: auto; padding-inline: var(--gutter); }
.icon { flex: none; }
.muted { color: var(--muted); }
.only-desktop { display: none !important; }
.price, .amount, .woocommerce-Price-amount, .tile-from, .spot-price { font-variant-numeric: tabular-nums; }

/* ---------- Buttons ---------- */
.btn, .button, button.button, a.button, input[type="submit"],
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-height: 48px; padding: 0 22px; border: 1px solid transparent; border-radius: 12px;
	font-family: var(--font); font-weight: 600; font-size: 15px; line-height: 1.2; letter-spacing: 0; text-align: center;
	cursor: pointer; transition: background .2s, color .2s, border-color .2s, box-shadow .2s, opacity .2s;
	background: var(--ink); color: #fff; text-decoration: none;
}
.btn .icon { width: 18px; height: 18px; }
.btn:hover, .button:hover, .woocommerce a.button:hover, .woocommerce button.button:hover { background: var(--accent); color: #fff; }
.btn-dark { background: var(--ink); color: #fff; }
.btn-line { background: #fff; color: var(--ink); border-color: var(--line-2); }
.btn-line:hover { background: var(--ink); color: #fff; border-color: var(--ink); }
.btn-light { background: #fff; color: var(--ink); }
.btn-light:hover { background: var(--accent-soft); color: var(--ink); }
.btn-ghost { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .3); }
.btn-ghost:hover { background: rgba(255, 255, 255, .1); color: #fff; border-color: rgba(255, 255, 255, .6); }
.btn-accent, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce button.single_add_to_cart_button { background: var(--accent); color: #fff; box-shadow: 0 8px 24px -10px var(--glow); }
.btn-accent:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce button.single_add_to_cart_button:hover { background: var(--accent-dark); color: #fff; }
.btn-sm { min-height: 44px; padding: 0 16px; font-size: 14px; }
.btn-block { width: 100%; }
/* WooCommerce paints disabled buttons in its own purple: keep the brand colour. */
.woocommerce button.button.alt.disabled, .woocommerce button.button.alt:disabled, .woocommerce button.button.alt:disabled[disabled],
.woocommerce button.button.alt.disabled:hover, .woocommerce div.product form.cart .button.disabled {
	background: var(--accent) !important; color: #fff !important; opacity: .5; cursor: not-allowed;
}
.icon-btn { display: inline-grid; place-items: center; position: relative; width: 44px; height: 44px; border-radius: 12px; background: transparent; border: 0; cursor: pointer; color: var(--ink); }
.icon-btn:hover { background: var(--panel); color: var(--ink); }
.lang-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 34px; padding: 0 10px; margin-inline-end: 4px; border: 1px solid var(--line-2); border-radius: 10px; background: #fff; color: var(--ink); font-size: 13px; font-weight: 600; line-height: 1; }
.lang-btn:hover { border-color: var(--ink); color: var(--ink); }
.lang-btn[lang="en"] { font-family: var(--mono); letter-spacing: .06em; }
.lang-link .icon, .lang-foot .icon { width: 18px; height: 18px; }
.lang-foot { display: inline-flex; align-items: center; gap: 6px; }

/* ---------- Demo notice ---------- */
.demo-bar { background: var(--accent-dark); color: #fff; font-size: 13px; }
.demo-bar-inner { display: flex; align-items: center; gap: 6px 14px; min-height: 40px; padding-block: 4px; }
.demo-bar p { margin: 0; flex: 1; min-width: 0; line-height: 1.5; }
.demo-bar a { color: #fff; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.demo-bar a:hover { color: #dbe4ff; }
.demo-bar-close { display: grid; place-items: center; flex: none; width: 36px; height: 36px; border: 0; border-radius: 10px; background: none; color: #fff; cursor: pointer; }
.demo-bar-close:hover { background: rgba(255, 255, 255, .14); }
.demo-bar-close .icon { width: 18px; height: 18px; }

/* ---------- Status ticker ---------- */
.ticker { background: var(--night); color: var(--on-night-2); font-size: 12.5px; overflow: hidden; white-space: nowrap; border-bottom: 1px solid var(--night-line); }
.ticker-track { display: flex; width: max-content; animation: neo-tick 52s linear infinite; }
.ticker:hover .ticker-track { animation-play-state: paused; }
.ticker-group { display: flex; }
.ticker-item { position: relative; display: inline-flex; align-items: center; gap: 8px; padding: 8px 24px; }
.ticker-item::after { content: ""; position: absolute; inset-inline-end: 0; top: 50%; width: 4px; height: 4px; margin-top: -2px; border-radius: 50%; background: rgba(255, 255, 255, .22); }
.ticker-item .icon { width: 15px; height: 15px; color: var(--accent-night); }
@keyframes neo-tick { from { transform: translateX(0); } to { transform: translateX(-50%); } }
[dir="rtl"] .ticker-track { animation-name: neo-tick-rtl; }
@keyframes neo-tick-rtl { from { transform: translateX(0); } to { transform: translateX(50%); } }

/* ---------- Header ---------- */
.site-header { position: sticky; top: 0; z-index: 40; background: rgba(255, 255, 255, .92); backdrop-filter: saturate(1.5) blur(14px); -webkit-backdrop-filter: saturate(1.5) blur(14px); border-bottom: 1px solid var(--line); }
.site-header.is-scrolled { box-shadow: 0 8px 28px rgba(15, 18, 24, .08); }
.admin-bar .site-header { top: 46px; }
.header-row { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; min-height: var(--header-h); }
.header-row > .icon-btn:first-child { justify-self: start; }
.brand { display: inline-flex; align-items: center; gap: 9px; justify-self: center; color: var(--ink); }
.brand:hover { color: var(--ink); }
.brand-logo { max-height: 40px; width: auto; }
.brand-mark { width: 32px; height: 32px; flex: none; color: var(--ink); }
.brand-mark .mk-bolt { fill: var(--accent); }
.brand-mark .mk-arc { stroke: var(--accent); }
.brand-name { font-family: var(--display); font-weight: 700; font-size: 23px; line-height: 1; white-space: nowrap; }
html[lang^="en"] .brand-name { text-transform: uppercase; letter-spacing: .2em; font-size: 19px; }
.header-actions { display: flex; align-items: center; justify-self: end; gap: 2px; }
.neon-cart-count { position: absolute; top: 4px; inset-inline-end: 2px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 999px; background: var(--accent); color: #fff; font: 600 10.5px/18px var(--mono); text-align: center; box-shadow: 0 0 0 2px #fff; }
.neon-cart-count.is-empty { display: none; }
.header-search { border-top: 1px solid var(--line); padding-block: 12px; background: #fff; }
.nav-list, .drawer-list { list-style: none; margin: 0; padding: 0; }
.main-nav .nav-list { display: flex; gap: 2px; }
.main-nav .nav-list > li { position: relative; }
.main-nav .nav-list a { display: block; padding: 10px 12px; font-weight: 500; font-size: 15px; color: var(--ink-2); white-space: nowrap; border-radius: 10px; }
.main-nav .nav-list a:hover, .main-nav .current-menu-item > a, .main-nav .current-menu-ancestor > a { color: var(--ink); }
.main-nav .nav-list > li > a { position: relative; }
.main-nav .nav-list > li > a::after { content: ""; position: absolute; inset-inline: 12px; bottom: 3px; height: 2px; border-radius: 2px; background: var(--accent); box-shadow: 0 0 10px var(--glow); transform: scaleX(0); transition: transform .2s; }
.main-nav .nav-list > li:hover > a::after, .main-nav .current-menu-item > a::after, .main-nav .current-menu-ancestor > a::after { transform: scaleX(1); }
.main-nav .menu-item-has-children > a { padding-inline-end: 26px; }
.main-nav .menu-item-has-children > a::before { content: ""; position: absolute; inset-inline-end: 11px; top: 50%; width: 6px; height: 6px; margin-top: -5px; border-right: 1.6px solid currentColor; border-bottom: 1.6px solid currentColor; transform: rotate(45deg); }
.main-nav .sub-menu { list-style: none; margin: 0; padding: 8px; position: absolute; top: 100%; inset-inline-start: 0; min-width: 250px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-lg); opacity: 0; visibility: hidden; transform: translateY(6px); transition: .2s; z-index: 5; }
.main-nav .sub-menu a { padding: 10px 12px; }
.main-nav .sub-menu a::after { display: none; }
.main-nav .sub-menu a:hover { background: var(--panel); }
.main-nav li:hover > .sub-menu, .main-nav li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }

/* ---------- Search form ---------- */
.search-form { display: flex; align-items: center; gap: 8px; background: #fff; border: 1px solid var(--line-2); border-radius: 14px; padding: 5px; padding-inline-start: 14px; max-width: 680px; margin-inline: auto; }
.search-form:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(37, 99, 255, .18); }
.search-form .icon { color: var(--muted); width: 20px; height: 20px; }
.search-form input[type="search"] { flex: 1; min-width: 0; border: 0; background: transparent; padding: 8px 4px; outline: none; font-size: 16px; text-overflow: ellipsis; }
.search-form .btn { min-height: 42px; padding: 0 18px; box-shadow: none; }

/* ---------- Drawer ---------- */
.drawer { position: fixed; inset: 0; z-index: 60; }
.drawer-backdrop { position: absolute; inset: 0; background: rgba(15, 18, 24, .55); opacity: 0; transition: opacity .25s; }
.drawer-panel { position: absolute; top: 0; bottom: 0; inset-inline-start: 0; width: min(86vw, 360px); background: #fff; display: flex; flex-direction: column; transform: translateX(100%); transition: transform .25s ease; padding-bottom: env(safe-area-inset-bottom); }
[dir="ltr"] .drawer-panel { transform: translateX(-100%); }
.drawer.is-open .drawer-backdrop { opacity: 1; }
.drawer.is-open .drawer-panel { transform: none; }
.drawer-head { display: flex; align-items: center; justify-content: space-between; padding: 12px var(--gutter); border-bottom: 1px solid var(--line); }
.drawer-list { flex: 1; overflow: auto; padding: 8px var(--gutter); }
.drawer-list a { display: block; padding: 13px 2px; border-bottom: 1px solid var(--line); font-weight: 600; font-size: 16.5px; }
.drawer-list .sub-menu { list-style: none; padding-inline-start: 14px; margin: 0; }
.drawer-list .sub-menu a { font-size: 15px; font-weight: 500; color: var(--ink-2); padding-block: 11px; }
.drawer-foot { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; padding: 16px var(--gutter); border-top: 1px solid var(--line); }
.drawer-foot > :first-child { grid-column: 1 / -1; }
.drawer-foot .btn { padding-inline: 12px; }

/* ---------- Common section parts ---------- */
.section { padding-block: 48px; }
.section-follow { padding-top: 8px; }
.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.section-head > div { min-width: 0; }
.section-head h2 { font-size: clamp(22px, 5.6vw, 34px); margin: 0; }
.section-lead { color: var(--ink-2); max-width: 640px; margin: 8px 0 0; }
.eyebrow { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 6px; font-size: 13px; font-weight: 600; color: var(--accent-ink); }
.eyebrow::before { content: ""; width: 18px; height: 2px; border-radius: 2px; background: currentColor; }
.eyebrow.on-dark { color: var(--accent-night); }
.eyebrow.is-sale { color: var(--sale-ink); }
.eyebrow:has(.live-dot)::before { display: none; }
.link-more { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; font-weight: 600; font-size: 14px; white-space: nowrap; color: var(--accent-ink); }
.link-more .icon { width: 18px; height: 18px; transition: transform .2s; }
.link-more:hover .icon { transform: translateX(-3px); }
[dir="ltr"] .link-more .icon { transform: scaleX(-1); }
[dir="ltr"] .link-more:hover .icon { transform: scaleX(-1) translateX(-3px); }
.live-dot { position: relative; display: inline-block; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0 0 rgba(22, 163, 74, .6); animation: neo-pulse 2.4s ease-out infinite; }
@keyframes neo-pulse { 0% { box-shadow: 0 0 0 0 rgba(22, 163, 74, .55); } 70% { box-shadow: 0 0 0 9px rgba(22, 163, 74, 0); } 100% { box-shadow: 0 0 0 0 rgba(22, 163, 74, 0); } }

/* ---------- Home: hero ---------- */
.hero { position: relative; isolation: isolate; overflow: hidden; background: var(--night); color: var(--on-night); }
.hero::before { content: ""; position: absolute; z-index: -1; width: 900px; height: 900px; top: -340px; inset-inline-start: -260px; border-radius: 50%; background: radial-gradient(circle, rgba(37, 99, 255, .32) 0%, rgba(37, 99, 255, .08) 38%, transparent 64%); pointer-events: none; }
.hero-lines { position: absolute; inset: 0; z-index: -1; pointer-events: none; background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px); background-size: 44px 44px; -webkit-mask-image: radial-gradient(ellipse 80% 70% at 50% 30%, #000 10%, transparent 72%); mask-image: radial-gradient(ellipse 80% 70% at 50% 30%, #000 10%, transparent 72%); }
.hero-inner { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; padding-block: 26px 40px; }
.hero-head, .hero-body { min-width: 0; }
.hero-head .hero-title { margin-bottom: 0; }
.hero-title { font-size: clamp(31px, 8.6vw, 62px); line-height: 1.32; color: #fff; margin: 0 0 14px; }
.hero-title span { color: var(--accent-night); background: linear-gradient(90deg, #7c9dff, #b9caff 60%, #7c9dff); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.hero-lead { color: var(--on-night-2); font-size: 16px; max-width: 540px; margin-bottom: 20px; }
.hero-search { display: flex; align-items: center; gap: 8px; max-width: 540px; padding: 6px; padding-inline-start: 14px; border-radius: 14px; background: #fff; color: var(--ink); box-shadow: 0 0 0 1px rgba(255, 255, 255, .08), 0 24px 48px -18px rgba(0, 0, 0, .6); }
.hero-search:focus-within { box-shadow: 0 0 0 3px rgba(124, 157, 255, .55), 0 24px 48px -18px rgba(0, 0, 0, .6); }
.hero-search .icon { width: 20px; height: 20px; color: var(--muted); }
.hero-search input { flex: 1; min-width: 0; border: 0; outline: none; background: transparent; padding: 8px 2px; font-size: 16px; text-overflow: ellipsis; }
.hero-search .btn { box-shadow: none; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.hero-actions .btn { flex: 1 1 150px; }
.hero-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 24px 0 0; padding-top: 18px; border-top: 1px solid var(--night-line); max-width: 540px; }
.hero-facts > div { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: 2px; min-width: 0; }
.hero-facts dt { font-size: 12px; line-height: 1.45; color: var(--on-night-2); }
.hero-facts dd { margin: 0; font-family: var(--mono); font-size: 16px; font-weight: 500; line-height: 1.4; color: #fff; }

/* The spotlight: a "screen" on a stage, with rings, a glow that follows the pointer and the device's readouts */
.spotlight { position: relative; min-width: 0; }
.spot-stage { --gx: 50%; --gy: 35%; position: relative; isolation: isolate; padding: 12px; border-radius: var(--radius-lg); border: 1px solid var(--night-line); background: linear-gradient(180deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .015)); }
.spot-stage::before { content: ""; position: absolute; inset: -1px; z-index: -1; border-radius: inherit; background: radial-gradient(420px circle at var(--gx) var(--gy), rgba(37, 99, 255, .3), transparent 62%); pointer-events: none; }
.spot-rings { position: absolute; z-index: -1; top: 50%; left: 50%; width: 118%; height: auto; transform: translate(-50%, -50%); fill: none; stroke: rgba(124, 157, 255, .16); stroke-width: 1; pointer-events: none; }
.spot-trace { stroke: rgba(124, 157, 255, .5); stroke-dasharray: 5 9; animation: neo-trace 5s linear infinite; }
@keyframes neo-trace { to { stroke-dashoffset: -56; } }
.spot-panel { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.spot-panel.is-entering .spot-screen img { animation: neo-zoom .7s cubic-bezier(.2, .7, .2, 1); }
.spot-panel.is-entering .spot-readout li { animation: neo-rise .5s ease both; }
.spot-panel.is-entering .spot-readout li:nth-child(2) { animation-delay: .08s; }
.spot-panel.is-entering .spot-readout li:nth-child(3) { animation-delay: .16s; }
@keyframes neo-zoom { from { opacity: .2; transform: scale(1.06); } to { opacity: 1; transform: none; } }
@keyframes neo-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.spot-screen { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 18px; background: var(--panel); box-shadow: 0 0 0 1px rgba(255, 255, 255, .1), 0 36px 90px -30px var(--glow); }
.spot-screen img { width: 100%; height: 100%; object-fit: cover; }
.spot-screen::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(160deg, rgba(255, 255, 255, .16), transparent 32%); pointer-events: none; }
.spot-readout { position: absolute; top: 12px; inset-inline-start: 12px; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; max-width: calc(100% - 24px); margin: 0; padding: 0; list-style: none; }
.spot-readout li { position: relative; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 4px 10px; border-radius: 8px; border: 1px solid rgba(255, 255, 255, .14); background: rgba(15, 18, 24, .74); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #fff; font: 500 12px/1.6 var(--mono); }
.spot-info { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; padding: 0 4px 2px; }
.spot-info > div { display: grid; min-width: 0; }
.spot-cat { font-size: 12px; color: var(--on-night-2); }
.spot-name { font-weight: 600; font-size: 16.5px; line-height: 1.45; color: #fff; }
.spot-name:hover { color: var(--accent-night); }
.spot-price { flex: none; font-family: var(--mono); font-weight: 500; font-size: 16px; color: #fff; text-align: end; }
.spot-price del { display: block; font-size: 12px; color: var(--on-night-2); opacity: 1; }
.spot-price ins { text-decoration: none; }
.spot-controls { display: flex; align-items: stretch; gap: 6px; margin-top: 10px; }
.spot-tabs { flex: 1; min-width: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.spot-pause { flex: none; display: grid; place-items: center; width: 44px; border-radius: 12px; border: 1px solid var(--night-line); background: rgba(255, 255, 255, .03); color: var(--on-night-2); cursor: pointer; }
.spot-pause:hover { color: #fff; border-color: rgba(255, 255, 255, .25); }
.spot-pause .icon { width: 18px; height: 18px; }
.spot-pause .icon-play, .spot-pause[aria-pressed="true"] .icon-pause { display: none; }
.spot-pause[aria-pressed="true"] .icon-play { display: block; }
.spot-tab { position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-width: 0; min-height: 58px; padding: 8px 4px; border-radius: 12px; border: 1px solid var(--night-line); background: rgba(255, 255, 255, .03); color: var(--on-night-2); font-size: 12.5px; font-weight: 600; cursor: pointer; transition: color .2s, border-color .2s, background .2s; }
.spot-tab .icon { width: 20px; height: 20px; }
.spot-tab:hover { color: #fff; border-color: rgba(255, 255, 255, .25); }
.spot-tab[aria-selected="true"] { color: #fff; border-color: rgba(124, 157, 255, .6); background: rgba(37, 99, 255, .18); }
.spot-tab[aria-selected="true"] .icon { color: var(--accent-night); }
.spot-tab::after { content: ""; position: absolute; bottom: 0; inset-inline-start: 0; width: 100%; height: 2px; background: var(--accent-night); transform: scaleX(0); transform-origin: right center; }
[dir="ltr"] .spot-tab::after { transform-origin: left center; }
.is-running .spot-tab[aria-selected="true"]::after { animation: neo-progress var(--spot-time, 6s) linear forwards; }
@keyframes neo-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* ---------- Home: departments as a bento grid ---------- */
.bento { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: minmax(190px, auto); gap: 12px; }
.bento-tile { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; min-width: 0; border-radius: var(--radius); background: var(--panel); color: var(--ink); border: 1px solid transparent; transition: border-color .2s, box-shadow .2s; }
.bento-tile:first-child, .bento-tile:nth-child(6) { grid-column: span 2; }
.bento-tile:hover { color: var(--ink); border-color: var(--line-2); box-shadow: var(--shadow); }
.tile-img { position: absolute; inset: 0; z-index: -1; display: grid; place-items: center; }
.tile-img img { width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; filter: saturate(.92) contrast(1.04); transition: transform .6s ease; }
.tile-img .brand-mark { width: 56px; height: 56px; opacity: .4; }
.bento-tile:hover .tile-img img { transform: scale(1.04); }
.tile-text { position: relative; display: grid; gap: 2px; padding: 40px 14px 14px; background: linear-gradient(to top, rgba(238, 241, 246, .97) 46%, rgba(238, 241, 246, 0)); }
.tile-index { font: 500 11.5px/1.4 var(--mono); color: var(--muted); }
.tile-text strong { font-family: var(--display); font-weight: 700; font-size: 16px; line-height: 1.45; }
.tile-from { font-size: 13px; color: var(--ink-2); }
.tile-from .amount { font-family: var(--mono); font-weight: 500; }
.tile-go { position: absolute; top: 12px; inset-inline-end: 12px; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: #fff; color: var(--ink); box-shadow: 0 4px 14px rgba(15, 18, 24, .1); transition: background .2s, color .2s; }
.tile-go .icon { width: 18px; height: 18px; }
[dir="ltr"] .tile-go .icon { transform: scaleX(-1); }
.bento-tile:hover .tile-go { background: var(--accent); color: #fff; }

/* ---------- Product grid and cards (WooCommerce) ---------- */
.woocommerce ul.products, .woocommerce-page ul.products { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0 !important; padding: 0; list-style: none; }
.woocommerce ul.products::before, .woocommerce ul.products::after { display: none !important; }
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
	position: relative; display: flex; flex-direction: column; width: auto !important; min-width: 0; margin: 0 !important; padding: 8px 8px 14px !important; float: none !important; clear: none !important;
	text-align: start; color: var(--ink); background: #fff; border: 1px solid var(--line); border-radius: var(--radius); transition: border-color .2s, box-shadow .2s, transform .2s;
}
.woocommerce ul.products li.product:hover { border-color: var(--line-2); box-shadow: var(--shadow); }
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link { display: flex; flex-direction: column; flex: 1; color: var(--ink); text-decoration: none; }
.card-media { position: relative; isolation: isolate; display: block; aspect-ratio: 1 / 1; overflow: hidden; margin-bottom: 12px; border-radius: 12px; background: var(--panel); }
.woocommerce ul.products li.product .card-media img { width: 100%; height: 100%; margin: 0; object-fit: cover; border-radius: 0; mix-blend-mode: multiply; filter: saturate(.92) contrast(1.04); transition: transform .5s ease; }
.woocommerce ul.products li.product:hover .card-media img { transform: scale(1.04); }
.card-cat { display: block; padding-inline: 4px; font-size: 12px; color: var(--muted); margin-bottom: 2px; }
.woocommerce ul.products li.product .woocommerce-loop-product__title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; padding: 0 4px; margin: 0 0 4px; font-family: var(--font); font-size: 15px; font-weight: 600; line-height: 1.5; color: var(--ink); }
.card-specs { display: flex; flex-wrap: wrap; gap: 2px 0; padding-inline: 4px; margin-bottom: 8px; font: 400 11.5px/1.6 var(--mono); color: var(--muted); }
.card-specs span + span::before { content: "·"; margin-inline: 6px; color: var(--line-2); }
.woocommerce ul.products li.product .price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; margin: auto 0 0; padding: 0 4px; font-family: var(--mono); font-size: 16px; font-weight: 500; color: var(--ink); }
.woocommerce ul.products li.product .price del { color: var(--muted); font-weight: 400; font-size: 12.5px; opacity: 1; }
.woocommerce ul.products li.product .price ins { text-decoration: none; color: var(--sale); }
.card-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-top: 6px; padding-inline: 4px; }
.stock-dot { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 500; color: var(--ink-2); }
.stock-dot::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0 3px rgba(22, 163, 74, .16); }
.stock-dot.is-out::before { background: #9aa3b2; box-shadow: none; }
.saving { display: inline-flex; align-items: center; padding: 1px 8px; border-radius: 6px; background: var(--sale-soft); color: var(--sale-ink); font-size: 12px; font-weight: 600; }
.saving .amount { font-family: var(--mono); font-weight: 500; }
.card-badges { position: absolute; top: 16px; inset-inline-start: 16px; z-index: 3; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; pointer-events: none; }
.woocommerce .card-badges .onsale, .woocommerce ul.products li.product .card-badges .onsale {
	position: static; margin: 0; min-width: 0; min-height: 0; padding: 2px 8px; line-height: 1.6; border-radius: 8px;
	background: var(--sale); color: #fff; font: 500 12px/1.6 var(--mono); direction: ltr;
}
.quick-add {
	position: absolute; top: 16px; inset-inline-end: 16px; z-index: 4; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px;
	background: #fff; color: var(--ink); box-shadow: 0 4px 14px rgba(15, 18, 24, .14); transition: background .2s, color .2s, transform .15s, opacity .2s;
}
.quick-add .icon { width: 20px; height: 20px; }
.quick-add:hover { background: var(--accent); color: #fff; }
.quick-add:active { transform: scale(.94); }
.quick-add.loading { opacity: .6; pointer-events: none; }
.quick-add.added { background: var(--ok); color: #fff; }
.quick-add.loading::after, .quick-add.added::after { display: none !important; }
.woocommerce ul.products li.product a.added_to_cart { display: none; }
.woocommerce .star-rating { display: none; }

/* ---------- Home: deals band, why band, needs, visit, demo CTA ---------- */
.deals { background: var(--panel); }
.deals-rail { margin-inline: calc(var(--gutter) * -1); }
.deals-rail ul.products { grid-auto-flow: column; grid-template-columns: none !important; grid-auto-columns: 62%; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--gutter); padding: 0 var(--gutter) 8px !important; scrollbar-width: none; }
.deals-rail ul.products::-webkit-scrollbar { display: none; }
.deals-rail ul.products li.product { scroll-snap-align: start; }

.why { position: relative; isolation: isolate; overflow: hidden; padding-block: 56px; background: var(--night); color: var(--on-night); }
.why::before { content: ""; position: absolute; z-index: -1; width: 720px; height: 720px; bottom: -420px; inset-inline-end: -220px; border-radius: 50%; background: radial-gradient(circle, rgba(37, 99, 255, .22), transparent 62%); pointer-events: none; }
.why-head { max-width: 720px; margin-bottom: 24px; }
.why-head h2 { color: #fff; font-size: clamp(23px, 5.6vw, 36px); margin: 0; }
.why-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.why-card { position: relative; min-width: 0; padding: 22px; border-radius: var(--radius); border: 1px solid var(--night-line); background: var(--night-2); color: var(--on-night); }
.why-card h3 { color: #fff; font-size: 18px; margin: 14px 0 6px; }
.why-card p { color: var(--on-night-2); font-size: 14.5px; margin: 0; }
.why-art, .empty-art { width: 76px; height: 76px; fill: none; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.why-art .a-line, .empty-art .a-line { stroke: var(--on-night); }
.why-art .a-accent, .empty-art .a-accent { stroke: var(--accent-night); }
.why-art .a-faint, .empty-art .a-faint { stroke: rgba(124, 157, 255, .35); stroke-dasharray: 3 5; }
.why-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; margin: 28px 0 0; }
.why-stats > div { display: flex; flex-direction: column-reverse; justify-content: flex-end; padding: 16px 0; border-top: 1px solid var(--night-line); min-width: 0; }
.why-stats dd { margin: 0; font-family: var(--mono); font-weight: 500; font-size: clamp(34px, 10vw, 56px); line-height: 1.1; color: #fff; }
.why-stats dt { font-size: 13.5px; color: var(--on-night-2); }

.needs { background: var(--panel); }
.need-tabs { display: flex; gap: 8px; overflow-x: auto; margin: 0 calc(var(--gutter) * -1) 18px; padding: 2px var(--gutter) 4px; scrollbar-width: none; }
.need-tabs::-webkit-scrollbar { display: none; }
.need-tab { position: relative; flex: none; display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 18px; border-radius: 12px; border: 1px solid var(--line-2); background: #fff; color: var(--ink-2); font-weight: 600; font-size: 15px; cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
.need-tab .icon { width: 20px; height: 20px; color: var(--accent-ink); }
.need-tab:hover { border-color: var(--ink); color: var(--ink); }
.need-tab[aria-selected="true"] { background: var(--ink); border-color: var(--ink); color: #fff; }
.need-tab[aria-selected="true"] .icon { color: var(--accent-night); }
.need-intro { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 20px; margin-bottom: 16px; }
.need-intro p { margin: 0; max-width: 680px; color: var(--ink-2); }
.need-panel.is-entering ul.products { animation: neo-rise .45s ease both; }

.visit-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: center; }
.visit-photo { position: relative; margin: 0; overflow: hidden; aspect-ratio: 4 / 3; border-radius: var(--radius-lg); background: var(--panel); }
.visit-photo img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.9) contrast(1.04); }
.visit-photo::after { content: ""; position: absolute; inset: 10px; border: 1px solid rgba(255, 255, 255, .55); border-radius: 18px; pointer-events: none; }
.visit-photo figcaption { position: absolute; z-index: 1; bottom: 18px; inset-inline-start: 18px; max-width: calc(100% - 36px); display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px; border-radius: 10px; background: rgba(15, 18, 24, .8); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color: #fff; font-size: 13px; line-height: 1.5; }
.visit-text { min-width: 0; }
.visit-text h2 { font-size: clamp(23px, 5.6vw, 36px); }
.visit-text > p { color: var(--ink-2); max-width: 560px; }
.open-now { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 16px; padding: 6px 14px; border-radius: 999px; background: var(--panel); color: var(--ink); font-size: 14px; font-weight: 600; }
.open-dot { width: 8px; height: 8px; border-radius: 50%; background: #9aa3b2; }
.open-now.is-open .open-dot { background: var(--ok); box-shadow: 0 0 0 4px rgba(22, 163, 74, .18); }
.open-now.on-dark { background: rgba(255, 255, 255, .08); color: #fff; margin: 14px 0 0; }
.visit-list { list-style: none; margin: 0 0 20px; padding: 0; display: grid; gap: 10px; }
.visit-list li { display: flex; gap: 10px; align-items: flex-start; }
.visit-list li span { min-width: 0; }
.visit-list .icon { width: 21px; height: 21px; margin-top: 2px; color: var(--accent-ink); }
.visit-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.visit-actions .btn { flex: 1 1 160px; }

.cta-demo { padding-block: 0 56px; }
.cta-card { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; align-items: center; padding: 24px; border-radius: var(--radius-lg); background: linear-gradient(135deg, var(--accent-soft), #f5f8ff 70%); border: 1px solid #d3defd; }
.cta-card h2 { font-size: 22px; margin-bottom: 6px; }
.cta-card p { margin: 0; color: var(--ink-2); max-width: 700px; }

/* ---------- Shop page ---------- */
.shop-wrap { padding-block: 14px 56px; }
.woocommerce-products-header { margin-bottom: 8px; }
.woocommerce-products-header__title.page-title { font-size: clamp(26px, 7vw, 40px); margin: 4px 0; }
.term-description { color: var(--ink-2); font-size: 15px; max-width: 760px; }
.breadcrumb, .woocommerce .woocommerce-breadcrumb { font-size: 13px; color: var(--muted); margin: 0 0 6px; }
.breadcrumb a, .woocommerce .woocommerce-breadcrumb a { color: var(--ink-2); }
.breadcrumb a:hover { color: var(--accent-ink); }
.breadcrumb .sep { margin-inline: 6px; opacity: .6; }
.chips { display: flex; gap: 8px; overflow-x: auto; padding: 4px 0 12px; margin-bottom: 6px; scrollbar-width: none; scroll-padding-inline: var(--gutter); }
.chips::-webkit-scrollbar { display: none; }
.chip { position: relative; flex: none; display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 10px; border: 1px solid var(--line-2); background: #fff; font-size: 14px; font-weight: 500; color: var(--ink-2); }
.chip:hover { border-color: var(--ink); color: var(--ink); }
.chip.is-active { background: var(--ink); color: #fff; border-color: var(--ink); }
.woocommerce .woocommerce-result-count { margin: 0 0 14px; font-size: 13px; color: var(--muted); float: none; }
.woocommerce .woocommerce-ordering { float: none; margin: 0 0 16px; }
.woocommerce .woocommerce-ordering select {
	appearance: none; -webkit-appearance: none; min-height: 44px; padding: 0 16px; padding-inline-end: 40px; border: 1px solid var(--line-2); border-radius: 12px;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23353c4a' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat left 14px center / 18px; font-size: 14px; cursor: pointer; width: 100%;
}
[dir="ltr"] .woocommerce .woocommerce-ordering select { background-position: right 14px center; }
.woocommerce nav.woocommerce-pagination { margin-top: 32px; }
.woocommerce nav.woocommerce-pagination ul { border: 0; display: inline-flex; flex-wrap: wrap; gap: 6px; }
.woocommerce nav.woocommerce-pagination ul li { border: 0; }
.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span { min-width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; border: 1px solid var(--line-2); background: #fff; padding: 0 10px; font-family: var(--mono); }
.woocommerce nav.woocommerce-pagination ul li span.current { background: var(--ink); color: #fff; border-color: var(--ink); }
.woocommerce-info, .woocommerce-message, .woocommerce-error, .woocommerce-noreviews, p.no-comments { border: 1px solid var(--line) !important; border-radius: var(--radius); background: var(--panel-2) !important; color: var(--ink) !important; padding: 14px 18px !important; margin: 0 0 18px !important; list-style: none; }
.woocommerce-message { border-color: #bfe3cf !important; background: #f1faf5 !important; }
.woocommerce-error { border-color: #f6c3cf !important; background: #fff4f6 !important; }
.woocommerce-info::before, .woocommerce-message::before, .woocommerce-error::before { display: none; }
.woocommerce-message .button, .woocommerce-info .button { float: none !important; min-height: 40px; margin-inline-start: 12px; }

/* ---------- Single product ---------- */
.woocommerce div.product { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; margin-top: 4px; }
.woocommerce div.product div.images, .woocommerce div.product div.summary { width: auto !important; float: none !important; margin: 0 !important; min-width: 0; }
.woocommerce div.product div.images { position: relative; margin-inline: calc(var(--gutter) * -1) !important; }
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper, .woocommerce div.product div.images .flex-viewport { background: var(--panel); isolation: isolate; }
.woocommerce div.product div.images img { mix-blend-mode: multiply; filter: saturate(.94) contrast(1.03); }
.woocommerce div.product div.images .flex-control-thumbs { display: flex; gap: 8px; margin-top: 8px; padding-inline: var(--gutter); }
.woocommerce div.product div.images .flex-control-thumbs li { width: 64px !important; }
.woocommerce div.product div.images .flex-control-thumbs img { border-radius: 10px; opacity: .6; mix-blend-mode: normal; }
.woocommerce div.product div.images .flex-control-thumbs img.flex-active { opacity: 1; }
.woocommerce div.product div.images .woocommerce-product-gallery__trigger { top: 12px; background: #fff; border-radius: 12px; }
[dir="rtl"] .woocommerce div.product div.images .woocommerce-product-gallery__trigger { left: 12px; right: auto; }
.woocommerce div.product span.onsale { position: absolute; top: 12px; z-index: 3; margin: 0; min-width: 0; min-height: 0; padding: 3px 10px; line-height: 1.6; border-radius: 8px; background: var(--sale); color: #fff; font: 500 13px/1.6 var(--mono); direction: ltr; }
[dir="rtl"] .woocommerce div.product span.onsale { right: 12px; left: auto; }
[dir="ltr"] .woocommerce div.product span.onsale { left: 12px; right: auto; }
.summary-kicker { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 6px; font-size: 13px; font-weight: 600; color: var(--accent-ink); }
.woocommerce div.product .product_title { font-size: clamp(23px, 6vw, 34px); line-height: 1.4; margin-bottom: 10px; }
.spec-chips { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 14px; padding: 0; }
.spec-chips li { padding: 4px 10px; border-radius: 8px; background: var(--panel); border: 1px solid var(--line); font: 500 12.5px/1.6 var(--mono); color: var(--ink-2); }
.woocommerce div.product p.price, .woocommerce div.product span.price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin-bottom: 12px; font-family: var(--mono); font-size: 26px; font-weight: 500; color: var(--ink); }
.woocommerce div.product p.price del, .woocommerce div.product span.price del { color: var(--muted); font-size: 16px; font-weight: 400; opacity: 1; }
.woocommerce div.product p.price ins, .woocommerce div.product span.price ins { color: var(--sale); text-decoration: none; }
.woocommerce-product-details__short-description { color: var(--ink-2); font-size: 15.5px; }
.stock-line { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 0 0 4px; font-size: 14px; color: var(--ink-2); }
.woocommerce div.product form.cart { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; margin: 18px 0; }
.woocommerce div.product form.cart::before, .woocommerce div.product form.cart::after { display: none; }
.woocommerce div.product form.cart.variations_form { display: block; position: relative; }
.woocommerce div.product form.cart .variations { width: 100%; margin-bottom: 12px; border: 0; }
.woocommerce div.product form.cart .variations tr { display: block; margin-bottom: 10px; }
.woocommerce div.product form.cart .variations th, .woocommerce div.product form.cart .variations td { display: block; padding: 0; text-align: start; line-height: 1.5; }
.woocommerce div.product form.cart .variations label { font-weight: 600; font-size: 14px; }
.woocommerce div.product form.cart .variations td.value { position: relative; margin: 8px 0 4px; }
.woocommerce div.product form.cart .variations select { min-height: 44px; border: 1px solid var(--line-2); border-radius: 12px; padding: 0 14px; width: 100%; background: #fff; }
.woocommerce div.product form.cart .variations select.is-replaced { position: absolute !important; top: 0; inset-inline-start: 0; width: 1px !important; height: 1px !important; opacity: 0; pointer-events: none; }
.option-buttons { display: flex; flex-wrap: wrap; gap: 8px; }
.option-btn { display: inline-flex; align-items: center; gap: 8px; min-width: 56px; min-height: 44px; padding: 0 16px; border-radius: 12px; border: 1px solid var(--line-2); background: #fff; font-weight: 600; font-size: 14px; cursor: pointer; transition: .15s; }
.option-btn:hover { border-color: var(--ink); }
.option-btn[aria-pressed="true"] { border-color: var(--accent); background: var(--accent-soft); color: var(--ink); box-shadow: inset 0 0 0 1px var(--accent); }
.option-btn:disabled { opacity: .4; text-decoration: line-through; cursor: not-allowed; }
.swatch-dot { width: 16px; height: 16px; flex: none; border-radius: 50%; background: var(--dot, #ccc); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .18); }
.option-btn[aria-pressed="true"] .swatch-dot { box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .18), 0 0 0 2px #fff, 0 0 0 3px var(--accent); }
form.cart.needs-option .option-buttons { animation: neo-shake .4s; }
form.cart.needs-option .variations label { color: var(--sale-ink); }
@keyframes neo-shake { 25% { transform: translateX(-6px); } 50% { transform: translateX(6px); } 75% { transform: translateX(-3px); } }
.woocommerce div.product form.cart .reset_variations { font-size: 13px; color: var(--muted); display: inline-block; margin-top: 8px; }
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end; }
.woocommerce div.product .woocommerce-variation-price { margin-bottom: 10px; }
.woocommerce .quantity .qty { width: 88px; min-height: 52px; border: 1px solid var(--line-2); border-radius: 12px; text-align: center; background: #fff; font-family: var(--mono); font-weight: 500; }
.woocommerce div.product form.cart .button { flex: 1 1 180px; min-height: 52px; font-size: 16px; }
.promise { list-style: none; padding: 14px 16px; margin: 0 0 12px; display: grid; gap: 11px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel-2); }
.promise li { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; line-height: 1.6; }
.promise li span { min-width: 0; }
.promise .icon { color: var(--accent-ink); width: 21px; height: 21px; margin-top: 1px; }
.instalment-note { display: flex; gap: 8px; align-items: flex-start; margin: 0 0 18px; font-size: 13.5px; color: var(--muted); }
.instalment-note .icon { width: 18px; height: 18px; margin-top: 2px; }
.product_meta { font-size: 13px; color: var(--muted); }
.product_meta a { color: var(--ink-2); font-weight: 500; }

/* Specs table, box contents, warranty and returns */
.product-specs { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; min-width: 0; margin-top: 12px; padding-top: 28px; border-top: 1px solid var(--line); }
.product-specs h2 { font-size: clamp(21px, 5vw, 28px); margin-bottom: 14px; }
.specs-main { min-width: 0; }
.specs-table { width: 100%; border-collapse: separate; border-spacing: 0; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); font-size: 15px; }
.specs-table th, .specs-table td { padding: 13px 16px; text-align: start; vertical-align: top; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
.specs-table tr:last-child th, .specs-table tr:last-child td { border-bottom: 0; }
.specs-table tr:nth-child(odd) th, .specs-table tr:nth-child(odd) td { background: var(--panel-2); }
.specs-table th { width: 38%; font-weight: 500; color: var(--muted); font-size: 14px; }
.specs-table td { font-weight: 500; color: var(--ink); font-variant-numeric: tabular-nums; }
.specs-side { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; align-content: start; min-width: 0; }
.side-card { min-width: 0; padding: 18px; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.side-card h3 { display: flex; align-items: center; gap: 8px; font-size: 16px; margin: 0 0 8px; }
.side-card h3 .icon { width: 22px; height: 22px; color: var(--accent-ink); }
.side-card p { margin: 0 0 6px; font-size: 14.5px; color: var(--ink-2); }
.box-card { background: var(--panel-2); }
.box-card ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.box-card li { position: relative; padding-inline-start: 26px; font-size: 14.5px; }
.box-card li::before { content: ""; position: absolute; inset-inline-start: 0; top: 4px; width: 16px; height: 16px; border-radius: 5px; background: var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 4.5 4.5L19 7'/%3E%3C/svg%3E") no-repeat center / 11px; }

.woocommerce div.product .woocommerce-tabs { grid-column: 1 / -1; margin-top: 8px; min-width: 0; }
.woocommerce div.product .woocommerce-tabs ul.tabs { display: flex; gap: 20px; padding: 0; margin: 0 0 14px; border-bottom: 1px solid var(--line); overflow-x: auto; }
.woocommerce div.product .woocommerce-tabs ul.tabs::before, .woocommerce div.product .woocommerce-tabs ul.tabs li::before, .woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li { position: relative; border: 0; background: none; border-radius: 0; margin: 0; padding: 0; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { padding: 10px 0; font-weight: 600; font-size: 15px; color: var(--muted); white-space: nowrap; border-bottom: 2px solid transparent; display: block; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--ink); border-bottom-color: var(--accent); }
.woocommerce div.product .woocommerce-tabs .panel { padding: 0; margin: 0; background: none; border: 0; max-width: 820px; }
.woocommerce div.product .woocommerce-tabs .panel > h2:first-child { display: none; }
.woocommerce div.product .woocommerce-tabs .panel ul, .woocommerce div.product .woocommerce-tabs .panel ol { padding-inline-start: 1.3em; }
.woocommerce div.product .woocommerce-tabs .panel h3 { font-size: 18px; margin-top: 1.2em; }
.woocommerce div.product .related, .woocommerce div.product .upsells { grid-column: 1 / -1; margin-top: 20px; min-width: 0; }
.woocommerce div.product .related > h2, .woocommerce div.product .upsells > h2 { font-size: clamp(21px, 5vw, 28px); margin-bottom: 16px; }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .woocommerce form .form-row select { border: 1px solid var(--line-2); border-radius: 10px; background: #fff; padding: 12px 14px; min-height: 48px; font-size: 16px; }
.woocommerce form .form-row label { font-weight: 500; }

/* Phone buy bar */
.buybar { position: fixed; inset-inline: 0; bottom: 0; z-index: 46; display: flex; align-items: center; gap: 12px; padding: 10px var(--gutter) calc(10px + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .96); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-top: 1px solid var(--line); box-shadow: 0 -8px 24px rgba(15, 18, 24, .08); }
.buybar-info { flex: 1; min-width: 0; display: grid; line-height: 1.35; }
.buybar-name { font-size: 13px; color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.buybar-price { font-family: var(--mono); font-weight: 500; font-size: 15px; }
.buybar-price del { color: var(--muted); font-weight: 400; font-size: 12px; }
.buybar-price ins { text-decoration: none; color: var(--sale); }
.buybar .btn { flex: 0 0 auto; min-height: 46px; padding: 0 20px; }
body.single-product .tabbar { display: none; }
body.single-product { padding-bottom: 80px; }

/* Toast */
.toast { position: fixed; z-index: 70; inset-inline: 16px; bottom: calc(var(--tabbar-h) + 14px + env(safe-area-inset-bottom)); margin-inline: auto; max-width: 420px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 18px; border-radius: 14px; background: var(--night); color: #fff; font-weight: 500; box-shadow: var(--shadow-lg); border: 1px solid var(--night-line); opacity: 0; transform: translateY(10px); transition: opacity .25s, transform .25s; }
.toast::before { content: ""; width: 8px; height: 8px; flex: none; border-radius: 50%; background: var(--ok); }
.toast span { flex: 1; min-width: 0; }
.toast.is-on { opacity: 1; transform: none; }
.toast a { color: var(--accent-night); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
body.single-product .toast { bottom: calc(86px + env(safe-area-inset-bottom)); }

/* ---------- Pages, cart, checkout, account ---------- */
.page-wrap { padding-block: 20px 56px; }
.page-wrap.narrow { max-width: 820px; }
.page-head h1 { font-size: clamp(26px, 7vw, 40px); margin-top: 4px; }
.page-lead { color: var(--ink-2); max-width: 680px; }
.entry { font-size: 16px; min-width: 0; }
.entry > :first-child { margin-top: 0; }
.entry h2 { font-size: 22px; margin-top: 1.4em; }
.entry h3 { font-size: 18px; margin-top: 1.2em; }
.entry ul, .entry ol { padding-inline-start: 1.3em; }
.entry li { margin-bottom: .35em; }
:where(.page-wrap:not(.is-store-page)) .entry a:where(:not(.button):not(.btn):not(.wc-block-components-button)) { color: var(--accent-ink); text-decoration: underline; text-underline-offset: 3px; }
.is-store-page .entry a:where(:not(.button):not(.btn):not([class*="wc-block"])) { text-decoration: underline; text-underline-offset: 3px; }
.woocommerce-MyAccount-content a:where(:not(.button)) { color: var(--accent-ink); }
.entry ul.products { padding: 0; }
.entry ul.products li { margin-bottom: 0; }
.entry ul.products a { color: var(--ink); text-decoration: none; }
.entry ul.products .quick-add:hover, .entry ul.products .quick-add.added { color: #fff; }
.entry figure { margin: 0 0 1.4em; max-width: 100%; overflow-x: auto; }
.entry figure.page-photo { overflow: hidden; border-radius: var(--radius-lg); background: var(--panel); }
.entry figure.page-photo img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.entry table { width: 100%; border-collapse: separate; border-spacing: 0; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.entry th, .entry td { padding: 12px 14px; border-bottom: 1px solid var(--line); text-align: start; vertical-align: top; overflow-wrap: anywhere; }
.entry tr:last-child td { border-bottom: 0; }
.entry th { background: var(--panel); font-weight: 600; font-size: 14.5px; }
.credits-table { font-size: 14px; }
.credits-table small { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; }
.store-note { display: flex; gap: 10px; align-items: flex-start; padding: 14px 16px; margin: 0 0 20px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel-2); font-size: 14.5px; color: var(--ink-2); line-height: 1.7; }
.store-note span { min-width: 0; }
.store-note .icon { color: var(--accent-ink); width: 22px; height: 22px; margin-top: 2px; }
.wc-block-components-button:not(.is-link), .wc-block-cart__submit-button, .wc-block-components-checkout-place-order-button { background: var(--accent) !important; color: #fff !important; border-radius: 12px !important; min-height: 52px; font-family: var(--font); font-weight: 600; }
.wc-block-components-button:not(.is-link):hover { background: var(--accent-dark) !important; }
.wc-block-components-text-input input, .wc-block-components-combobox .wc-block-components-combobox-control input, .wc-block-components-textarea, .wc-blocks-components-select .wc-blocks-components-select__select { border-radius: 10px !important; border-color: var(--line-2) !important; }
.wc-block-components-product-name { font-weight: 600; color: var(--ink) !important; }
.wc-block-components-product-price, .wc-block-components-totals-item__value, .wc-block-components-formatted-money-amount { font-family: var(--mono); font-variant-numeric: tabular-nums; }
.wc-block-components-radio-control__option-checked, .wc-block-components-radio-control-accordion-option--checked-option-highlighted { box-shadow: inset 0 0 0 2px var(--accent) !important; }
.wc-block-cart-item__image img, .wc-block-components-order-summary-item__image img { border-radius: 10px; background: var(--panel); }
.woocommerce table.shop_table { border: 1px solid var(--line); border-radius: var(--radius); background: #fff; border-collapse: separate; }
.woocommerce table.shop_table th, .woocommerce table.shop_table td { border-top-color: var(--line); padding: 12px; }
.woocommerce-account .woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; margin: 0 0 20px; display: flex; gap: 6px; overflow-x: auto; }
.woocommerce-account .woocommerce-MyAccount-navigation li { position: relative; flex: none; }
.woocommerce-account .woocommerce-MyAccount-navigation li a { display: flex; align-items: center; min-height: 40px; padding: 0 16px; border: 1px solid var(--line-2); border-radius: 10px; background: #fff; white-space: nowrap; font-size: 14px; text-decoration: none; color: inherit; }
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { background: var(--ink); color: #fff; border-color: var(--ink); }
.woocommerce-account .woocommerce-MyAccount-navigation, .woocommerce-account .woocommerce-MyAccount-content { float: none; width: auto; min-width: 0; }
.woocommerce-account .woocommerce::before, .woocommerce-account .woocommerce::after { display: none; }
.woocommerce form.login, .woocommerce form.register { border: 1px solid var(--line) !important; border-radius: var(--radius) !important; background: #fff; padding: 22px !important; margin: 0 0 18px !important; }
.order-next { display: grid; gap: 10px; margin: 0 0 22px; }
.order-next p { display: flex; gap: 10px; align-items: flex-start; margin: 0; padding: 14px 16px; border-radius: var(--radius); background: var(--accent-soft); border: 1px solid #d3defd; }
.order-next p span { min-width: 0; }
.order-next .icon { color: var(--accent-ink); width: 22px; height: 22px; margin-top: 2px; }
.empty-state { text-align: center; display: grid; grid-template-columns: minmax(0, 1fr); justify-items: center; gap: 10px; }
.empty-state .empty-art { width: min(260px, 70vw); height: auto; padding: 18px; border-radius: var(--radius-lg); background: var(--night); }
.empty-art .a-code { fill: var(--accent-night); stroke: none; font: 500 34px var(--mono); letter-spacing: .08em; }
.empty-state .search-form { width: 100%; }
.post-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; }
.post-card img, .post-cover img { border-radius: var(--radius); margin-bottom: 10px; }

/* Contact page */
.contact-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; align-items: start; }
.contact-card { padding: 22px; border-radius: var(--radius-lg); background: var(--night); color: var(--on-night); min-width: 0; display: grid; gap: 10px; }
.contact-card .brand { color: #fff; margin-bottom: 8px; justify-self: start; }
.contact-card .brand-mark { color: #fff; }
.contact-card .brand-mark .mk-bolt { fill: var(--accent-night); }
.contact-card .brand-mark .mk-arc { stroke: var(--accent-night); }
.contact-card ul { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 14px; }
.contact-card li { display: flex; gap: 12px; align-items: flex-start; }
.contact-card li > span { display: grid; min-width: 0; overflow-wrap: anywhere; }
.contact-card strong { font-weight: 600; font-size: 13px; color: var(--on-night-2); }
.contact-card .icon { color: var(--accent-night); width: 22px; height: 22px; margin-top: 2px; }
.contact-card a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.contact-card .btn { text-decoration: none; }
.contact-card .open-now { justify-self: start; }
.contact-card .contact-hint { margin: 4px 0 0; font-size: 13.5px; color: var(--on-night-2); }
.contact-form { padding: 22px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: #fff; }
.swst-contact { display: block !important; margin: 0 !important; color: var(--ink); }
.swst-contact .swst-contact-form { padding: 0 !important; border: 0 !important; background: none !important; }
.swst-contact .swst-contact-details { display: none !important; }
.swst-contact h2 { margin-top: 0 !important; font-size: 22px !important; font-family: var(--display) !important; }
.swst-contact .swst-intro { color: var(--muted) !important; }
.swst-contact input:not([type=hidden]), .swst-contact textarea { background: #fff !important; border-color: var(--line-2) !important; border-radius: 10px !important; }
.swst-contact .swst-submit { font-family: var(--font) !important; background: var(--accent) !important; border-radius: 12px !important; }
.swst-contact .swst-trap { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; clip-path: inset(50%) !important; white-space: nowrap !important; }

/* ---------- Footer ---------- */
.site-footer { position: relative; background: var(--night); color: var(--on-night-2); padding-top: 44px; font-size: 14px; border-top: 1px solid var(--night-line); }
.site-footer::before { content: ""; position: absolute; top: -1px; inset-inline: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--accent) 50%, transparent); opacity: .7; }
.site-footer a { color: var(--on-night); }
.site-footer a:hover { color: #fff; }
.site-footer .brand { color: #fff; justify-self: start; }
.site-footer .brand-mark { color: #fff; }
.site-footer .brand-mark .mk-bolt { fill: var(--accent-night); }
.site-footer .brand-mark .mk-arc { stroke: var(--accent-night); }
.footer-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; padding-bottom: 20px; align-items: start; }
.footer-brand { grid-column: 1 / -1; padding-bottom: 20px; min-width: 0; }
.footer-brand p { margin: 12px 0 16px; max-width: 400px; }
.footer-pay { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; padding: 0; }
.footer-pay li { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 8px; border: 1px solid var(--night-line); font-size: 12.5px; color: var(--on-night); }
.footer-pay .icon { width: 17px; height: 17px; color: var(--accent-night); }
.footer-col { border-top: 1px solid var(--night-line); min-width: 0; }
.footer-contact { grid-column: 1 / -1; }
.footer-col summary { list-style: none; display: flex; align-items: center; justify-content: space-between; min-height: 52px; padding: 4px 0; cursor: pointer; font-family: var(--display); font-weight: 700; font-size: 15px; color: #fff; }
.footer-col summary::-webkit-details-marker { display: none; }
.footer-col summary::after { content: "+"; font-family: var(--mono); font-size: 18px; font-weight: 400; color: var(--on-night-2); }
.footer-col[open] summary::after { content: "–"; }
.footer-col ul { list-style: none; margin: 0; padding: 0 0 16px; display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
.footer-col li { min-width: 0; }
.footer-contact li { display: flex; gap: 10px; align-items: flex-start; min-width: 0; overflow-wrap: anywhere; }
.footer-contact li > span, .footer-contact li > a { min-width: 0; }
.footer-contact .icon { width: 18px; height: 18px; margin-top: 3px; color: var(--accent-night); }
.socials { display: flex; gap: 8px; }
.socials a { position: relative; width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: rgba(255, 255, 255, .06); border: 1px solid var(--night-line); }
.socials a:hover { background: var(--accent); }
.socials .icon { width: 19px; height: 19px; }
.footer-bottom { display: flex; flex-wrap: wrap; gap: 8px 20px; justify-content: space-between; align-items: center; border-top: 1px solid var(--night-line); padding-block: 16px; font-size: 12.5px; color: var(--on-night-2); }
.footer-legal { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; }
.site-footer .footer-legal a { color: var(--on-night); }

/* ---------- Phone tab bar ---------- */
.tabbar { position: fixed; inset-inline: 0; bottom: 0; z-index: 45; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); background: rgba(255, 255, 255, .96); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-top: 1px solid var(--line); padding-bottom: env(safe-area-inset-bottom); }
.tabbar a, .tabbar button { display: grid; justify-items: center; gap: 2px; padding: 8px 0 6px; font-size: 11px; font-weight: 500; color: var(--muted); background: none; border: 0; cursor: pointer; min-width: 0; }
.tabbar .icon { width: 22px; height: 22px; }
.tabbar [aria-current="page"] { color: var(--ink); }
.tabbar [aria-current="page"] .icon { color: var(--accent); }
.tab-icon { position: relative; display: inline-grid; }
.tabbar .neon-cart-count { top: -6px; inset-inline-end: -10px; }

/* ---------- Reveal on scroll (only below the fold, only with motion) ---------- */
.has-reveal .reveal { transition: opacity .7s ease, transform .7s cubic-bezier(.2, .7, .2, 1), border-color .2s, box-shadow .2s; }
.has-reveal .reveal.is-pending { opacity: 0; transform: translateY(22px); }
.has-reveal .why-card.is-drawn .a-accent { stroke-dasharray: 160; animation: neo-draw 1.2s ease .2s both; }
@keyframes neo-draw { from { stroke-dashoffset: 160; } to { stroke-dashoffset: 0; } }

/* One-column grids never grow wider than their box (long names, prices, e-mail addresses). */
.spot-info > div, .tile-text, .buybar-info, .contact-card, .contact-card li > span, .visit-list, .promise, .box-card ul, .order-next { grid-template-columns: minmax(0, 1fr); }

/* ---------- Breakpoints ---------- */
@media (max-width: 599px) {
	.card-badges { top: 14px; inset-inline-start: 14px; }
	.quick-add { top: 14px; inset-inline-end: 14px; }
	.demo-bar { font-size: 12px; }
	.demo-bar-inner { flex-wrap: wrap; }
	.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 14px; }
	.card-specs { font-size: 11px; }
	.tile-text { padding: 36px 12px 12px; }
	.tile-text strong { font-size: 15px; }
	.bento-tile:first-child .tile-text strong, .bento-tile:nth-child(6) .tile-text strong { font-size: 17px; }
}

@media (max-width: 380px) {
	.hero-facts { gap: 8px; }
	.hero-facts dd { font-size: 14.5px; }
	.spot-tab { font-size: 11.5px; }
	.brand-name { font-size: 21px; }
	.brand-mark { width: 28px; height: 28px; }
	html[lang^="en"] .brand-name { font-size: 17px; letter-spacing: .14em; }
}

@media (min-width: 600px) {
	:root { --gutter: 24px; }
	.woocommerce ul.products, .woocommerce-page ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
	.deals-rail ul.products { grid-auto-columns: 38%; }
	.hero-actions .btn { flex: 0 0 auto; }
	.woocommerce .woocommerce-ordering select { width: auto; }
	.shop-wrap .woocommerce-result-count { float: right !important; }
	[dir="rtl"] .shop-wrap .woocommerce-ordering { float: left !important; }
	[dir="ltr"] .shop-wrap .woocommerce-result-count { float: left !important; }
	[dir="ltr"] .shop-wrap .woocommerce-ordering { float: right !important; }
	.shop-wrap ul.products { clear: both; }
	.why-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.bento { grid-auto-rows: minmax(220px, auto); }
	.woocommerce div.product div.images { margin-inline: 0 !important; }
	.woocommerce div.product div.images .woocommerce-product-gallery__wrapper, .woocommerce div.product div.images .flex-viewport { border-radius: 20px; overflow: hidden; }
	.woocommerce div.product div.images .flex-control-thumbs { padding-inline: 0; }
	.cta-card { padding: 32px; }
}

@media (min-width: 760px) {
	.contact-grid { grid-template-columns: minmax(0, .8fr) minmax(0, 1.4fr); gap: 28px; }
	.contact-card, .contact-form { padding: 30px; }
	.hero-inner { padding-block: 40px 52px; }
	.spot-stage { padding: 16px; }
}

@media (min-width: 960px) {
	.section { padding-block: 72px; }
	.section-follow { padding-top: 16px; }
	.section-head { margin-bottom: 26px; }
	.woocommerce ul.products, .woocommerce-page ul.products { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
	.deals-rail { margin-inline: 0; }
	.deals-rail ul.products { grid-auto-flow: row; grid-template-columns: repeat(5, minmax(0, 1fr)) !important; overflow: visible; padding: 0 !important; }
	.hero-inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); grid-template-areas: ". spot" "head spot" "body spot" ". spot"; grid-template-rows: 1fr auto auto 1fr; gap: 0 56px; min-height: min(78vh, 720px); padding-block: 56px; align-content: center; }
	.hero-head { grid-area: head; margin-bottom: 18px; }
	.hero-body { grid-area: body; }
	.spotlight { grid-area: spot; align-self: center; }
	.hero-title { font-size: clamp(44px, 4.6vw, 64px); }
	.bento { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 230px; gap: 16px; }
	.bento-tile:first-child { grid-column: span 2; grid-row: span 2; }
	.bento-tile:nth-child(2), .bento-tile:nth-child(5), .bento-tile:nth-child(6) { grid-column: span 2; }
	.bento-tile:first-child .tile-text strong { font-size: 24px; }
	.why { padding-block: 88px; }
	.why-head { margin-bottom: 36px; }
	.why-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
	.why-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 24px; margin-top: 40px; }
	.need-tabs { margin-inline: 0; padding-inline: 0; }
	.visit-grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 56px; }
	.cta-card { grid-template-columns: minmax(0, 1fr) auto; padding: 36px 40px; }
	.woocommerce div.product { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 56px; align-items: start; margin-top: 12px; }
	.woocommerce div.product div.summary { position: sticky; top: calc(var(--header-h) + 24px); }
	.product-specs { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 32px; margin-top: 24px; padding-top: 40px; }
	.specs-side { padding-top: 54px; }
	.footer-grid { grid-template-columns: minmax(0, 1.3fr) minmax(0, .8fr) minmax(0, .9fr) minmax(0, 1.3fr); gap: 40px; padding-bottom: 40px; }
	.footer-brand, .footer-contact { grid-column: auto; }
	.footer-col { border: 0; }
	.footer-col summary { pointer-events: none; min-height: 0; padding: 0 0 12px; }
	.footer-col summary::after { display: none; }
	.woocommerce-account .woocommerce { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 32px; }
	.woocommerce-account .woocommerce-MyAccount-navigation ul { display: grid; }
	.woocommerce-account .woocommerce > .woocommerce-notices-wrapper { grid-column: 1 / -1; }
}

@media (min-width: 960px) and (hover: hover) {
	.quick-add { opacity: 0; transform: translateY(-4px); }
	.woocommerce ul.products li.product:hover .quick-add, .quick-add:focus-visible, .quick-add.added, .quick-add.loading { opacity: 1; transform: none; }
}

/* The header becomes the desktop one when the menu fits. */
@media (min-width: 1024px) {
	:root { --header-h: 72px; }
	body, body.single-product { padding-bottom: 0; }
	.only-mobile { display: none !important; }
	.main-nav.only-desktop { display: block !important; }
	.icon-btn.only-desktop { display: inline-grid !important; }
	.admin-bar .site-header { top: 32px; }
	.header-row { grid-template-columns: auto minmax(0, 1fr) auto; gap: 24px; }
	.brand { justify-self: start; }
	.main-nav { justify-self: center; }
	.toast, body.single-product .toast { bottom: 24px; }
}

@media (min-width: 1024px) and (max-width: 1199px) {
	.main-nav .nav-list a { padding-inline: 9px; font-size: 14.5px; }
	.main-nav .menu-item-has-children > a { padding-inline-end: 22px; }
	.main-nav .menu-item-has-children > a::before { inset-inline-end: 8px; }
	.main-nav .nav-list > li > a::after { inset-inline: 9px; }
}

@media (max-width: 1023px) {
	.header-actions .icon-btn { width: 40px; }
	.header-actions .lang-btn { min-width: 36px; padding: 0 8px; margin-inline-end: 0; }
}

/* Touch screens: every control is at least 44px. */
@media (pointer: coarse) {
	.lang-btn { height: 44px; min-width: 44px; }
	.chip, .link-more, .woocommerce-account .woocommerce-MyAccount-navigation li a { min-height: 44px; }
	.quick-add { width: 44px; height: 44px; }
	.header-actions .icon-btn { width: 44px; }
	.demo-bar-close { width: 44px; height: 44px; }
	.footer-col li a, .footer-legal a, .demo-bar a, .breadcrumb a, .spot-name { display: inline-flex; align-items: center; min-height: 44px; }
	.footer-col ul { gap: 0; }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
	.ticker { overflow-x: auto; scrollbar-width: none; }
	.ticker-group[aria-hidden="true"] { display: none; }
	.bento-tile:hover .tile-img img, .woocommerce ul.products li.product:hover .card-media img { transform: none; }
	.has-reveal .reveal.is-pending { opacity: 1; transform: none; }
}

/* Windows high contrast: the gradient words keep a real colour. */
@media (forced-colors: active) {
	.hero-title span { background: none; -webkit-text-fill-color: currentColor; }
}

/* English pages: longer words in the headline and the labels. */
html[lang^="en"] .hero-title { font-size: clamp(30px, 8vw, 58px); line-height: 1.18; }
html[lang^="en"] .hero-title span { display: block; }
html[lang^="en"] h1, html[lang^="en"] h2, html[lang^="en"] h3 { line-height: 1.25; letter-spacing: -.01em; }
@media (min-width: 960px) {
	html[lang^="en"] .hero-title { font-size: clamp(42px, 4.4vw, 60px); }
}