/* ============================================================
   EduPro — Color tokens
   Brand idea: synergy of two strong audiences (marketing experts ×
   educators). The palette is built from a deep, credible NAVY and a
   bright, international BLUE, energized by an AMBER spark — the two
   contrasting halves of the "Edu / Pro" mark.
   ============================================================ */
:root {
  /* ---- Brand: Navy (the "Edu" half — depth, trust, knowledge) ---- */
  --navy-950: #08182F;
  --navy-900: #0F2647;
  --navy-800: #15315C;
  --navy-700: #1B3A6B; /* ★ primary brand navy */
  --navy-600: #234982;
  --navy-500: #2E5C9E;

  /* ---- Brand: Blue (international, action, links) ---- */
  --blue-700: #1D4FD8;
  --blue-600: #2563EB;
  --blue-500: #3B82F6; /* ★ primary brand blue */
  --blue-400: #60A5FA;
  --blue-200: #BFDBFE;
  --blue-100: #DBEAFE;
  --blue-50:  #EFF6FF;

  /* ---- Brand: Amber (the "Pro" half — energy, spark, the now) ---- */
  --amber-600: #D97706;
  --amber-500: #F59E0B; /* ★ primary brand amber */
  --amber-400: #FBBF24;
  --amber-200: #FDE68A;
  --amber-100: #FEF3C7;
  --amber-50:  #FFFBEB;

  /* ---- Neutrals: cool slate to sit beside the blues ---- */
  --slate-950: #0A0F1A;
  --slate-900: #0F172A;
  --slate-800: #1E293B;
  --slate-700: #334155;
  --slate-600: #475569;
  --slate-500: #64748B;
  --slate-400: #94A3B8;
  --slate-300: #CBD5E1;
  --slate-200: #E2E8F0;
  --slate-150: #EBEFF4;
  --slate-100: #F1F5F9;
  --slate-50:  #F8FAFC;
  --white:     #FFFFFF;

  /* ---- Semantic status ---- */
  --green-600: #15803D;
  --green-500: #16A34A;
  --green-100: #DCFCE7;
  --red-600:   #DC2626;
  --red-500:   #EF4444;
  --red-100:   #FEE2E2;
  --warn-600:  #B45309;
  --warn-500:  #D97706;
  --warn-100:  #FEF0C7;

  /* ============================================================
     Semantic aliases — prefer these in components.
     ============================================================ */
  /* Brand */
  --brand-primary:        var(--navy-700);
  --brand-primary-strong: var(--navy-900);
  --brand-secondary:      var(--blue-500);
  --brand-accent:         var(--amber-500);
  --brand-gradient:       linear-gradient(105deg, var(--navy-700) 0%, var(--blue-600) 60%, var(--blue-500) 100%);
  --brand-gradient-spark: linear-gradient(105deg, var(--navy-800) 0%, var(--blue-600) 55%, var(--amber-500) 130%);

  /* Text */
  --text-strong:    var(--slate-900);
  --text-body:      var(--slate-700);
  --text-muted:     var(--slate-500);
  --text-subtle:    var(--slate-400);
  --text-on-brand:  var(--white);
  --text-link:      var(--blue-600);
  --text-accent:    var(--amber-600);

  /* Surfaces */
  --surface-page:    var(--slate-50);
  --surface-card:    var(--white);
  --surface-sunken:  var(--slate-100);
  --surface-inverse: var(--navy-900);
  --surface-tint:    var(--blue-50);
  --surface-tint-accent: var(--amber-50);

  /* Borders */
  --border-subtle:  var(--slate-200);
  --border-default: var(--slate-300);
  --border-strong:  var(--slate-400);
  --border-brand:   var(--blue-500);
  --border-focus:   var(--blue-500);

  /* Status semantic */
  --success:     var(--green-500);
  --success-bg:  var(--green-100);
  --danger:      var(--red-600);
  --danger-bg:   var(--red-100);
  --warning:     var(--warn-600);
  --warning-bg:  var(--warn-100);
  --info:        var(--blue-600);
  --info-bg:     var(--blue-50);
}
