/* ============================================================
   MBANQ DESIGN TOKENS
   Single source of truth - import this file only via mbanq.css
   ============================================================ */

:root {

  /* Brand colors */
  --primary:       #BA535F;   /* rose-magenta - main accent */
  --primary-dark:  #9e3a45;   /* button hover states */
  --primary-light: #fdf2f3;   /* tag and highlight background */
  --primary-mid:   #f0c8cc;   /* tag border */

  --teal:          #01b6b1;
  --teal-dark:     #017b78;
  --teal-light:    #e0f7f6;
  --teal-mid:      #9de4e2;

  --navy:          #0d1117;   /* headings, dark background */
  --navy-2:        #160a20;   /* gradient second stop */

  /* Neutral palette */
  --text:          #1a202c;
  --muted:         #64748b;
  --light:         #94a3b8;
  --border:        #e2e8f0;
  --surface:       #f8fafc;
  --surface-2:     #f1f5f9;
  --white:         #ffffff;

  /* Tag colors */
  --purple:        #3c3489;
  --purple-light:  #eeedfe;
  --purple-mid:    #c8c5f8;
  --amber:         #633806;
  --amber-light:   #faeeda;
  --amber-mid:     #f0d0a0;
  --blue:          #1a4fd6;
  --blue-light:    #f0f4ff;
  --blue-mid:      #c8d8ff;
  --green:         #1EA163;
  --green-light:   #edfaf4;
  --green-mid:     #c9eedb;

  /* Spacing */
  --pad:           clamp(64px, 8vw, 96px);   /* section vertical padding */

  /* Border radius */
  --r-xl:          32px;
  --r-lg:          24px;
  --r-md:          16px;
  --r-sm:          10px;

  /* Shadows */
  --sh-sm:         0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
  --sh-md:         0 4px 16px rgba(0,0,0,.08), 0 2px 8px rgba(0,0,0,.04);
  --sh-lg:         0 10px 40px rgba(0,0,0,.1), 0 4px 16px rgba(0,0,0,.06);
}
