/* ============================================================
   THE CLOUDBASE FOUNDATION — Design Tokens
   Brand Style Guide v1.1 · May 2026
   ============================================================ */

:root {

  /* Primary palette */
  --cbf-navy:           #1B3A6B;
  --cbf-sky:            #2D5FA8;
  --cbf-ice:            #C8DCF0;
  --cbf-sky-wash:       #EBF2FA;

  /* Accent */
  --cbf-gold:           #E8960F;   /* PRIMARY CTA BUTTONS ONLY */
  --cbf-sand:           #F5B84A;   /* gold hover */
  --cbf-warm-wash:      #FDF3E0;

  /* Supporting */
  --cbf-teal:           #1D8C68;
  --cbf-teal-light:     #D8EEE6;
  --cbf-ground:         #2A2A28;
  --cbf-off-white:      #F4F2EE;
  --cbf-mid-gray:       #888680;
  --cbf-light-gray:     #E0DED8;
  --cbf-white:          #FFFFFF;

  /* Project category tags */
  --cat-education-bg:        #EBF2FA;
  --cat-education-text:      #1B3A6B;
  --cat-health-bg:           #D8EEE6;
  --cat-health-text:         #0F6E50;
  --cat-community-bg:        #FDF3E0;
  --cat-community-text:      #7A4A00;
  --cat-wildlife-bg:         #F0EAF8;
  --cat-wildlife-text:       #5B2D8E;
  --cat-infrastructure-bg:   #FFE8E8;
  --cat-infrastructure-text: #8B2020;

  /* Typography */
  --font-display: 'Barlow Condensed', sans-serif;
  --font-body:    'Plus Jakarta Sans', sans-serif;

  /* Spacing scale */
  --space-1:   4px;
  --space-2:   8px;
  --space-3:  16px;
  --space-4:  24px;
  --space-5:  32px;
  --space-6:  64px;
  --space-7:  96px;

  /* Layout */
  --max-width:        1140px;
  --gutter:           24px;
  --radius-sm:         6px;
  --radius-md:         8px;
  --radius-lg:        12px;
  --radius-pill:      99px;

  /* Borders */
  --border-default: 1px solid var(--cbf-light-gray);
  --border-emphasis: 1.5px solid var(--cbf-navy);

  /* Shadows */
  --shadow-card: 0 1px 4px rgba(27,58,107,0.07), 0 0 0 1px var(--cbf-light-gray);
  --shadow-nav:  0 1px 8px rgba(27,58,107,0.12);

  /* Transitions */
  --transition: 0.15s ease;
}