:root {
    --primary: #475569;
--primary-light: #94a3b8;
--primary-dark: #1e293b;
--secondary: #64748b;
--secondary-light: #e2e8f0;
--secondary-dark: #334155;
--accent: #0f172a;
--accent-light: #64748b;
--accent-dark: #020617;
--brand-gradient-start: #94a3b8;
--bg: #f8fafc;
--bg-alt: #e2e8f0;
--surface: #ffffff;
--surface-muted: #f1f5f9;
--border: #cbd5e1;
--border-strong: #94a3b8;
--text: #0f172a;
--text-muted: #475569;
--text-inverse: #ffffff;
--success: #64748b;
--warning: #94a3b8;
--info: #cbd5e1;
--primary-rgb: 71, 85, 105;
--bg-rgb: 248, 250, 252;
--overlay-rgb: 15, 23, 42;
--pricing-highlight-start: rgba(148, 163, 184, 0.25);
    --primary-a-03: rgba(var(--primary-rgb), 0.03);
    --primary-a-10: rgba(var(--primary-rgb), 0.1);
    --primary-a-16: rgba(var(--primary-rgb), 0.16);
    --primary-a-18: rgba(var(--primary-rgb), 0.18);
    --primary-a-22: rgba(var(--primary-rgb), 0.22);
    --primary-a-25: rgba(var(--primary-rgb), 0.25);

    --bg-a-10: rgba(var(--bg-rgb), 0.1);
    --bg-a-20: rgba(var(--bg-rgb), 0.2);
    --bg-a-30: rgba(var(--bg-rgb), 0.3);
    --bg-a-60: rgba(var(--bg-rgb), 0.6);
    --bg-a-70: rgba(var(--bg-rgb), 0.7);

    --overlay-a-60: rgba(var(--overlay-rgb), 0.6);
    --overlay-a-85: rgba(var(--overlay-rgb), 0.85);

    --surface-card: rgba(255, 255, 255, 0.7);
    --surface-pill: rgba(255, 255, 255, 0.55);
    --shadow-card: 0 10px 30px rgba(0, 0, 0, 0.06);
    --shadow-pill: 0 8px 22px rgba(0, 0, 0, 0.04);
    --shadow-hover: 0 12px 28px rgba(0, 0, 0, 0.12);
}