/* Design tokens and theme – single source for colors and sizes. */
:root {
  /* Dark theme - softened charcoal grey backdrop */
  --background: #2C2C2C;
  --text: #FFFFFF;
  --navbar-bg: #2C2C2C;
  --navbar-text: #FFFFFF;
  /* Primary accent updated to match lighter hero orange */
  --card-bg: #FFB74D;
  --card-text: #FFFFFF;
  --card-max-width: 420px;
  --panel-max-width: 560px;
  /* Buttons: white background, accent-colored text */
  --button-bg: #e0e0e0;
  --button-text: #FFB74D;
  --section-bg: #2C2C2C;
  /* Layout heights (used by layout.css and sections) */
  --navbar-height: 5rem;
  --footer-height: 4.5rem;
}

.theme-light {
  --background: #FFFFFF;
  --text: #333333;
  --navbar-bg: #FFFFFF;
  --navbar-text: #333333;
  /* Light theme accent UPDATED to match hero orange */
  --card-bg: #FFB74D;
  --card-text: #FFFFFF;
  /* Buttons: switch accent/white for visibility */
  --button-bg: #FFB74D;
  --button-text: #FFFFFF;
  --section-bg: #FFFFFF;
}