style: improve footer responsiveness on small screens

[Muskankr]

Summary [required]

This PR fixes the footer layout issues on mobile devices by improving responsiveness and adjusting spacing, alignment, and grid behavior for smaller screen widths. The update ensures that the footer content remains properly structured, readable, and visually consistent across different device sizes without breaking the overall design.

Related Issue [required]

Closes #21

Type of Change [required]

• Bug fix — resolves a broken behaviour
• Style — CSS or visual changes only, no logic change

What Was Changed [required]

File	Change made
Footer stylesheet (CSS)	Updated responsive styles for mobile view, fixed layout stacking, spacing, and alignment issues in footer sections

How to Test This PR [required]

1. Pull this branch: git checkout fix/footer-mobile-responsive
2. Open the project in browser
3. Resize screen width to mobile breakpoints (320px–768px)
4. Navigate to pages containing footer

Check that:

• Footer columns stack properly on small screens
• No horizontal scrolling appears
• Text and links remain readable and aligned

Self-Review Checklist [required]

• I have read CONTRIBUTING.md and followed all guidelines
• My branch name follows the convention: fix/
• I have run tests locally (if applicable)
• I have not introduced any print() or debug statements
• I have not modified files outside the scope of the linked issue
• If I changed the UI, I tested it at mobile and desktop breakpoints

Notes for Reviewer

This change focuses only on mobile responsiveness of the footer and does not affect any logic or backend functionality.

Thanks for reviewing my PR !

[vercel]

@Muskankr is attempting to deploy a commit to the komalsony234-1530's projects Team on Vercel.

A member of the Team first needs to authorize it.

[Muskankr]

Hi @komalharshita , I’ve rechecked the footer responsiveness changes on mobile breakpoints and verified that all CI tests are passing successfully. Please let me know if any further improvements or changes are needed. Thank you for reviewing the PR!

[komalharshita]

Thanks for the contribution. The footer responsiveness improvements are clean and the CSS changes stay properly scoped to the issue.

Before this PR can be approved, please upload screenshots of the footer on:

• mobile view (around 375px)
• tablet view
• desktop view

This helps reviewers verify the responsive behavior and visual consistency across breakpoints.

Please add both before and after screenshots in the PR description or comments.

[Muskankr]

Hi @komalharshita

As requested, I’ve added screenshots of the footer responsiveness across different breakpoints.

📱 Mobile

• Before:

• After:

📟 Tablet

• Before:

• After:

🖥️ Desktop

• Before:

• After:

All layouts have been tested and verified to ensure proper stacking, spacing, and no horizontal overflow.

Please let me know if any other adjustments are needed. Thanks!

[komalharshita]

@Muskankr please resolve the conflicts before merging this PR

[Muskankr]

@komalharshita Resolved conflicts

[komalharshita]

Approved for merge!