body {
    font-family: 'Inter', sans-serif;
    font-feature-settings: "cv11", "ss01";
    -webkit-font-smoothing: antialiased;
}

::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-track {
    background: #fafafa;
}

::-webkit-scrollbar-thumb {
    background: #e4e4e7;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #d4d4d8;
}

/* Mobile Menu */
#mobile-menu {
    transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s;
}

.open-menu {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}

/* Advanced Animation Engine */

/* Default hidden state for all animated elements */
.anim-hero, .anim-stagger-item, .anim-wipe, .anim-drift, .reveal-on-scroll {
    opacity: 0;
    will-change: transform, opacity, filter, clip-path;
}

/* Hero Entrance: Scale-out + Blur Reveal */
.anim-hero {
    transform: scale(1.05) translateY(20px);
    filter: blur(8px);
    transition: opacity 1.2s cubic-bezier(0.2, 0.8, 0.2, 1), 
                transform 1.2s cubic-bezier(0.2, 0.8, 0.2, 1),
                filter 1.2s ease-out;
}
.anim-hero.visible {
    opacity: 1;
    transform: scale(1) translateY(0);
    filter: blur(0px);
}

/* Text Drift: Soft horizontal drift */
.anim-drift {
    transform: translateX(-30px);
    transition: opacity 1s cubic-bezier(0.25, 1, 0.5, 1), transform 1s cubic-bezier(0.25, 1, 0.5, 1);
}
.anim-drift.visible {
    opacity: 1;
    transform: translateX(0);
}

/* Image Wipe: Directional wipe from bottom with slight scale */
.anim-wipe {
    transform: scale(0.95);
    clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%);
    transition: opacity 0.8s cubic-bezier(0.77, 0, 0.175, 1), 
                transform 1.2s cubic-bezier(0.77, 0, 0.175, 1),
                clip-path 1.2s cubic-bezier(0.77, 0, 0.175, 1);
}
.anim-wipe.visible {
    opacity: 1;
    transform: scale(1);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

/* Grid Stagger: Appear one by one */
.anim-stagger-item {
    transform: translateY(30px);
    transition: opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1), 
                transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.anim-stagger-item.visible {
    opacity: 1;
    transform: translateY(0);
}
.stagger-delay-1 { transition-delay: 0.1s; }
.stagger-delay-2 { transition-delay: 0.2s; }
.stagger-delay-3 { transition-delay: 0.3s; }
.stagger-delay-4 { transition-delay: 0.4s; }

/* Keep original reveal-on-scroll for compatibility */
.reveal-on-scroll {
    transform: translateY(16px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}
.reveal-on-scroll.visible {
    opacity: 1;
    transform: translateY(0);
}

#mobile-menu-toggle span {
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s;
}

.is-active #mobile-menu-toggle span:nth-child(1) { transform: rotate(-45deg) translate(-5px, 6px); }
.is-active #mobile-menu-toggle span:nth-child(2) { opacity: 0; }
.is-active #mobile-menu-toggle span:nth-child(3) { transform: rotate(45deg) translate(-5px, -6px); }