:root { --primary: #06B6D4; --secondary: #0E7490; --dark: #0F172A; --light: #F8FAFC; --primary-soft: rgb(207 250 254 / 0.8); --text-primary: #475569; --text-muted: #CBD5E1; --white: #fff; --brand-hover: #0891B2; --border-light: #E2E8F0; --light-slate-gray: #f1f5f9; --primary-light: #ecfeff; --space-2xs: clamp(4px, 0.3vw, 6px); --space-xs: clamp(8px, 0.6vw, 10px); --space-s: clamp(12px, 0.9vw, 14px); --space-m: clamp(16px, 1.2vw, 20px); --space-l: clamp(24px, 1.8vw, 28px); --space-xl: clamp(32px, 2.5vw, 40px); --space-2xl: clamp(48px, 3.5vw, 64px); --text-2xs: clamp(12px, 0.75vw, 13px); --text-xs: clamp(13px, 0.85vw, 14px); --text-s: clamp(14px, 0.95vw, 16px); --text-m: clamp(16px, 1.05vw, 18px); --text-l: clamp(18px, 1.25vw, 20px); --text-xl: clamp(20px, 1.5vw, 24px); --text-2xl: clamp(24px, 2vw, 30px);}