/* ============================================================
   COLOURS
   Two brand systems live here:
   1. ENTREPRENEURS CIRCLE (EC) — the parent. Red / Blue / White core,
      plus a secondary "fun" palette.
   2. THE MASTERPLAN — the division this system is themed around.
      Navy + Gold gradient.
   Base tokens (raw brand values) sit at the top; semantic aliases that
   designs should actually consume sit at the bottom, themed to Masterplan.
   ============================================================ */

:root {
  /* ---- EC primary (from the EC logo) ---- */
  --ec-red:        #C8102E;   /* Pantone 186 */
  --ec-blue:       #012169;   /* Pantone 280 */
  --ec-white:      #FFFFFF;

  /* tints / shades for UI states */
  --ec-red-600:    #A60D26;
  --ec-red-700:    #870A1F;
  --ec-blue-700:   #021A52;
  --ec-blue-800:   #01133D;

  /* ---- EC secondary "fun" palette ---- */
  --ec-pink:       #EA81A8;   /* Pantone 204 C */
  --ec-purple:     #3A2152;   /* Pantone 2627 C */
  --ec-yellow:     #FFCD02;   /* Pantone 116 C */
  --ec-lime:       #AAC91D;   /* Pantone 4010 C */
  --ec-orange:     #E66810;   /* Pantone 3545 C */
  --ec-cyan:       #08B9E0;   /* Pantone 3507 C */

  /* ---- The Masterplan ---- */
  --mp-navy:       #15162F;   /* core dark blue */
  --mp-navy-900:   #0D0E1F;   /* deeper still */
  --mp-navy-800:   #1E2042;
  --mp-navy-700:   #2A2C55;
  --mp-gold:       #D4AF5A;   /* representative mid-gold */
  --mp-gold-light: #EED27C;   /* gradient start */
  --mp-gold-dark:  #BE973D;   /* gradient end */
  --mp-gold-deep:  #9A7A2E;   /* pressed / hover gold */

  /* signature Masterplan gold gradient — only ever used as a gradient,
     never as a flat fill (per brand guidelines) */
  --mp-gold-gradient: linear-gradient(135deg, var(--mp-gold-light) 0%, var(--mp-gold-dark) 100%);
  --mp-gold-gradient-text: linear-gradient(100deg, #F3DD93 0%, #D4AF5A 45%, #B98F37 100%);

  /* ---- Neutrals (warm-cool ramp tuned to the navy) ---- */
  --neutral-0:    #FFFFFF;
  --neutral-25:   #FAFAFB;
  --neutral-50:   #F4F5F7;
  --neutral-100:  #E9EAF0;
  --neutral-200:  #D7D9E4;
  --neutral-300:  #B9BCCD;
  --neutral-400:  #8C90A8;
  --neutral-500:  #686C85;
  --neutral-600:  #4C5069;
  --neutral-700:  #34374D;
  --neutral-800:  #222539;
  --neutral-900:  #15162F;

  /* ---- Semantic status ---- */
  --success:      #2E9E5B;
  --success-bg:   #E6F4EC;
  --warning:      #E6A210;
  --warning-bg:   #FCF3DC;
  --danger:       #C8102E;
  --danger-bg:    #FBE7EA;
  --info:         #08B9E0;
  --info-bg:      #E2F7FC;

  /* ============================================================
     SEMANTIC ALIASES — themed to THE MASTERPLAN.
     Consume THESE in components / designs, not the raw values.
     ============================================================ */

  /* surfaces */
  --surface-page:       var(--neutral-50);
  --surface-card:       var(--neutral-0);
  --surface-raised:     var(--neutral-0);
  --surface-sunken:     var(--neutral-100);
  --surface-inverse:    var(--mp-navy);
  --surface-inverse-2:  var(--mp-navy-800);
  --surface-brand:      var(--mp-navy);

  /* text */
  --text-strong:    var(--mp-navy);
  --text-body:      var(--neutral-700);
  --text-muted:     var(--neutral-500);
  --text-subtle:    var(--neutral-400);
  --text-on-dark:   var(--neutral-0);
  --text-on-dark-muted: rgba(255,255,255,0.68);
  --text-gold:      var(--mp-gold-dark);

  /* brand accents */
  --accent:         var(--mp-gold-dark);
  --accent-strong:  var(--mp-gold-deep);
  --accent-soft:    #F6ECCF;
  --on-accent:      var(--mp-navy);

  /* lines */
  --border:         var(--neutral-200);
  --border-strong:  var(--neutral-300);
  --border-inverse: rgba(255,255,255,0.14);
  --ring:           rgba(190,151,61,0.45);   /* gold focus ring */

  /* links */
  --link:           var(--mp-navy);
  --link-hover:     var(--mp-gold-dark);
}