/*----- DESIGN TOKENS -----*/

:root {
  /* Backgrounds */
  --primary-pg-bg: #FAF8F4; /* warm ivory */
  --hero-bg: #141410; /* near black */
  --dark-feature-bg: #1E2820; /* deep teal-black */
  --alt-section-bg: #F2EDE6; /* linen */

  /* Text */
  --primary-text: #1E1C18; /* ink */
  --captions-secondary: #4A4540; /* charcoal */
  --headings-links: #085041; /* deep teal */
  --light-text: #E8E0D4; /* warm white */

  /* Accent and UI Colors */
  --primary-cta: #A04A2A; /* burnt sienna */
  --hover-highlight: #C46840; /* terracotta */
  --tags-icons: #1D9E75; /* mid teal */
  --secondary-cta: #085041; /* deep teal */

  /* Borders and Overlays */
  --default-border: #D4C8B8; /* sand */
  --accent-border: #085041; /* deep teal */
  --dark-overlay: rgba(20,20,16,0.55); /* dark scrim */
  --teal-overlay: rgba(8,80,65,0.75); /* teal scrim */

  /* Typography */
  --body-text: 'DM Sans', sans-serif;
  --large-heading: 'DM Serif', serif;
  --elegant-heading: 'Cormorant', serif;
  --body-text-sm: 12px;
  --body-text-md: 16px;
  --body-text-lg: 20px;
  --menu-text-sm: 11px;
  --menu-text-md: 15px;
  --menu-text-lg: 19px;
  --footer-text-sm: 11px;
  --footer-text-md: 15px;
  --footer-text-lg: 19px;
  --header-sm: 18px;
  --header-md: 24px;
  --header-lg: 30px;
  --intro-text-sm: 14px;
  --intro-text-md: 20px;
  --intro-text-lg: 26px;
  --subheader-sm: 16px;
  --subheader-md: 22px;
  --subheader-lg: 28px;
}