/* ============================================================
   Fifth Asset Management — Design Tokens
   ============================================================ */

:root {
  /* ---- Color: Core Navy ---- */
  --color-navy-950: #081426;
  --color-navy-900: #0A1B32;
  --color-navy-800: #10233F;
  --color-navy-700: #16304F;
  --color-navy-600: #1E3E62;

  /* ---- Color: Accents ---- */
  --color-blue-accent: #4C7098;
  --color-blue-accent-dark: #395875;
  --color-blue-soft: #EAF0F6;
  --color-green-600: #3C6E52;
  --color-green-700: #2F5A42;
  --color-green-100: #E8F0EB;

  /* ---- Color: Neutrals ---- */
  --color-white: #FFFFFF;
  --color-offwhite: #F7F4EE;
  --color-charcoal-900: #16181C;
  --color-charcoal-800: #1E2126;
  --color-grey-50: #F8F9FA;
  --color-grey-100: #F1F3F5;
  --color-grey-200: #E4E8EC;
  --color-grey-300: #D3D9E0;
  --color-grey-400: #A6AFBB;
  --color-grey-500: #7C8695;
  --color-grey-600: #5B6472;
  --color-ink: #101520;
  --color-border: #E1E5EA;
  --color-border-dark: rgba(255, 255, 255, 0.12);

  /* ---- Semantic ---- */
  --color-bg: var(--color-white);
  --color-bg-alt: var(--color-grey-50);
  --color-bg-warm: var(--color-offwhite);
  --color-text: var(--color-ink);
  --color-text-muted: var(--color-grey-600);
  --color-text-inverse: var(--color-white);
  --color-text-inverse-muted: rgba(255, 255, 255, 0.68);

  /* ---- Typography ----
     Display: Cormorant Garamond — editorial, high-contrast serif for headlines.
     Body/UI: Plus Jakarta Sans — refined geometric grotesk, distinct from
     overused system sans stacks (Inter/Roboto/Arial). */
  --font-serif: 'Cormorant Garamond', 'Iowan Old Style', 'Georgia', serif;
  --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --text-xs: 0.8125rem;
  --text-sm: 0.9375rem;
  --text-base: 1.0625rem;
  --text-md: 1.1875rem;
  --text-lg: 1.4375rem;
  --text-xl: 1.875rem;
  --text-2xl: 2.5rem;
  --text-3xl: 3.25rem;
  --text-4xl: 4rem;
  --text-5xl: 5.25rem;

  --leading-tight: 1.1;
  --leading-snug: 1.3;
  --leading-normal: 1.6;
  --leading-relaxed: 1.75;

  --tracking-tight: -0.01em;
  --tracking-wide: 0.06em;
  --tracking-wider: 0.14em;

  /* ---- Spacing (8pt rhythm, generous for editorial layout) ---- */
  --space-1: 0.5rem;
  --space-2: 0.75rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2rem;
  --space-6: 3rem;
  --space-7: 4rem;
  --space-8: 6rem;
  --space-9: 8rem;
  --space-10: 10rem;

  /* ---- Radius (refined, not overly rounded) ---- */
  --radius-sm: 3px;
  --radius-md: 6px;
  --radius-lg: 10px;

  /* ---- Shadow (subtle) ---- */
  --shadow-sm: 0 1px 2px rgba(10, 27, 50, 0.05);
  --shadow-md: 0 8px 24px rgba(10, 27, 50, 0.07);
  --shadow-lg: 0 16px 48px rgba(10, 27, 50, 0.10);

  /* ---- Motion ---- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --duration-fast: 180ms;
  --duration-base: 320ms;
  --duration-slow: 560ms;

  /* ---- Layout ---- */
  --container-max: 1200px;
  --container-narrow: 780px;
  --nav-height: 84px;
}