:root {
  /* Brand Colors — Blue/White palette matching Eko Vita logo */
  --green-darkest: #06122A;
  --green-dark:    #0D3778;
  --green-primary: #1B5FAD;
  --green-mid:     #2E7BC4;
  --green-light:   #5AAEE0;
  --green-pale:    #BAD9F8;
  --teal:          #0891B2;
  --teal-light:    #38BDF8;
  --cream:         #F0F7FF;
  --cream-dark:    #DFF0FF;

  /* Neutrals */
  --white:         #FFFFFF;
  --text-dark:     #0F2647;
  --text-mid:      #2C5282;
  --text-muted:    #6B8EC4;
  --border:        rgba(27,95,173,0.12);
  --border-strong: rgba(27,95,173,0.25);

  /* Shadows */
  --shadow-xs: 0 1px 4px rgba(10,32,72,0.06);
  --shadow-sm: 0 2px 10px rgba(10,32,72,0.08);
  --shadow:    0 6px 28px rgba(10,32,72,0.12);
  --shadow-lg: 0 12px 48px rgba(10,32,72,0.16);
  --shadow-xl: 0 24px 80px rgba(10,32,72,0.22);

  /* Spacing */
  --sp-1:  4px;
  --sp-2:  8px;
  --sp-3:  12px;
  --sp-4:  16px;
  --sp-5:  20px;
  --sp-6:  24px;
  --sp-8:  32px;
  --sp-10: 40px;
  --sp-12: 48px;
  --sp-16: 64px;
  --sp-20: 80px;
  --sp-24: 96px;

  /* Border Radius */
  --r-sm:   6px;
  --r:      12px;
  --r-lg:   20px;
  --r-xl:   32px;
  --r-full: 9999px;

  /* Transitions */
  --t-fast:   0.15s ease;
  --t:        0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --t-slow:   0.5s cubic-bezier(0.4, 0, 0.2, 1);
  --t-bounce: 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Typography */
  --font-body:    'Inter', system-ui, -apple-system, sans-serif;
  --font-heading: 'Playfair Display', Georgia, serif;

  /* Z-index */
  --z-below:   -1;
  --z-base:     1;
  --z-raised:  10;
  --z-nav:    100;
  --z-modal:  200;
  --z-toast:  300;
}