/* Inquiro design tokens. Single source of truth for colors, typography, motion.
   Changing a value here changes every page. Do not redeclare in page styles.

   v2 tokens are the authoritative system. v1 tokens remain as aliases for
   pages mid-migration. New work MUST use v2 names. */

:root {
  /* ── v2 SURFACES ────────────────────────────────────────────── */
  --ink-0: #000000;         /* page canvas */
  --ink-1: #0A0A0A;         /* elevated surface */
  --ink-2: #111111;         /* card surface */
  --ink-3: #1A1A1A;         /* hover / border-active */

  --line-1: rgba(255, 255, 255, 0.08);   /* hairline */
  --line-2: rgba(255, 255, 255, 0.14);   /* divider */
  --line-3: rgba(255, 255, 255, 0.22);   /* focus / hover border */

  /* ── v2 TEXT ────────────────────────────────────────────────── */
  --text-1: #FFFFFF;                     /* primary */
  --text-2: rgba(255, 255, 255, 0.72);   /* body */
  --text-3: rgba(255, 255, 255, 0.52);   /* meta */
  --text-4: rgba(255, 255, 255, 0.36);   /* captions, decor */

  /* ── v2 ACCENT (used only to drive action or convey value) ──── */
  --amber: #FF9500;
  --amber-wash: rgba(255, 149, 0, 0.10); /* rare, receipt-adjacent only */
  --seal: #22C55E;                       /* verified receipt only */

  /* ── v2 TYPE SCALE (fluid) ──────────────────────────────────── */
  --fs-display: clamp(3.5rem, 7vw, 6rem);
  --fs-h1:      clamp(2.25rem, 4vw, 3.5rem);
  --fs-h2:      clamp(1.75rem, 3vw, 2.5rem);
  --fs-h3:      1.375rem;
  --fs-body:    1.0625rem;   /* 17px */
  --fs-meta:    0.875rem;
  --fs-caption: 0.75rem;

  --lh-tight: 1.05;
  --lh-snug:  1.25;
  --lh-body:  1.6;
  --lh-prose: 1.7;

  --tracking-display: -0.03em;
  --tracking-tight:   -0.01em;
  --tracking-wide:     0.08em;
  --tracking-caps:     0.14em;

  /* ── v2 SPACING (8pt grid) ──────────────────────────────────── */
  --s-1:  4px;
  --s-2:  8px;
  --s-3:  12px;
  --s-4:  16px;
  --s-5:  24px;
  --s-6:  32px;
  --s-7:  48px;
  --s-8:  64px;
  --s-9:  96px;
  --s-10: 128px;
  --s-11: 160px;
  --s-12: 200px;

  /* Section rhythm */
  --section-y-desktop: 128px;
  --section-y-tablet:   80px;
  --section-y-mobile:   64px;

  /* ── v2 BREAKPOINTS (reference only; use in @media) ─────────── */
  /* --bp-sm: 640px  --bp-md: 900px  --bp-lg: 1200px  --bp-xl: 1440px */

  /* ── v2 MOTION ──────────────────────────────────────────────── */
  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --t-fast: 180ms var(--ease-out);
  --t-base: 280ms var(--ease-out);
  --t-slow: 560ms var(--ease-out);

  /* ── v2 LAYOUT ──────────────────────────────────────────────── */
  --page-pad-x: clamp(20px, 4vw, 32px);
  --content-readable: 680px;
  --content-doc:      800px;
  --content-wide:    1120px;
  --content-max:     1200px;

  /* ── v2 ELEVATION ───────────────────────────────────────────── */
  --shadow-1: 0 1px 0 rgba(255,255,255,0.04) inset, 0 0 0 1px var(--line-1);
  --shadow-2: 0 1px 0 rgba(255,255,255,0.06) inset, 0 0 0 1px var(--line-2),
              0 24px 48px -24px rgba(0,0,0,0.6);
  --shadow-amber: 0 0 0 1px var(--amber), 0 0 32px -4px rgba(255,149,0,0.28);

  /* ── v2 RADII ───────────────────────────────────────────────── */
  --r-1:  4px;
  --r-2:  8px;
  --r-3: 12px;
  --r-4: 16px;
  --r-pill: 999px;

  /* ── FONT FAMILIES ──────────────────────────────────────────── */
  --font-sans:  'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  --font-serif: 'IBM Plex Serif', Georgia, serif;
  --font-mono:  'IBM Plex Mono', 'Courier New', monospace;

  /* ═════════════════════════════════════════════════════════════ */
  /* v1 LEGACY ALIASES — remove after full migration is verified   */
  /* ═════════════════════════════════════════════════════════════ */
  --black: var(--ink-0);
  --ink:   var(--ink-1);
  --panel: var(--ink-1);
  --panel-2: var(--ink-2);
  --line:  var(--line-1);
  --line-hot: var(--line-2);

  --white: var(--text-1);
  --bone:  #F5F0EB;
  --text:  var(--text-2);
  --mute:  var(--text-3);

  --amber-hot:  #FFA733;
  --amber-soft: rgba(255, 149, 0, 0.55);
  --amber-glow: rgba(255, 149, 0, 0.14);
  --amber-dim:  rgba(255, 149, 0, 0.25);

  --signal: var(--seal);
  --signal-dim: rgba(34, 197, 94, 0.35);
  --alert: #ff4d4d;

  --text-body: var(--fs-body);
  --text-body-sm: 16px;
  --leading-prose: var(--lh-prose);
}