/* ============================================================
   Flores Campos Soluciones Corporativas — Color tokens
   Core brand trio sampled from the master logo:
     navy  #123D6C · royal #1760A7 · cyan #16AADE
   ============================================================ */

:root {
  /* ---- Core brand ---- */
  --fc-navy:  #123D6C;   /* primary  — wordmark, primary actions   */
  --fc-royal: #1760A7;   /* secondary — links, supporting accent   */
  --fc-cyan:  #16AADE;   /* accent   — highlights, data, energy     */
  --fc-ink:   #0E2C4F;   /* deepest navy — headings on light        */

  /* ---- Primary (navy→royal) ramp ---- */
  --blue-50:  #F2F7FC;
  --blue-100: #E3EEF8;
  --blue-200: #C3DAF0;
  --blue-300: #93BCE2;
  --blue-400: #5C9AD2;
  --blue-500: #2A77BE;
  --blue-600: #1760A7;   /* royal */
  --blue-700: #17508C;
  --blue-800: #123D6C;   /* navy  */
  --blue-900: #0E2C4F;   /* ink   */

  /* ---- Cyan accent ramp ---- */
  --cyan-100: #DBF1FA;
  --cyan-200: #B4E2F4;
  --cyan-300: #84D5EF;
  --cyan-400: #45BEE6;
  --cyan-500: #16AADE;   /* core accent */
  --cyan-600: #1187B4;
  --cyan-700: #0E6A8D;

  /* ---- Neutral slate ramp (cool, premium) ---- */
  --slate-0:   #FFFFFF;
  --slate-25:  #FAFBFD;
  --slate-50:  #F4F6F9;
  --slate-100: #E9EDF2;
  --slate-200: #D6DDE6;
  --slate-300: #B7C2CF;
  --slate-400: #8B98A8;
  --slate-500: #647184;
  --slate-600: #4A5667;
  --slate-700: #36404E;
  --slate-800: #232C38;
  --slate-900: #141B24;

  /* ---- Semantic accents ---- */
  --green-500:  #1E8E62;
  --green-soft: #E4F2EC;
  --amber-500:  #C0881D;
  --amber-soft: #FAF0DA;
  --red-500:    #C0392B;
  --red-soft:   #F8E5E2;

  /* ============================================================
     SEMANTIC ALIASES — prefer these in components
     ============================================================ */

  /* Brand */
  --brand-primary:        var(--fc-navy);
  --brand-primary-hover:  #0F345C;
  --brand-primary-press:  #0C2A4B;
  --brand-secondary:      var(--fc-royal);
  --brand-accent:         var(--fc-cyan);

  /* Text */
  --text-strong:   var(--blue-900);
  --text-heading:  var(--fc-navy);
  --text-body:     var(--slate-800);
  --text-muted:    var(--slate-500);
  --text-subtle:   var(--slate-400);
  --text-link:     var(--fc-royal);
  --text-on-brand: #FFFFFF;
  --text-on-accent: var(--blue-900);

  /* Surfaces */
  --surface-page:         var(--slate-25);
  --surface-card:         #FFFFFF;
  --surface-sunken:       var(--slate-50);
  --surface-hover:        var(--slate-50);
  --surface-brand:        var(--fc-navy);
  --surface-brand-deep:   var(--blue-900);
  --surface-brand-subtle: var(--blue-50);
  --surface-accent-subtle: var(--cyan-100);

  /* Borders */
  --border-subtle:  var(--slate-100);
  --border-default: var(--slate-200);
  --border-strong:  var(--slate-300);
  --border-brand:   var(--fc-royal);
  --border-focus:   var(--fc-cyan);

  /* Feedback */
  --fb-success: var(--green-500);
  --fb-success-surface: var(--green-soft);
  --fb-warning: var(--amber-500);
  --fb-warning-surface: var(--amber-soft);
  --fb-danger:  var(--red-500);
  --fb-danger-surface:  var(--red-soft);
  --fb-info:    var(--fc-royal);
  --fb-info-surface: var(--blue-100);
}