/* ═══════════════════════════════════════════════════════════
   E-commerce Intelligence Hub 2026 — styles.css
   ═══════════════════════════════════════════════════════════ */

/* ─── CSS Variables ──────────────── */

:root {
  --heading-font: 'Bricolage Grotesque', sans-serif;
  --body-font: 'Inter', system-ui, sans-serif;
  --mono-font: 'JetBrains Mono', monospace;
}

/* ─── CSS Variables — Dark Theme (default) ──────────────── */
:root,
[data-theme="dark"] {
  /* Background */
  --bg-base: #000000;
  --bg-surface: #0c0b0a;
  --bg-elevated: #1d120a;
  --bg-card: #281c16;
  --bg-card-hover: #35261c;
  --bg-light: rgba(232, 222, 164, 0.3);

  /* Borders */
  --border: #472121;
  --border-accent: rgba(205, 107, 48, 0.45);
  --border-light: #e8daa4;
  --border-dark: #472121;

  /* Text */
  --text-primary: #efd2ba;
  --text-secondary: #ffd3b2;
  --text-muted: #bc8e67;
  --text-black: #000000;

  /* Accent Colors */
  --accent: #d8004e;
  --accent-2: #fc814a;
  --accent-glow: rgba(255, 118, 91, 0.15);
  --accent-2-glow: rgba(252, 129, 74, 0.20);

  /* Semantic */
  --success: #48bb78;
  --warning: #ed8936;
  --danger: #fc8181;

  /* Nav */
  --nav-bg: rgba(18, 17, 8, 0.5);
  --nav-border: rgba(255, 255, 255, 0.06);

  /* Glow effects */
  --glow-1: rgba(237, 133, 99, 0.1);
  --glow-2: rgba(252, 129, 74, 0.1);

  /* Shadows */
  --shadow-card: 0 4px 32px rgba(0, 0, 0, 0.4);
  --shadow-glow: 0 0 40px var(--accent-glow);
}

/* ─── Light Theme ────────────────────────────────────────── */
[data-theme="light"] {
  --bg-base: #ffffff;
  --bg-surface: #ffffff;
  --bg-elevated: #f0f4fa;
  --bg-card: #ffffff;
  --bg-card-hover: #f5f8ff;

  --border: rgba(0, 0, 0, 0.08);
  --border-accent: rgba(29, 78, 216, 0.25);

  --text-primary: #322d23;
  --text-secondary: #513016;
  --text-muted: #94a3b8;

  --accent: #8e3a2b;
  --accent-2: #fc814a;
  --accent-glow: rgba(142, 58, 43, 0.12);
  --accent-2-glow: rgba(252, 129, 74, 0.08);

  --nav-bg: rgba(248, 250, 255, 0.92);
  --nav-border: rgba(0, 0, 0, 0.06);

  --glow-1: rgba(29, 78, 216, 0.06);
  --glow-2: rgba(124, 58, 237, 0.05);

  --shadow-card: 0 4px 32px rgba(0, 0, 0, 0.08);
  --shadow-glow: 0 0 40px var(--accent-glow);
}

.ai-terminal {
  background: #140d0a;
}

.ai-terminal__bar {
  background: rgba(41, 21, 18, 0.5);
}

.lh-1 {
  line-height: 1.2;
}

.text-1\.5x {
  font-size: 150% !important;
}

.text-2x {
  font-size: 200% !important;
}

.text-mega-price {
  font-size: 5rem !important;
  line-height: 1 !important;
}

.hero-leadmagnet {
  padding: 1.5rem !important;
}

.feature-card__list .mdi-check-circle {
  color: var(--accent-2);
}

.lp-hero {
  background: var(--bg-base);
}

.lp-features {
  background: var(--bg-surface);
}

.lp-solution {
  background: var(--bg-base);
}

.lp-footer-fomo {
  background: var(--bg-base);
}