:root {
  /* Colors */
  --color-primary: #ff4b3e;
  --color-primary-dark: #e23c30;
  --color-secondary: #eb1e25;
  --color-secondary-dark: #c8171d;
  --color-heading-blue: #0f4b88;
  --color-dark: #0b1e39;
  --color-dark-soft: #10284a;
  --color-rich-black: #222222;
  --color-text: #333333;
  --color-muted: #6b7280;
  --color-body: #7e899e;
  --color-border: #e5e7eb;
  --color-white: #ffffff;
  --color-black: #000000;
  --color-light: #f5f7fa;
  --color-accent-red: #ef353e;
  --color-shadow-red: #880d11;
  --color-navy: #0b345d;
  --color-border-light: #cdd5e4;
  --color-shadow-soft: #e8ecf4;
  --color-tint-blue: #edf3fa;
  --color-tint-cream: #fff4ce;
  --color-eco-green: #16a34a;
  --color-eco-green-dark: #128038;
  --color-sustain-green: #22a06b;
  --color-violet: #7c3aed;

  /* RGB triplets, for rgba(var(--color-x-rgb), alpha) */
  --color-black-rgb: 0, 0, 0;
  --color-white-rgb: 255, 255, 255;
  --color-primary-rgb: 255, 75, 62;
  --color-secondary-rgb: 235, 30, 37;
  --color-navy-rgb: 11, 52, 93;
  --color-dark-rgb: 11, 30, 57;
  --color-tint-blue-rgb: 237, 243, 250;
  --color-tint-cream-rgb: 255, 244, 206;

  /* Typography */
  --font-heading: "Montserrat", sans-serif;
  --font-body: "Rubik", sans-serif;

  /* Radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;

  /* Z-index scale */
  --z-dropdown: 1000;
  --z-sticky: 1100;
  --z-modal: 1200;
  --z-tooltip: 1300;
}