/* ==========================================================================
   Navitrade Overseas — Design Tokens
   Mirrors the color palette, type scale and spacing of the source design.
   ========================================================================== */
:root {
  /* Forest greens */
  --forest-50: #EAF1EC;
  --forest-100: #CBDCD1;
  --forest-200: #A3C2AC;
  --forest-300: #7AA787;
  --forest-400: #528C62;
  --forest-500: #356B45;
  --forest-600: #2A5638;
  --forest-700: #20422B;
  --forest-800: #1B3B2E;
  --forest-900: #122519;

  /* Ivory / neutrals */
  --ivory-50: #FFFFFF;
  --ivory-100: #FAF8F3;
  --ivory-200: #F3EEE2;

  /* Sand / beige */
  --sand-100: #F5F1E6;
  --sand-200: #E9E2D0;
  --sand-300: #DBCFAF;

  /* Gold accents */
  --gold: #B08D3E;
  --gold-light: #D4B975;
  --gold-dark: #8C6D2A;

  /* Text */
  --graphite: #2B2B28;
  --graphite-light: #5B5B55;

  /* Type */
  --font-display: "Cormorant Garamond", Georgia, serif;
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  /* Shadows */
  --shadow-soft: 0 20px 60px -20px rgba(27, 59, 46, 0.25);
  --shadow-card: 0 10px 40px -15px rgba(27, 59, 46, 0.2);

  /* Layout */
  --container-max: 1320px;
  --gutter: 24px;
  --nav-height: 88px;

  /* Motion */
  --ease-premium: cubic-bezier(0.22, 1, 0.36, 1);
}

@media (min-width: 768px) {
  :root {
    --gutter: 48px;
  }
}
@media (min-width: 1024px) {
  :root {
    --gutter: 80px;
  }
}