/* ============================================================
   Born in the City — Design tokens
   Loaded by functions.php as the first site-wide stylesheet.
   These tokens are the single source of truth — every color,
   type size, and spacing value elsewhere in the theme should
   use one of these variables via var(--name).
   ============================================================ */

:root {
  /* CORE INK (newsprint + skyline) */
  --ink-900:#0F1115;
  --ink-800:#1E222B;
  --ink-700:#353A45;
  --ink-500:#5A6170;
  --ink-300:#B5BAC2;
  --ink-100:#E6E5DF;
  --paper:  #F6F2E7;
  --paper-2:#FBF8EE;
  --white:  #FFFFFF;

  /* BROADWAY MARQUEE ACCENTS */
  --marquee-gold:#D4A22A;
  --marquee-gold-deep:#8E6A12;
  --marquee-gold-soft:#F5E7B8;
  --curtain-red:#B7282E;
  --curtain-red-deep:#7C1A1F;
  --taxi-yellow:#F5C518;
  --hudson-blue:#1F5AA8;
  --park-green:#2E6B46;

  /* SEMANTIC */
  --fg-1:var(--ink-900);
  --fg-2:var(--ink-700);
  --fg-3:var(--ink-500);
  --fg-inverse:var(--paper);
  --fg-link:var(--hudson-blue);
  --fg-link-hover:var(--curtain-red);
  --fg-accent:var(--marquee-gold-deep);
  --bg-1:var(--paper);
  --bg-2:var(--paper-2);
  --bg-3:var(--ink-100);
  --bg-inverse:var(--ink-900);
  --border-1:var(--ink-300);
  --border-2:var(--ink-700);
  --border-accent:var(--marquee-gold);
  --state-success:var(--park-green);
  --state-warning:var(--taxi-yellow);
  --state-danger:var(--curtain-red);

  /* TYPE — families */
  --font-display:'Playfair Display','Times New Roman',Georgia,serif;
  --font-serif:'DM Serif Display','Playfair Display',Georgia,serif;
  --font-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;

  /* TYPE — scale */
  --text-xs:0.75rem;
  --text-sm:0.875rem;
  --text-base:1rem;
  --text-md:1.125rem;
  --text-lg:1.375rem;
  --text-xl:1.75rem;
  --text-2xl:2.25rem;
  --text-3xl:3rem;
  --text-4xl:4rem;
  --text-5xl:5.5rem;

  /* Line heights + tracking */
  --lh-tight:1.05;
  --lh-heading:1.15;
  --lh-body:1.6;
  --lh-loose:1.75;
  --track-tight:-0.02em;
  --track-caps:0.12em;
  --track-caps-lg:0.22em;

  /* Spacing */
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:24px;
  --space-6:32px;
  --space-7:48px;
  --space-8:64px;
  --space-9:96px;

  /* Radii */
  --radius-0:0px;
  --radius-1:2px;
  --radius-2:6px;
  --radius-3:12px;
  --radius-pill:999px;

  /* Shadows */
  --shadow-1:0 1px 0 rgba(15,17,21,.08);
  --shadow-2:0 2px 8px rgba(15,17,21,.10), 0 1px 2px rgba(15,17,21,.06);
  --shadow-3:0 8px 24px rgba(15,17,21,.14);
  --shadow-ticket:6px 6px 0 var(--ink-900);
  --shadow-ticket-gold:6px 6px 0 var(--marquee-gold);
}

/* ---- Astra global overrides ---- */
body.bitc {
  background: var(--paper);
  color: var(--fg-1);
  font-family: var(--font-sans);
}

body.bitc h1,
body.bitc h2,
body.bitc h3 {
  font-family: var(--font-display);
  color: var(--ink-900);
  letter-spacing: var(--track-tight);
}

body.bitc a { color: var(--fg-link); text-underline-offset: 3px; }
body.bitc a:hover { color: var(--fg-link-hover); }

/* Astra wraps content in .ast-container-fluid > .site / header. Tune these if needed. */
body.bitc .site-header { border-bottom: 2px solid var(--ink-900); background: var(--paper); }
body.bitc .site-footer { background: var(--paper); border-top: 2px solid var(--ink-900); }