/* ==========================================================================
   NonQM Capital — Design Tokens
   Single source of truth for color, type, spacing, radius, shadow.
   Brand palette derived from the NonQM Capital logo.
   ========================================================================== */

:root {
  /* ---- Brand color ---- */
  --navy:        #102A43;  /* Midnight Navy — dominant foundation */
  --navy-deep:   #081B2A;  /* Deep Navy — darkest surfaces */
  --navy-700:    #17395a;
  --blue:        #1F5C8A;  /* Capital Blue — interactive / structure */
  --blue-600:    #1a5178;
  --blue-500:    #2E6EA0;
  --blue-400:    #3E7CB1;
  --blue-200:    #9FC1DE;
  --blue-100:    #d7e6f2;
  --gold:        #D6A84F;  /* Capital Gold — accents / key CTAs (used sparingly) */
  --gold-600:    #c2913a;
  --gold-ink:    #8a6410;  /* Accessible gold-ish text on light backgrounds */

  /* ---- Neutrals ---- */
  --ink:         #10222f;  /* Primary text */
  --ink-soft:    #33465a;  /* Secondary text */
  --slate:       #526579;  /* Muted / supporting text */
  --slate-light: #6f8194;
  --ice:         #F3F7FA;  /* App background */
  --ice-2:       #e9f0f6;  /* Subtle raised background */
  --line:        #d9e2ea;  /* Hairline borders */
  --line-strong: #c3d0db;
  --white:       #ffffff;

  /* ---- Semantic (never color-only; always paired with text/icon) ---- */
  --ok:      #1f7a54;
  --ok-bg:   #e7f4ee;
  --warn:    #9a6a00;
  --warn-bg: #fbf1dc;
  --alert:   #b3261e;
  --alert-bg:#fbe9e7;
  --info:    var(--blue);
  --info-bg: #e8f1f8;

  /* ---- Typography ---- */
  --font-sans: "Inter", "Segoe UI", system-ui, -apple-system, "Helvetica Neue",
               Arial, "Noto Sans", sans-serif;
  --font-num: "SF Mono", "Segoe UI Mono", "Roboto Mono", ui-monospace,
              Menlo, Consolas, monospace;

  --fs-xs:  0.78rem;
  --fs-sm:  0.875rem;
  --fs-base:1rem;
  --fs-md:  1.075rem;
  --fs-lg:  clamp(1.15rem, 1.05rem + 0.5vw, 1.35rem);
  --fs-xl:  clamp(1.4rem, 1.2rem + 1vw, 1.85rem);
  --fs-2xl: clamp(1.85rem, 1.5rem + 1.8vw, 2.6rem);
  --fs-3xl: clamp(2.3rem, 1.8rem + 2.8vw, 3.4rem);

  --lh-tight: 1.15;
  --lh-snug:  1.32;
  --lh-body:  1.62;

  /* ---- Spacing (4px base) ---- */
  --sp-1: 0.25rem;  --sp-2: 0.5rem;   --sp-3: 0.75rem;  --sp-4: 1rem;
  --sp-5: 1.5rem;   --sp-6: 2rem;     --sp-7: 2.5rem;    --sp-8: 3rem;
  --sp-10: 4rem;    --sp-12: 5rem;    --sp-16: 7rem;

  /* ---- Layout ---- */
  --container: 1140px;
  --container-narrow: 780px;
  --container-wide: 1280px;
  --gutter: clamp(1rem, 4vw, 2rem);

  /* ---- Radius ---- */
  --r-sm: 7px; --r: 12px; --r-lg: 18px; --r-xl: 26px; --r-pill: 999px;

  /* ---- Shadow (subtle, financial) ---- */
  --shadow-xs: 0 1px 2px rgba(16, 42, 67, 0.06);
  --shadow-sm: 0 2px 8px rgba(16, 42, 67, 0.07);
  --shadow:    0 8px 24px rgba(16, 42, 67, 0.10);
  --shadow-lg: 0 20px 48px rgba(16, 42, 67, 0.16);

  /* ---- Motion ---- */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --dur: 180ms;

  /* ---- Focus ---- */
  --focus: 0 0 0 3px rgba(31, 92, 138, 0.45);
  --focus-gold: 0 0 0 3px rgba(214, 168, 79, 0.55);

  --z-header: 100;
  --z-modal: 500;
}