/* Custom styles for Jenn & Jessie's Ice Cream Parlor */
    
    * {
        scroll-behavior: smooth;
    }
    
    html {
        scroll-padding-top: 80px;
    }
    
    body {
        overflow-x: hidden;
    }
    
    /* Navbar scroll state */
    #navbar.scrolled {
        background: rgba(255, 255, 255, 0.97);
        backdrop-filter: blur(12px);
        box-shadow: 0 4px 30px rgba(13, 20, 35, 0.08);
    }
    
    #navbar.scrolled .nav-link {
        color: #1a2846;
    }
    
    #navbar.scrolled .font-display,
    #navbar.scrolled .text-navy-800 {
        color: #1a2846;
    }
    
    #navbar.scrolled .text-navy-600 {
        color: #4164af;
    }
    
    /* Scroll reveal animations - progressive enhancement */
    @media (prefers-reduced-motion: no-preference) {
        .reveal-up {
            opacity: 1;
            transform: translateY(0);
            transition: opacity 0.7s ease, transform 0.7s ease;
        }
        
        .reveal-left {
            opacity: 1;
            transform: translateX(0);
            transition: opacity 0.7s ease, transform 0.7s ease;
        }
        
        .reveal-right {
            opacity: 1;
            transform: translateX(0);
            transition: opacity 0.7s ease, transform 0.7s ease;
        }
    }
    
    /* Mobile menu */
    #mobileMenu {
        animation: slideDown 0.3s ease;
    }
    
    @keyframes slideDown {
        from {
            opacity: 0;
            transform: translateY(-10px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
    
    /* Custom scrollbar */
    ::-webkit-scrollbar {
        width: 10px;
    }
    
    ::-webkit-scrollbar-track {
        background: #f0f3f9;
    }
    
    ::-webkit-scrollbar-thumb {
        background: #d4a843;
        border-radius: 5px;
    }
    
    ::-webkit-scrollbar-thumb:hover {
        background: #b8860b;
    }
    
    /* Selection color */
    ::selection {
        background: #d4a843;
        color: #0d1423;
    }
    
    /* Image loading placeholder */
    img {
        background: linear-gradient(135deg, #f0f3f9 0%, #d9e0ef 100%);
    }
    
    /* Subtle pattern overlay for sections */
    .section-pattern {
        background-image: radial-gradient(circle at 25% 25%, rgba(212, 168, 67, 0.03) 0%, transparent 50%),
                          radial-gradient(circle at 75% 75%, rgba(27, 40, 70, 0.03) 0%, transparent 50%);
    }