@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
    --forest: #2b6e4c;
    --oak: #8b6b4a;
    --oak-light: #f0e7dd;
    --oak-dark: #6e5339;
    --charcoal: #333333;
    --offwhite: #f9f9f7;
}

body {
    font-family: 'Inter', sans-serif;
}

.font-serif {
    font-family: 'EB Garamond', serif;
}

.bg-forest {
    background-color: var(--forest);
}

.text-forest {
    color: var(--forest);
}

.bg-oak {
    background-color: var(--oak);
}

.bg-oak-dark {
    background-color: var(--oak-dark);
}

.bg-oak-light {
    background-color: var(--oak-light);
}

.text-oak {
    color: var(--oak);
}

.text-oak-dark {
    color: var(--oak-dark);
}

.bg-offwhite {
    background-color: var(--offwhite);
}

.bg-charcoal {
    background-color: var(--charcoal);
}

.text-charcoal {
    color: var(--charcoal);
}

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
}

/* Form focus states */
input:focus, textarea:focus, select:focus {
    outline: none;
    ring-width: 2px;
    ring-color: var(--oak);
}