Responsive Navigation Menu

This project is a responsive landing page navigation bar with an interactive menu that changes its appearance on scroll and has hover effects. It is built using HTML, CSS, and JavaScript.

📌 Features

• Fixed position navigation bar visible on all pages.
• Scroll effect: Navbar background and padding change after scrolling.
• Hover effect: Smooth underline animation on menu items.
• Responsive design: Collapsible hamburger menu for mobile devices.
• Interactive menu toggle: Opens and closes smoothly on click.

📂 Project Structure

project-folder/
│── index.html    # Main HTML file
│── style.css     # CSS styles for layout and animations
│── script.js     # JavaScript for scroll and menu toggle interactions

🛠️ Technologies Used

• HTML5 for structure
• CSS3 for styling and animations
• JavaScript (ES6) for interactivity

🚀 How to Use

1. Download or clone this repository.
2. Make sure index.html, style.css, and script.js are in the same folder.
3. Open index.html in a web browser.
4. Scroll or click on the hamburger icon to see the interactive effects.

📱 Responsive Behavior

• On desktop, the navigation menu items are displayed inline.
• On mobile (screen width ≤ 768px), the menu becomes a hamburger icon that toggles the menu visibility.