Update src/app/page.tsx

src/app/page.tsx

@@ -13,33 +13,24 @@ import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
 export default function LandingPage() {
   return (
     <ThemeProvider
-        defaultButtonVariant="elastic-effect"
+        defaultButtonVariant="hover-magnetic"
-        defaultTextAnimation="background-highlight"
+        defaultTextAnimation="reveal-blur"
-        borderRadius="rounded"
+        borderRadius="soft"
-        contentWidth="mediumSmall"
+        contentWidth="mediumLarge"
-        sizing="mediumLargeSizeLargeTitles"
+        sizing="largeSizeMediumTitles"
         background="noise"
-        cardStyle="subtle-shadow"
+        cardStyle="glass-depth"
-        primaryButtonStyle="radial-glow"
+        primaryButtonStyle="primary-glow"
-        secondaryButtonStyle="layered"
+        secondaryButtonStyle="glass"
-        headingFontWeight="light"
+        headingFontWeight="bold"
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
       <NavbarStyleCentered
       navItems={[
-        {
+        { name: "Exclusive Brews", id: "brews" },
-          name: "Brews",
+        { name: "Luxury Atmosphere", id: "atmosphere" },
-          id: "brews",
+        { name: "Private Reservations", id: "reservations" },
-        },
-        {
-          name: "Atmosphere",
-          id: "atmosphere",
-        },
-        {
-          name: "Reservations",
-          id: "reservations",
-        },
       ]}
       brandName="THE VAULT"
     />
@@ -48,220 +39,84 @@ export default function LandingPage() {
   <div id="hero" data-section="hero">
       <HeroBillboardScroll
       background={{
-        variant: "sparkles-gradient",
+        variant: "radial-gradient"}}
-      }}
+      title="Craftsmanship Defined"
-      title="A Symphony of Gold & Grain"
+      description="A symphony of gold and grain. Experience the elite standard of craft brewing in our sanctuary of taste."
-      description="Experience the pinnacle of craftsmanship in our exclusive lounge. A journey of taste, light, and atmosphere."
+      imageSrc="http://img.b2bpic.net/free-photo/beer-glass-front-black-background_23-2148098775.jpg"
-      imageSrc="http://img.b2bpic.net/free-photo/front-view-iced-cocktail-long-glass-with-dishes-nuts-table-drink-juice-cocktail-ice_140725-26177.jpg"
+      imageAlt="Realistic golden beer glass"
-      imageAlt="Golden craft beer glass"
       buttons={[
-        {
+        { text: "Discover Brews", href: "#brews" },
-          text: "View Menu",
+        { text: "Reserve Now", href: "#reservations" },
-          href: "#brews",
-        },
-        {
-          text: "Reserve Table",
-          href: "#reservations",
-        },
       ]}
     />
   </div>
 
   <div id="brews" data-section="brews">
       <ProductCardTwo
-      animationType="slide-up"
+      animationType="blur-reveal"
       textboxLayout="default"
       gridVariant="three-columns-all-equal-width"
-      useInvertedBackground={false}
+      useInvertedBackground={true}
       products={[
-        {
+        { id: "b1", brand: "Signature", name: "Gilded Horizon", price: "$28", rating: 5, reviewCount: "1.2k reviews", imageSrc: "http://img.b2bpic.net/free-photo/view-golden-skull-with-alcoholic-drink_23-2150835876.jpg" },
-          id: "b1",
+        { id: "b2", brand: "Reserve", name: "Obsidian Velvet", price: "$35", rating: 5, reviewCount: "850 reviews", imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-beverage-stucco-background_23-2148437092.jpg" },
-          brand: "Vault Series",
+        { id: "b3", brand: "Limited", name: "Amber Legacy", price: "$42", rating: 5, reviewCount: "620 reviews", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-artizanal-beer_23-2148322828.jpg" },
-          name: "Golden Horizon",
-          price: "$18",
-          rating: 5,
-          reviewCount: "42 reviews",
-          imageSrc: "http://img.b2bpic.net/free-photo/black-bearded-tattooed-hipster-male-manufacturer-tasting-beer-microbrewery_613910-13629.jpg",
-        },
-        {
-          id: "b2",
-          brand: "Vault Series",
-          name: "Obsidian Stout",
-          price: "$22",
-          rating: 5,
-          reviewCount: "38 reviews",
-          imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-beverage-stucco-background_23-2148437092.jpg",
-        },
-        {
-          id: "b3",
-          brand: "Vault Series",
-          name: "Amber Reserve",
-          price: "$20",
-          rating: 4,
-          reviewCount: "29 reviews",
-          imageSrc: "http://img.b2bpic.net/free-photo/beer-glass-front-black-background_23-2148098775.jpg",
-        },
-        {
-          id: "b4",
-          brand: "Vault Series",
-          name: "Hazy Eclipse",
-          price: "$19",
-          rating: 5,
-          reviewCount: "51 reviews",
-          imageSrc: "http://img.b2bpic.net/free-photo/view-golden-skull-with-alcoholic-drink_23-2150835876.jpg",
-        },
-        {
-          id: "b5",
-          brand: "Vault Series",
-          name: "Golden Fields",
-          price: "$17",
-          rating: 4,
-          reviewCount: "33 reviews",
-          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-artizanal-beer_23-2148322828.jpg",
-        },
-        {
-          id: "b6",
-          brand: "Vault Series",
-          name: "Velvet Barrel",
-          price: "$25",
-          rating: 5,
-          reviewCount: "27 reviews",
-          imageSrc: "http://img.b2bpic.net/free-photo/tattooed-bearded-caucasian-indian-men-presenting-craft-beer-microbrewery_613910-13541.jpg",
-        },
       ]}
       title="Exclusive Brews"
-      description="A curated selection of the finest craft ales, stouts, and lagers from around the globe."
+      description="A curation of the world's most refined craft beers, aged to perfection and served with precision."
     />
   </div>
 
   <div id="atmosphere" data-section="atmosphere">
       <FeatureCardEight
-      textboxLayout="inline-image"
+      textboxLayout="split"
-      useInvertedBackground={false}
+      useInvertedBackground={true}
       features={[
-        {
+        { title: "Nocturnal Elegance", description: "A charcoal-hued lounge designed for intimate encounters and elite relaxation.", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-light-lamp-bulb-decoration-interior-room_74190-7930.jpg" },
-          title: "Intimate Lounge",
+        { title: "Cinematic Lighting", description: "Subtle golden accents dance against deep navy textures, creating a timeless atmosphere.", imageSrc: "http://img.b2bpic.net/free-photo/view-futuristic-light-lamp-design_23-2151037676.jpg" },
-          description: "Perfect for meaningful conversations in a sophisticated dark-mode setting.",
-          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-light-lamp-bulb-decoration-interior-room_74190-7930.jpg",
-        },
-        {
-          title: "Cinematic Lighting",
-          description: "Curated warmth and gold accents that transform the space into a nocturnal sanctuary.",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-woman-sitting-chair-inside-cafe_1303-19191.jpg",
-        },
-        {
-          title: "Private Chambers",
-          description: "Exclusivity guaranteed in our private glass-enclosed seating areas.",
-          imageSrc: "http://img.b2bpic.net/free-photo/view-futuristic-light-lamp-design_23-2151037676.jpg",
-        },
       ]}
       title="Luxury Atmosphere"
-      description="Where cinematic lighting meets classic refinement. Designed for those who appreciate the finer things."
+      description="Step into a realm where cinematic design meets the art of drinking. Every detail is curated for a modern, sophisticated experience."
     />
   </div>
 
   <div id="faq" data-section="faq">
       <FaqDouble
       textboxLayout="default"
-      useInvertedBackground={false}
+      useInvertedBackground={true}
-      title="Frequently Asked Questions"
+      title="Refinement Details"
-      description="Your guide to an elevated experience at The Vault."
+      description="Essential information for your visit to The Vault."
-      faqsAnimation="slide-up"
+      faqsAnimation="blur-reveal"
       faqs={[
-        {
+        { id: "q1", title: "What is the dress code?", content: "Refined elegance is encouraged to match our sophisticated setting." },
-          id: "f1",
+        { id: "q2", title: "Are reservations necessary?", content: "For private chambers, reservations are highly recommended to secure your space." },
-          title: "Is there a dress code?",
-          content: "We maintain an upscale smart-casual atmosphere to match our environment.",
-        },
-        {
-          id: "f2",
-          title: "Do you accept walk-ins?",
-          content: "We prioritize reservations but welcome guests at the bar based on availability.",
-        },
-        {
-          id: "f3",
-          title: "Are private events available?",
-          content: "Yes, our private chambers can be booked for exclusive events and gatherings.",
-        },
-        {
-          id: "f4",
-          title: "Do you offer food?",
-          content: "We curate a selection of artisanal pairings specifically designed to complement our craft beer.",
-        },
-        {
-          id: "f5",
-          title: "What are your hours?",
-          content: "We welcome guests nightly from 6 PM until late, ensuring a premium evening experience.",
-        },
       ]}
     />
   </div>
 
   <div id="reservations" data-section="reservations">
       <ContactCenter
-      useInvertedBackground={false}
+      useInvertedBackground={true}
       background={{
-        variant: "radial-gradient",
+        variant: "gradient-bars"}}
-      }}
+      tag="Access"
-      tag="Booking"
       title="Private Reservations"
-      description="Secure your table in our exclusive lounge for an evening of unmatched luxury and refined craft beer."
+      description="Secure your place in the most exclusive lounge in the city. Book your private chamber experience."
-      buttonText="Request Access"
+      buttonText="Reserve"
     />
   </div>
 
   <div id="footer" data-section="footer">
       <FooterSimple
       columns={[
-        {
+        { title: "Explore", items: [{ label: "Exclusive Brews", href: "#brews" }, { label: "Atmosphere", href: "#atmosphere" }] },
-          title: "Navigation",
+        { title: "Services", items: [{ label: "Private Reservations", href: "#reservations" }, { label: "Event Hosting", href: "#" }] },
-          items: [
-            {
-              label: "Brews",
-              href: "#brews",
-            },
-            {
-              label: "Atmosphere",
-              href: "#atmosphere",
-            },
-            {
-              label: "Reservations",
-              href: "#reservations",
-            },
-          ],
-        },
-        {
-          title: "Contact",
-          items: [
-            {
-              label: "Private Events",
-              href: "#",
-            },
-            {
-              label: "Careers",
-              href: "#",
-            },
-          ],
-        },
-        {
-          title: "Legal",
-          items: [
-            {
-              label: "Privacy Policy",
-              href: "#",
-            },
-            {
-              label: "Terms of Service",
-              href: "#",
-            },
-          ],
-        },
       ]}
-      bottomLeftText="© 2024 The Vault Luxury Pub."
+      bottomLeftText="© 2024 The Vault. All Rights Reserved."
-      bottomRightText="Crafted for the elite."
+      bottomRightText="Excellence in every pour."
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}