[FEAT] : Make Hero Section Responsive for All devices

[dhruv389]

Is your feature request related to a problem? Please describe.

• On smaller screens (e.g., mobile devices), text may overlap or become too small to read.
• Images may not scale correctly, leading to distortion or improper display.
• Layout elements may be positioned awkwardly or off-screen.

Describe the solution you'd like

• Use flexible grid layouts and media queries to adjust the hero section's design based on screen size.
• Ensure text scales properly and remains legible on all devices.
• Optimize images to prevent distortion and overflow issues.
• Adjust spacing and positioning of elements for better visual hierarchy and usability.

Add screenshot

Checklist
Example Fill x { [x] } into bracket

• I have checked the existing issues *
• I have read the Contributing Guidelines *
• I have starred the repository *
• Working under Gssoc'24

[github-actions]

Hi there! Thanks for opening this issue. We appreciate your contribution to this open-source project. We aim to respond or assign your issue as soon as possible.

[panwar8279]

Hi, @dhruv389 , i am assigning this issue to you; kindly complete within 2 days. Good Luck!

[Tarungupta18]

assign me excited to contribute