feat: enhance Waitlist page with background and layout improvements

- Added a new BeamBackground component to the Waitlist page for visual enhancement.
- Wrapped the WaitlistForm in a div with a background image for better aesthetics.
- Updated the WaitlistForm styling to include a 'bg-center' class for improved layout.

Author: 0xdevcollins

app/(landing)/waitlist/page.tsx

@@ -1,9 +1,15 @@
 import { Metadata } from 'next';
 import { generatePageMetadata } from '@/lib/metadata';
 import WaitlistForm from '@/components/waitlist/WaitlistForm';
+import BeamBackground from '@/components/landing-page/BeamBackground';
 
 export const metadata: Metadata = generatePageMetadata('waitlist');
 
 export default function WaitlistPage() {
-  return <WaitlistForm />;
+  return (
+    <div className='bg-[url(/waitlist-bg.svg)] bg-cover bg-center'>
+      <BeamBackground />
+      <WaitlistForm />
+    </div>
+  );
 }

components/waitlist/WaitlistForm.tsx

@@ -466,7 +466,7 @@ export default function WaitlistForm() {
   return (
     <div
       ref={container}
-      className=' max-w-[446px] mx-auto flex flex-col gap-16 items-center justify-start px-4 mt-[65px]'
+      className=' max-w-[446px] mx-auto flex flex-col gap-16 items-center justify-start px-4 mt-[65px] bg-center'
     >
       <div className={cn(' w-full text-center', isSubmitted && 'hidden')}>
         <h1