/* Custom styles to complement Tailwind */
html {
    scroll-behavior: smooth;
}

body {
    /* Ensuring no layout shift on load */
    background-color: #ffffff;
}

/* Subtle fade-in for sections below fold */
.fade-in-section {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
    will-change: opacity, visibility;
}

/* If JS fails or is disabled, content remains visible */
@media (prefers-reduced-motion: no-preference) {
    .reveal {
        opacity: 0;
        transform: translateY(20px);
    }
    .reveal.is-visible {
        opacity: 1;
        transform: translateY(0);
    }
}