/* Built by build-css.php — edit the source files, then rerun. */
/* == fonts.css == */
@font-face {
font-family: 'Black Ops One';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../fonts/blackopsone-400-cyrillic-ext.woff2') format('woff2');
unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
font-family: 'Black Ops One';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../fonts/blackopsone-400-vietnamese.woff2') format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
font-family: 'Black Ops One';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../fonts/blackopsone-400-latin-ext.woff2') format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Black Ops One';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../fonts/blackopsone-400-latin.woff2') format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Rajdhani';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../fonts/rajdhani-400-devanagari.woff2') format('woff2');
unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}
@font-face {
font-family: 'Rajdhani';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../fonts/rajdhani-400-latin-ext.woff2') format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Rajdhani';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../fonts/rajdhani-400-latin.woff2') format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Rajdhani';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url('../fonts/rajdhani-600-devanagari.woff2') format('woff2');
unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}
@font-face {
font-family: 'Rajdhani';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url('../fonts/rajdhani-600-latin-ext.woff2') format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Rajdhani';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url('../fonts/rajdhani-600-latin.woff2') format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Rajdhani';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('../fonts/rajdhani-700-devanagari.woff2') format('woff2');
unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}
@font-face {
font-family: 'Rajdhani';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('../fonts/rajdhani-700-latin-ext.woff2') format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Rajdhani';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('../fonts/rajdhani-700-latin.woff2') format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* == base.css == */
:root {
--tx-black:        #080810;
--tx-void:         #0A0A14;
--tx-navy:         #131650;
--tx-navy-light:   #1A2070;
--tx-card:         #111436;
--tx-border:       #1E2456;
--tx-green:        #39FF14;
--tx-green-dark:   #2ACC0F;
--tx-green-glow:   rgba(57, 255, 20, 0.15);
--tx-green-subtle: rgba(57, 255, 20, 0.07);
--tx-red:          #FF3D3D;
--tx-orange:       #FF9F00;
--tx-white:        #F0F2FF;
--tx-muted:        #8A8FB8;
--tx-muted-light:  #B0B5D8;
--font-display: 'Black Ops One', sans-serif;
--font-body:    'Rajdhani', sans-serif;
--font-mono:    'JetBrains Mono', 'Fira Code', monospace;
--text-xs:   11px;
--text-sm:   13px;
--text-base: clamp(14px, 0.875rem + 0.15vw, 16px);
--text-md:   clamp(15px, 0.95rem + 0.3vw, 18px);
--text-lg:   clamp(17px, 1rem + 0.6vw, 22px);
--text-xl:   clamp(20px, 1.1rem + 1.1vw, 28px);
--text-2xl:  clamp(24px, 1.2rem + 2.2vw, 38px);
--text-3xl:  clamp(32px, 5vw, 54px);
--space-1:  4px;
--space-2:  8px;
--space-3:  12px;
--space-4:  16px;
--space-5:  20px;
--space-6:  24px;
--space-8:  32px;
--space-10: 40px;
--space-12: 48px;
--space-16: 64px;
--space-20: 80px;
--radius-xs: 2px;
--radius-sm: 4px;
--radius-md: 6px;
--radius-lg: 10px;
--radius-xl: 16px;
--shadow-sm:    0 2px 8px rgba(0, 0, 0, 0.3);
--shadow-md:    0 4px 24px rgba(0, 0, 0, 0.4);
--shadow-lg:    0 8px 40px rgba(0, 0, 0, 0.5);
--shadow-green: 0 8px 32px rgba(57, 255, 20, 0.12);
--shadow-card:  0 4px 20px rgba(0, 0, 0, 0.35);
--ease:      0.2s ease;
--ease-slow: 0.4s ease;
--z-base:    1;
--z-raised:  10;
--z-overlay: 50;
--z-modal:   100;
--z-nav:     200;
--z-toast:   300;
--container-max:    1240px;
--container-narrow: 760px;
--container-wide:   1440px;
--sidebar-width:    280px;
--header-height:    62px;
}
*, *::before, *::after {
box-sizing: border-box;
margin: 0;
padding: 0;
}
html {
font-size: 16px;
scroll-behavior: smooth;
-webkit-text-size-adjust: 100%;
text-size-adjust: 100%;
}
body {
background-color: var(--tx-void);
color: var(--tx-white);
font-family: var(--font-body);
font-size: var(--text-base);
line-height: 1.6;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
overflow-x: clip; 
}
#page, .site, .site-content, main,
#content, .site-main, .woocommerce {
background-color: var(--tx-void);
}
img, video, svg { display: block; max-width: 100%; height: auto; }
a { color: var(--tx-green); text-decoration: none; transition: color var(--ease); }
a:hover { color: var(--tx-green-dark); }
ul, ol { list-style: none; }
table { border-collapse: collapse; width: 100%; }
button, input, select, textarea { font-family: inherit; font-size: inherit; }
input, textarea { background: none; border: none; outline: none; }
button { cursor: pointer; background: none; border: none; }
h1, h2, h3, h4, h5, h6 {
font-family: var(--font-display);
color: var(--tx-white);
line-height: 1.1;
font-weight: 400; 
}
h1 { font-size: clamp(32px, 5vw, 54px); }
h2 { font-size: clamp(22px, 3vw, 34px); }
h3 { font-size: var(--text-xl); }
h4 { font-size: var(--text-lg); }
h5 { font-size: var(--text-base); font-family: var(--font-body); font-weight: 700; }
h6 { font-size: var(--text-sm);   font-family: var(--font-body); font-weight: 700; }
p { margin-bottom: var(--space-4); color: var(--tx-muted); }
p:last-child { margin-bottom: 0; }
strong, b { color: var(--tx-white); font-weight: 700; }
em, i     { font-style: italic; }
small     { font-size: var(--text-xs); }
code, pre {
font-family: var(--font-mono);
background: var(--tx-navy);
border-radius: var(--radius-sm);
}
code { padding: 2px 6px; font-size: var(--text-sm); }
pre  { padding: var(--space-4); overflow-x: auto; }
hr {
border: none;
border-top: 1px solid var(--tx-border);
margin: var(--space-8) 0;
}
.container {
width: 100%;
max-width: none; 
margin-inline: auto;
padding-inline: clamp(16px, 3vw, 56px); 
}
.container--narrow { max-width: var(--container-narrow); }
.container--wide   { max-width: var(--container-wide);   }
.woocommerce-cart     .container,
.woocommerce-checkout .container,
.woocommerce-account  .container { max-width: var(--container-wide); }
.flex           { display: flex; }
.flex-center    { display: flex; align-items: center; justify-content: center; }
.flex-between   { display: flex; align-items: center; justify-content: space-between; }
.flex-col       { display: flex; flex-direction: column; }
.flex-wrap      { flex-wrap: wrap; }
.gap-2          { gap: var(--space-2); }
.gap-4          { gap: var(--space-4); }
.gap-6          { gap: var(--space-6); }
.grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-6); }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-6); }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-6); }
.sr-only {
position: absolute; width: 1px; height: 1px;
padding: 0; margin: -1px; overflow: hidden;
clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.hidden { display: none !important; }
.invisible { visibility: hidden; }
.text-green  { color: var(--tx-green); }
.text-muted  { color: var(--tx-muted); }
.text-center { text-align: center; }
.text-upper  { text-transform: uppercase; letter-spacing: 1px; }
.text-sm     { font-size: var(--text-sm); }
.text-xs     { font-size: var(--text-xs); }
.section     { padding: var(--space-10) 0; }
.section--lg { padding: var(--space-16) 0; }
.section--sm { padding: var(--space-6) 0; }
.section--bordered { border-top: 1px solid rgba(57, 255, 20, 0.06); }
.section-header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: var(--space-6);
}
.section-title { font-size: var(--text-xl); }
.section-title span { color: var(--tx-green); }
.section-eyebrow {
font-size: var(--text-xs);
font-weight: 700;
color: var(--tx-muted);
letter-spacing: 2px;
text-transform: uppercase;
margin-bottom: var(--space-2);
}
:focus-visible {
outline: 2px solid var(--tx-green);
outline-offset: 3px;
border-radius: var(--radius-xs);
}
.skip-link {
position: absolute;
top: -100%;
left: var(--space-4);
background: var(--tx-green);
color: var(--tx-black);
padding: var(--space-2) var(--space-4);
border-radius: var(--radius-sm);
font-weight: 700;
z-index: var(--z-toast);
transition: top var(--ease);
}
.skip-link:focus { top: var(--space-2); }
@keyframes fadeIn {
from { opacity: 0; transform: translateY(8px); }
to   { opacity: 1; transform: translateY(0); }
}
@keyframes pulse-green {
0%, 100% { box-shadow: 0 0 0 0 rgba(57, 255, 20, 0.4); }
50%       { box-shadow: 0 0 0 8px rgba(57, 255, 20, 0); }
}
.animate-fade-in { animation: fadeIn 0.3s ease both; }
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after {
animation-duration: 0.01ms !important;
transition-duration: 0.01ms !important;
scroll-behavior: auto !important;
}
}
.entry-content p,
.entry-content li,
.entry-content td,
.entry-content dd {
color: var(--tx-white);
}
/* == components.css == */
.btn {
display: inline-flex;
align-items: center;
gap: var(--space-2);
padding: 11px 24px;
border-radius: var(--radius-sm);
font-family: var(--font-body);
font-size: var(--text-sm);
font-weight: 700;
letter-spacing: 0.5px;
cursor: pointer;
border: none;
line-height: 1;
text-decoration: none;
white-space: nowrap;
transition: background var(--ease), color var(--ease),
border-color var(--ease), transform var(--ease),
box-shadow var(--ease);
user-select: none;
}
.btn:active { transform: scale(0.97); }
.btn:disabled, .btn[disabled] {
opacity: 0.5;
cursor: not-allowed;
pointer-events: none;
}
.btn--primary {
background: var(--tx-green);
color: var(--tx-black);
}
.btn--primary:hover {
background: var(--tx-green-dark);
color: var(--tx-black);
box-shadow: var(--shadow-green);
}
.btn--secondary {
background: var(--tx-navy);
color: var(--tx-white);
border: 1px solid var(--tx-border);
}
.btn--secondary:hover {
border-color: rgba(57,255,20,0.35);
color: var(--tx-white);
}
.btn--ghost {
background: transparent;
color: var(--tx-white);
border: 1px solid rgba(240,242,255,0.25);
}
.btn--ghost:hover {
border-color: var(--tx-white);
color: var(--tx-white);
}
.btn--outline-green {
background: transparent;
color: var(--tx-green);
border: 1px solid rgba(57,255,20,0.4);
}
.btn--outline-green:hover {
background: var(--tx-green-glow);
color: var(--tx-green);
}
.btn--danger {
background: var(--tx-red);
color: #fff;
}
.btn--danger:hover { background: #e03030; color: #fff; }
.btn--xs  { padding: 5px 12px;  font-size: var(--text-xs); }
.btn--sm  { padding: 8px 16px;  font-size: var(--text-sm); }
.btn--lg  { padding: 14px 32px; font-size: var(--text-md); }
.btn--xl  { padding: 16px 40px; font-size: var(--text-lg); }
.btn--full { width: 100%; justify-content: center; }
.btn--icon {
padding: var(--space-2);
width: 36px;
height: 36px;
justify-content: center;
}
.badge {
display: inline-flex;
align-items: center;
justify-content: center;
font-size: var(--text-xs);
font-weight: 700;
letter-spacing: 0.8px;
padding: 3px 8px;
border-radius: var(--radius-xs);
line-height: 1.4;
text-transform: uppercase;
white-space: nowrap;
}
.badge--sale     { background: var(--tx-orange); color: var(--tx-black); }
.badge--hot      { background: var(--tx-red);    color: #fff; }
.badge--new      { background: var(--tx-green);  color: var(--tx-black); }
.badge--featured { background: var(--tx-navy-light); color: var(--tx-white); border: 1px solid var(--tx-border); }
.badge--out      { background: rgba(255,255,255,0.08); color: var(--tx-muted); }
.badge--count {
width: 18px; height: 18px;
border-radius: 50%;
background: var(--tx-green);
color: var(--tx-black);
font-size: 9px;
padding: 0;
}
.field {
display: flex;
flex-direction: column;
gap: var(--space-1);
margin-bottom: var(--space-4);
}
.field__label {
font-size: var(--text-sm);
font-weight: 700;
color: var(--tx-muted-light);
letter-spacing: 0.3px;
}
.field__label span { color: var(--tx-red); }  
.field__input,
.field__select,
.field__textarea {
width: 100%;
background: var(--tx-navy);
border: 1px solid var(--tx-border);
color: var(--tx-white);
padding: 10px 14px;
border-radius: var(--radius-sm);
font-family: var(--font-body);
font-size: var(--text-base);
transition: border-color var(--ease);
}
.field__input::placeholder,
.field__textarea::placeholder { color: var(--tx-muted); }
.field__input:focus,
.field__select:focus,
.field__textarea:focus {
border-color: rgba(57,255,20,0.45);
outline: none;
}
.field__input--error { border-color: var(--tx-red); }
.field__error { font-size: var(--text-xs); color: var(--tx-red); margin-top: var(--space-1); }
.field__hint  { font-size: var(--text-xs); color: var(--tx-muted); margin-top: var(--space-1); }
.field__textarea { resize: vertical; min-height: 120px; }
.field__select { appearance: none; cursor: pointer; }
.search-field {
display: flex;
align-items: center;
width: 100%;
max-width: none;
background: var(--tx-navy-light);
border: 1px solid rgba(57,255,20,0.35);
border-radius: var(--radius-sm);
overflow: hidden;
transition: border-color var(--ease), box-shadow var(--ease);
}
.search-field:focus-within {
border-color: var(--tx-green);
box-shadow: 0 0 0 2px rgba(57,255,20,0.18);
}
.search-field input {
flex: 1;
background: none;
color: var(--tx-white);
padding: 9px 14px;
font-size: var(--text-sm);
}
.search-field input::placeholder { color: var(--tx-white); opacity: 1; }
.search-field button {
color: var(--tx-muted);
padding: 9px 13px;
transition: color var(--ease);
font-size: 16px;
}
.search-field button:hover { color: var(--tx-green); }
.field--check {
flex-direction: row;
align-items: center;
gap: var(--space-2);
cursor: pointer;
}
.field--check input[type="checkbox"],
.field--check input[type="radio"] { accent-color: var(--tx-green); width: 16px; height: 16px; cursor: pointer; }
.product-card {
background: var(--tx-card);
border: 1px solid var(--tx-border);
border-radius: var(--radius-md);
overflow: hidden;
display: flex;
flex-direction: column;
transition: border-color var(--ease), transform var(--ease-slow), box-shadow var(--ease);
}
.product-card:hover {
border-color: rgba(57,255,20,0.45);
transform: translateY(-4px);
box-shadow: var(--shadow-green);
}
.product-card__thumb {
position: relative;
background: var(--tx-navy-light);
aspect-ratio: 1 / 1;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
}
.product-card__thumb img {
width: 100%; height: 100%;
object-fit: cover;
transition: transform var(--ease-slow);
}
.product-card:hover .product-card__thumb img { transform: scale(1.05); }
.product-card__thumb .badge {
position: absolute;
top: 10px; left: 10px;
z-index: var(--z-raised);
}
.product-card__actions {
position: absolute;
top: 10px; right: 10px;
display: flex;
flex-direction: column;
gap: var(--space-1);
opacity: 0;
transition: opacity var(--ease);
}
.product-card:hover .product-card__actions { opacity: 1; }
.product-card__action {
width: 34px; height: 34px;
background: rgba(8,8,16,0.85);
border: 1px solid var(--tx-border);
color: var(--tx-muted-light);
border-radius: var(--radius-sm);
display: flex; align-items: center; justify-content: center;
font-size: 16px;
transition: border-color var(--ease), color var(--ease);
text-decoration: none;
}
.product-card__action:hover {
border-color: var(--tx-green);
color: var(--tx-green);
}
.product-card__action.is-wishlisted { color: var(--tx-green); border-color: rgba(57,255,20,0.45); }
.product-card__body {
padding: var(--space-4);
display: flex;
flex-direction: column;
flex: 1;
}
.product-card__brand {
font-size: var(--text-xs);
font-weight: 700;
color: var(--tx-muted-light);
letter-spacing: 1.2px;
text-transform: uppercase;
margin-bottom: var(--space-1);
}
.product-card__name {
font-size: 14px;
font-weight: 600; 
color: var(--tx-white);
line-height: 1.4;
margin-bottom: var(--space-2);
flex: 1;
text-rendering: optimizeLegibility;
}
.product-card__name a { color: inherit; }
.product-card__name a:hover { color: var(--tx-green); }
.product-card__rating {
display: flex;
align-items: center;
gap: var(--space-1);
font-size: var(--text-xs);
color: var(--tx-orange);
margin-bottom: var(--space-2);
}
.product-card__rating span { color: var(--tx-muted); }
.product-card__footer {
display: flex;
align-items: flex-end;
justify-content: space-between;
margin-top: auto;
padding-top: var(--space-3);
border-top: 1px solid var(--tx-border);
}
.product-card__price { display: block; min-width: 0; color: var(--tx-white); }
.product-card__price ins {
font-family: var(--font-display);
font-size: 18px;
color: var(--tx-white); 
text-decoration: none;
}
.product-card__price del { font-size: var(--text-xs); color: var(--tx-muted); }
.tx-price { display: grid; grid-template-columns: auto auto; gap: 1px var(--space-3); justify-content: start; line-height: 1.2; }
.tx-price--simple { display: block; font-family: var(--font-display); font-size: 18px; color: var(--tx-white); }
.tx-price--compact { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.tx-price--compact .tx-price__total { font-family: var(--font-display); font-size: var(--text-xl); color: var(--tx-white); line-height: 1.05; }
.tx-price--compact .tx-price__suffix { font-size: 11px; color: var(--tx-muted-light); text-transform: uppercase; letter-spacing: .5px; }
.tx-price__row { display: contents; }
.tx-price__lbl { color: var(--tx-white); font-size: var(--text-sm); text-transform: uppercase; letter-spacing: .5px; }
.tx-price__val { color: var(--tx-white); font-size: var(--text-sm); text-align: right; white-space: nowrap; }
.tx-price__row--total .tx-price__lbl,
.tx-price__row--total .tx-price__val {
border-top: 1px solid rgba(255,255,255,0.12);
padding-top: 3px; margin-top: 2px;
}
.tx-price__row--total .tx-price__lbl { color: var(--tx-white); font-weight: 700; align-self: center; }
.tx-price__row--total .tx-price__val { color: var(--tx-white); font-family: var(--font-display); font-size: var(--text-md); }
.product-card__add {
width: 32px; height: 32px;
background: var(--tx-green-subtle);
border: 1px solid rgba(57,255,20,0.35);
color: var(--tx-green);
border-radius: var(--radius-sm);
display: flex; align-items: center; justify-content: center;
font-size: 20px; line-height: 1;
transition: background var(--ease);
}
.product-card__add:hover { background: rgba(57,255,20,0.2); }
.product-card__add.loading { opacity: 0.6; pointer-events: none; }
.product-card--oos { opacity: 0.7; }
.product-card--oos .product-card__add { display: none; }
.product-card__oos-label { font-size: var(--text-xs); color: var(--tx-muted); font-weight: 700; }
.toast-container {
position: fixed;
bottom: var(--space-6);
right: var(--space-6);
z-index: var(--z-toast);
display: flex;
flex-direction: column;
gap: var(--space-2);
pointer-events: none;
}
.toast {
background: var(--tx-navy);
border: 1px solid var(--tx-border);
border-left: 3px solid var(--tx-green);
border-radius: var(--radius-md);
padding: var(--space-3) var(--space-4);
font-size: var(--text-sm);
font-weight: 600;
color: var(--tx-white);
box-shadow: var(--shadow-md);
animation: fadeIn 0.25s ease both;
pointer-events: all;
max-width: 320px;
}
.toast--error { border-left-color: var(--tx-red); }
.toast--warning { border-left-color: var(--tx-orange); }
.tx-pagination {
display: flex;
align-items: center;
justify-content: center;
gap: var(--space-2);
padding: var(--space-8) 0;
flex-wrap: wrap;
}
.tx-pagination a,
.tx-pagination span {
display: flex;
align-items: center;
justify-content: center;
width: 38px; height: 38px;
border-radius: var(--radius-sm);
font-size: var(--text-sm);
font-weight: 700;
transition: background var(--ease), border-color var(--ease), color var(--ease);
border: 1px solid var(--tx-border);
color: var(--tx-muted);
text-decoration: none;
}
.tx-pagination a:hover { border-color: rgba(57,255,20,0.35); color: var(--tx-white); }
.tx-pagination .current { background: var(--tx-green); color: var(--tx-black); border-color: var(--tx-green); }
.tx-breadcrumb {
display: flex;
align-items: center;
gap: var(--space-2);
font-size: var(--text-xs);
color: var(--tx-muted);
padding: var(--space-3) 0;
flex-wrap: wrap;
}
.tx-breadcrumb a { color: var(--tx-muted); }
.tx-breadcrumb a:hover { color: var(--tx-white); }
.tx-breadcrumb__sep { color: var(--tx-border); }
.tx-breadcrumb__current { color: var(--tx-white); font-weight: 600; }
.tx-spinner {
width: 20px; height: 20px;
border: 2px solid rgba(57,255,20,0.2);
border-top-color: var(--tx-green);
border-radius: 50%;
animation: spin 0.7s linear infinite;
display: inline-block;
}
@keyframes spin { to { transform: rotate(360deg); } }
.tx-empty {
text-align: center;
padding: var(--space-20) var(--space-6);
}
.tx-empty__icon { font-size: 48px; margin-bottom: var(--space-4); opacity: 0.5; }
.tx-empty__title { font-size: var(--text-xl); margin-bottom: var(--space-2); }
.tx-empty__text  { color: var(--tx-muted); margin-bottom: var(--space-6); }
.tx-page { padding: var(--space-12) var(--space-4); max-width: 880px; }
.tx-page__title { font-family: var(--font-display); font-size: var(--text-2xl, 32px); color: var(--tx-white); }
.tx-page__lead { color: var(--tx-white); margin-bottom: var(--space-8); }
.tx-hp { position: absolute; left: -9999px; }
.tx-form { display: flex; flex-direction: column; gap: var(--space-4); }
.tx-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); }
.tx-field { display: flex; flex-direction: column; gap: 6px; }
.tx-field > span { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 1px; color: var(--tx-white); }
.tx-field input, .tx-field select, .tx-field textarea {
background: var(--tx-navy-light);
border: 1px solid var(--tx-border);
border-radius: var(--radius-sm);
color: var(--tx-white);
padding: 10px 12px;
}
.tx-field input:focus, .tx-field select:focus, .tx-field textarea:focus { border-color: var(--tx-green); outline: none; }
.tx-btn { display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
font-family: var(--font-display); letter-spacing: 1px; text-transform: uppercase;
padding: 12px 22px; border-radius: var(--radius-sm); border: 1px solid transparent; text-decoration: none; }
.tx-btn--primary { background: var(--tx-green); color: var(--tx-black); }
.tx-btn--primary:hover { box-shadow: var(--shadow-green); }
.tx-btn--ghost { background: transparent; color: var(--tx-white); border-color: var(--tx-border); }
.tx-form-notice { padding: 12px 16px; border-radius: var(--radius-sm); margin-bottom: var(--space-6); }
.tx-form-notice--ok { background: var(--tx-green-subtle); border: 1px solid rgba(57,255,20,0.4); color: var(--tx-green); }
.tx-form-notice--err { background: rgba(255,60,60,0.1); border: 1px solid rgba(255,60,60,0.4); color: #ff8080; }
@media (max-width: 640px) { .tx-form__row { grid-template-columns: 1fr; } }
.tx-build__rows { display: flex; flex-direction: column; gap: var(--space-3); margin-bottom: var(--space-6); }
.tx-build__row { display: grid; grid-template-columns: 160px 1fr; align-items: center; gap: var(--space-4); }
.tx-build__label { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 1px; color: var(--tx-muted); }
.tx-build__select, .tx-build__note {
background: var(--tx-navy-light); border: 1px solid var(--tx-border); border-radius: var(--radius-sm);
color: var(--tx-white); padding: 10px 12px; width: 100%; }
.tx-build__total { font-size: var(--text-lg); color: var(--tx-white); margin-bottom: var(--space-6); }
.tx-build__total strong { color: var(--tx-green); }
@media (max-width: 640px) { .tx-build__row { grid-template-columns: 1fr; gap: 6px; } }
.tx-hero { padding: var(--space-16) var(--space-4); text-align: center; }
.tx-hero__title { font-family: var(--font-display); font-size: var(--text-3xl, 44px); color: var(--tx-white); }
.tx-hero__lead { color: var(--tx-muted-light); margin: var(--space-3) 0 var(--space-6); }
.tx-hero__cta { display: flex; gap: var(--space-3); justify-content: center; }
.tx-home-feat { padding: var(--space-10) var(--space-4); }
.tx-home-feat {
max-width: var(--container-wide);
margin-inline: auto;
}
.tx-home-feat ul.products,
.woocommerce .tx-home-feat ul.products {
grid-template-columns: repeat(6, 1fr) !important;
gap: var(--space-3);
}
@media (max-width: 1100px) {
.tx-home-feat ul.products,
.woocommerce .tx-home-feat ul.products {
grid-template-columns: repeat(3, 1fr) !important;
}
}
@media (max-width: 700px) {
.tx-home-feat ul.products,
.woocommerce .tx-home-feat ul.products {
grid-template-columns: repeat(2, 1fr) !important;
}
}
.tx-home-banner { padding: var(--space-6) var(--space-4) 0; }
.tx-home-banner__link { display: block; }
.tx-home-banner__img {
display: block;
width: 100%;
height: auto;
border-radius: var(--radius-md);
border: 1px solid var(--tx-border);
}
.tx-home-services { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-6); padding: var(--space-10) var(--space-4); }
.tx-service-card { display: block; padding: var(--space-8); background: var(--tx-card); border: 1px solid var(--tx-border);
border-radius: var(--radius-md); text-decoration: none; color: var(--tx-white); transition: border-color var(--ease); }
.tx-service-card:hover { border-color: var(--tx-green); }
.tx-service-card h3 { font-family: var(--font-display); margin-bottom: 6px; }
.tx-service-card p { color: var(--tx-muted-light); }
@media (max-width: 640px) { .tx-home-services { grid-template-columns: 1fr; } }
.tx-choice { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-6); margin: var(--space-8) 0; }
.tx-choice__card {
display: block; padding: var(--space-8); background: var(--tx-card);
border: 1px solid var(--tx-border); border-radius: var(--radius-md);
text-decoration: none; color: var(--tx-white);
transition: border-color var(--ease), transform var(--ease); }
.tx-choice__card:hover { border-color: var(--tx-green); transform: translateY(-4px); }
.tx-choice__title { font-family: var(--font-display); font-size: var(--text-xl); margin-bottom: var(--space-2); }
.tx-choice__desc { color: var(--tx-muted-light); margin-bottom: var(--space-4); }
.tx-choice__cta { color: var(--tx-green); font-weight: 700; text-transform: uppercase; letter-spacing: 1px; font-size: var(--text-sm); }
.tx-build__back { color: var(--tx-muted); text-decoration: none; font-size: var(--text-sm); }
.tx-build__back:hover { color: var(--tx-green); }
@media (max-width: 640px) { .tx-choice { grid-template-columns: 1fr; } }
.tx-warranty-note {
background: var(--tx-green-subtle); border-left: 3px solid var(--tx-green);
padding: var(--space-3) var(--space-4); border-radius: var(--radius-sm);
color: var(--tx-muted-light); font-size: var(--text-sm); margin-top: var(--space-4);
}
.tx-field__hint { font-size: var(--text-xs); color: var(--tx-muted); margin: -4px 0 var(--space-2); }
.woocommerce .quantity .qty,
.woocommerce div.product form.cart .quantity .qty,
input.qty {
background: var(--tx-navy-light);
border: 1px solid rgba(57,255,20,0.35);
color: var(--tx-white);
border-radius: var(--radius-sm);
padding: 9px 10px;
font-weight: 700;
}
input.qty:focus { border-color: var(--tx-green); outline: none; box-shadow: 0 0 0 2px rgba(57,255,20,0.15); }
.tx-build > .tx-page__head { padding-top: 72px; }
.tx-build { padding-bottom: var(--space-16); }
.tx-build__layout { display: grid; grid-template-columns: 1fr 320px; gap: var(--space-6); align-items: start; }
.tx-build__slots { display: flex; flex-direction: column; gap: var(--space-4); }
.tx-slot { background: var(--tx-navy); border: 1px solid var(--tx-border); border-radius: var(--radius-md); padding: var(--space-4); }
.tx-slot__head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); }
.tx-slot__title { font-size: var(--text-md); color: var(--tx-white); margin: 0; }
.tx-slot__chosen { list-style: none; margin: var(--space-3) 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.tx-chosen { display: flex; align-items: center; gap: var(--space-3); background: var(--tx-navy-light); border-radius: var(--radius-sm); padding: 6px 8px; }
.tx-chosen img { width: 34px; height: 34px; object-fit: contain; background: rgba(255,255,255,.06); border-radius: 4px; }
.tx-chosen__name { flex: 1 1 auto; color: var(--tx-white); font-size: var(--text-sm); }
.tx-chosen__price { color: var(--tx-white); font-weight: 700; font-size: var(--text-sm); white-space: nowrap; }
.tx-chosen__rm { background: none; border: none; color: var(--tx-muted); font-size: 20px; line-height: 1; cursor: pointer; padding: 0 4px; }
.tx-chosen__rm:hover { color: var(--tx-green); }
.tx-slot__picker { margin-top: var(--space-3); }
.tx-slot__search { width: 100%; background: var(--tx-navy-light); border: 1px solid rgba(57,255,20,.35); color: var(--tx-white); border-radius: var(--radius-sm); padding: 10px 12px; font-weight: 600; }
.tx-slot__search::placeholder { color: var(--tx-muted-light); }
.tx-slot__results { margin-top: var(--space-3); max-height: 360px; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; }
.tx-slot__results[aria-busy="true"] { opacity: .5; }
.tx-slot__empty { color: var(--tx-muted); font-size: var(--text-sm); padding: var(--space-3); }
.tx-result { display: flex; align-items: center; gap: var(--space-3); background: var(--tx-navy-light); border-radius: var(--radius-sm); padding: 6px 8px; }
.tx-result.is-blocked { opacity: .55; }
.tx-result__img { width: 40px; height: 40px; object-fit: contain; background: rgba(255,255,255,.06); border-radius: 4px; flex: 0 0 auto; }
.tx-result__main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.tx-result__name { color: var(--tx-white); font-size: var(--text-sm); }
.tx-result__reason { color: var(--tx-muted-light); font-size: var(--text-xs); }
.tx-result__buy { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.tx-result__price { color: var(--tx-white); font-weight: 700; font-size: var(--text-sm); white-space: nowrap; }
.tx-pill { display: inline-block; align-self: flex-start; font-size: 10px; text-transform: uppercase; letter-spacing: .5px; padding: 1px 6px; border-radius: 999px; }
.tx-pill--block { background: rgba(255,80,80,.18); color: #ff8a8a; }
.tx-pill--warn { background: rgba(255,196,0,.15); color: #ffd24d; }
.tx-build__summary { position: sticky; top: 80px; background: var(--tx-navy); border: 1px solid var(--tx-border); border-radius: var(--radius-md); padding: var(--space-4); }
.tx-build__summary-title { font-size: var(--text-md); color: var(--tx-white); margin: 0 0 var(--space-3); }
.tx-build__list { list-style: none; margin: 0 0 var(--space-3); padding: 0; display: flex; flex-direction: column; gap: 4px; }
.tx-build__list li { display: flex; justify-content: space-between; gap: var(--space-3); color: var(--tx-muted-light); font-size: var(--text-xs); }
.tx-build__totals { margin: 0 0 var(--space-4); border-top: 1px solid var(--tx-border); padding-top: var(--space-3); }
.tx-build__row { display: flex; justify-content: space-between; margin: 0 0 4px; color: var(--tx-muted-light); font-size: var(--text-sm); }
.tx-build__row dt, .tx-build__row dd { margin: 0; }
.tx-build__row--bonus dd { color: var(--tx-green); }
.tx-build__row--grand { color: var(--tx-white); font-weight: 700; font-size: var(--text-md); border-top: 1px solid var(--tx-border); padding-top: 6px; margin-top: 6px; }
.tx-build__addcart { width: 100%; }
.tx-build__note { color: var(--tx-muted); font-size: var(--text-xs); margin: var(--space-3) 0 0; }
.tx-slot__open, .tx-result__add { padding: 6px 14px; font-size: var(--text-sm); }
@media (max-width: 900px) { .tx-build__layout { grid-template-columns: 1fr; } .tx-build__summary { position: static; } }
.tx-build__periph { background: var(--tx-navy); border: 1px solid var(--tx-border); border-radius: var(--radius-md); padding: var(--space-4); }
.tx-periph-toggles { display: flex; flex-wrap: wrap; gap: var(--space-3); margin: var(--space-3) 0; }
.tx-periph-toggle { display: flex; align-items: center; gap: 6px; color: var(--tx-white); font-size: var(--text-sm); cursor: pointer; }
.tx-periph-toggle input, .tx-radio input, .tx-check input { accent-color: var(--tx-green); width: 16px; height: 16px; }
.tx-slot--periph { margin-top: var(--space-3); border-color: rgba(57,255,20,.15); }
.tx-slot__cap { color: var(--tx-muted-light); font-size: var(--text-xs); margin: 0 0 6px; }
.tx-build__assembly { margin: var(--space-3) 0; border-top: 1px solid var(--tx-border); padding-top: var(--space-3); display: flex; flex-direction: column; gap: 7px; }
.tx-build__assembly-title { font-size: var(--text-sm); color: var(--tx-white); margin: 0 0 4px; text-transform: uppercase; letter-spacing: .5px; }
.tx-radio, .tx-check { display: flex; align-items: center; gap: 8px; color: var(--tx-white); font-size: var(--text-sm); cursor: pointer; }
.tx-radio__price { margin-left: auto; color: var(--tx-white); font-weight: 600; white-space: nowrap; }
.tx-custom-wrap { margin-top: 4px; }
.tx-custom-wrap summary { color: var(--tx-green); cursor: pointer; font-size: var(--text-sm); }
.tx-custom { width: 100%; margin-top: 6px; background: var(--tx-navy-light); border: 1px solid var(--tx-border); color: var(--tx-white); border-radius: var(--radius-sm); padding: 8px; font-family: var(--font-body); resize: vertical; }
.tx-build__row--asm dd { color: var(--tx-white); }
.tx-build__sent { color: var(--tx-green); font-weight: 600; text-align: center; padding: var(--space-4) 0; }
.tx-qty { display: inline-flex; align-items: center; gap: 4px; }
.tx-qty__dec, .tx-qty__inc { background: var(--tx-navy); border: 1px solid var(--tx-border); color: var(--tx-white); width: 22px; height: 22px; border-radius: 4px; line-height: 1; cursor: pointer; }
.tx-qty__dec:hover, .tx-qty__inc:hover { border-color: var(--tx-accent, #00e0ff); }
.tx-qty__n { min-width: 18px; text-align: center; color: var(--tx-white); font-size: var(--text-sm); }
.tx-chosen__kit { display: block; color: var(--tx-muted); font-size: var(--text-xs); }
.tx-slot__cap { color: var(--tx-muted); font-size: var(--text-sm); margin: var(--space-2) 0; }
.tx-result__add[disabled] { opacity: .4; cursor: not-allowed; }
.tx-build__notes { width: 100%; background: var(--tx-navy); border: 1px solid var(--tx-border); border-radius: var(--radius-sm); color: var(--tx-white); padding: 8px; margin-bottom: var(--space-3); font: inherit; }
.tx-build__notes-label { display: block; color: var(--tx-white); font-size: var(--text-sm); margin: var(--space-3) 0 4px; }
@media (max-width: 768px) { .tx-result { cursor: pointer; } }
.tx-build__os { display: flex; flex-direction: column; gap: 6px; margin-bottom: var(--space-3); }
.tx-build__os-select, .tx-build__os-note { width: 100%; background: var(--tx-navy); border: 1px solid var(--tx-border); border-radius: var(--radius-sm); color: var(--tx-white); padding: 8px; font: inherit; }
.tx-consent {
position: fixed;
left: 0;
right: 0;
bottom: 0;
z-index: var(--z-toast);
width: 100%;
background: var(--tx-navy);
border-top: 1px solid rgba(57,255,20,0.35);
box-shadow: var(--shadow-lg);
padding: var(--space-4) clamp(16px, 3vw, 56px); 
display: none; 
}
.tx-consent.is-open { display: block; }
.tx-consent__body { max-width: var(--container-wide); margin-inline: auto; }
.tx-consent__text { margin: 0 0 var(--space-3); color: var(--tx-white); font-size: var(--text-sm); }
.tx-consent__text a { color: var(--tx-green); text-decoration: underline; }
.tx-consent__settings { margin: 0 0 var(--space-3); display: flex; flex-direction: column; gap: 8px; border-top: 1px solid var(--tx-border); padding-top: var(--space-3); }
.tx-consent__settings[hidden] { display: none; }
.tx-consent__row { display: flex; gap: 10px; align-items: flex-start; color: var(--tx-white); font-size: var(--text-sm); cursor: pointer; }
.tx-consent__row input { accent-color: var(--tx-green); width: 16px; height: 16px; margin-top: 2px; flex-shrink: 0; }
.tx-consent__actions { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.tx-consent__actions [hidden] { display: none; }
.tx-form__section { font-size: var(--text-lg); color: var(--tx-green); margin: var(--space-6) 0 var(--space-2); }
.tx-returns-link { color: var(--tx-green); font-weight: 700; text-decoration: underline; }
.tx-returns-link:hover { color: var(--tx-green-dark); }
.tx-wish { display: inline-flex; align-items: center; gap: 8px; margin: var(--space-3) 0; padding: 9px 16px; background: var(--tx-navy); border: 1px solid var(--tx-border); border-radius: var(--radius-sm); color: var(--tx-white); font-weight: 700; font-size: var(--text-sm); cursor: pointer; transition: border-color var(--ease), color var(--ease); }
.tx-wish__heart { color: var(--tx-muted); font-size: 16px; transition: color var(--ease), transform var(--ease); }
.tx-wish:hover { border-color: rgba(57,255,20,0.45); }
.tx-wish.is-on .tx-wish__heart { color: var(--tx-green); transform: scale(1.15); }
.tx-wish.is-on { border-color: rgba(57,255,20,0.45); }
.tx-wishlist { display: flex; flex-direction: column; gap: var(--space-3); }
.tx-wishlist__row { display: flex; align-items: center; gap: var(--space-4); background: var(--tx-card); border: 1px solid var(--tx-border); border-radius: var(--radius-md); padding: var(--space-3) var(--space-4); }
.tx-wishlist__media img { width: 64px; height: 64px; object-fit: contain; background: var(--tx-navy-light); border-radius: var(--radius-sm); }
.tx-wishlist__main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.tx-wishlist__name { color: var(--tx-white); font-weight: 700; line-height: 1.3; }
.tx-wishlist__name:hover { color: var(--tx-green); }
.tx-wishlist__added { color: var(--tx-muted); font-size: var(--text-xs); }
.tx-wishlist__price { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; white-space: nowrap; }
.tx-wishlist__now { color: var(--tx-white); font-weight: 700; }
.tx-wishlist__delta { font-size: var(--text-xs); font-weight: 700; }
.tx-wishlist__delta.is-down { color: var(--tx-green); }
.tx-wishlist__delta.is-up { color: var(--tx-orange); }
.tx-wishlist__delta.is-same { color: var(--tx-muted); font-weight: 400; }
.tx-wishlist__actions { display: flex; align-items: center; gap: var(--space-3); }
.tx-wishlist__oos { color: var(--tx-muted); font-size: var(--text-xs); text-transform: uppercase; }
.tx-wishlist__remove { background: none; border: none; color: var(--tx-muted); font-size: 22px; line-height: 1; cursor: pointer; }
.tx-wishlist__remove:hover { color: var(--tx-red); }
@media (max-width: 640px) { .tx-wishlist__row { flex-wrap: wrap; } .tx-wishlist__price { align-items: flex-start; } }
.tx-wish--card { margin: 0; padding: 0; border-radius: var(--radius-sm); }
.tx-wish--card .tx-wish__heart { font-size: 16px; }
.tx-wish--card.is-on { border-color: rgba(57,255,20,0.45); }
.product-card__actions:has(.tx-wish.is-on) { opacity: 1; }
@media (hover: none), (pointer: coarse) { .product-card__actions { opacity: 1; } }
.tx-policy { max-width: none; margin-bottom: var(--space-8); }
.tx-policy-list { list-style: disc; padding-left: 22px; color: var(--tx-white); margin: 0 0 var(--space-4); }
.tx-policy-list li { margin-bottom: 6px; }
.tx-policy-table { width: 100%; border-collapse: collapse; margin: 0 0 var(--space-4); }
.tx-policy-table th, .tx-policy-table td { border: 1px solid var(--tx-border); padding: 9px 12px; text-align: left; color: var(--tx-white); font-size: var(--text-sm); }
.tx-policy-table th { background: var(--tx-navy); color: var(--tx-green); text-transform: uppercase; letter-spacing: 0.5px; font-size: var(--text-xs); }
.tx-field--agree { flex-direction: row; align-items: flex-start; gap: 10px; color: var(--tx-white); font-size: var(--text-sm); cursor: pointer; }
.tx-field--agree input { accent-color: var(--tx-green); width: 17px; height: 17px; margin-top: 2px; flex-shrink: 0; }
/* == header.css == */
.site-header {
position: sticky;
top: 0;
z-index: var(--z-nav);
background: rgba(8, 8, 16, 0.97);
border-bottom: 1px solid rgba(57, 255, 20, 0.12);
backdrop-filter: blur(14px);
-webkit-backdrop-filter: blur(14px);
transition: box-shadow var(--ease);
}
.site-header.is-scrolled { box-shadow: 0 4px 32px rgba(0,0,0,0.5); }
.header-inner {
display: flex;
align-items: center;
gap: var(--space-6);
height: var(--header-height);
width: 100%;
padding: 0 clamp(12px, 4vw, 24px);   
}
.header-inner .search-field { flex: 1 1 auto; }     
.site-logo {
display: flex;
align-items: center;
gap: var(--space-2);
text-decoration: none;
flex-shrink: 0;
}
.site-logo__badge {
background: var(--tx-green);
color: var(--tx-black);
font-family: var(--font-display);
font-size: var(--text-xs);
padding: 5px 9px;
border-radius: var(--radius-xs);
letter-spacing: 1px;
line-height: 1;
}
.site-logo__name {
font-family: var(--font-display);
font-size: var(--text-xl);
color: var(--tx-white);
letter-spacing: 2px;
line-height: 1;
}
.site-logo img {
display: block;
height: auto;
width: auto;
max-height: calc(var(--header-height) - 14px);
max-width: 160px;
object-fit: contain;
}
.site-logo img.site-logo__mark {
height: 41px;
width: auto;
max-width: none;
}
.tx-dropdown-menu {
display: none;
position: absolute;
top: calc(100% + 6px);
left: 50%;
transform: translateX(-50%);
background: #0D1024;
border: 1px solid var(--tx-border);
box-shadow: var(--shadow-lg);
padding: var(--space-2) 0;
min-width: 210px;
border-radius: var(--radius-md);
z-index: var(--z-nav);
animation: fadeIn 0.15s ease both;
}
.tx-dropdown-menu li a {
display: block;
color: var(--tx-muted-light);
padding: 10px var(--space-5);
font-size: var(--text-sm);
font-weight: 600;
transition: background var(--ease), color var(--ease);
}
.tx-dropdown-menu li a:hover { background: var(--tx-navy); color: var(--tx-green); }
.tx-dropdown-menu li + li { border-top: 1px solid rgba(255,255,255,0.04); }
.header-actions {
margin-left: auto;
display: flex;
align-items: center;
gap: var(--space-3);
}
.header-icon {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 46px; height: 46px;
color: var(--tx-muted);
border-radius: var(--radius-sm);
font-size: 23px;
transition: color var(--ease), background var(--ease);
text-decoration: none;
}
.header-icon:hover { color: var(--tx-green); background: rgba(57,255,20,0.07); }
.header-icon .count {
position: absolute;
top: 2px; right: 2px;
background: var(--tx-green);
color: var(--tx-black);
font-size: 9px;
font-weight: 700;
width: 16px; height: 16px;
border-radius: 50%;
display: flex; align-items: center; justify-content: center;
line-height: 1;
pointer-events: none;
}
.menu-toggle {
display: none;
align-items: center;
justify-content: center;
width: 40px; height: 40px;
background: none;
border: 1px solid var(--tx-border);
color: var(--tx-white);
border-radius: var(--radius-sm);
font-size: 18px;
transition: border-color var(--ease), color var(--ease);
}
.menu-toggle:hover { border-color: rgba(57,255,20,0.4); color: var(--tx-green); }
.main-nav { background: var(--tx-navy-light); border-top: 1px solid var(--tx-border); border-bottom: 1px solid var(--tx-border); }
.main-nav__inner { display: flex; padding: 0 clamp(16px, 4vw, 24px); }
.header-link {
display: flex; align-items: center; height: 46px; padding: 0 8px;
color: var(--tx-muted-light);
font-family: var(--font-display); letter-spacing: 1px; text-transform: uppercase;
font-size: var(--text-sm); text-decoration: none;
transition: color var(--ease);
}
.header-link:hover { color: var(--tx-green); }
.main-nav__list { display: flex; align-items: center; gap: var(--space-2); list-style: none; margin: 0; padding: 0; }
.main-nav__list > .menu-item > a {
display: block; padding: 12px 16px; color: var(--tx-white);
font-family: var(--font-display); letter-spacing: 1px; text-transform: uppercase; font-size: var(--text-sm);
text-decoration: none; transition: color var(--ease); }
.main-nav__list > .menu-item > a:hover { color: var(--tx-green); }
.main-nav .menu-item { position: relative; }
.main-nav .tx-dropdown-menu {
display: none; position: absolute; top: 100%; left: 0; transform: none; min-width: 200px; z-index: var(--z-dropdown, 50);
background: var(--tx-card); border: 1px solid var(--tx-border); border-radius: var(--radius-sm);
list-style: none; margin: 0; padding: 6px 0; }
.main-nav .menu-item:hover > .tx-dropdown-menu { display: block; }
.main-nav .tx-dropdown-menu a { display: block; padding: 8px 16px; color: var(--tx-white); text-decoration: none; }
.main-nav .tx-dropdown-menu a:hover { color: var(--tx-green); background: rgba(255,255,255,0.04); }
@media (max-width: 880px) { .main-nav__list { flex-wrap: wrap; } }
@media (max-width: 768px) {
.menu-toggle { display: flex; }
.header-inner .search-field { display: none; }
.main-nav { display: none; }
.main-nav.is-open { display: block; }
.main-nav.is-open .main-nav__inner { padding: var(--space-2) clamp(16px, 4vw, 24px); }
.main-nav.is-open .main-nav__list { flex-direction: column; align-items: stretch; gap: 0; }
.main-nav.is-open .main-nav__list > .menu-item { width: 100%; }
.main-nav.is-open .main-nav__list > .menu-item > a {
display: block; padding: 12px 2px; border-bottom: 1px solid var(--tx-border);
}
.tx-dropdown-menu {
display: none;
position: static;
transform: none;
box-shadow: none;
background: rgba(255,255,255,0.03);
border: none;
border-radius: 0;
margin-left: var(--space-4);
}
.main-nav .menu-item.is-sub-open > .tx-dropdown-menu { display: block; }
.main-nav.is-open .menu-item-has-children > a::after {
content: '\25BE'; 
float: right;
color: var(--tx-green);
transition: transform var(--ease);
}
.main-nav.is-open .menu-item.is-sub-open > a::after { transform: rotate(180deg); }
}
@media (max-width: 480px) {
.site-logo__name { display: none; }
}
.tx-search-toggle { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; }
.search-toggle { display: none; } 
@media (max-width: 768px) {
.header-inner { position: relative; gap: var(--space-3); }
.header-actions { gap: var(--space-2); }
.header-link { font-size: var(--text-xs); padding: 0 4px; height: 40px; }
.header-icon { width: 40px; height: 40px; font-size: 19px; }
.search-toggle {
display: inline-flex; align-items: center; justify-content: center;
width: 40px; height: 40px; border-radius: var(--radius-sm);
background: none; border: none; cursor: pointer;
color: var(--tx-muted-light); font-size: 19px;
}
.search-toggle:hover { color: var(--tx-green); }
#tx-search-toggle:checked ~ .search-field {
display: flex; position: absolute; top: 100%; left: 0; right: 0;
width: 100%; max-width: none; margin: 0; z-index: 60;
padding: 10px clamp(16px, 4vw, 40px);
background: var(--tx-void, #05050A); border-bottom: 1px solid var(--tx-border);
}
}
.tx-context-nav {
background: var(--tx-navy);
border-top: 1px solid var(--tx-green-subtle);
border-bottom: 1px solid var(--tx-green-subtle);
animation: tx-context-in .35s ease both;
}
.tx-context-nav__inner {
width: 100%;
padding: var(--space-2) clamp(16px, 4vw, 40px);
display: flex;
flex-direction: column;
gap: 6px;
}
@keyframes tx-context-in {
from { opacity: 0; transform: translateY(-8px); }
to   { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) { .tx-context-nav { animation: none; } }
.tx-breadcrumb {
display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
margin: 0; padding: 0; list-style: none; font-size: var(--text-xs);
}
.tx-breadcrumb__item { display: flex; align-items: center; gap: 6px; color: var(--tx-muted); }
.tx-breadcrumb__item:not(:first-child)::before { content: "\203A"; color: var(--tx-muted); opacity: .55; }
.tx-breadcrumb__item a { color: var(--tx-muted-light); text-decoration: none; transition: color var(--ease); }
.tx-breadcrumb__item a:hover { color: var(--tx-green); }
.tx-breadcrumb__item[aria-current] span { color: var(--tx-white); font-weight: 600; }
.tx-cat-chips {
display: flex; gap: 8px; margin: 0; padding: 2px 0; list-style: none;
overflow-x: auto; scrollbar-width: thin;
}
.tx-cat-chips::-webkit-scrollbar { height: 6px; }
.tx-cat-chips::-webkit-scrollbar-thumb { background: var(--tx-green-glow); border-radius: 3px; }
.tx-chip {
display: inline-block; white-space: nowrap;
padding: 5px 12px; border-radius: 999px;
background: var(--tx-navy-light);
border: 1px solid rgba(255,255,255,.08);
color: var(--tx-muted-light); text-decoration: none;
font-size: var(--text-xs); font-weight: 600;
transition: border-color var(--ease), color var(--ease), background var(--ease);
}
.tx-chip:hover { color: var(--tx-white); border-color: rgba(57,255,20,.45); }
.tx-chip.is-active { color: var(--tx-green); border-color: var(--tx-green); background: var(--tx-green-subtle); }
.tx-slime-host { position: relative; }
.tx-slime {
position: absolute;
top: 100%;
left: 0;
right: 0;
height: 140px;            
pointer-events: none;
z-index: 2;
filter: url(#tx-goo) drop-shadow(0 2px 4px rgba(57,255,20,.4));
}
.tx-slime__skin {
position: absolute;
top: -3px;
left: 0;
right: 0;
height: 7px;
background: linear-gradient(#d9ffcb 0 2px, var(--tx-green) 2px);
}
.tx-slime__tooth {
position: absolute;
top: -2px;
width: var(--w, 32px);
height: var(--h, 26px);
background: radial-gradient(at 40% 18%, #c7ffb3, var(--tx-green) 52%, #23a80c 82%, #157506 100%);
border-radius: 0 0 50% 50% / 0 0 var(--r, 55%) var(--r, 55%);
transform-origin: top center;
animation: tx-ooze var(--d, 5.4s) var(--delay, 0s) ease-in-out infinite;
}
@keyframes tx-ooze {
0%   { transform: scaleY(.78) scaleX(1.05); }
42%  { transform: scaleY(1.16) scaleX(.965); }
58%  { transform: scaleY(1.04) scaleX(1.0); }
82%  { transform: scaleY(1.22) scaleX(.95); }
100% { transform: scaleY(.78) scaleX(1.05); }
}
.tx-slime__tooth.is-surging {
animation: tx-surge .9s cubic-bezier(.55, 0, .85, .4) forwards;
}
@keyframes tx-surge {
0%   { transform: scaleY(1)    scaleX(1); }
70%  { transform: scaleY(1.22) scaleX(.9); }
100% { transform: scaleY(1.35) scaleX(.78); } 
}
.tx-slime__tooth.is-recoil {
animation: tx-recoil .7s cubic-bezier(.2, 1.4, .4, 1) forwards;
}
@keyframes tx-recoil {
0%   { transform: scaleY(1.35) scaleX(.78); }
55%  { transform: scaleY(.82)  scaleX(1.1); } 
100% { transform: scaleY(1)    scaleX(1); }
}
.tx-slime-drops {
position: absolute;
top: 100%;
left: 0;
right: 0;
height: 240px;
pointer-events: none;
z-index: 3;
}
.tx-slime__fall {
position: absolute;
top: 0;
width: var(--dot, 14px);
height: calc(var(--dot, 14px) * 1.55);
transform: translateX(-50%);
background: radial-gradient(at 38% 24%, #eafff0 0%, #7dff5a 42%, var(--tx-green) 78%, #1f9a0a 100%);
border-radius: 50% 50% 50% 50% / 64% 64% 36% 36%;
box-shadow: 0 0 8px rgba(57,255,20,.5);
animation: tx-slime-fall var(--dur, 1.6s) cubic-bezier(.5, 0, .9, .45) forwards;
}
.tx-slime__fall::before { 
content: "";
position: absolute;
top: 16%;
left: 24%;
width: 30%;
height: 34%;
background: rgba(255,255,255,.75);
border-radius: 50%;
filter: blur(.5px);
}
.tx-slime__fall::after { 
content: "";
position: absolute;
bottom: 92%;
left: 50%;
width: 2px;
height: 26px;
margin-left: -1px;
background: linear-gradient(rgba(57,255,20,0), var(--tx-green));
transform-origin: bottom center;
animation: tx-filament var(--dur, 1.6s) ease-out forwards;
}
@keyframes tx-filament {
0%   { transform: scaleY(.4); opacity: .9; }
18%  { transform: scaleY(1);  opacity: .7; } 
32%  { transform: scaleY(.15); opacity: 0; } 
100% { transform: scaleY(0);  opacity: 0; }
}
@keyframes tx-slime-fall {
0%   { transform: translate(-50%, -6px) scaleY(1.25) scaleX(.85); opacity: 0; }
10%  { opacity: 1; transform: translate(-50%, 2px) scaleY(1.05) scaleX(.98); }
80%  { opacity: 1; }
100% { transform: translate(-50%, var(--fall, 120px)) scaleY(1.18) scaleX(.92); opacity: 0; }
}
@media (max-width: 768px) {
.tx-slime { height: 90px; }
.tx-slime-drops { height: 160px; }
}
@media (prefers-reduced-motion: reduce) { .tx-slime, .tx-slime-drops { display: none; } }
.search-field { position: relative; }
.tx-livesearch {
position: absolute;
top: calc(100% + 6px);
left: 0;
right: 0;
z-index: 300;
background: var(--tx-card, #111436);
border: 1px solid var(--tx-border);
border-radius: var(--radius-sm, 8px);
box-shadow: 0 16px 40px rgba(0, 0, 0, 0.55);
max-height: min(70vh, 520px);
overflow-y: auto;
padding: 4px;
}
.tx-ls-item {
display: flex;
align-items: center;
gap: 10px;
padding: 8px;
border-radius: 6px;
color: var(--tx-white);
text-decoration: none;
}
.tx-ls-item:hover,
.tx-ls-item.is-active { background: var(--tx-green-subtle); }
.tx-ls-item__img {
width: 44px;
height: 44px;
flex: 0 0 44px;
object-fit: contain;
background: rgba(255, 255, 255, 0.06);
border-radius: 4px;
}
.tx-ls-item__name {
flex: 1;
min-width: 0;
font-size: 13px;
font-weight: 600;
line-height: 1.3;
color: var(--tx-white);
}
.tx-ls-item__oos {
font-size: 10px;
color: var(--tx-muted-light);
text-transform: uppercase;
letter-spacing: .5px;
}
.tx-ls-item__price {
font-family: var(--font-display);
font-size: 13px;
color: var(--tx-white);
white-space: nowrap;
}
.tx-livesearch__all {
display: block;
text-align: center;
padding: 10px;
margin-top: 4px;
border-top: 1px solid var(--tx-border);
color: var(--tx-green);
font-weight: 700;
font-size: var(--text-sm);
text-decoration: none;
}
.tx-livesearch__all:hover,
.tx-livesearch__all.is-active { background: var(--tx-green-subtle); }
.tx-livesearch__empty {
padding: 14px;
text-align: center;
color: var(--tx-muted-light);
font-size: 13px;
}
.main-nav__inner { align-items: center; }      
.tx-langs { margin-left: auto; }                 
.tx-langs ul { display: flex; align-items: center; gap: 10px; list-style: none; margin: 0; padding: 0; }
.tx-langs li { margin: 0; }
.tx-langs a {
display: flex;
align-items: center;
line-height: 0;
opacity: .5;
border-radius: 3px;
transition: opacity var(--ease), transform var(--ease);
}
.tx-langs a:hover { opacity: 1; transform: translateY(-1px); }
.tx-langs img {
display: block;
width: 24px !important;   
height: auto !important;
border-radius: 3px;
box-shadow: 0 0 0 1px rgba(0,0,0,.25);
}
.tx-langs .current-lang a {
opacity: 1;
outline: 2px solid var(--tx-green);
outline-offset: 1px;
}
/* == footer.css == */
.trust-bar {
background: #0D0F2A;
padding: var(--space-10) 0;
border-top: 1px solid rgba(57,255,20,0.06);
border-bottom: 1px solid rgba(57,255,20,0.06);
}
.trust-bar__grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
gap: var(--space-6);
}
.trust-item { text-align: center; }
.trust-item__icon   { font-size: 26px; margin-bottom: var(--space-2); }
.trust-item__title  { font-size: var(--text-sm); font-weight: 700; color: var(--tx-white); margin-bottom: var(--space-1); }
.trust-item__desc   { font-size: var(--text-xs); color: var(--tx-muted); line-height: 1.6; }
.newsletter-section {
padding: var(--space-16) 0;
text-align: center;
}
.newsletter-section h2 { font-size: var(--text-2xl); margin-bottom: var(--space-2); }
.newsletter-section h2 span { color: var(--tx-green); }
.newsletter-section p { font-size: var(--text-base); color: var(--tx-muted); margin-bottom: var(--space-8); }
.newsletter-form {
display: flex;
gap: var(--space-2);
justify-content: center;
flex-wrap: wrap;
}
.newsletter-form input[type="email"] {
background: var(--tx-navy);
border: 1px solid rgba(57,255,20,0.2);
color: var(--tx-white);
padding: 12px 18px;
border-radius: var(--radius-sm);
font-family: var(--font-body);
font-size: var(--text-base);
width: 280px;
outline: none;
transition: border-color var(--ease);
}
.newsletter-form input[type="email"]::placeholder { color: var(--tx-muted); }
.newsletter-form input[type="email"]:focus { border-color: rgba(57,255,20,0.5); }
.site-footer {
background: #05050A;
border-top: 1px solid rgba(57,255,20,0.08);
padding: var(--space-16) 0 var(--space-10);
}
.footer-grid {
display: grid;
grid-template-columns: minmax(260px, 1.4fr) repeat(4, 1fr);
gap: var(--space-8);
margin-bottom: var(--space-10);
align-items: start;
}
.footer-brand { margin-right: var(--space-6); }
.footer-brand__name {
font-family: var(--font-display);
font-size: var(--text-xl);
color: var(--tx-white);
letter-spacing: 2px;
margin-bottom: var(--space-2);
line-height: 1;
}
.footer-brand__name span { color: var(--tx-green); }
.footer-brand__tagline {
font-size: var(--text-xs);
color: var(--tx-green);
font-weight: 700;
letter-spacing: 1.5px;
text-transform: uppercase;
margin-bottom: var(--space-3);
}
.footer-brand__desc {
font-size: var(--text-sm);
color: var(--tx-muted);
line-height: 1.7;
max-width: 230px;
margin-bottom: var(--space-5);
}
.footer-social { display: flex; gap: var(--space-2); }
.footer-social__btn {
width: 34px; height: 34px;
background: var(--tx-navy);
border: 1px solid rgba(57,255,20,0.15);
border-radius: var(--radius-sm);
color: var(--tx-muted);
display: flex; align-items: center; justify-content: center;
font-size: 15px;
text-decoration: none;
transition: border-color var(--ease), color var(--ease);
}
.footer-social__btn:hover { border-color: rgba(57,255,20,0.45); color: var(--tx-green); }
.footer-col__heading {
font-family: var(--font-display);
font-size: var(--text-xs);
color: var(--tx-green);
letter-spacing: 1.5px;
text-transform: uppercase;
margin-bottom: var(--space-4);
}
.footer-col__links { display: flex; flex-direction: column; gap: 9px; }
.footer-col__links a {
font-size: var(--text-sm);
color: var(--tx-white); 
font-weight: 600;
transition: color var(--ease);
line-height: 1.3;
}
.footer-col__links a:hover { color: var(--tx-green); }
.footer-brands {
display: flex;
align-items: center;
gap: var(--space-4);
flex-wrap: wrap;
padding: var(--space-5) 0;
border-top: 1px solid rgba(255,255,255,0.05);
border-bottom: 1px solid rgba(255,255,255,0.05);
margin-bottom: var(--space-5);
}
.footer-brands__label {
font-size: var(--text-xs);
font-weight: 700;
color: var(--tx-muted);
letter-spacing: 1px;
text-transform: uppercase;
white-space: nowrap;
flex-shrink: 0;
}
.footer-brands__row {
display: flex;
gap: var(--space-2);
flex-wrap: wrap;
align-items: center;
}
.footer-brand-pill {
display: inline-flex;
align-items: center;
justify-content: center;
background: var(--tx-navy);
border: 1px solid var(--tx-border);
border-radius: var(--radius-xs);
padding: 5px 12px;
font-family: var(--font-display);
font-size: var(--text-xs);
font-weight: 400;
color: var(--tx-muted-light);
letter-spacing: 0.8px;
white-space: nowrap;
text-decoration: none;
transition: color var(--ease), border-color var(--ease), background var(--ease);
}
a.footer-brand-pill:hover {
color: var(--tx-green);
border-color: rgba(57, 255, 20, 0.3);
background: rgba(57, 255, 20, 0.05);
}
.footer-bottom {
display: flex;
align-items: flex-start;
justify-content: space-between;
flex-wrap: wrap;
gap: var(--space-4);
}
.footer-bottom__copy {
font-size: var(--text-xs);
color: var(--tx-muted);
line-height: 1.7;
}
.footer-bottom__copy strong { color: var(--tx-white); }
.footer-bottom__copy .reg {
display: block;
margin-top: 2px;
font-size: 11px;
opacity: 0.6;
}
.footer-bottom__legal {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0;
list-style: none;
}
.footer-bottom__legal li { display: flex; align-items: center; }
.footer-bottom__legal li + li::before {
content: '·';
color: var(--tx-border);
padding: 0 var(--space-2);
pointer-events: none;
font-size: var(--text-xs);
}
.footer-bottom__legal a {
font-size: var(--text-xs);
color: var(--tx-white); 
white-space: nowrap;
transition: color var(--ease);
}
.footer-bottom__legal a:hover { color: var(--tx-green); }
@media (max-width: 1024px) {
.footer-grid { grid-template-columns: repeat(3, 1fr); }
.footer-brand { grid-column: 1 / -1; }
.footer-brand__desc { max-width: 100%; }
}
@media (max-width: 768px) {
.footer-grid { grid-template-columns: repeat(2, 1fr); }
.footer-brand { grid-column: 1 / -1; }
.footer-bottom { flex-direction: column; }
}
@media (max-width: 480px) {
.footer-grid { grid-template-columns: 1fr 1fr; }
.newsletter-form input[type="email"] { width: 100%; }
.newsletter-form { flex-direction: column; align-items: center; }
.footer-bottom__legal { gap: var(--space-1) 0; }
}
.footer-inner {
width: 100%;
max-width: none;
margin-inline: 0;
padding-inline: clamp(16px, 4vw, 40px);
}
.footer-col__soon { font-size: var(--text-sm); color: var(--tx-muted); font-weight: 600; margin: 9px 0 0; line-height: 1.3; }
.footer-col__soon em { color: var(--tx-green); font-style: normal; font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.5px; }
.tx-brand-marquee {
overflow: hidden;
padding: var(--space-6) 0;
border-top: 1px solid rgba(57,255,20,0.08);
-webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.tx-brand-marquee__track {
display: flex;
width: max-content;
animation: tx-brand-drift calc(var(--n, 60) * 1.6s) linear infinite;
}
.tx-brand-marquee:hover .tx-brand-marquee__track,
.tx-brand-marquee:focus-within .tx-brand-marquee__track {
animation-play-state: paused;
}
.tx-brand-marquee__set { display: flex; align-items: center; }
@keyframes tx-brand-drift {
from { transform: translateX(0); }
to   { transform: translateX(-50%); } 
}
.tx-brand3d {
font-family: var(--font-display);
font-size: clamp(15px, 1.5vw, 22px);
letter-spacing: 1px;
text-transform: uppercase;
white-space: nowrap;
padding: 0 clamp(14px, 2vw, 28px);
color: var(--tx-white);
text-decoration: none;
text-shadow:
1px 1px 0 #157506,
2px 2px 0 #126305,
3px 3px 0 #0e5204,
4px 4px 0 #0a4103,
0 0 14px rgba(57,255,20,.25);
transition: color var(--ease), transform var(--ease), text-shadow var(--ease);
}
.tx-brand3d:hover,
.tx-brand3d:focus-visible {
color: var(--tx-green);
transform: translateY(-3px);
text-shadow:
2px 2px 0 #157506,
4px 4px 0 #126305,
6px 6px 0 #0e5204,
8px 8px 0 #0a4103,
0 0 22px rgba(57,255,20,.55);
}
@media (prefers-reduced-motion: reduce) {
.tx-brand-marquee { overflow-x: auto; }
.tx-brand-marquee__track { animation: none; }
.tx-brand-marquee__set[aria-hidden] { display: none; } 
}
/* == shop.css == */
.woocommerce ul.products,
ul.products {
display: grid !important;
grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr));
gap: clamp(var(--space-3), 2vw, var(--space-6));
margin: var(--space-8) 0 0;
padding: 0;
list-style: none;
}
.woocommerce ul.products li.product,
ul.products li.product,
ul.products li.product-category {
width: auto !important;
max-width: none !important;
margin: 0 !important;
padding: 0;
float: none !important;
display: flex;
flex-direction: column;
}
ul.products li.product > .product-card {
flex: 1 1 auto;
width: 100%;
}
.woocommerce ul.products::before,
.woocommerce ul.products::after,
ul.products::before,
ul.products::after {
content: none !important;
}
.woo-wrap--full { width: 100%; padding: 0 clamp(16px, 4vw, 40px); }
.woo-layout--filtered {
display: grid;
grid-template-columns: 260px 1fr;
gap: var(--space-8);
align-items: start;
}
.woo-results { min-width: 0; }
.woo-results.tx-loading { opacity: 0.5; pointer-events: none; transition: opacity var(--ease); }
.tx-filters {
position: sticky; top: calc(var(--header-height) + 12px);
display: flex; flex-direction: column; gap: var(--space-5);
background: var(--tx-card); border: 1px solid var(--tx-border);
border-radius: var(--radius-md); padding: var(--space-5);
}
.tx-filters__head { display: flex; align-items: center; justify-content: space-between; }
.tx-filters__count { font-weight: 700; color: var(--tx-white); font-size: var(--text-sm); }
.tx-filters__clear { font-size: var(--text-xs); color: var(--tx-muted-light); text-decoration: none; }
.tx-filters__clear:hover { color: var(--tx-green); }
.tx-facet { border: none; margin: 0; padding: 0; }
.tx-facet__title {
font-family: var(--font-display); font-size: var(--text-sm); color: var(--tx-white);
text-transform: uppercase; letter-spacing: 1px; padding: 0 0 var(--space-2);
border-bottom: 1px solid var(--tx-border); margin-bottom: var(--space-2); width: 100%;
}
.tx-facet__opt { display: flex; align-items: center; gap: 8px; padding: 4px 0; font-size: var(--text-sm); color: var(--tx-muted-light); cursor: pointer; }
.tx-facet__opt input { accent-color: var(--tx-green); }
.tx-facet__name { flex: 1; }
.tx-facet__count { color: var(--tx-muted); font-size: var(--text-xs); }
.tx-facet__opt:hover .tx-facet__name { color: var(--tx-white); }
.tx-facet__opt--more { display: none; }
.tx-facet--expanded .tx-facet__opt--more { display: flex; }
.tx-facet__showmore { background: none; border: none; color: var(--tx-green); font-size: var(--text-xs); cursor: pointer; padding: 4px 0; text-align: left; }
.tx-facet__price { display: flex; align-items: center; gap: 8px; }
.tx-facet__price input {
width: 100%; background: var(--tx-navy-light); border: 1px solid var(--tx-border);
border-radius: var(--radius-sm); color: var(--tx-white); padding: 8px 10px; font-size: var(--text-sm);
}
.tx-pagination { display: flex; gap: 6px; justify-content: center; margin-top: var(--space-8); flex-wrap: wrap; }
.tx-pagination a, .tx-pagination .current {
display: inline-flex; align-items: center; justify-content: center; min-width: 38px; height: 38px;
padding: 0 10px; border: 1px solid var(--tx-border); border-radius: var(--radius-sm);
color: var(--tx-white); text-decoration: none; font-weight: 700;
}
.tx-pagination .current, .tx-pagination a:hover { background: var(--tx-green); color: var(--tx-black); border-color: var(--tx-green); }
.tx-no-results { color: var(--tx-muted-light); padding: var(--space-8) 0; }
.tx-filters__toggle { display: none; }
.tx-filters__close { display: none; }
@media (max-width: 768px) {
.tx-filters__close {
display: flex; align-items: center; justify-content: center;
position: absolute; top: 8px; right: 10px; width: 38px; height: 38px;
background: transparent; border: none; color: var(--tx-white);
font-size: 30px; line-height: 1; cursor: pointer; z-index: 3;
}
.tx-filters__close:hover { color: var(--tx-green); }
.woo-layout--filtered { grid-template-columns: 1fr; }
.tx-filters__toggle {
display: inline-flex; align-items: center; gap: 8px; margin-bottom: var(--space-4);
font-family: var(--font-display); letter-spacing: 1px; text-transform: uppercase; font-size: var(--text-sm);
background: var(--tx-green); color: var(--tx-black); border: none; border-radius: var(--radius-sm);
padding: 10px 18px; cursor: pointer;
}
.woo-sidebar {
position: fixed; top: 0; left: 0; bottom: 0; width: 86%; max-width: 340px; z-index: var(--z-overlay, 900);
transform: translateX(-100%); transition: transform var(--ease); overflow-y: auto;
background: var(--tx-void, #05050A); padding: 54px var(--space-4) var(--space-4);
}
body.tx-filters-open .woo-sidebar { transform: translateX(0); }
body.tx-filters-open::after { content: ''; position: fixed; inset: 0; background: rgba(0,0,0,0.6); z-index: calc(var(--z-overlay, 900) - 1); }
.tx-filters { position: static; }
}
/* == woocommerce.css == */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt,
.woocommerce .single_add_to_cart_button,
.woocommerce ul.products li.product .button.add_to_cart_button,
.woocommerce .products .button.add_to_cart_button {
background: var(--tx-green);
color: var(--tx-black);
font-weight: 700;
border: none;
transition: box-shadow var(--ease), background var(--ease);
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce .single_add_to_cart_button:hover,
.woocommerce ul.products li.product .button.add_to_cart_button:hover,
.woocommerce .products .button.add_to_cart_button:hover {
background: var(--tx-green-dark);
color: var(--tx-black);
box-shadow: var(--shadow-green);
}
.product-card__add {
background: var(--tx-green);
color: var(--tx-black);
border-color: var(--tx-green);
}
.product-card__add:hover { background: var(--tx-green-dark); box-shadow: var(--shadow-green); }