/* ==========================================================================
   Hindsight — Design Tokens
   Single source of truth. Change a value here, it changes everywhere.
   ========================================================================== */

:root {

  /* ---- Brand / Primary (pulled from logo: rgb 26,85,211) ---- */
  --c-primary:        #1A55D3;
  --c-primary-600:    #1E5BE6;   /* welcome banner top */
  --c-primary-700:    #1746B0;   /* hover / pressed */
  --c-primary-050:    #EEF2FE;   /* tint backgrounds (icon chips) */
  --c-primary-100:    #DCE5FD;

  /* ---- Status colors ---- */
  --c-success:        #15803D;
  --c-success-bg:     #DCFCE7;
  --c-warning:        #B45309;
  --c-warning-bg:     #FEF0DD;
  --c-danger:         #DC2626;
  --c-danger-bg:      #FEE2E2;
  --c-info:           #1A55D3;
  --c-info-bg:        #DCE5FD;
  --c-star:           #F5A623;

  /* ---- Neutrals ---- */
  --c-bg:             #F4F6FA;   /* app background */
  --c-surface:        #FFFFFF;   /* cards */
  --c-border:         #E8ECF3;
  --c-border-strong:  #D6DCE6;

  --c-ink:            #0F1B2D;   /* primary text */
  --c-ink-2:          #5A6B82;   /* secondary text */
  --c-ink-3:          #8B98AC;   /* muted / meta */
  --c-on-primary:     #FFFFFF;
  --c-on-primary-dim: rgba(255,255,255,.78);

  /* ---- Typography ---- */
  --font-base: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  --fz-xs:   12px;
  --fz-sm:   13px;
  --fz-base: 15px;
  --fz-md:   16px;
  --fz-lg:   18px;
  --fz-xl:   22px;
  --fz-2xl:  28px;

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

  /* ---- Spacing scale (4px base) ---- */
  --s-1:  4px;
  --s-2:  8px;
  --s-3:  12px;
  --s-4:  16px;
  --s-5:  20px;
  --s-6:  24px;
  --s-7:  32px;
  --s-8:  40px;
  --s-9:  48px;

  /* ---- Radius ---- */
  --r-sm:  8px;
  --r-md:  12px;
  --r-lg:  16px;
  --r-xl:  20px;
  --r-pill: 999px;

  /* ---- Shadows ---- */
  --sh-card:  0 1px 2px rgba(15,27,45,.04), 0 1px 3px rgba(15,27,45,.06);
  --sh-raise: 0 4px 14px rgba(15,27,45,.08);
  --sh-nav:   0 -1px 0 var(--c-border), 0 -8px 24px rgba(15,27,45,.04);

  /* ---- Layout ---- */
  --app-max:      1200px;  /* max content width */
  --header-h:     68px;
  --page-pad:     24px;

  /* ---- Motion (reserved for later GSAP/transition layer) ---- */
  --ease:     cubic-bezier(.4, 0, .2, 1);
  --dur-fast: .15s;
  --dur:      .25s;
}