:root {
  /* Brand Primary */
  --brand-primary: #e67e14;
  --brand-primary-rgb: 230, 126, 20;

  /* Brand Secondary */
  --brand-black: #000000;
  --brand-black-rgb: 0, 0, 0;
  --brand-white: #ffffff;
  --brand-white-rgb: 255, 255, 255;

  /* Semantic Mappings - Strictly using only the 3 colors and their opacities */
  --bg-primary: var(--brand-white);
  --bg-secondary: rgba(var(--brand-black-rgb), 0.02); /* Faint black overlay instead of gray */
  
  --text-primary: var(--brand-black);
  --text-secondary: rgba(var(--brand-black-rgb), 0.65);
  --text-muted: rgba(var(--brand-black-rgb), 0.45);
  --text-on-primary: var(--brand-white);

  --border-color: rgba(var(--brand-black-rgb), 0.1);
  --border-light: rgba(var(--brand-black-rgb), 0.05);
  
  --primary-button-bg: var(--brand-primary);
  --primary-button-text: var(--brand-white);
  --primary-button-hover: rgba(var(--brand-primary-rgb), 0.9);

  --secondary-button-bg: var(--brand-white);
  --secondary-button-text: var(--brand-black);
  --secondary-button-border: var(--brand-black);
}