/* Custom styles that extend Tailwind */
html {
    scroll-behavior: smooth;
}

body {
    background-color: #FDFBF7; /* Cream */
}

/* Typography tweaks */
h1, h2, h3, h4 {
    font-family: 'Playfair Display', serif;
}

p, a, span, button, input, textarea, li {
    font-family: 'Public Sans', sans-serif;
}

/* Animation utilities */
.reveal-up {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.reveal-left {
    opacity: 0;
    transform: translateX(-30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.reveal-right {
    opacity: 0;
    transform: translateX(30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.reveal-up.visible,
.reveal-left.visible,
.reveal-right.visible {
    opacity: 1;
    transform: translate(0, 0);
}

/* Staggered delays */
.delay-100 { transition-delay: 100ms; }
.delay-200 { transition-delay: 200ms; }
.delay-300 { transition-delay: 300ms; }

/* Mobile menu transitions */
#mobile-menu {
    box-shadow: -5px 0 15px rgba(0,0,0,0.1);
}

/* Focus states for accessibility */
button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible {
    outline: 2px solid #059669;
    outline-offset: 2px;
}