/* ============================================================
   Hudson Pay — Color tokens
   Brand: deep navy → bright blue. Cool, institutional, precise.
   ============================================================ */
:root {
  /* --- Brand: Navy (the dark of the logomark) --- */
  --navy-950: #050B26;
  --navy-900: #07112E;
  --navy-800: #0A1A4F;   /* logo dark */
  --navy-700: #0F2570;
  --navy-600: #143494;
  --navy-500: #1A45BE;

  /* --- Brand: Blue / Azure (gradient start, accents) --- */
  --blue-700: #1E54C8;
  --blue-600: #2A6FDB;   /* link / accent */
  --blue-500: #3D7BF7;   /* gradient start */
  --blue-400: #6F9DFF;
  --blue-300: #9CBEFF;
  --blue-200: #C4D8FF;
  --blue-100: #E2ECFF;
  --blue-50:  #F2F6FF;

  /* --- Brand: Indigo / Violet (display type, gradient end) --- */
  --indigo-950: #140B36;
  --indigo-900: #1B1147;
  --indigo-800: #241461;   /* display text & wordmark */
  --indigo-700: #33208A;
  --violet-600: #6E3AE0;   /* gradient end */
  --violet-500: #8455F6;
  --violet-400: #A07FF9;
  --violet-100: #ECE6FE;
  --violet-50:  #F6F2FF;

  /* --- Neutral ink / paper --- */
  --ink-900: #0A1124;
  --ink-800: #141C33;
  --ink-700: #283150;
  --ink-600: #3E4868;
  --ink-500: #5A6585;
  --ink-400: #8089A4;
  --ink-300: #A9B1C6;
  --ink-200: #D2D8E5;
  --ink-150: #E1E6EF;
  --ink-100: #ECEFF5;
  --ink-50:  #F6F8FC;
  --paper:   #FFFFFF;

  /* --- Semantic status --- */
  --success-600: #0E8A5F;
  --success-500: #16A66F;
  --success-100: #DBF3E8;
  --warning-600: #B5780A;
  --warning-500: #E0930F;
  --warning-100: #FBEFD3;
  --danger-600:  #C8362F;
  --danger-500:  #E5483F;
  --danger-100:  #FBE2E0;
  --info-600:    var(--blue-600);
  --info-100:    var(--blue-100);

  /* ===================== Semantic aliases ===================== */
  /* Surfaces */
  --surface-page:      #FBFCFF;
  --surface-card:      var(--paper);
  --surface-sunken:    var(--ink-100);
  --surface-inverse:   var(--indigo-800);
  --surface-inverse-2: var(--indigo-900);
  --surface-brand:     var(--blue-500);
  --surface-brand-soft:var(--blue-50);

  /* Text */
  --text-strong:   var(--indigo-900);
  --text-display:  var(--indigo-800);
  --text-body:     var(--ink-700);
  --text-muted:    var(--ink-500);
  --text-faint:    var(--ink-400);
  --text-on-brand: var(--paper);
  --text-on-dark:  #FFFFFF;
  --text-on-dark-muted: rgba(255,255,255,0.78);
  --text-link:     var(--blue-600);

  /* Borders / lines */
  --border-subtle: var(--ink-150);
  --border-default:var(--ink-200);
  --border-strong: var(--ink-300);
  --border-brand:  var(--blue-400);
  --border-dashed-on-dark: rgba(255,255,255,0.55);

  /* Accents */
  --accent:        var(--blue-600);
  --accent-hover:  var(--blue-700);
  --accent-press:  var(--indigo-700);
  --ring-focus:    rgba(61,123,247,0.40);

  /* Gradients — signature azure → violet */
  --grad-brand:    linear-gradient(135deg, #3D7BF7 0%, #6E3AE0 100%); /* @kind color */
  --grad-brand-vivid: linear-gradient(120deg, #4F8BFF 0%, #7B45ED 55%, #8455F6 100%); /* @kind color */
  /* Colored feature panel (welcome / contact / auth aside) */
  --grad-panel:    linear-gradient(150deg, #3D7BF7 0%, #5B53EE 48%, #7B3FE4 100%); /* @kind color */
  /* Hero / page is now LIGHT and airy: pale blue → lilac */
  --grad-hero:     linear-gradient(180deg, #FFFFFF 0%, #EEF3FF 46%, #F4EEFF 100%); /* @kind color */
  --grad-page-soft:linear-gradient(180deg, #FBFCFF 0%, #EFF4FF 100%); /* @kind color */
  --grad-wordmark: linear-gradient(120deg, #3D7BF7 0%, #6E3AE0 100%); /* @kind color */
}