Added responsive hamburger menu and refined header layout

[shivanginigupta573-dev]

📌 What does this PR do?

Implemented a mobile-friendly hamburger menu with drop down navigation. Refined header layout for better responsiveness and visual polish. Improves usability and aesthetics on smaller screens.

Related Issue

Fixes # (437)

🔧 Type of Change

• New feature

✅ How Has This Been Tested?

Mention the steps for testing or an overview of the testing process.
This feature was tested manually across multiple screen sizes to ensure responsive behavior.

• On mobile view, the hamburger icon appears on the right and toggles a dropdown menu with navigation links.
• On desktop view, the full navigation bar displays correctly and the hamburger icon is hidden.
• All links in the dropdown were clicked to confirm they route correctly.
• No layout breakage or console errors were observed during testing.
  Operating System:Windows
  Browser:Chrome

Include environment details (Operating System, browser, Node version, etc.)

📸 Screenshots (if UI changed)

📊 Impact / Performance

Mobile users will have more convenience

✅ Checklist

• [] I have followed the code style guidelines.
• I have self-reviewed my code.
• I have commented on complex parts of the code.
• I have updated or added documentation where necessary.
• All tests pass locally.
• No new warnings have been introduced.

[shivanginigupta573-dev]

@Jadhav124Akshada can you look into this PR?If everything is alright to you ,please merge it