Bob AI: Added text-balance to hero heading

Merge version_12_1780495544927 into main

src/pages/HomePage/sections/Hero.tsx

@@ -42,18 +42,18 @@ export default function HeroSection(): React.JSX.Element {
   return (
     <div id="hero" data-webild-section="hero" className="w-full pt-32 pb-16 px-4 md:px-8 bg-background">
         <SectionErrorBoundary name="hero">
-            <div className="container mx-auto max-w-6xl flex flex-col items-center text-center gap-12">
-                <div className="flex flex-col items-center gap-6 max-w-4xl">
+            <div className="container mx-auto max-w-6xl flex flex-col items-center text-center">
+                <div className="flex flex-col items-center text-center gap-4 mb-16 max-w-3xl mx-auto">
                     <Tag text="Welcome to Luxury" />
-                    <h1 className="text-5xl md:text-7xl font-bold text-foreground">
+                    <h1 className="text-5xl md:text-6xl lg:text-7xl font-bold tracking-tight text-balance bg-clip-text text-transparent bg-gradient-to-b from-foreground to-foreground/70">
                         Experience Unparalleled Comfort & Elegance
                     </h1>
-                    <p className="text-lg md:text-xl text-muted-foreground max-w-2xl">
+                    <p className="text-lg text-muted-foreground">
                         Discover a world where impeccable service meets sophisticated design. Your unforgettable journey begins here.
                     </p>
-                    <div className="flex flex-wrap items-center justify-center gap-4 mt-4">
-                        <Button text="Book Your Stay" variant="primary" href="#contact" className="text-lg px-8 py-6" />
-                        <Button text="Explore Rooms" variant="secondary" href="#accommodation" className="text-lg px-8 py-6" />
+                    <div className="flex flex-wrap items-center justify-center gap-4">
+                        <Button text="Book Your Stay" variant="primary" href="#contact" />
+                        <Button text="Explore Rooms" variant="secondary" href="#accommodation" />
                     </div>
                 </div>