:root {
  /* Brand — matches logo #4F46E5 */
  --color-primary: #4f46e5;
  --color-primary-dark: #4338ca;
  --color-primary-light: #818cf8;
  --color-primary-soft: #eef2ff;
  --color-accent-orange: #ff6b00;
  --color-accent-teal: #14b8a6;
  --color-accent-green: #16a34a;
  --color-accent-blue: #3b82f6;
  --color-accent-pink: #e11d48;

  /* Neutrals */
  --color-white: #ffffff;
  --color-black: #0a0a0a;
  --color-text: #111827;
  --color-text-secondary: #6b7280;
  --color-text-muted: #9ca3af;
  --color-border: #e5e7eb;
  --color-bg-light: #f8f9fc;
  --color-bg-dark: #05070a;
  --color-bg-navy: #0b0f1a;
  --color-card-dark: #0f172a;

  /* Before / After */
  --color-before-bg: #fff5f5;
  --color-before-badge: #fee2e2;
  --color-before-text: #b91c1c;
  --color-after-bg: #f0fdf4;
  --color-after-badge: #d1fae5;
  --color-after-text: #065f46;

  /* Typography */
  --font-heading: 'Plus Jakarta Sans', sans-serif;
  --font-body: 'Inter', sans-serif;
  --font-logo: 'Litera Heavy', 'Plus Jakarta Sans', sans-serif;

  /* Layout */
  --content-width: 1280px;
  --section-padding-y: 100px;
  /* Mobile section headings — matches About Us hero */
  --mobile-heading-size: clamp(30px, 6vw, 42px);
  --mobile-heading-line-height: 1.2;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-pill: 999px;

  /* Shadows */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 20px 50px rgba(0, 0, 0, 0.12);
  --shadow-glow: 0 8px 32px rgba(79, 70, 229, 0.4);
}