Fix wave css animation

[Jeet-Bubna]

Summary

Fixed the wave animations on the home page, reducing the CLS score to near zero. The screenshot below was taken from the local development environment. This improvement was achieved by changing the animation method from margin-based to transform-based animation.

![Wave animation after fix]

Description of changes

• Updated wave animation to use transform: translateX() instead of animating margin-left, preventing layout recalculation and reducing CLS.
• Adjusted overflow attributes on the wave container to accommodate a wider set of overflow scenarios.
• TO DO: Implement seamless infinite loop for wave width, as discussed in the original issue.

I confirm I have:

• Joined the Python Discord community
• Read the Code of Conduct and agree to it
• Discussed implementing this feature on the relevant service (Discord, GitHub, etc.)

[netlify]

❌ Deploy Preview for pydis-static failed. Why did it fail? →

Name	Link
🔨 Latest commit	b70a73a
🔍 Latest deploy log	https://app.netlify.com/projects/pydis-static/deploys/69acf9fa07a3e900083f0f6d

[Jeet-Bubna]

Checking back in on this. The refactor to transform: translateX() successfully eliminated the 2.46 CLS on the home page in local testing. Happy to adjust the 'TO-DO' items if that's a blocker for the merge!"

[wookie184]

Thanks for the PR. I've not tried it out yet but it seems like the linting CI is failing due to trailing whitespace.

Could you undo the formatting changes? They make the git diff less clear and are not consistent with the rest of the file.

[ChrisLovering]

Marking as draft until CI failures are fixed