/* Mantx — Color tokens
   Brand palette is exact per brand spec. Semantic aliases map usage. */
:root {
  /* ---- Brand base ---- */
  --forest-900: #0E3A23;   /* deepest forest, dark headers */
  --forest-700: #165032;   /* Deep Forest Green — PRIMARY */
  --forest-500: #1E6B43;   /* mid forest, hover on primary */
  --green-500:  #48A942;   /* Mantx Green — ACCENT / buttons */
  --green-600:  #3C8F37;   /* button hover (darker) */
  --green-400:  #5FBE57;   /* button glow / lighter accent */
  --mint-300:   #86CDB0;   /* Mint Accent — soft fills / badges */
  --mint-200:   #AEDDC9;   /* lighter mint fill */
  --mint-100:   #E2F1EA;   /* faint mint wash background */
  --charcoal-900: #213B31; /* Dark Charcoal — dark sections / footer */
  --charcoal-800: #2B4A3D; /* slightly raised charcoal surface */

  /* ---- Neutrals ---- */
  --white:    #FFFFFF;
  --off-white:#F7F7F7;     /* Off White background */
  --gray-100: #ECEEED;     /* hairline / subtle fills */
  --gray-200: #D8DCDA;     /* borders */
  --gray-500: #7A7A7A;     /* secondary body text */
  --gray-600: #54595F;     /* primary body text */
  --gray-900: #1C2522;     /* near-black text on light */

  /* ---- Semantic surfaces ---- */
  --surface-base:    var(--off-white);
  --surface-raised:  var(--white);
  --surface-card:    var(--white);
  --surface-soft:    var(--mint-100);
  --surface-dark:    var(--charcoal-900);
  --surface-forest:  var(--forest-700);

  /* ---- Semantic text ---- */
  --text-strong:   var(--forest-700);   /* headlines on light */
  --text-body:     var(--gray-600);     /* body copy */
  --text-muted:    var(--gray-500);     /* captions, meta */
  --text-on-dark:  var(--off-white);    /* body on dark */
  --text-on-dark-strong: var(--white);
  --text-on-dark-muted:  #A9BDB1;

  /* ---- Semantic accents ---- */
  --accent:        var(--green-500);
  --accent-hover:  var(--green-600);
  --accent-glow:   rgba(72,169,66,0.35);
  --badge-bg:      var(--mint-300);
  --badge-text:    var(--forest-900);

  /* ---- Borders / lines ---- */
  --border-subtle: var(--gray-200);
  --border-card:   #E6EAE8;
  --border-on-dark:rgba(255,255,255,0.14);

  /* ---- Focus ---- */
  --focus-ring: 0 0 0 3px rgba(72,169,66,0.45);
}