Enhance Header interactivity and clean up HoverCard structure:

- **Mobile menu improvements**: Added functionality to close the menu when navigation links are clicked.
- **HoverCard cleanup**: Removed unused title and date markup for a leaner structure.

src/components/Header.astro

@@ -62,10 +62,20 @@ import "../styles/components/Header.css";
 	document.addEventListener('DOMContentLoaded', () => {
 		const burgerIcon = document.querySelector('.burger-icon');
 		const mobileMenu = document.querySelector('.mobile-menu');
+		const mobileMenuLinks = document.querySelectorAll('.mobile-menu a');
 		
+		// Toggle menu when burger icon is clicked
 		burgerIcon.addEventListener('click', () => {
 			burgerIcon.classList.toggle('active');
 			mobileMenu.classList.toggle('active');
 		});
+		
+		// Close menu when a navigation link is clicked
+		mobileMenuLinks.forEach(link => {
+			link.addEventListener('click', () => {
+				burgerIcon.classList.remove('active');
+				mobileMenu.classList.remove('active');
+			});
+		});
 	});
 </script>

src/components/HoverCard.astro

@@ -5,8 +5,6 @@ const {title, description, image = "", date} = Astro.props;
 ---
 
 <article class="hover-card">
-	{title && <h3 class="card-title">{title}</h3>}
-	{date && <p class="card_date">{date}</p>}
 	<div class="image-container">
 		<img class="card-image" src={image} alt={title} />
 	</div>