/* ============================================================
   Synergy Capital — Brand Motion (self-contained styles)
   Flattened tokens: fonts + colors + typography.
   No external @import of the design-system token tree.
   ============================================================ */

/* ============================================================
   Synergy Capital — Fonts (per Brand Standards, Mar 2026)
   Headlines: Poppins (Bold) — open source
   Body/Copy: Nunito Sans — open source
   Logo lockup: Gotham — LICENSED, not loaded here (logo art only)
   Both webfonts served from Google Fonts.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500;600;700;800&family=Nunito+Sans:ital,opsz,wght@0,6..12,400;0,6..12,600;0,6..12,700;1,6..12,400&display=swap');

/* ============================================================
   Synergy Capital — Color Tokens
   Brand: Navy #052045 + Sky Blue #0080DE
   Signal accent (use VERY sparingly): #F2004A
   ============================================================ */

:root {
  /* ---- Brand: Navy (primary dark) ---- */
  --navy-950: #03152e;
  --navy-900: #052045; /* BRAND navy — wordmark, icon on light */
  --navy-800: #0a2d5a;
  --navy-700: #123c70;
  --navy-600: #1c4d88;

  /* ---- Brand: Sky Blue (primary accent) ---- */
  --blue-800: #005a9e;
  --blue-700: #0069bb;
  --blue-600: #0076cf;
  --blue-500: #0080de; /* BRAND blue — "CAPITAL", icon highlights */
  --blue-400: #3b9de8;
  --blue-300: #79bcf0;
  --blue-200: #b0d8f7;
  --blue-100: #dcedfb;
  --blue-50:  #eef6fd;

  /* ---- Brand: Signal (USE VERY SPARINGLY — accents only) ---- */
  --signal-600: #c8003e;
  --signal-500: #f2004a; /* BRAND signal — rare emphasis, never as a fill base */
  --signal-100: #fcd9e2;

  /* ---- Supporting brand neutrals (Brand Standards palette) ---- */
  --mist:      #dbe7f2;  /* PMS 656 C — pale blue-gray tint */
  --cool-gray: #8b9094;  /* PMS Cool Gray — neutral mid gray */

  /* ---- Neutrals (cool gray, tuned toward navy) ---- */
  --white:    #ffffff;
  --gray-50:  #f6f8fb;
  --gray-100: #eef2f6;
  --gray-200: #dde4ec;
  --gray-300: #c4cedb;
  --gray-400: #9aa7b8;
  --gray-500: #6c7a8c;
  --gray-600: #4d5a6b;
  --gray-700: #36414f;
  --gray-800: #232c38;
  --black:    #0a0e16;

  /* ---- Semantic status ---- */
  --green-600: #1f8a5b;
  --green-500: #27a36b;
  --green-100: #dcf2e8;
  --amber-600: #c2820a;
  --amber-500: #e09b16;
  --amber-100: #fbeecd;
  --red-600:   #c5413b;
  --red-500:   #dd564f;
  --red-100:   #fadddb;

  /* ============================================================
     Semantic aliases — reference these in components
     ============================================================ */

  /* Text */
  --text-strong:   var(--navy-900);
  --text-body:     var(--gray-700);
  --text-muted:    var(--gray-500);
  --text-subtle:   var(--gray-400);
  --text-inverse:  var(--white);
  --text-accent:   var(--blue-600);
  --text-on-navy:  #c9d6e8;

  /* Surfaces */
  --surface-page:    var(--gray-50);
  --surface-card:    var(--white);
  --surface-sunken:  var(--gray-100);
  --surface-navy:    var(--navy-900);
  --surface-navy-2:  var(--navy-800);
  --surface-accent:  var(--blue-50);

  /* Borders */
  --border-subtle:  var(--gray-200);
  --border-default: var(--gray-300);
  --border-strong:  var(--gray-400);
  --border-accent:  var(--blue-500);
  --border-on-navy: rgba(255, 255, 255, 0.14);

  /* Brand / action */
  --brand-primary:        var(--navy-900);
  --brand-primary-hover:  var(--navy-800);
  --brand-accent:         var(--blue-500);
  --brand-accent-hover:   var(--blue-600);
  --focus-ring:           rgba(0, 128, 222, 0.40);
  --brand-signal:         var(--signal-500);

  /* Status semantic */
  --status-success: var(--green-600);
  --status-warning: var(--amber-600);
  --status-danger:  var(--red-600);
  --status-info:    var(--blue-600);
}

/* ============================================================
   Synergy Capital — Typography Tokens
   ============================================================ */

:root {
  /* ---- Families (per Brand Standards) ---- */
  --font-display: 'Poppins', 'Helvetica Neue', Arial, sans-serif;   /* headlines */
  --font-body:    'Nunito Sans', 'Helvetica Neue', Arial, sans-serif; /* body / copy */
  --font-mono:    ui-monospace, 'SFMono-Regular', Menlo, monospace;  /* rare code use; figures use --font-display + tabular-nums */
  /* NOTE: the wordmark uses Gotham (licensed). The logo is always placed as
     SVG/PNG art from assets/ — never set as live text — so no Gotham webfont
     is loaded or tokenized here. */

  /* ---- Weights ---- */
  --weight-regular:  400;
  --weight-medium:   500;
  --weight-semibold: 600;
  --weight-bold:     700;
  --weight-black:    800;

  /* ---- Type scale (1.250 major-third-ish, tuned) ---- */
  --text-xs:   0.75rem;   /* 12px */
  --text-sm:   0.875rem;  /* 14px */
  --text-base: 1rem;      /* 16px */
  --text-md:   1.125rem;  /* 18px */
  --text-lg:   1.375rem;  /* 22px */
  --text-xl:   1.75rem;   /* 28px */
  --text-2xl:  2.25rem;   /* 36px */
  --text-3xl:  3rem;      /* 48px */
  --text-4xl:  3.75rem;   /* 60px */
  --text-5xl:  4.75rem;   /* 76px */

  /* ---- Line heights ---- */
  --leading-tight:   1.1;
  --leading-snug:    1.25;
  --leading-normal:  1.5;
  --leading-relaxed: 1.65;

  /* ---- Letter spacing ----
     The brand wordmark is widely tracked, esp. "CAPITAL".
     Use --tracking-wide for eyebrows/labels to echo it. */
  --tracking-tight:  -0.02em;
  --tracking-normal: 0;
  --tracking-wide:   0.08em;
  --tracking-wider:  0.18em;  /* eyebrow / wordmark-style labels */

  /* ---- Semantic roles ---- */
  --role-eyebrow-size:    var(--text-sm);
  --role-eyebrow-spacing: var(--tracking-wider);
  --role-display-family:  var(--font-display);
  --role-body-family:     var(--font-body);
}