/* ==========================================================================
   NominaHQ — Design Tokens
   Bespoke premium design system (P4 Software premium-website-design standard).
   Brand palette color-picked from the NominaHQ wordmark: blue #0C60AD, amber #FBAD48.
   Never hardcode hex outside this file — always use var(--token).
   ========================================================================== */

:root {
  /* ---- Brand: NominaHQ Blue (#0C60AD, from logo) ---- */
  --nomina-blue:        #0C60AD;
  --nomina-blue-dark:   #094E8C;
  --nomina-blue-deeper: #073A69;
  --nomina-blue-50:     #EAF3FB;
  --nomina-blue-100:    #D0E4F5;
  --nomina-blue-200:    #A3C9EA;
  --nomina-blue-300:    #6FA9DC;
  --nomina-blue-400:    #3A85CB;
  --nomina-blue-500:    #0C60AD;
  --nomina-blue-600:    #0A5499;
  --nomina-blue-700:    #094E8C;
  --nomina-blue-800:    #073A69;
  --nomina-blue-900:    #052744;
  --nomina-blue-rgb:    12, 96, 173;
  --nomina-blue-subtle: #F4F8FC;

  /* ---- Brand: NominaHQ Amber (#FBAD48, from logo) ---- */
  --nomina-amber:       #FBAD48;
  --nomina-amber-dark:  #E89A2E;
  --nomina-amber-50:    #FFF7EC;
  --nomina-amber-100:   #FEEBCF;
  --nomina-amber-200:   #FDD79E;
  --nomina-amber-300:   #FCC471;
  --nomina-amber-400:   #FBAD48;
  --nomina-amber-500:   #F39A22;
  --nomina-amber-600:   #D9821A;
  --nomina-amber-700:   #A66214;
  --nomina-amber-rgb:   251, 173, 72;

  /* ---- Neutrals — blue-hued, never pure gray ---- */
  --neutral-950: #0B1929;
  --neutral-900: #0F2438;
  --neutral-800: #1E3A5F;
  --neutral-700: #2D4A6F;
  --neutral-600: #475B73;
  --neutral-500: #64748B;
  --neutral-400: #94A3B8;
  --neutral-300: #CBD5E1;
  --neutral-200: #E2E8F0;
  --neutral-100: #F1F5F9;
  --neutral-50:  #F8FAFC;

  /* ---- Semantic ---- */
  --success: #2E7D32;
  --warning: #F9A825;
  --error:   #C62828;

  /* ---- Surfaces ---- */
  --surface-primary:   #FFFFFF;
  --surface-secondary: var(--neutral-50);
  --surface-tertiary:  var(--nomina-blue-subtle);
  --surface-dark:      var(--nomina-blue-900);

  /* ---- Text ---- */
  --text-primary:   var(--neutral-950);
  --text-secondary: var(--neutral-600);
  --text-tertiary:  var(--neutral-500);
  --text-inverse:   #FFFFFF;
  --text-link:      var(--nomina-blue);
  --text-link-hover:var(--nomina-blue-dark);

  /* ---- Typography ---- */
  --font-display: 'Segoe UI', system-ui, -apple-system, 'Helvetica Neue', sans-serif;
  --font-body:    'Segoe UI', system-ui, -apple-system, 'Helvetica Neue', sans-serif;
  --font-mono:    'Cascadia Code', 'JetBrains Mono', 'Fira Code', monospace;

  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.25rem;
  --text-2xl:  1.5rem;
  --text-3xl:  2rem;
  --text-4xl:  2.5rem;
  --text-5xl:  3rem;
  --text-6xl:  3.75rem;

  --leading-tight:   1.1;
  --leading-snug:    1.3;
  --leading-normal:  1.6;
  --leading-relaxed: 1.8;

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

  /* ---- Spacing (4px grid) ---- */
  --space-1: 0.25rem;  --space-2: 0.5rem;   --space-3: 0.75rem;  --space-4: 1rem;
  --space-5: 1.25rem;  --space-6: 1.5rem;   --space-8: 2rem;     --space-10: 2.5rem;
  --space-12: 3rem;    --space-16: 4rem;    --space-20: 5rem;    --space-24: 6rem;
  --space-32: 8rem;    --space-40: 10rem;

  /* ---- Radius ---- */
  --radius-sm: 4px;  --radius-md: 6px;  --radius-lg: 8px;  --radius-xl: 12px;
  --radius-pill: 999px;

  /* ---- Elevation ---- */
  --shadow-xs: 0 1px 2px rgba(11, 25, 41, 0.05);
  --shadow-sm: 0 1px 3px rgba(11, 25, 41, 0.08), 0 1px 2px rgba(11, 25, 41, 0.04);
  --shadow-md: 0 4px 6px rgba(11, 25, 41, 0.06), 0 2px 4px rgba(11, 25, 41, 0.04);
  --shadow-lg: 0 10px 24px rgba(11, 25, 41, 0.08), 0 4px 8px rgba(11, 25, 41, 0.04);
  --shadow-xl: 0 20px 48px rgba(11, 25, 41, 0.10), 0 8px 16px rgba(11, 25, 41, 0.04);
  --shadow-glow: 0 0 0 1px rgba(12, 96, 173, 0.08), 0 4px 16px rgba(12, 96, 173, 0.12);

  /* ---- Motion ---- */
  --ease-out-expo:  cubic-bezier(0.1, 0.9, 0.2, 1);
  --ease-in-expo:   cubic-bezier(0.7, 0, 1, 0.5);
  --ease-standard:  cubic-bezier(0.33, 0, 0.67, 1);

  /* ---- Layout ---- */
  --container: 1120px;
}
