/* ─────────────────────────────────────────────────────────────────
   marketing-v2.css — Design-system overlay for legacy marketing
   pages (blog, fixes, privacy, terms, contact, refund, agencies,
   features, publishers, woocommerce).

   These pages still load the legacy shell.css / style.css /
   landing.css / marketing.css stylesheets, plus the new unified
   nav + footer markup. This overlay file:

   1. Defines the canonical new design tokens (--ink, --line,
      --blue, --r-md, ...) that the new nav/footer inline CSS and
      responsive.css expect.
   2. Re-maps every legacy token (--text, --text-muted, --border,
      --surface, --brand, --link, --radius, --ba-*, --spark*, etc.)
      to the new design values, so body content rendered with the
      old stylesheets inherits the new look automatically.
   3. Forces Inter as the body font and registers JetBrains Mono
      for monospace, matching the new design system.

   Load this AFTER shell.css / style.css / landing.css /
   marketing.css and BEFORE responsive.css.
   ───────────────────────────────────────────────────────────────── */

:root {
  /* ── New design tokens (canonical names) ── */
  --ink: #0B1220; --ink-2: #0F172A; --ink-3: #1E293B;
  --text: #334155; --text-muted: #64748B; --text-dim: #94A3B8;
  --line: #E2E8F0; --line-dim: #F1F5F9;
  --bg: #FFFFFF; --bg-tint: #F8FAFC; --bg-tint-2: #F1F5F9;
  --blue: #2563EB; --blue-2: #1D4ED8; --blue-tint: #EFF6FF; --blue-tint-2: #DBEAFE;
  --green: #10B981; --green-2: #059669; --green-tint: #D1FAE5; --green-tint-2: #ECFDF5;
  --amber: #F59E0B; --amber-2: #D97706; --amber-tint: #FEF3C7;
  --red: #DC2626; --red-2: #B91C1C; --red-tint: #FEE2E2; --red-tint-2: #FEF2F2;
  --purple: #7C3AED; --purple-tint: #F3E8FF;
  --shadow-sm: 0 1px 2px rgba(15,23,42,0.04), 0 1px 3px rgba(15,23,42,0.06);
  --shadow-md: 0 4px 6px -1px rgba(15,23,42,0.06), 0 2px 4px -2px rgba(15,23,42,0.04);
  --shadow-xl: 0 20px 25px -5px rgba(15,23,42,0.08), 0 8px 10px -6px rgba(15,23,42,0.04);
  --r-sm: 4px; --r-md: 6px; --r-lg: 10px; --r-xl: 16px;

  /* ── Legacy style.css aliases → new tokens ── */
  --bg-warm: #FFFFFF;
  --bg-deep: #0B1220;
  --bg-alt: #F1F5F9;
  --surface: #F8FAFC;
  --surface-2: #F1F5F9;
  --surface-soft: #FAFBFC;
  --border: #E2E8F0;
  --border-2: #CBD5E1;
  --text-soft: #94A3B8;
  --link: #2563EB;
  --brand: #2563EB;
  --brand-hover: #1D4ED8;
  --brand-soft: #EFF6FF;
  --radius: 8px;
  --radius-sm: 6px;
  --radius-lg: 14px;
  --radius-xl: 20px;

  /* ── Legacy landing.css ink scale → new ink scale ── */
  --ink-1: #0B1220;
  --ink-4: #334155;
  --ink-5: #64748B;
  --ink-6: #94A3B8;

  /* ── Legacy spark/brand accent (old orange) → new blue ── */
  --spark:        #2563EB;
  --spark-deep:   #1D4ED8;
  --spark-tint:   #EFF6FF;
  --spark-border: #DBEAFE;
  --spark-glow:   rgba(37, 99, 235, 0.14);

  /* ── Status colors used by old pages ── */
  --good: #047857;
  --good-tint: #D1FAE5;
  --warn: #B45309;
  --warn-tint: #FEF3C7;
  --danger: #DC2626;
  --danger-tint: #FEE2E2;

  /* ── Legacy shell.css ba-* tokens (mostly used by old .ba-nav /
     .ba-footer chrome; remapped to new look in case any body
     content still references them). ── */
  --ba-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --ba-ink:   #0B1220;
  --ba-ink-2: #0F172A;
  --ba-ink-3: #1E293B;
  --ba-ink-4: #334155;
  --ba-ink-5: #64748B;
  --ba-ink-6: #94A3B8;
  --ba-hair:    #E2E8F0;
  --ba-hair-2:  #CBD5E1;
  --ba-paper:   #F8FAFC;
  --ba-surface: #FFFFFF;
  --ba-surface-2: #F1F5F9;
  --ba-blue:        #2563EB;
  --ba-blue-deep:   #1D4ED8;
  --ba-blue-tint:   #EFF6FF;
  --ba-blue-border: #DBEAFE;
  --ba-black:       #0B1220;
  --ba-black-2:     #0F172A;
  --ba-dark:        #0B1220;
  --ba-dark-2:      #0F172A;
  --ba-spark:        #2563EB;
  --ba-spark-deep:   #1D4ED8;
  --ba-spark-tint:   #EFF6FF;
  --ba-spark-border: #DBEAFE;
}

html, body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background: #FFFFFF;
  color: #334155;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-feature-settings: 'cv02','cv03','cv04','cv11';
}

code, pre, kbd, samp, .mono {
  font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

/* Headings inherit the new look without changing layout. */
h1, h2, h3, h4, h5, h6 {
  color: #0B1220;
  letter-spacing: -0.018em;
}
