Revamp invite page banner styling and layout.

Updated the invite page banner to use a more dynamic and visually appealing design with a background image or fallback styling. Added a text overlay for improved readability and enhanced the fallback display when an image is unavailable.

frontend/src/app/(public)/invite/[slug]/page.tsx

@@ -107,7 +107,7 @@ const InvitationPage = () => {
   return (
     <div className="min-h-screen relative overflow-hidden" style={pageStyle}>
       <div
-        className="absolute inset-0 bg-no-repeat bg-[top_right] bg-cover bg-fixed opacity-15"
+        className="absolute inset-0 bg-no-repeat bg-[top_right] bg-cover bg-fixed opacity-10"
         style={{
           backgroundImage: `url(${getAssetUrl("background-h")})`,
         }}
@@ -122,7 +122,7 @@ const InvitationPage = () => {
       </div>
 
       <div className="mx-auto max-w-4xl px-4 py-6">
-        {/* Wooden Sign Title */}
+        {/* Banner */}
         <div className="mx-auto max-w-6xl px-0 py-10">
           <div
             className="relative overflow-hidden rounded-xl bg-cover bg-center"