Update src/app/page.tsx

Merge version_2 into main

src/app/page.tsx

@@ -4,7 +4,6 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import ContactCTA from '@/components/sections/contact/ContactCTA';
 import FaqBase from '@/components/sections/faq/FaqBase';
-import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
 import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
 import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
 import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
@@ -12,6 +11,7 @@ import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarS
 import ProductCardThree from '@/components/sections/product/ProductCardThree';
 import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
 import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
+import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
 
 export default function LandingPage() {
   return (
@@ -31,16 +31,11 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarStyleCentered
       navItems={[
-        {
-          name: "Home",          id: "hero"},
-        {
-          name: "About",          id: "about"},
-        {
-          name: "Events",          id: "events"},
-        {
-          name: "Pricing",          id: "pricing"},
-        {
-          name: "Contact",          id: "contact"},
+        { name: "Home", id: "hero" },
+        { name: "Table Booking", id: "pricing" },
+        { name: "Events", id: "events" },
+        { name: "Gallery", id: "features" },
+        { name: "Contact", id: "contact" },
       ]}
       brandName="Trend"
     />
@@ -49,90 +44,66 @@ export default function LandingPage() {
   <div id="hero" data-section="hero">
       <HeroBillboardTestimonial
       useInvertedBackground={true}
-      background={{
-        variant: "gradient-bars"}}
+      background={{ variant: "gradient-bars" }}
       title="Trend Amman: Where the City Comes Alive"
       description="Experience the heartbeat of Amman nightlife. Premium service, world-class beats, and an unforgettable vibe awaits you at Trend."
-      testimonials={[
-        {
-          name: "Layla",          handle: "@layla_amman",          testimonial: "The best club in Amman. The vibe is always unmatched!",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/glamorous-girl-posing-while-resting-modern-cafe_158595-4350.jpg"},
-        {
-          name: "Omar",          handle: "@omar_jordan",          testimonial: "Excellent service and world-class sound. Definitely a trendsetter.",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/young-friends-with-sparklers-night-beach_23-2147645596.jpg"},
-        {
-          name: "Sara",          handle: "@sara_night",          testimonial: "Every weekend here is an event to remember.",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/techno-party-lifestyle_52683-122056.jpg"},
-        {
-          name: "Karim",          handle: "@k_night",          testimonial: "Professional staff and a stunning venue.",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/interested-young-woman-yellow-pants-sitting-street-outdoor-photo-winsome-brunette-girl-posing-bench_197531-9426.jpg"},
-        {
-          name: "Nadine",          handle: "@nadine_trend",          testimonial: "Always high energy. My favorite spot in Amman.",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman_1303-17561.jpg"},
-      ]}
+      testimonials={[]}
       buttons={[
-        {
-          text: "Reserve Now",          href: "#contact"},
+        { text: "Book Your Table", href: "#pricing" },
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/bowling-alley-neon-lights_23-2151697017.jpg"
       mediaAnimation="slide-up"
-      avatars={[
+    />
+  </div>
+
+  <div id="pricing" data-section="pricing">
+      <PricingCardEight
+      animationType="slide-up"
+      textboxLayout="default"
+      useInvertedBackground={true}
+      title="Table Booking"
+      description="Secure your exclusive spot at Amman's premier destination. Choose your preferred zone below."
+      plans={[
         {
-          src: "http://img.b2bpic.net/free-photo/photorealistic-wedding-venue-with-intricate-decor-ornaments_23-2151481522.jpg",          alt: "Guest 1"},
+          id: "p1", badge: "VIP Lounge", price: "Limited", subtitle: "Prime View", features: ["Bottle Service", "Dedicated Server", "Best Sound"],
+          buttons: [{ text: "Book Table", href: "#contact" }]
+        },
         {
-          src: "http://img.b2bpic.net/free-photo/cosmic-background-with-colorful-geometric-laser-lights_181624-26247.jpg",          alt: "Guest 2"},
+          id: "p2", badge: "Dance Floor", price: "Available", subtitle: "Stay Close", features: ["Immediate Access", "Near Deejay", "High Energy"],
+          buttons: [{ text: "Book Table", href: "#contact" }]
+        },
         {
-          src: "http://img.b2bpic.net/free-photo/closeup-shot-purple-neon-lights-forming-triangular-shapes-perspective_181624-56899.jpg",          alt: "Guest 3"},
-        {
-          src: "http://img.b2bpic.net/free-photo/unfocused-entry-disco-colors_1208-250.jpg",          alt: "Guest 4"},
-        {
-          src: "http://img.b2bpic.net/free-photo/black-boy-posing-with-headphones_23-2148171778.jpg",          alt: "Guest 5"},
+          id: "p3", badge: "Bar Side", price: "Open", subtitle: "Quick Access", features: ["Bar Proximity", "Cocktail Specials", "Flexible Seating"],
+          buttons: [{ text: "Book Table", href: "#contact" }]
+        }
       ]}
-      marqueeItems={[
-        {
-          type: "text",          text: "Premium Nightlife"},
-        {
-          type: "text",          text: "VIP Service"},
-        {
-          type: "text",          text: "Amman's Best"},
-        {
-          type: "text",          text: "Exclusive Beats"},
-        {
-          type: "text",          text: "Trend Setting"},
+      />
+  </div>
+
+  <div id="features" data-section="features">
+      <FeatureCardThree
+      animationType="slide-up"
+      textboxLayout="split"
+      useInvertedBackground={false}
+      gridVariant="bento-grid"
+      title="Gallery of Past Events"
+      description="Relive the energy from our past nights and see why Trend remains Amman's favorite nightclub."
+      features={[
+        { title: "Grand Opening", description: "The night the city stopped.", imageSrc: "http://img.b2bpic.net/free-photo/techno-party-lifestyle_52683-122056.jpg" },
+        { title: "Summer Showcase", description: "Unforgettable beats under the stars.", imageSrc: "http://img.b2bpic.net/free-photo/group-friends-celebrating-new-year-s-eve-home_23-2148741470.jpg" },
+        { title: "Signature Fridays", description: "High energy service and sound.", imageSrc: "http://img.b2bpic.net/free-photo/front-view-male-bartender-making-drink-working-with-shakers-white-wall-night-bar-alcohol-club-drink-job_140725-121905.jpg?_wi=1" },
+        { title: "VIP Nights", description: "Privacy and luxury redefined.", imageSrc: "http://img.b2bpic.net/free-photo/unfocused-entry-disco-colors_1208-243.jpg" }
       ]}
     />
   </div>
 
   <div id="about" data-section="about">
       <TextSplitAbout
-      useInvertedBackground={false}
+      useInvertedBackground={true}
       title="A New Chapter in Nightlife"
       description={[
-        "Trend is more than just a club; it’s an experience. Nestled in the heart of Amman, we combine luxury with music to create an atmosphere that resonates with every guest.",        "Our venue features state-of-the-art sound systems, bespoke interiors, and unmatched service to ensure every night is an event to remember."]}
-    />
-  </div>
-
-  <div id="features" data-section="features">
-      <FeatureCardTwentyFour
-      animationType="slide-up"
-      textboxLayout="split"
-      useInvertedBackground={true}
-      features={[
-        {
-          id: "f1",          title: "Artisan Cocktails",          author: "Mixology Team",          description: "Handcrafted drinks served with flare.",          tags: [
-            "Drinks",            "Service"],
-          imageSrc: "http://img.b2bpic.net/free-photo/romantic-couple-city-night-taking-selfie_23-2149215119.jpg"},
-        {
-          id: "f2",          title: "World-Class Sound",          author: "Sound Team",          description: "Immersive soundscapes for the best beats.",          tags: [
-            "Audio",            "Vibe"],
-          imageSrc: "http://img.b2bpic.net/free-photo/rainbow-abstract-background-with-neon-led-light_53876-103802.jpg"},
-        {
-          id: "f3",          title: "VIP Luxury Booths",          author: "Management",          description: "Exclusive areas with premium bottle service.",          tags: [
-            "VIP",            "Privacy"],
-          imageSrc: "http://img.b2bpic.net/free-photo/unfocused-entry-disco-colors_1208-243.jpg"},
-      ]}
-      title="Unmatched Nightclub Experiences"
-      description="Discover what makes Trend the ultimate destination for your night out."
+        "Trend is more than just a club; it’s an experience. Nestled in the heart of Amman, we combine luxury with music to create an atmosphere that resonates with every guest.", 
+        "Our venue features state-of-the-art sound systems, bespoke interiors, and unmatched service to ensure every night is an event to remember."]}
     />
   </div>
 
@@ -143,60 +114,24 @@ export default function LandingPage() {
       gridVariant="uniform-all-items-equal"
       useInvertedBackground={false}
       products={[
-        {
-          id: "e1",          name: "Trend Fridays",          price: "VIP Access",          imageSrc: "http://img.b2bpic.net/free-photo/front-view-male-bartender-making-drink-working-with-shakers-white-wall-night-bar-alcohol-club-drink-job_140725-121905.jpg"},
-        {
-          id: "e2",          name: "Neon Saturdays",          price: "Limited",          imageSrc: "http://img.b2bpic.net/free-photo/cosmic-background-with-blue-red-laser-lights-perfect-digital-background_181624-32643.jpg"},
-        {
-          id: "e3",          name: "Signature Nights",          price: "Reserve",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-rich-woman-indoors-with-book_23-2149548502.jpg"},
-        {
-          id: "e4",          name: "Deep Beats Session",          price: "VIP",          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-optical-fiber-detail_23-2149182520.jpg"},
-        {
-          id: "e5",          name: "Grand Gala",          price: "RSVP Only",          imageSrc: "http://img.b2bpic.net/free-photo/man-preparing-cocktails_23-2148454466.jpg"},
-        {
-          id: "e6",          name: "Summer Showcase",          price: "Tickets",          imageSrc: "http://img.b2bpic.net/free-photo/group-friends-celebrating-new-year-s-eve-home_23-2148741470.jpg"},
+        { id: "e1", name: "Trend Fridays", price: "VIP Access", imageSrc: "http://img.b2bpic.net/free-photo/front-view-male-bartender-making-drink-working-with-shakers-white-wall-night-bar-alcohol-club-drink-job_140725-121905.jpg?_wi=2" },
+        { id: "e2", name: "Neon Saturdays", price: "Limited", imageSrc: "http://img.b2bpic.net/free-photo/cosmic-background-with-blue-red-laser-lights-perfect-digital-background_181624-32643.jpg" },
+        { id: "e3", name: "Signature Nights", price: "Reserve", imageSrc: "http://img.b2bpic.net/free-photo/portrait-rich-woman-indoors-with-book_23-2149548502.jpg" },
       ]}
       title="Upcoming Nights"
       description="Join our upcoming exclusive events."
     />
   </div>
 
-  <div id="pricing" data-section="pricing">
-      <PricingCardEight
-      animationType="slide-up"
-      textboxLayout="default"
-      useInvertedBackground={true}
-      title="Table Availability & Booking"
-      description="Select your preferred area and reserve your space for the night."
-      plans={[
-        {
-          id: "p1",          badge: "VIP Lounge",          price: "Limited",          subtitle: "Prime View",          features: ["Bottle Service", "Dedicated Server", "Best Sound"],
-          buttons: [{ text: "Book Table", href: "#contact" }]
-        },
-        {
-          id: "p2",          badge: "Dance Floor",          price: "Available",          subtitle: "Stay Close",          features: ["Immediate Access", "Near Deejay", "High Energy"],
-          buttons: [{ text: "Book Table", href: "#contact" }]
-        },
-        {
-          id: "p3",          badge: "Bar Side",          price: "Open",          subtitle: "Quick Access",          features: ["Bar Proximity", "Cocktail Specials", "Flexible Seating"],
-          buttons: [{ text: "Book Table", href: "#contact" }]
-        }
-      ]}
-      />
-  </div>
-
   <div id="metrics" data-section="metrics">
       <MetricCardFourteen
       useInvertedBackground={true}
       title="Trend by the Numbers"
       tag="Our Impact"
       metrics={[
-        {
-          id: "m1",          value: "500+",          description: "Happy Guests Monthly"},
-        {
-          id: "m2",          value: "12",          description: "Expert Bartenders"},
-        {
-          id: "m3",          value: "24/7",          description: "Passion for Quality"},
+        { id: "m1", value: "500+", description: "Happy Guests Monthly" },
+        { id: "m2", value: "12", description: "Expert Bartenders" },
+        { id: "m3", value: "24/7", description: "Passion for Quality" },
       ]}
       metricsAnimation="slide-up"
     />
@@ -207,12 +142,9 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={false}
       faqs={[
-        {
-          id: "q1",          title: "Do I need a reservation?",          content: "Yes, we highly recommend reservations for VIP areas and peak hours."},
-        {
-          id: "q2",          title: "What is the dress code?",          content: "Smart casual or formal—dress to impress."},
-        {
-          id: "q3",          title: "Where are you located?",          content: "We are located in the vibrant district of Amman, Jordan."},
+        { id: "q1", title: "Do I need a reservation?", content: "Yes, we highly recommend reservations for VIP areas and peak hours." },
+        { id: "q2", title: "What is the dress code?", content: "Smart casual or formal—dress to impress." },
+        { id: "q3", title: "Where are you located?", content: "We are located in the vibrant district of Amman, Jordan." },
       ]}
       title="Got Questions?"
       description="Find everything you need to know."
@@ -223,14 +155,12 @@ export default function LandingPage() {
   <div id="contact" data-section="contact">
       <ContactCTA
       useInvertedBackground={true}
-      background={{
-        variant: "sparkles-gradient"}}
+      background={{ variant: "sparkles-gradient" }}
       tag="Reservations"
       title="Book Your Spot Today"
       description="Join the Trend and secure your table at Amman's hottest nightclub destination."
       buttons={[
-        {
-          text: "Call to Reserve",          href: "tel:+962777777777"},
+        { text: "Call to Reserve", href: "tel:+962777777777" },
       ]}
     />
   </div>
@@ -238,32 +168,9 @@ export default function LandingPage() {
   <div id="footer" data-section="footer">
       <FooterLogoEmphasis
       columns={[
-        {
-          items: [
-            {
-              label: "About Us",              href: "#about"},
-            {
-              label: "Upcoming Events",              href: "#events"},
-            {
-              label: "Pricing",              href: "#pricing"},
-          ],
-        },
-        {
-          items: [
-            {
-              label: "Instagram",              href: "#"},
-            {
-              label: "WhatsApp",              href: "#"},
-          ],
-        },
-        {
-          items: [
-            {
-              label: "Privacy Policy",              href: "#"},
-            {
-              label: "Terms of Service",              href: "#"},
-          ],
-        },
+        { items: [{ label: "Table Booking", href: "#pricing" }, { label: "Gallery", href: "#features" }, { label: "Events", href: "#events" }] },
+        { items: [{ label: "Instagram", href: "#" }, { label: "WhatsApp", href: "#" }] },
+        { items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] },
       ]}
       logoText="Trend"
     />

src/app/styles/variables.css

@@ -12,13 +12,13 @@
 
   --background: #0a0a0a;
   --card: #1a1a1a;
-  --foreground: #ffffff;
-  --primary-cta: #1f7cff;
+  --foreground: #f5f5f5;
+  --primary-cta: #ffdf7d;
   --primary-cta-text: #ffffff;
-  --secondary-cta: #010101;
+  --secondary-cta: #1a1a1a;
   --secondary-cta-text: #ffffff;
-  --accent: #1f7cff;
-  --background-accent: #f96b2f;
+  --accent: #b8860b;
+  --background-accent: #8b6914;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);