/* ══════════════════════════════════════════════════════════════
   LANDING PAGE — Hardware Aesthetic Overrides
   Loaded AFTER landing.css. Reskins v1 classes with --hw-* tokens.
   No DOM changes — JS keeps working.
══════════════════════════════════════════════════════════════ */

/* ── Global ── */
body {
  background: var(--hw-bg);
  color: var(--hw-text);
  font-family: var(--hw-font-body);
}

/* ── Boot Splash → LED Power-On ── */
.boot-splash {
  background: var(--hw-bg);
}
.boot-logo {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-ultra);
  color: var(--hw-text-dim);
  text-shadow: none;
}
.boot-lines {
  font-family: var(--hw-font-mono);
  color: var(--hw-text-dim);
}
.boot-line .ok   { color: var(--led-active); }
.boot-line .warn { color: var(--led-warn); }
.boot-line .hot  { color: var(--led-alert); }
.boot-bar {
  background: linear-gradient(90deg, var(--led-active), var(--led-signal));
}
.boot-bar-wrap {
  background: var(--hw-metal-dark);
}

/* ── Nav → Rack Rail ── */
.page-nav {
  background: rgba(13,13,15,0.95);
  border-bottom: 2px solid var(--hw-metal-dark);
  backdrop-filter: blur(12px);
}
.page-nav.scrolled {
  background: rgba(13,13,15,0.98);
  border-bottom-color: var(--hw-metal);
}
.nav-brand {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text);
  text-shadow: none;
}
.nav-brand .accent,
.nav-brand-text .accent { color: var(--hw-metal-bright); }
.nav-links a {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text-dim);
  font-size: 0.7rem;
}
.nav-links a:hover { color: var(--hw-text); }
.nav-links a.active { color: var(--hw-text); }
.nav-links a.active::after {
  background: var(--led-active);
  box-shadow: 0 0 4px var(--led-active);
}
.nav-auth-btn {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text);
  border-color: var(--hw-metal-dark);
  background: var(--hw-bg-raised);
}
.nav-auth-btn:hover {
  background: var(--hw-metal-dark);
  border-color: var(--hw-metal);
}

/* ── Hero ── */
.hero {
  background: var(--hw-bg);
}
.hero-tagline {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text-dim);
}
.hero-headline {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text);
  text-shadow: none;
}
.hero-headline em {
  color: var(--hw-text);
  font-style: normal;
}
.hero-sub {
  font-family: var(--hw-font-body);
  color: var(--hw-text-dim);
}
.hero-cta {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  background: var(--hw-metal-dark);
  border: 2px solid var(--hw-metal);
  color: var(--hw-text);
  text-shadow: none;
  box-shadow: var(--hw-shadow-raised);
  border-radius: 24px;
}
.hero-cta:hover {
  background: var(--hw-metal);
  border-color: var(--hw-metal-light);
  box-shadow: var(--hw-shadow-deep), 0 0 8px var(--led-active);
  color: #fff;
}
.hero-trust-item {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text-dim);
  font-size: 0.7rem;
}

/* ── Sections ── */
.section {
  border-top: 1px solid var(--hw-metal-dark);
}
.section-inner {
  max-width: var(--hw-content-max);
}
.eyebrow {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-ultra);
  color: var(--hw-text-dim);
}
.section-title {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text);
  text-shadow: none;
  -webkit-text-fill-color: unset;
  background: none;
  -webkit-background-clip: unset;
}
/* Kill shimmer animation */
.shimmer-text {
  background: none !important;
  -webkit-background-clip: unset !important;
  -webkit-text-fill-color: var(--hw-text) !important;
  animation: none !important;
}

/* ── Demo Showcase ── */
.demo-showcase {
  background: var(--hw-bg-inset);
  border-top: 2px solid var(--hw-metal-dark);
  border-bottom: 2px solid var(--hw-metal-dark);
}
.demo-eyebrow,
.demo-title {
  font-family: var(--hw-font-brand);
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
}
.demo-stat-val {
  font-family: var(--hw-font-label);
  color: var(--hw-text);
}
.demo-stat-label {
  font-family: var(--hw-font-brand);
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text-dim);
}

/* ── Modes Dial ── */
.mode-preview-name {
  font-family: var(--hw-font-brand);
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
}
.mode-try-cta {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text);
  background: var(--hw-metal-dark);
  border-color: var(--hw-metal);
}
.mode-try-cta:hover {
  background: var(--hw-metal);
}

/* ── How It Works ── */
.patch-step-label {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
}
.patch-step-time {
  font-family: var(--hw-font-mono);
  color: var(--led-active);
}
.patch-step-desc {
  font-family: var(--hw-font-body);
  color: var(--hw-text-dim);
}
.patch-jack {
  background: var(--hw-bg-inset);
  border-color: var(--hw-metal-dark);
}
.patch-jack-inner {
  background: var(--hw-metal-dark);
}

/* ── Knowledge Terminal ── */
.boot-terminal {
  background: var(--hw-bg-inset);
  border-color: var(--hw-metal-dark);
  font-family: var(--hw-font-mono);
}

/* ── Social Proof ── */
.proof-stat-number {
  font-family: var(--hw-font-label);
  color: var(--hw-text);
  text-shadow: none;
}
.proof-stat-label {
  font-family: var(--hw-font-brand);
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text-dim);
}
.proof-quote-text {
  font-family: var(--hw-font-body);
  color: var(--hw-text);
}
.proof-quote-attr {
  font-family: var(--hw-font-brand);
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text-dim);
}

/* ── FAQ ── */
.faq-question span:first-child {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-normal);
}
.faq-answer-text {
  font-family: var(--hw-font-body);
  color: var(--hw-text-dim);
}

/* ── Features ── */
.feature-card {
  background: var(--hw-bg-panel);
  border-color: var(--hw-metal-dark);
  border-radius: 0;
}
.feature-card:hover {
  border-color: var(--hw-metal);
}
.feature-card-title {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text);
}
.feature-card-desc {
  font-family: var(--hw-font-body);
  color: var(--hw-text-dim);
}
.feature-card-tier {
  font-family: var(--hw-font-brand);
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--led-active);
}

/* ── Pricing ── */
.price-card {
  background: var(--hw-bg-panel);
  border-color: var(--hw-metal-dark);
  border-radius: 0;
}
.price-card:hover {
  border-color: var(--hw-metal);
}
.price-card-tier {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-ultra);
  color: var(--hw-text-dim);
}
.price-card-amount {
  font-family: var(--hw-font-label);
  color: var(--hw-text);
}
.price-card-period {
  font-family: var(--hw-font-mono);
  color: var(--hw-text-faint);
}
.price-card-engine {
  font-family: var(--hw-font-brand);
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--led-signal);
}
.price-card-features {
  font-family: var(--hw-font-body);
  color: var(--hw-text-dim);
}
.price-card-domains {
  font-family: var(--hw-font-brand);
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text-faint);
  font-size: 0.65rem;
}
.price-card-cta {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  background: var(--hw-metal-dark);
  border: 1px solid var(--hw-metal);
  color: var(--hw-text);
  border-radius: var(--hw-radius-md);
}
.price-card-cta:hover {
  background: var(--hw-metal);
  border-color: var(--hw-metal-light);
  color: #fff;
}
.price-card-badge {
  font-family: var(--hw-font-brand);
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  background: var(--hw-bg-inset);
  color: var(--led-active);
  border-color: rgba(68,255,136,0.2);
}
/* Remove tilt/glare effects */
.tilt-card { transform: none !important; }
.tilt-glare { display: none; }

/* ── Final CTA ── */
.final-section {
  background: linear-gradient(180deg, var(--hw-bg) 0%, var(--hw-bg-inset) 100%);
}
.final-eyebrow {
  font-family: var(--hw-font-brand);
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text-dim);
}
.final-headline {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text);
  filter: none;
}
.final-sub {
  font-family: var(--hw-font-body);
  color: var(--hw-text-dim);
}
.final-btn {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  background: var(--hw-metal-dark);
  border: 2px solid var(--hw-metal);
  color: var(--hw-text);
  border-radius: 24px;
  text-shadow: none;
}
.final-btn:hover {
  background: var(--hw-metal);
  border-color: var(--hw-metal-light);
  box-shadow: var(--hw-shadow-deep), 0 0 8px var(--led-active);
}

/* ── Auth Modal ── */
.auth-card {
  background: var(--hw-bg-panel);
  border: var(--hw-border);
}
.auth-input {
  background: var(--hw-bg-inset);
  border-color: var(--hw-metal-dark);
  color: var(--hw-text);
  font-family: var(--hw-font-mono);
}
.auth-input:focus {
  border-color: var(--hw-accent);
}
.auth-submit {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  background: var(--hw-metal-dark);
  border-color: var(--hw-metal);
}
.auth-tab {
  font-family: var(--hw-font-brand);
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
}

/* ── Footer ── */
.site-footer {
  background: var(--hw-bg);
  border-top-color: var(--hw-metal-dark);
}
.footer-logo {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text);
}
.footer-col h4 {
  font-family: var(--hw-font-brand);
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-ultra);
  color: var(--hw-text-dim);
}
.footer-col a {
  font-family: var(--hw-font-body);
  color: var(--hw-text-dim);
}
.footer-col a:hover { color: var(--hw-text); }

/* ── Remove CRT glow effects ── */
.glow, .glow--teal { text-shadow: none !important; }
.hero-glow { display: none; }

/* ── Social Ticker ── */
.social-ticker-wrap {
  border-top: 1px solid var(--hw-metal-dark);
  border-bottom: 1px solid var(--hw-metal-dark);
  background: var(--hw-bg-inset);
}

/* ── Mobile Nav ── */
.mobile-nav {
  background: var(--hw-bg);
}
.mobile-nav a {
  font-family: var(--hw-font-brand);
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text-dim);
  border-bottom-color: var(--hw-metal-dark);
}
.mobile-nav a:hover { color: var(--hw-text); }

/* ── Hamburger ── */
.hamburger span {
  background: var(--hw-text-dim);
}