/*
 * FinCo Payments brand tokens v2.0.0 (2026-09-22).
 * GENERATED from tokens.json by build_tokens.py. Do not hand-edit; edit tokens.json and rebuild.
 * Never hardcode hex values anywhere else.
 */
:root {
  /* Navy stack (dark surfaces) */
  --navy:        #0d1b2a;
  --navy2:       #12213a;
  --navy3:       #17273f;
  --navy4:       #1b2d44;
  --glow:        radial-gradient(ellipse at 30% 0%, rgba(74,124,190,0.20), transparent 60%);   /* hero / header / cover bands only */
  --avatar-bg:   radial-gradient(70% 55% at 50% 40%, rgba(74,124,190,0.20) 0%, rgba(74,124,190,0) 70%), radial-gradient(95% 85% at 50% 44%, #1b2d44 0%, #17273f 42%, #0d1b2a 100%);   /* documented exception: avatars only */

  /* Gold (canon #c9a84c) */
  --gold:        #c9a84c;
  --gold2:       #dfc06a;   /* web hover only */
  --golddim:     rgba(201,168,76,0.08);
  --goldborder:  rgba(201,168,76,0.12);

  /* Text on navy: bright white; hierarchy by alpha, never by grey hue */
  --text:        #ffffff;
  --text-bright: #ffffff;
  --text-muted:  rgba(255,255,255,0.84);
  --text-dim:    rgba(255,255,255,0.62);

  /* Meaning colours on navy (figures only, always with a sign or word) */
  --positive:    #4fd08a;
  --negative:    #e07a6b;
  --warn:        #ffb27d;

  /* Light mode (on white) */
  --paper:        #ffffff;
  --ink:          #0d1b2a;
  --ink-muted:    #4a5a70;
  --gold-ink:     #7a5c14;
  --positive-ink: #146c3c;
  --negative-ink: #b3372b;
  --line-light:   #d9dee6;

  /* Semantic aliases - use these in components */
  --bg:           var(--navy);
  --surface:      var(--navy2);
  --surface-elev: var(--navy3);
  --surface-hi:   var(--navy4);
  --line:         var(--navy4);
  --control-border: #5d6f88;
  --accent:       var(--gold);
  --accent-hover: var(--gold2);
  --border:       var(--goldborder);
  --field-border:       rgba(201,168,76,0.28);
  --field-border-hover: rgba(201,168,76,0.50);

  /* Type: two typed families. Saira exists only inside logo files - no token on purpose. */
  --font-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-body:    'DM Sans', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;

  /* Scale, spacing, radius, layout, effects, motion (tokens.json web_scale) */
  --fs-1: clamp(2.5rem, 5vw + 1rem, 4.5rem);
  --fs-2: clamp(2rem, 3vw + 1rem, 3rem);
  --fs-3: clamp(1.5rem, 2vw + 0.75rem, 2.25rem);
  --fs-4: 1.5rem;
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --fs-tiny: 0.75rem;
  --lh-tight: 1.1;
  --lh-snug: 1.3;
  --lh-body: 1.55;
  --eyebrow-tracking: 0.14em;
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-5: 2.5rem;
  --space-6: 3rem;
  --space-7: 3.5rem;
  --space-8: 4rem;
  --space-10: 5rem;
  --space-12: 6rem;
  --space-16: 8rem;
  --space-20: 10rem;
  --radius-sm: 6px;
  --radius: 10px;
  --radius-lg: 16px;
  --radius-pill: 999px;
  --max-width: 1180px;
  --max-prose: 68ch;
  --header-h: 72px;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.2);
  --shadow: 0 4px 16px rgba(0,0,0,0.25);
  --shadow-lg: 0 20px 50px rgba(0,0,0,0.45);
  --shadow-gold: 0 0 0 1px var(--goldborder), 0 10px 40px rgba(201,168,76,0.12);
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --dur-fast: 140ms;
  --dur: 220ms;
  --dur-slow: 400ms;
  /* Logo sizing (see tokens.json logo.size_table) */
  --logo-metallic-min: 120px;
  --logo-icon-below:   48px;
}

/* Helpers */
.eyebrow { font-family: var(--font-body); font-weight: 600; text-transform: uppercase;
  letter-spacing: var(--eyebrow-tracking); font-size: 0.75rem; color: var(--gold); }
.stat { font-family: var(--font-display); font-variant-numeric: lining-nums; color: var(--gold); }
.num  { text-align: right; }  /* DM Sans has no tabular figures; right-align, 2 decimals */
.on-white { background: var(--paper); color: var(--ink); }
.on-white .eyebrow { color: var(--gold-ink); font-size: 0.875rem; }  /* gold on white needs >= 14px */

/* ---------- Site overrides (fincopayments.com) ----------
   Drew 2026-09-22 (chat): "brighten colors" / "i may be looking for contrast".
   Secondary text lifted from the v2.0 84%/62% to 88%/72% white. Still white by
   alpha (the v2.0 rule), just more legible on the brighter page. Site-level
   override only, not an org-wide change: promote it to tokens.json
   (text on navy) if Drew keeps it. */
:root {
  --text-muted: rgba(255,255,255,0.88);
  --text-dim:   rgba(255,255,255,0.72);
}