/*
  Tokens CSS for Hannah Trading (International Export & Agricultural Machinery)
  Aligned with Official Logo (Deep Burgundy & Champagne Gold) and Verified Brand DNA
*/
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700;800&family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap');

:root {
  /* Brand Colors from Official Logo */
  --color-primary: #54151C;
  --color-primary-dark: #380D12;
  --color-primary-light: #6E1D26;
  --color-primary-glow: rgba(84, 21, 28, 0.15);
  --color-secondary: #C5A059;
  --color-secondary-dark: #9E7D3B;
  --color-secondary-light: #D8B775;
  --color-accent: #C5A059;
  --color-white: #FFFFFF;
  --color-cream: #FAF6F0;
  --color-cream-dark: #F3EBE1;
  --color-ink: #1E293B;
  --color-ink-soft: #475569;
  --color-ink-faint: #64748B;
  --color-border: #E8DFD5;
  --color-overlay: rgba(56, 13, 18, 0.82);

  /* Typography */
  --font-display: "Cinzel", "Playfair Display", Georgia, serif;
  --font-body: "Plus Jakarta Sans", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  /* Font Sizes - Upgraded for High Legibility on Desktop & Mobile */
  --text-eyebrow: 12.5px;
  --text-hero: 48px;
  --text-h1: 38px;
  --text-h2: 29px;
  --text-h3: 21px;
  --text-h4: 17px;
  --text-body-lg: 19px;
  --text-body: 17px;
  --text-small: 15px;
  --text-tiny: 13px;
  --text-stat: 36px;

  /* Line Heights */
  --leading-tight: 1.15;
  --leading-snug: 1.35;
  --leading-normal: 1.68;

  /* Font Weights */
  --weight-black: 900;
  --weight-bold: 700;
  --weight-medium: 600;
  --weight-regular: 400;

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

  /* Layout */
  --container-max: 1200px;
  --header-max-width: 1560px;
  --footer-max-width: 1440px;
  --container-pad: 24px;
  --gap-sm: 16px;
  --gap-md: 24px;
  --gap-lg: 32px;

  /* Shapes & Shadows */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-full: 999px;
  --border-width: 1px;
  --border-width-thick: 2px;
  --shadow-card: 0 10px 30px rgba(84, 21, 28, 0.08);
  --shadow-elevated: 0 20px 40px rgba(56, 13, 18, 0.16);

  --header-height: 88px;
  --z-header: 100;
}