Improve mobile pricing table usability

[WildTrio]

Description

This PR fixes #7665 by improving the Pricing section UI for mobile users. The changes ensure better visibility and alignment of feature checkmarks and improve the overall responsive layout experience.

Notes for Reviewers

• Updated the Pricing section responsiveness for smaller screens.
• Improved UI alignment and visibility in mobile view.
• Tested the changes locally.

[Signed commits](https://github.com/layer5io/layer5/blob/master/CONTRIBUTING.md#signing-off-on-commits-developer-certificate-of-origin)

• Yes, I signed my commits.

[github-actions]

🚀 Preview deployment: https://layer5.io/pr-preview/pr-7736/

Note: Preview may take a moment (GitHub Pages deployment in progress). Please wait and refresh. Track deployment here

[rishiraj38]

Please fix this; it shouldn’t be transparent.

[rishiraj38]

Could you please refer to the current site? It seems like the pricing component doesn’t have a separate scrollable table. Instead, they move with the main page. Could you please move that component to the page scroll only until the table appears and then remove it?

[WildTrio]

Actually, I’m facing issues while setting up the codebase locally. For now, I have only forked the src folder, made the required changes, and tested the code in a separate test folder. As soon as I’m able to set up the complete codebase locally, I’ll solve the issue properly.

[Bhumikagarggg]

@WildTrio Thank you for your contribution! Let's discuss this during the website call tomorrow at 5:30 PM IST | 7 AM CST Add it as an agenda item to the meeting minutes, if you would 🙂