/* ============================================================
   Baba Traders — Design Tokens
   "Engineered Cool" — editorial precision + HVAC engineering.
   ============================================================ */

:root {
  /* ---- Brand palette ---- */
  --color-ink:          #07111F;          /* near-black navy, primary surface */
  --color-ink-soft:     #0E1B2D;
  --color-primary:      #0B5394;          /* deep blue */
  --color-primary-dark: #06365F;
  --color-secondary:    #38BDF8;          /* sky */
  --color-secondary-2:  #7DD3FC;
  --color-accent:       #F97316;          /* orange */
  --color-accent-warm:  #FB923C;
  --color-accent-dark:  #C2570F;
  --color-success:      #16A34A;
  --color-danger:       #DC2626;

  --color-text:         #0B1220;
  --color-muted:        #5B6779;
  --color-line:         #E4E8EE;
  --color-line-soft:    #EEF1F5;
  --color-bg:           #FFFFFF;
  --color-bg-alt:       #F4F6FA;
  --color-bg-tinted:    #EAF2FB;          /* subtle sky tint */

  /* ---- Typography ---- */
  --font-display: "Bricolage Grotesque", "Times New Roman", serif;
  --font-body:    "Manrope", system-ui, -apple-system, sans-serif;
  --font-mono:    "JetBrains Mono", "SFMono-Regular", ui-monospace, monospace;

  /* legacy aliases used by Astra/old code */
  --font-heading: var(--font-display);

  --fs-display:  clamp(2.75rem, 8vw, 7.25rem);   /* hero headline */
  --fs-eyebrow:  0.75rem;
  --fs-h1:       clamp(2rem, 4.5vw, 3.5rem);
  --fs-h2:       clamp(1.75rem, 3.6vw, 2.75rem);
  --fs-h3:       clamp(1.25rem, 2.4vw, 1.625rem);
  --fs-body:     1rem;
  --fs-lead:     clamp(1.0625rem, 1.4vw, 1.1875rem);
  --fs-small:    0.8125rem;
  --fs-micro:    0.6875rem;

  --lh-tight:    1.02;
  --lh-snug:     1.15;
  --lh-body:     1.6;

  --tracking-tight:  -0.02em;
  --tracking-display:-0.035em;
  --tracking-eyebrow: 0.18em;

  /* ---- Spacing ---- */
  --space-2xs: 0.25rem;
  --space-xs:  0.5rem;
  --space-sm:  1rem;
  --space-md:  1.5rem;
  --space-lg:  2.5rem;
  --space-xl:  4rem;
  --space-2xl: 6.5rem;

  --radius-sm: 4px;
  --radius-md: 10px;
  --radius-lg: 18px;
  --radius-pill: 999px;

  --shadow-card:     0 1px 0 rgba(15,23,42,0.04), 0 6px 24px rgba(15,23,42,0.06);
  --shadow-elevated: 0 12px 48px rgba(7,17,31,0.18);
  --shadow-inset:    inset 0 1px 0 rgba(255,255,255,0.04);

  --container-max:  1280px;
  --container-pad:  clamp(1.25rem, 4vw, 2.5rem);

  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}