.tx-body { --tx-card-ratio: 4 / 3; }

.tx-brand-name { font-size: 1.35em; letter-spacing: .1em; }
.tx-brand-name::before { content: "//"; color: var(--tx-accent); margin-right: 6px; }
.tx-nav-bar > .tx-nav-item > .tx-nav-link { font-family: var(--tx-font-head); text-transform: uppercase; letter-spacing: .1em; font-size: .86em; font-weight: 600; }
.tx-nav-bar > .tx-nav-item.is-active > .tx-nav-link { color: var(--tx-accent); }
.tx-nav-bar > .tx-nav-item.is-active > .tx-nav-link::after { border-radius: 0; height: 2px; bottom: -16px; }

.tx-hero-frame { border: 1px solid var(--tx-accent-line); }
.tx-hero-frame .tx-hero-bg img { filter: saturate(.55) sepia(.25) contrast(1.1); }
.tx-hero-frame .tx-hero-bg::before { background: linear-gradient(90deg, color-mix(in srgb, var(--tx-bg) 94%, transparent) 20%, color-mix(in srgb, var(--tx-bg) 40%, transparent) 65%, transparent), repeating-linear-gradient(0deg, rgba(0, 0, 0, .18) 0 1px, transparent 1px 4px); }
.tx-hero-frame::after { content: ""; position: absolute; top: 20px; right: 22px; z-index: 3; width: 10px; height: 10px; border-radius: 50%; background: var(--tx-sale); box-shadow: 0 0 0 4px color-mix(in srgb, var(--tx-sale) 25%, transparent); animation: tx-pulse 1.2s ease-in-out infinite; }
.tx-hero-title { font-size: clamp(2.8em, 7vw, 5.8em); line-height: .9; }
.tx-eyebrow { font-family: var(--tx-font-head); letter-spacing: .22em; }
.tx-eyebrow::before { content: "["; }
.tx-eyebrow::after { content: "]"; }

.tx-section-title { font-size: clamp(1.9em, 3.6vw, 3em); }
.tx-section-title::before { content: "▸ "; color: var(--tx-accent); font-style: normal; }

.tx-btn { font-family: var(--tx-font-head); text-transform: uppercase; letter-spacing: .12em; font-weight: 700; }
.tx-btn-connect { background: var(--tx-accent); color: var(--tx-accent-ink); }
.tx-btn-primary:hover, .tx-btn-connect:hover { filter: brightness(1.08); }

.tx-card { border-width: 1px; }
.tx-card:hover { border-color: var(--tx-accent); }
.tx-card-media { background: repeating-linear-gradient(45deg, var(--tx-surface-2) 0 2px, var(--tx-surface) 2px 12px); }
.tx-card-title { letter-spacing: .05em; }
.tx-price { font-family: var(--tx-font-head); color: var(--tx-accent); }

.tx-cats-rows .tx-cat { border-left: 3px solid var(--tx-accent); }
.tx-cats-rows .tx-cat-name { letter-spacing: .06em; }

.tx-jobs-list .tx-job { border-left: 3px solid var(--tx-accent); }
.tx-jobs-list .tx-job-name { font-size: 1.25em; }
.tx-job-icon { background: transparent; color: var(--tx-accent); border: 1px dashed var(--tx-accent-line); }

.tx-stats { border-style: dashed; }
.tx-stat dd { color: var(--tx-accent); font-family: var(--tx-font-head); }
.tx-stat dt { text-transform: uppercase; letter-spacing: .14em; font-size: .76em; }
.tx-live-body strong { color: var(--tx-accent); }
.tx-step-num { border-radius: 0; clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); width: 38px; height: 38px; }
.tx-cta { border: 1px dashed var(--tx-accent); background: transparent; }
.tx-tag-sale { background: var(--tx-accent); color: var(--tx-accent-ink); }

@media (max-width: 899px) {
  .tx-hero-frame::after { top: 14px; right: 14px; }
  .tx-hero-title { font-size: clamp(2.4em, 12vw, 3.4em); }
}