/* ==========================================================================
   COLOR TOKENS — Grow Bridge Partners
   Source: "Paleta Cromática" pages, brand manual (Grow Bridge 2025).
   "La paleta de colores institucionales está compuesta por 6 colores
   pertenecientes al círculo cromático de los tonos fríos..." — a closed,
   cool-toned 6-color system. Do not introduce warm accents.
   ========================================================================== */
:root {
  /* ---- Base palette (exact values from brand manual) ---- */
  --color-ink:        #1B2B3B; /* darkest neutral — near-black navy */
  --color-teal-900:   #014751; /* PRIMARY brand color — deep teal */
  --color-teal-700:   #486C6E; /* muted teal-gray */
  --color-mint-500:   #71C6AA; /* brand mint/green — logo icon + "PARTNERS" wordmark */
  --color-mist-100:   #DDE6E5; /* pale cool neutral */
  --color-white:      #FFFFFF;

  /* ---- Extended neutrals (derived in-gamut via oklch; UI needs only) ---- */
  --color-mist-50:    oklch(97.5% 0.004 200);
  --color-mist-200:   oklch(90% 0.008 200);
  --color-mist-300:   oklch(83% 0.012 200);
  --color-slate-400:  oklch(64% 0.02 214);
  --color-slate-600:  oklch(46% 0.03 214);

  /* ---- Mint tint/shade ramp (for hover/active/subtle-fill states) ---- */
  --color-mint-100:   oklch(94% 0.045 165);
  --color-mint-300:   oklch(83% 0.09 165);
  --color-mint-700:   oklch(52% 0.09 165);

  /* ---- Semantic: surfaces ---- */
  --surface-page:        var(--color-white);
  --surface-sunken:      var(--color-mist-50);
  --surface-muted:       var(--color-mist-100);
  --surface-card:        var(--color-white);
  --surface-inverse:     var(--color-teal-900);
  --surface-inverse-deep:var(--color-ink);

  /* ---- Semantic: text ---- */
  --text-primary:        var(--color-ink);
  --text-secondary:      var(--color-slate-600);
  --text-muted:          var(--color-slate-400);
  --text-brand:          var(--color-teal-900);
  --text-accent:         var(--color-mint-700);
  --text-on-dark:        var(--color-white);
  --text-on-dark-muted:  var(--color-mist-300);
  --text-on-accent:      var(--color-ink);

  /* ---- Semantic: brand ---- */
  --brand-primary:       var(--color-teal-900);
  --brand-accent:        var(--color-mint-500);
  --brand-ink:           var(--color-ink);

  /* ---- Semantic: borders ---- */
  --border-subtle:       var(--color-mist-200);
  --border-default:      var(--color-mist-300);
  --border-strong:       var(--color-slate-400);
  --border-on-dark:      color-mix(in oklab, var(--color-white) 20%, transparent);

  /* ---- Semantic: interactive ---- */
  --action-primary:        var(--color-teal-900);
  --action-primary-hover:  #013841;
  --action-primary-active: #012c33;
  --action-accent:         var(--color-mint-500);
  --action-accent-hover:   var(--color-mint-700);
  --focus-ring:            var(--color-mint-500);

  /* ---- Gradients (per "Paleta Cromática (Degradado)" page) ---- */
  --gradient-brand:      linear-gradient(120deg, var(--color-ink) 0%, var(--color-teal-900) 48%, var(--color-mint-500) 100%);
  --gradient-brand-soft: linear-gradient(120deg, var(--color-teal-900) 0%, var(--color-mint-500) 100%);
}