:root {
  --brand: #A52A2A;
  --brand-hover: #8B2323;
  --charcoal: #2B2B2B;
  --on-brand: #FFFFFF;

  --bg: #FFFFFF;
  --surface: #FFFFFF;
  --surface-2: #F5F5F5;
  --text: #1A1A1A;
  --text-muted: #555555;
  --border: #E3E3E3;
  --accent-text: #A52A2A;
  --shadow: 0 10px 30px rgba(0, 0, 0, .12);

  --header-h: 72px;
}

[data-theme="dark"] {
  --bg: #000000;
  --surface: #0D0D0D;
  --surface-2: #1A1A1A;
  --text: #F5F5F5;
  --text-muted: #B5B5B5;
  --border: #2A2A2A;
  /* lighter red for text/underline: passes WCAG AA on black */
  --accent-text: #E26A6A;
  --shadow: 0 10px 30px rgba(0, 0, 0, .7);
}