/*
  Color tokens (semantic, API-friendly):
  - surface: backgrounds/panels
  - text: typography colors
  - accent: UI accents
  - brand: brand-specific colors
*/
:root {
    --color-surface-base: #fff;
    --color-surface-soft: #e9f0f8;
    --color-surface-contrast: #f5f8fc;
    --color-surface-subtle: #fafcff;
    --color-surface-panel: #f2f7fc;
    --color-text-primary: #58677c;
    --color-accent-primary: #bcd6f4;
    --color-text-muted: #a7aeb8;
    --color-border-subtle: #e2e8f1;
    --color-text-secondary: #c5ccd4;
    --color-accent-secondary: #a8c4ea;
    --color-accent-tertiary: #b6cbe6;
    --color-accent-warm: #cbd9f1;
    --color-text-strong: #596579;
    --color-brand-facebook: #3b5998;
    --color-brand-phone: #8fb6e5;
    --color-transparent: #FAE8E100;
    --color-text-dim: #666;
}