/* ==========================================================================
   Always First Capital — design tokens
   Single source of truth. Change a value here and the whole site follows.
   Direction: restrained institutional finance — trustworthy, calm, legible.
   ========================================================================== */

:root {
  /* ---- Colour ---------------------------------------------------------- */
  --bg:            #ffffff;
  --surface:       #f6f8fb;   /* section bands, cards on white              */
  --surface-2:     #eef2f7;   /* raised / inset within a surface            */
  --border:        #dfe5ed;
  --border-strong: #c6d0dd;

  --text:          #10203a;   /* 15.6:1 on --bg                             */
  --text-muted:    #52627a;   /*  6.2:1 on --bg                             */
  --text-faint:    #5e6e85;   /*  5.2:1 on --bg — still AA for small text   */
  --text-invert:   #ffffff;

  --accent:        #123a63;   /* brand navy — 11.6:1 on white               */
  --accent-hover:  #0d2c4c;
  --accent-active: #09223c;
  --accent-soft:   #e8eef6;   /* tinted background for navy elements        */
  --accent-ink:    #0d2c4c;   /* navy used as text on --accent-soft         */

  --gold:          #c08a2e;   /* decorative only (3.0:1) — rules, icons     */
  --gold-ink:      #8a6212;   /* gold as text (5.5:1 on white)              */
  --gold-soft:     #faf3e6;

  --success:       #1b7a4b;
  --warning:       #9a6408;
  --danger:        #b3261e;

  /* Dark ground used by the hero / footer */
  --ink:           #0b1d33;
  --ink-2:         #123a63;
  --on-ink:        #ffffff;
  --on-ink-muted:  #b8c6d8;   /* 8.0:1 on --ink                             */

  /* ---- Typography ------------------------------------------------------ */
  --font-display: "Plus Jakarta Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-body:    "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;

  /* modular scale, ratio ~1.25 */
  --fs-xs:   0.75rem;   /* 12 */
  --fs-sm:   0.875rem;  /* 14 */
  --fs-base: 1rem;      /* 16 */
  --fs-md:   1.125rem;  /* 18 */
  --fs-lg:   1.25rem;   /* 20 */
  --fs-xl:   1.5rem;    /* 24 */
  --fs-2xl:  1.875rem;  /* 30 */
  --fs-3xl:  2.375rem;  /* 38 */
  --fs-4xl:  3rem;      /* 48 */

  --lh-tight: 1.12;
  --lh-snug:  1.3;
  --lh-body:  1.6;

  --fw-regular: 400;
  --fw-medium:  500;
  --fw-bold:    700;

  /* ---- Spacing (4px rhythm) -------------------------------------------- */
  --sp-1:  0.25rem;  /*  4 */
  --sp-2:  0.5rem;   /*  8 */
  --sp-3:  0.75rem;  /* 12 */
  --sp-4:  1rem;     /* 16 */
  --sp-6:  1.5rem;   /* 24 */
  --sp-8:  2rem;     /* 32 */
  --sp-12: 3rem;     /* 48 */
  --sp-16: 4rem;     /* 64 */
  --sp-24: 6rem;     /* 96 */

  /* ---- Shape ----------------------------------------------------------- */
  --radius-sm: 8px;    /* controls */
  --radius-lg: 16px;   /* cards, media */

  --shadow-sm: 0 1px 2px rgba(11, 29, 51, .06), 0 1px 3px rgba(11, 29, 51, .04);
  --shadow-md: 0 4px 12px rgba(11, 29, 51, .07), 0 2px 4px rgba(11, 29, 51, .04);
  --shadow-lg: 0 16px 40px rgba(11, 29, 51, .10), 0 4px 12px rgba(11, 29, 51, .05);

  /* ---- Motion ---------------------------------------------------------- */
  --dur-fast: 140ms;
  --dur-base: 200ms;
  --ease:     cubic-bezier(.2, .8, .2, 1);

  /* ---- Layout ---------------------------------------------------------- */
  --container: 1180px;
  --gutter:    var(--sp-6);
  --header-h:  72px;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 1ms; --dur-base: 1ms; }
}
