@media (max-width: 767px) {
	/* Animation for menu items sliding up */
	.nav-item {
		transform: translateY(20px);
		opacity: 0;
		transition: all 0.4s ease;
	}
	
	/* When menu is active */
	#menu.active {
		opacity: 1;
		pointer-events: auto;
	}

	#menu.active .nav-item {
		transform: translateY(0);
		opacity: 1;
	}

	/* Staggered delay for each menu link */
	#menu.active .nav-item:nth-child(1) { transition-delay: 0.1s; }
	#menu.active .nav-item:nth-child(2) { transition-delay: 0.2s; }
	#menu.active .nav-item:nth-child(3) { transition-delay: 0.3s; }
	#menu.active .nav-item:nth-child(4) { transition-delay: 0.4s; }

	/* Hamburger to X Animation */
	#menu-btn.open #line1 { transform: translateY(4px) rotate(45deg); }
	#menu-btn.open #line2 { transform: translateY(-4px) rotate(-45deg); }
	#menu-btn.open #line3 { display:none; }
	/* Existing animations... */
	.social-item {
		transform: translateY(30px);
		opacity: 0;
		transition: all 0.5s ease;
	}

	#menu.active .social-item {
		transform: translateY(0);
		opacity: 1;
	}

	/* Delay icons until after the 4th menu link (Home, Gallery, About, Contact) */
	#menu.active .social-item:nth-child(1) { transition-delay: 0.5s; }
	#menu.active .social-item:nth-child(2) { transition-delay: 0.6s; }

}