@import "tailwindcss";

@theme {
  --font-serif: "Playfair Display", serif;
  --font-sans: "Instrument Sans", "Inter", sans-serif;

  --color-ink-900: #1a1a1a;
  --color-ink-800: #2d2d2d;
  --color-ink-700: #4a4a4a;
  --color-paper-100: #fcfbf9;
  --color-paper-200: #f4f2ee;
  --color-paper-300: #eae7e1;
  --color-accent-primary: #d94a38;
  --color-accent-secondary: #0e5b4c;
}

@layer base {
  body {
    @apply bg-[var(--color-paper-100)] text-[var(--color-ink-900)] font-sans antialiased selection:bg-[var(--color-accent-primary)] selection:text-white;
  }

  h1, h2, h3, h4, h5, h6 {
    @apply font-serif text-[var(--color-ink-900)] tracking-tight;
  }

  p {
    @apply leading-relaxed;
  }
}