/* ========== BASE ========== */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 80px; }
body { margin: 0; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; }
ul { list-style: none; margin: 0; padding: 0; }

/* ========== NAV ========== */
#nav { background: transparent; }
#nav.scrolled { background: rgba(27, 67, 50, 0.97); backdrop-filter: blur(12px); box-shadow: 0 1px 20px rgba(0,0,0,0.15); }

/* ========== MOBILE MENU ========== */
#mobileMenu.open { opacity: 1; pointer-events: all; }
#mobileMenu.closed { opacity: 0; pointer-events: none; }
.mobile-link { transition: opacity 0.2s; }

/* ========== REVEAL ANIMATIONS ========== */
.reveal {
    opacity: 1;
    transform: none;
    transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1), transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}
.reveal.revealed {
    opacity: 1;
    transform: none;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .reveal { opacity: 1; transform: none; transition: none; }
    html { scroll-behavior: auto; }
    * { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}
