@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');
@import "tailwindcss";

@theme {
  --font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-display: "Space Grotesk", sans-serif;
  
  --color-brand-primary: #ea580c; /* natural energetic orange */
  --color-brand-primary-hover: #c2410c;
  --color-brand-dark: #2d2723; /* soft earth coal charcoal */
  --color-brand-cream: #fdfbf7; /* organic warm milk / ivory */
  --color-brand-beige: #e6e2d3; /* earth border tint */
  --color-brand-muted: #746c64; /* tree-bark gray */
  --color-brand-accent: #f59e0b;
}

@layer base {
  body {
    background-color: var(--color-brand-cream);
    color: var(--color-brand-dark);
    font-family: var(--font-sans);
  }
}