/* Accel Capital Partners over the VisaTier design-system tokens.
   Loaded right after the design system (acp/brand.mjs), so these win.
   Palette from the Accel client portal and landing: ink, blue, orange. */
:root {
  /* Primary: Accel blue (VisaTier terracotta) */
  --primary: #1955ec;
  --primary-hover: #174dde;
  --primary-50: rgba(25, 85, 236, 0.5);
  --primary-20: rgba(25, 85, 236, 0.2);
  --primary-15: rgba(25, 85, 236, 0.15);
  --primary-10: rgba(25, 85, 236, 0.1);
  --primary-5: rgba(25, 85, 236, 0.05);

  /* Secondary: Accel orange (VisaTier gold) */
  --secondary: #e07a1f;
  --secondary-hover: #c96a14;

  /* Canvas: cool light grey (VisaTier cream) */
  --beige-100: #f3f5f9;
  --beige-80: rgba(243, 245, 249, 0.8);
  --beige-60: rgba(243, 245, 249, 0.6);
  --beige-50: rgba(243, 245, 249, 0.5);
  --beige-30: rgba(243, 245, 249, 0.3);
  --beige-10: rgba(243, 245, 249, 0.1);

  /* Ink (VisaTier navy) */
  --navy-100: #10243e;
  --navy-hover: #0d213b;
  --navy-80: rgba(16, 36, 62, 0.8);
  --navy-60: rgba(16, 36, 62, 0.6);
  --navy-50: rgba(16, 36, 62, 0.5);
  --navy-20: rgba(16, 36, 62, 0.2);
  --navy-15: rgba(16, 36, 62, 0.15);
  --navy-5: rgba(16, 36, 62, 0.05);

  --shadow-xs: 0 1px 2px rgba(16, 36, 62, 0.06);
  --shadow-sm: 0 4px 12px rgba(16, 36, 62, 0.06);
  --shadow-md: 0 8px 24px rgba(16, 36, 62, 0.08);
  --shadow-lg: 0 16px 48px rgba(16, 36, 62, 0.12);
  --shadow-card: 0 8px 30px rgba(16, 36, 62, 0.07);

  /* Accel uses a plain system sans */
  --font-display: Arial, Helvetica, sans-serif;
  --font-body: Arial, Helvetica, sans-serif;
  --font-fine: Arial, Helvetica, sans-serif;
}