/* Custom styles and overrides */
:root {
    --font-sans: 'DM Sans', sans-serif;
    --font-serif: 'Playfair Display', serif;
}

body {
    font-family: var(--font-sans);
}

h1, h2, h3, h4, .font-serif {
    font-family: var(--font-serif);
}

/* Floating Animations */
@keyframes float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-15px); }
}

@keyframes float-delayed {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(12px); }
}

.animate-float {
    animation: float 6s ease-in-out infinite;
}

.animate-float-delayed {
    animation: float-delayed 7s ease-in-out infinite;
    animation-delay: 1s;
}

/* Scroll Reveal Base States */
/* Note: We do not use opacity:0 here to ensure content is visible if JS fails.
   JS will add the .revealed class to trigger the animation. */
.reveal-up {
    transform: translateY(30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
    opacity: 1; /* Default visible */
}

.revealed {
    opacity: 1;
    transform: translateY(0);
}

/* Smooth Scroll behavior is handled by Tailwind 'scroll-smooth' on html */

/* Mobile Menu Transitions */
#mobile-menu {
    transition: opacity 0.3s ease, transform 0.3s ease;
}
#mobile-menu.hidden {
    opacity: 0;
    transform: translateY(-10px);
    pointer-events: none;
}
#mobile-menu:not(.hidden) {
    opacity: 1;
    transform: translateY(0);
    pointer-events: all;
}