*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 5rem; }
body { margin: 0; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/* Mobile menu */
#mobile-menu { transition: opacity 0.3s ease; }
#mobile-menu:not(.hidden) { opacity: 1; }
#mobile-menu.hidden { opacity: 0; pointer-events: none; }
.mobile-overlay { transition: opacity 0.3s ease; }
.mobile-link { transition: color 0.2s ease, padding-left 0.2s ease; }

/* Scroll reveal */
.reveal {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1), transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}
.js-active .reveal {
    opacity: 0;
    transform: translateY(28px);
}
.js-active .reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}
.reveal:nth-child(2) { transition-delay: 80ms; }
.reveal:nth-child(3) { transition-delay: 160ms; }
.reveal:nth-child(4) { transition-delay: 240ms; }

/* Scroll to top */
#scroll-top.visible {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

/* Header scroll state */
#site-header.scrolled {
    box-shadow: 0 1px 12px rgba(10, 22, 40, 0.08);
}

/* Form focus styles */
input:focus, textarea:focus {
    outline: none;
}

/* Selection */
::selection {
    background: #8EDFBD;
    color: #0A1628;
}

/* Custom scrollbar */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #F2FBF8; }
::-webkit-scrollbar-thumb { background: #142D4A; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #1A3A5C; }

@media (max-width: 767px) {
    #site-header { height: 4rem; }
}
