Make website responsive on larger displays/viewports

[aryanprince]

Changes

• Add a max-width when on larger/wider viewports
• Add text balancing to description on hero section

Screenshots

Improved Design for Large Displays

Top (Before): No X-axis margins/padding. Makes it hard to read on large displays (anything over 1080p).
Bottom (After): Added a max-width to the page and the navbar. That's it, but is way easier to read through now.

Text Balancing

Left (After): Adds text balancing so description looks (much) nicer! Makes it way easier to read as well
Right (Before): Currently how it looks like, has a few 'orphan' words on larger displays that can't fit the entire description on 1 page

Known Issue

If you notice, the section background and the website's body background have different colors/gradients. This is the same before (currently) and after this PR cus no changes have been made to the BG colors in this PR.

But it could look more 'pronounced' on larger displays now with this PR's changes. I can open a PR later to make it blend better to the body background, unless this design choice is intentional (no issues then).

[vapidinfinity]

This is huge, dude, thanks.
Was planning on doing this but i don't really know how to webdev so I was relying a bit on Copilot to help me through, lol

As for the 'pronounced' look, the gradient is intentional to denote a change in page content, but returning to the original color in a subtle manner -- lots of apple pages do this tmk.

So, before merging, it'd be preferred if the gradient was the whole viewport wide.

[vapidinfinity]

Managed to (hopefully) solve the problem.