.tx-body { --tx-card-ratio: 1 / 1; }

.tx-hero-title { font-size: clamp(3.2em, 8.5vw, 7.4em); line-height: .86; letter-spacing: -0.005em; }
.tx-hero-title::after { content: ""; display: block; width: 120px; height: 6px; margin-top: 22px; background: var(--tx-accent); transform: skewX(-24deg); }
.tx-hero-banner .tx-hero-bg img { filter: grayscale(.35) contrast(1.1); }
.tx-hero-banner .tx-hero-bg::after { background: linear-gradient(90deg, color-mix(in srgb, var(--tx-accent) 26%, transparent), transparent 60%), color-mix(in srgb, var(--tx-bg) calc(var(--tx-hero-overlay) * 100%), transparent); }
.tx-hero-banner:not(.has-image) { background: linear-gradient(115deg, color-mix(in srgb, var(--tx-accent) 18%, var(--tx-bg)) 0 30%, var(--tx-bg) 30.1%); }
.tx-eyebrow { color: var(--tx-accent-ink); background: var(--tx-accent); padding: 5px 12px; transform: skewX(-12deg); }
.tx-hero-copy .tx-eyebrow { margin-bottom: 22px; }

.tx-btn { text-transform: uppercase; letter-spacing: .08em; font-weight: 700; font-size: .88em; }
.tx-btn-primary { background: var(--tx-accent); }
.tx-btn-lg { padding: 0 28px; }
.tx-basket-btn { text-transform: uppercase; letter-spacing: .08em; font-size: .85em; }

.tx-section-title { font-size: clamp(2em, 4vw, 3.2em); display: flex; align-items: center; gap: 14px; }
.tx-section-title::before { content: ""; width: 18px; height: 18px; background: var(--tx-accent); transform: skewX(-18deg); flex: none; }

.tx-card { border-top: 3px solid var(--tx-border); }
.tx-card:hover { border-top-color: var(--tx-accent); transform: translateY(-4px); }
.tx-card-media { background: linear-gradient(160deg, color-mix(in srgb, var(--tx-accent) 14%, var(--tx-surface-2)), var(--tx-surface) 65%); }
.tx-card-title { font-size: 1.2em; letter-spacing: .02em; }

.tx-cats-rows { grid-template-columns: repeat(3, 1fr); }
.tx-cats-rows .tx-cat { border-left: 3px solid var(--tx-accent); border-radius: 0 var(--tx-radius) var(--tx-radius) 0; }
.tx-cats-rows .tx-cat-name { font-size: 1.25em; letter-spacing: .03em; }
.tx-cats-rows .tx-cat:hover { background: color-mix(in srgb, var(--tx-accent) 8%, var(--tx-surface)); }

.tx-stats { background: transparent; border: 0; gap: 12px; }
.tx-stat { background: var(--tx-surface); border: 1px solid var(--tx-border); border-radius: var(--tx-radius); }
.tx-stat dd { font-size: clamp(2.2em, 4vw, 3.4em); }
.tx-stat dt { text-transform: uppercase; letter-spacing: .14em; font-size: .75em; color: var(--tx-accent); }

.tx-feature { border-top: 3px solid var(--tx-accent); }
.tx-feature-icon { border-radius: 0; transform: skewX(-10deg); }
.tx-feature-title { font-size: 1.4em; }

.tx-cta { background: linear-gradient(115deg, var(--tx-accent) 0 58%, color-mix(in srgb, var(--tx-accent) 70%, #000) 58.1%); color: var(--tx-accent-ink); border: 0; }
.tx-cta .tx-cta-text { color: color-mix(in srgb, var(--tx-accent-ink) 80%, transparent); }
.tx-cta .tx-btn-primary { background: var(--tx-bg); color: var(--tx-text); }
.tx-cta-title { font-size: clamp(2.2em, 5vw, 3.8em); line-height: .9; }

.tx-price { font-family: var(--tx-font-head); font-size: 1.4em; font-weight: 600; }
.tx-price-xl { font-size: 2.8em; }
.tx-product-title { font-size: clamp(2.4em, 4vw, 3.6em); line-height: .9; }
.tx-tag-sale { background: var(--tx-accent); transform: skewX(-10deg); }
.tx-nav-bar > .tx-nav-item > .tx-nav-link { text-transform: uppercase; letter-spacing: .08em; font-size: .82em; font-weight: 600; }
.tx-nav-bar > .tx-nav-item.is-active > .tx-nav-link::after { border-radius: 0; height: 3px; bottom: -16px; }
.tx-brand-name { font-size: 1.5em; letter-spacing: .06em; }
.tx-progress, .tx-progress > span { border-radius: 0; }

@media (max-width: 1100px) { .tx-cats-rows { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 899px) {
  .tx-cats-rows { grid-template-columns: 1fr; }
  .tx-hero-title { font-size: clamp(3em, 15vw, 4.4em); }
  .tx-stats { gap: 8px; }
  .tx-stat { border-right: 1px solid var(--tx-border) !important; }
}
