/* ============================================================
   The Consultants MEA — Design Tokens v1.0
   Locked source of truth for every Consultants application.
   This file is consumed by:
     - theconsultantsmea.com
     - all .com sub-properties (proposals, givaudan calculator, etc.)
     - every Consultants-branded report, dashboard, document
   Do not hardcode brand values elsewhere. Reference tokens.
   ============================================================ */

:root {
  /* ----------------------------------------------------------
     COLOR — Core palette
     Five colors + paper (white) + charcoal (black).
     Paper is where the work lives, bone is where the brand lives.
     ---------------------------------------------------------- */
  --tc-paper:        #FFFFFF;   /* Pure white. Cards, data tables, dashboards, chart canvases. */
  --tc-bone:         #F4F2EE;   /* Warm off-white. Page backgrounds, document covers, hero areas. */
  --tc-sand:         #D4C8B5;   /* Deeper warm neutral. Secondary surfaces, callout backgrounds. */
  --tc-orange:       #DC6B1D;   /* Brand accent. Used SPARINGLY — markers, not fills. Pantone 159 C. */
  --tc-graphite:     #3D3D3A;   /* Dark neutral. Secondary text, mid-dark surfaces. */
  --tc-stone:        #7A7873;   /* Muted neutral. Tertiary text, captions. */
  --tc-charcoal:     #1A1A1A;   /* Near-black. Body text, dark surfaces, primary hero. */

  /* ----------------------------------------------------------
     COLOR — Functional roles
     ---------------------------------------------------------- */
  --tc-bg:           var(--tc-bone);
  --tc-bg-alt:       var(--tc-paper);
  --tc-bg-deep:      var(--tc-sand);
  --tc-bg-dark:      var(--tc-charcoal);
  --tc-bg-mid-dark:  var(--tc-graphite);

  --tc-text:         var(--tc-charcoal);
  --tc-text-2:       var(--tc-graphite);
  --tc-text-3:       var(--tc-stone);
  --tc-text-invert:  var(--tc-paper);

  --tc-line:         #E5E0DA;
  --tc-line-2:       #D4C8B5;
  --tc-line-dark:    rgba(255,255,255,0.08);

  --tc-accent:       var(--tc-orange);
  --tc-accent-bg:    rgba(220,107,29,0.08);
  --tc-accent-bd:    rgba(220,107,29,0.22);

  /* ----------------------------------------------------------
     COLOR — Chart / data viz palette
     ---------------------------------------------------------- */
  --tc-chart-1:      #DC6B1D;
  --tc-chart-2:      #8B3A1F;
  --tc-chart-3:      #A8B5A0;
  --tc-chart-4:      #C9A35B;
  --tc-chart-5:      #5F6E5A;
  --tc-chart-6:      #B8784F;
  --tc-chart-7:      #3D3D3A;

  --tc-seq-1: #F5E6D6;
  --tc-seq-2: #ECC9A1;
  --tc-seq-3: #E0A26B;
  --tc-seq-4: #DC6B1D;
  --tc-seq-5: #A6491A;

  /* ----------------------------------------------------------
     TYPOGRAPHY
     ---------------------------------------------------------- */
  --tc-font-display: 'Fraunces', 'Times New Roman', serif;
  --tc-font-body:    'Inter', system-ui, -apple-system, sans-serif;
  --tc-font-arabic:  'Readex Pro', system-ui, sans-serif;
  --tc-font-mono:    'JetBrains Mono', 'SF Mono', Consolas, monospace;

  --tc-fs-display:   clamp(2.4rem, 4.5vw, 4rem);
  --tc-fs-h1:        clamp(2rem, 3.2vw, 2.8rem);
  --tc-fs-h2:        clamp(1.4rem, 2.2vw, 1.8rem);
  --tc-fs-h3:        1.1rem;
  --tc-fs-lede:      1.05rem;
  --tc-fs-body:      0.95rem;
  --tc-fs-small:     0.82rem;
  --tc-fs-eyebrow:   0.7rem;
  --tc-fs-micro:     0.65rem;

  --tc-opsz-display: 144;
  --tc-opsz-mid:     36;
  --tc-opsz-text:    9;

  --tc-lh-tight:     1.05;
  --tc-lh-snug:      1.25;
  --tc-lh-body:      1.65;
  --tc-lh-relaxed:   1.85;

  --tc-tracking-display: -0.025em;
  --tc-tracking-h:       -0.015em;
  --tc-tracking-body:    0;
  --tc-tracking-eyebrow: 0.12em;

  --tc-fw-regular:   400;
  --tc-fw-medium:    500;
  --tc-fw-semibold:  600;
  --tc-fw-bold:      700;
  --tc-fw-black:     800;

  /* ----------------------------------------------------------
     SPACING — 8px-based scale
     ---------------------------------------------------------- */
  --tc-space-0:      0;
  --tc-space-1:      0.25rem;
  --tc-space-2:      0.5rem;
  --tc-space-3:      0.75rem;
  --tc-space-4:      1rem;
  --tc-space-5:      1.5rem;
  --tc-space-6:      2rem;
  --tc-space-7:      3rem;
  --tc-space-8:      4rem;
  --tc-space-9:      5.5rem;
  --tc-space-10:     8rem;

  /* ----------------------------------------------------------
     RADII
     ---------------------------------------------------------- */
  --tc-radius-sm:    3px;
  --tc-radius-md:    6px;
  --tc-radius-lg:    10px;
  --tc-radius-pill:  999px;

  /* ----------------------------------------------------------
     ELEVATION
     ---------------------------------------------------------- */
  --tc-shadow-sm:    none;
  --tc-shadow-md:    0 4px 16px rgba(26, 26, 26, 0.06);
  --tc-shadow-lg:    0 8px 32px rgba(26, 26, 26, 0.10);

  /* ----------------------------------------------------------
     MOTION
     ---------------------------------------------------------- */
  --tc-ease:         cubic-bezier(0.4, 0, 0.2, 1);
  --tc-dur-fast:     0.15s;
  --tc-dur:          0.25s;
  --tc-dur-slow:     0.45s;

  /* ----------------------------------------------------------
     LAYOUT
     ---------------------------------------------------------- */
  --tc-container:    1280px;
  --tc-gutter:       5vw;
  --tc-nav-h:        64px;
}

/* ============================================================
   ARABIC OVERRIDE
   ============================================================ */
html[lang="ar"] {
  --tc-font-body: var(--tc-font-arabic);
  --tc-font-display: 'Readex Pro', system-ui, sans-serif;
}

/* ============================================================
   PRINT
   ============================================================ */
@media print {
  :root {
    --tc-bg: var(--tc-paper);
  }
}