/* Custom Utilities & Animations */
    html {
        scroll-behavior: smooth;
    }

    body {
        background-color: #FDF8F5;
    }

    /* Animation Classes */
    .fade-in {
        opacity: 0;
        animation: fadeIn 1s ease-out forwards;
    }

    .fade-in-up {
        opacity: 0;
        transform: translateY(20px);
        animation: fadeInUp 0.8s ease-out forwards;
    }

    .delay-100 { animation-delay: 0.1s; }
    .delay-200 { animation-delay: 0.2s; }
    .delay-300 { animation-delay: 0.3s; }
    .delay-500 { animation-delay: 0.5s; }

    @keyframes fadeIn {
        from { opacity: 0; }
        to { opacity: 1; }
    }

    @keyframes fadeInUp {
        from { 
            opacity: 0;
            transform: translateY(20px);
        }
        to { 
            opacity: 1;
            transform: translateY(0);
        }
    }

    /* Mobile Menu Transition */
    #mobile-menu.open {
        opacity: 1;
        pointer-events: auto;
    }

    /* Hamburger Animation */
    #menu-btn.active #bar1 {
        transform: translateY(8px) rotate(45deg);
    }
    #menu-btn.active #bar2 {
        transform: translateY(-8px) rotate(-45deg);
    }