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

.tx-btn, .tx-basket-btn, .tx-chip, .tx-hero-server {
  clip-path: polygon(0 0, calc(100% - var(--tx-cut)) 0, 100% var(--tx-cut), 100% 100%, var(--tx-cut) 100%, 0 calc(100% - var(--tx-cut)));
}
.tx-btn-sm, .tx-actions-sm .tx-btn { --tx-cut: 7px; }
.tx-btn, .tx-basket-btn { text-transform: uppercase; letter-spacing: .06em; font-family: var(--tx-font-head); font-weight: 700; font-size: 1em; }
.tx-btn-lg { font-size: 1.1em; }
.tx-btn-secondary, .tx-btn-ghost { background: var(--tx-surface-2); border-color: transparent; }

.tx-card, .tx-cat, .tx-buybox, .tx-panel, .tx-widget, .tx-feature, .tx-cta, .tx-summary, .tx-line, .tx-gallery-stage, .tx-hero-frame, .tx-stats {
  clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 16px 100%, 0 calc(100% - 16px));
}
.tx-card:hover { box-shadow: none; }

.tx-eyebrow { color: var(--tx-accent); font-family: var(--tx-font-head); font-size: .95em; letter-spacing: .2em; }
.tx-eyebrow::before { content: ""; width: 10px; height: 10px; background: var(--tx-accent); clip-path: polygon(0 0, 100% 50%, 0 100%); }

.tx-hero-title { font-size: clamp(3em, 8vw, 6.6em); line-height: .88; letter-spacing: .005em; }
.tx-hero-banner .tx-hero-text { font-size: 1.2em; color: var(--tx-text); opacity: .85; }
.tx-hero-banner::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 6px;
  z-index: 3;
  background: repeating-linear-gradient(135deg, var(--tx-accent) 0 14px, var(--tx-bg) 14px 28px);
}
.tx-hero-banner:not(.has-image) {
  background:
    linear-gradient(to top, var(--tx-bg), transparent 60%),
    repeating-linear-gradient(90deg, color-mix(in srgb, var(--tx-accent) 6%, transparent) 0 1px, transparent 1px 90px),
    var(--tx-surface);
}

.tx-section-title { font-size: clamp(2em, 4vw, 3em); line-height: .95; }
.tx-section-head { position: relative; padding-left: 18px; }
.tx-section-head::before { content: ""; position: absolute; left: 0; top: 4px; bottom: 4px; width: 5px; background: var(--tx-accent); }

.tx-utility { background: var(--tx-accent); color: var(--tx-accent-ink); border: 0; }
.tx-utility-server, .tx-utility-link, .tx-utility-note, .tx-utility .tx-socials a { color: var(--tx-accent-ink); }
.tx-utility-server { font-family: var(--tx-font-head); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.tx-utility .tx-dot { background: var(--tx-accent-ink); box-shadow: none; animation: tx-pulse 1.6s ease-in-out infinite; }
.tx-utility .tx-socials a:hover { background: rgba(0, 0, 0, .12); color: var(--tx-accent-ink); }
.tx-nav-bar > .tx-nav-item > .tx-nav-link { font-family: var(--tx-font-head); text-transform: uppercase; letter-spacing: .08em; font-weight: 600; font-size: 1em; }
.tx-nav-bar > .tx-nav-item.is-active > .tx-nav-link::after { height: 3px; border-radius: 0; bottom: -16px; }
.tx-brand-name { font-size: 1.45em; letter-spacing: .04em; }

.tx-tag { border-radius: 0; text-transform: uppercase; letter-spacing: .08em; font-family: var(--tx-font-head); font-size: .8em; }
.tx-tag-sale { background: var(--tx-accent); color: var(--tx-accent-ink); }

.tx-card-poster .tx-card-media { aspect-ratio: 4 / 5; background: radial-gradient(circle at 50% 38%, color-mix(in srgb, var(--tx-accent) 16%, var(--tx-surface-2)), var(--tx-surface) 70%); }
.tx-card-poster .tx-card-body { background: linear-gradient(to top, rgba(8, 6, 4, .95) 35%, transparent); }
.tx-card-poster .tx-card-title { font-size: 1.35em; letter-spacing: .03em; }
.tx-card-poster:hover { outline: 2px solid var(--tx-accent); outline-offset: -2px; }

.tx-cats-mosaic .tx-cat { background: var(--tx-surface); }
.tx-cats-mosaic .tx-cat-media { background: radial-gradient(circle at 50% 40%, color-mix(in srgb, var(--tx-accent) 12%, var(--tx-surface-2)), var(--tx-surface) 72%); }
.tx-cats-mosaic .tx-cat-name { font-size: 1.4em; }
.tx-cats-mosaic .tx-cat:first-child .tx-cat-name { font-size: 2.4em; }
.tx-cat:hover { border-color: var(--tx-accent); }

.tx-stats { border: 0; background: var(--tx-surface); }
.tx-stat dd { font-size: clamp(2.2em, 4vw, 3.2em); color: var(--tx-accent); }
.tx-stat dt { text-transform: uppercase; letter-spacing: .12em; font-size: .78em; }

.tx-feature-icon { background: var(--tx-accent); color: var(--tx-accent-ink); border-radius: 0; clip-path: polygon(0 0, 70% 0, 100% 30%, 100% 100%, 30% 100%, 0 70%); }
.tx-feature-title { font-size: 1.5em; }

.tx-cta { background: var(--tx-accent); color: var(--tx-accent-ink); border: 0; }
.tx-cta .tx-cta-text { color: rgba(26, 18, 5, .75); }
.tx-cta .tx-btn-primary { background: var(--tx-bg); color: var(--tx-accent); }
.tx-cta-title { font-size: clamp(2.2em, 5vw, 3.6em); line-height: .9; }

.tx-price { font-family: var(--tx-font-head); font-size: 1.35em; letter-spacing: .02em; }
.tx-price-xl { font-size: 2.6em; color: var(--tx-accent); }
.tx-product-title { font-size: clamp(2.2em, 4vw, 3.4em); line-height: .92; }
.tx-tabbar .tx-tab { text-transform: uppercase; letter-spacing: .08em; font-family: var(--tx-font-head); font-size: 11px; }
.tx-tab::before { border-radius: 0; }
.tx-progress, .tx-progress > span { border-radius: 0; }

@media (max-width: 899px) {
  .tx-hero-title { font-size: clamp(2.8em, 14vw, 4em); }
  .tx-section-title { font-size: 2em; }
}