Update src/app/page.tsx

Merge version_1 into main

src/app/page.tsx

@@ -31,25 +31,15 @@ export default function LandingPage() {
       <NavbarStyleFullscreen
       navItems={[
         {
-          name: "Home",
-          id: "hero",
-        },
+          name: "Home",          id: "hero"},
         {
-          name: "About",
-          id: "about",
-        },
+          name: "About",          id: "about"},
         {
-          name: "Services",
-          id: "services",
-        },
+          name: "Services",          id: "services"},
         {
-          name: "Booking",
-          id: "booking",
-        },
+          name: "Booking",          id: "booking"},
         {
-          name: "Contact",
-          id: "contact",
-        },
+          name: "Contact",          id: "contact"},
       ]}
       brandName="EL KHAL"
     />
@@ -58,108 +48,61 @@ export default function LandingPage() {
   <div id="hero" data-section="hero">
       <HeroSplitTestimonial
       background={{
-        variant: "gradient-bars",
-      }}
+        variant: "gradient-bars"}}
       title="Precision. Style. Confidence."
       description="Premium Barber Experience in Barcelona. EL KHAL delivers modern barbering with precision, style, and attention to detail."
       testimonials={[
         {
-          name: "Marc L.",
-          handle: "@marc_bcn",
-          testimonial: "Best fade I've had in Barcelona. Truly professional.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/black-man-with-beard-looking-away_23-2148203662.jpg?_wi=1",
-          imageAlt: "cinematic barber shop",
-        },
+          name: "Marc L.",          handle: "@marc_bcn",          testimonial: "Best fade I've had in Barcelona. Truly professional.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/black-man-with-beard-looking-away_23-2148203662.jpg?_wi=1",          imageAlt: "cinematic barber shop"},
         {
-          name: "Alex D.",
-          handle: "@alex_d",
-          testimonial: "The attention to detail here is unmatched. Luxury vibes.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/rear-view-male-customer-sitting-armchair-barber-shop_23-2147839805.jpg?_wi=1",
-          imageAlt: "cinematic barber shop",
-        },
+          name: "Alex D.",          handle: "@alex_d",          testimonial: "The attention to detail here is unmatched. Luxury vibes.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/rear-view-male-customer-sitting-armchair-barber-shop_23-2147839805.jpg?_wi=1",          imageAlt: "cinematic barber shop"},
         {
-          name: "Jordi V.",
-          handle: "@jordi_v",
-          testimonial: "Top tier grooming. Highly recommend for a sharp look.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/stylish-man-sitting-barbershop_1157-21678.jpg?_wi=1",
-          imageAlt: "cinematic barber shop",
-        },
+          name: "Jordi V.",          handle: "@jordi_v",          testimonial: "Top tier grooming. Highly recommend for a sharp look.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/stylish-man-sitting-barbershop_1157-21678.jpg?_wi=1",          imageAlt: "cinematic barber shop"},
         {
-          name: "Luca S.",
-          handle: "@luca_s",
-          testimonial: "The atmosphere is incredible. Proper barber culture.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wallpaper-pattern-wooden-background-job-career-concept_53876-143260.jpg?_wi=1",
-          imageAlt: "cinematic barber shop",
-        },
+          name: "Luca S.",          handle: "@luca_s",          testimonial: "The atmosphere is incredible. Proper barber culture.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wallpaper-pattern-wooden-background-job-career-concept_53876-143260.jpg?_wi=1",          imageAlt: "cinematic barber shop"},
         {
-          name: "Sam R.",
-          handle: "@sam_r",
-          testimonial: "Precision work. Won't go anywhere else now.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/barber-using-scissors-make-hairstyle_23-2148298276.jpg?_wi=1",
-          imageAlt: "cinematic barber shop",
-        },
+          name: "Sam R.",          handle: "@sam_r",          testimonial: "Precision work. Won't go anywhere else now.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/barber-using-scissors-make-hairstyle_23-2148298276.jpg?_wi=1",          imageAlt: "cinematic barber shop"},
       ]}
       buttons={[
         {
-          text: "Book Appointment",
-          href: "#booking",
-        },
+          text: "Book Appointment",          href: "#booking"},
         {
-          text: "View Instagram",
-          href: "https://www.instagram.com/barberia_el_khal",
-        },
+          text: "View Instagram",          href: "https://www.instagram.com/barberia_el_khal"},
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/black-man-with-beard-looking-away_23-2148203662.jpg?_wi=2"
       mediaAnimation="blur-reveal"
       avatars={[
         {
-          src: "http://img.b2bpic.net/free-photo/portrait-handsome-confident-stylish-hipster-lambersexual-modelman-dressed-jacket-jeans-fashion-male-posing-near-blue-wall-studio_158538-23689.jpg",
-          alt: "Barber client 1",
-        },
+          src: "http://img.b2bpic.net/free-photo/portrait-handsome-confident-stylish-hipster-lambersexual-modelman-dressed-jacket-jeans-fashion-male-posing-near-blue-wall-studio_158538-23689.jpg",          alt: "Barber client 1"},
         {
-          src: "http://img.b2bpic.net/free-photo/close-up-portrait-man_23-2148323636.jpg",
-          alt: "Barber client 2",
-        },
+          src: "http://img.b2bpic.net/free-photo/close-up-portrait-man_23-2148323636.jpg",          alt: "Barber client 2"},
         {
-          src: "http://img.b2bpic.net/free-photo/lateral-view-man-with-vintage-haircut_23-2148328597.jpg",
-          alt: "Barber client 3",
-        },
+          src: "http://img.b2bpic.net/free-photo/lateral-view-man-with-vintage-haircut_23-2148328597.jpg",          alt: "Barber client 3"},
         {
-          src: "http://img.b2bpic.net/free-photo/portrait-stylish-blond-bearded-male-dressed-suit-grey-background_613910-11879.jpg",
-          alt: "Barber client 4",
-        },
+          src: "http://img.b2bpic.net/free-photo/portrait-stylish-blond-bearded-male-dressed-suit-grey-background_613910-11879.jpg",          alt: "Barber client 4"},
         {
-          src: "http://img.b2bpic.net/free-photo/full-shot-man-sitting-chair_23-2149220561.jpg",
-          alt: "Barber client 5",
-        },
+          src: "http://img.b2bpic.net/free-photo/full-shot-man-sitting-chair_23-2149220561.jpg",          alt: "Barber client 5"},
       ]}
       marqueeItems={[
         {
-          type: "text",
-          text: "PRECISION",
+          type: "image",          src: "http://img.b2bpic.net/free-photo/black-man-with-beard-looking-away_23-2148203662.jpg?_wi=1",          alt: "Instagram feed 1"
         },
         {
-          type: "text",
-          text: "LUXURY",
+          type: "image",          src: "http://img.b2bpic.net/free-photo/stylish-man-sitting-barbershop_1157-21678.jpg?_wi=1",          alt: "Instagram feed 2"
         },
         {
-          type: "text",
-          text: "STYLE",
+          type: "image",          src: "http://img.b2bpic.net/free-photo/barber-using-scissors-make-hairstyle_23-2148298276.jpg?_wi=1",          alt: "Instagram feed 3"
         },
         {
-          type: "text",
-          text: "BARCELONA",
-        },
-        {
-          type: "text",
-          text: "MODERN",
-        },
+          type: "text",          text: "FOLLOW @BARBERIA_EL_KHAL"
+        }
       ]}
+      marqueeSpeed={20}
     />
   </div>
 
@@ -170,17 +113,11 @@ export default function LandingPage() {
       description="EL KHAL combines luxury grooming with Barcelona's urban pulse. Our studio is built for those who value refined details and absolute confidence."
       metrics={[
         {
-          value: "100%",
-          title: "Precision",
-        },
+          value: "100%",          title: "Precision"},
         {
-          value: "5+",
-          title: "Years Experience",
-        },
+          value: "5+",          title: "Years Experience"},
         {
-          value: "10k+",
-          title: "Haircuts",
-        },
+          value: "10k+",          title: "Haircuts"},
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/rear-view-male-customer-sitting-armchair-barber-shop_23-2147839805.jpg?_wi=2"
       mediaAnimation="slide-up"
@@ -195,38 +132,17 @@ export default function LandingPage() {
       useInvertedBackground={false}
       features={[
         {
-          id: "f1",
-          title: "Skin Fade",
-          author: "Precision",
-          description: "Clean, crisp fades with military-grade precision.",
-          tags: [
-            "fade",
-            "grooming",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/stylish-man-sitting-barbershop_1157-21678.jpg?_wi=2",
-        },
+          id: "f1",          title: "Skin Fade",          author: "Precision",          description: "Clean, crisp fades with military-grade precision.",          tags: [
+            "fade",            "grooming"],
+          imageSrc: "http://img.b2bpic.net/free-photo/stylish-man-sitting-barbershop_1157-21678.jpg?_wi=2"},
         {
-          id: "f2",
-          title: "Razor Shave",
-          author: "Classic",
-          description: "The traditional premium shaving experience redefined.",
-          tags: [
-            "shave",
-            "luxury",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wallpaper-pattern-wooden-background-job-career-concept_53876-143260.jpg?_wi=2",
-        },
+          id: "f2",          title: "Razor Shave",          author: "Classic",          description: "The traditional premium shaving experience redefined.",          tags: [
+            "shave",            "luxury"],
+          imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wallpaper-pattern-wooden-background-job-career-concept_53876-143260.jpg?_wi=2"},
         {
-          id: "f3",
-          title: "Hair Styling",
-          author: "Professional",
-          description: "Tailored finishing touches for your personal style.",
-          tags: [
-            "styling",
-            "modern",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/barber-using-scissors-make-hairstyle_23-2148298276.jpg?_wi=2",
-        },
+          id: "f3",          title: "Hair Styling",          author: "Professional",          description: "Tailored finishing touches for your personal style.",          tags: [
+            "styling",            "modern"],
+          imageSrc: "http://img.b2bpic.net/free-photo/barber-using-scissors-make-hairstyle_23-2148298276.jpg?_wi=2"},
       ]}
       title="Our Signature Services"
       description="Premium grooming tailored for the modern man."
@@ -241,26 +157,11 @@ export default function LandingPage() {
       useInvertedBackground={true}
       members={[
         {
-          id: "m1",
-          name: "Khalid",
-          role: "Master Barber",
-          description: "Expert in modern fades and beard shaping.",
-          imageSrc: "http://img.b2bpic.net/free-photo/handsome-stylish-bearded-male-with-tattoo-arm-dressed-flannel-shirt-drinks-coffee-barbershop_613910-14697.jpg",
-        },
+          id: "m1",          name: "Khalid",          role: "Master Barber",          description: "Expert in modern fades and beard shaping.",          imageSrc: "http://img.b2bpic.net/free-photo/handsome-stylish-bearded-male-with-tattoo-arm-dressed-flannel-shirt-drinks-coffee-barbershop_613910-14697.jpg"},
         {
-          id: "m2",
-          name: "Alex",
-          role: "Senior Stylist",
-          description: "Specialist in razor fades and classic cuts.",
-          imageSrc: "http://img.b2bpic.net/free-photo/man-getting-his-hair-trimmed-with-trimmer_107420-94786.jpg",
-        },
+          id: "m2",          name: "Alex",          role: "Senior Stylist",          description: "Specialist in razor fades and classic cuts.",          imageSrc: "http://img.b2bpic.net/free-photo/man-getting-his-hair-trimmed-with-trimmer_107420-94786.jpg"},
         {
-          id: "m3",
-          name: "Javi",
-          role: "Barber",
-          description: "Attention to detail for the modern man.",
-          imageSrc: "http://img.b2bpic.net/free-photo/male-hairdresser-posing-salon_23-2150462487.jpg",
-        },
+          id: "m3",          name: "Javi",          role: "Barber",          description: "Attention to detail for the modern man.",          imageSrc: "http://img.b2bpic.net/free-photo/male-hairdresser-posing-salon_23-2150462487.jpg"},
       ]}
       title="Meet the Artists"
       description="The masters of precision grooming in Barcelona."
@@ -275,45 +176,20 @@ export default function LandingPage() {
       useInvertedBackground={false}
       testimonials={[
         {
-          id: "t1",
-          name: "Marc",
-          role: "Regular",
-          company: "Client",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/crop-barber-styling-beard-customer_23-2147778885.jpg",
-        },
+          id: "t1",          name: "Marc",          role: "Regular",          company: "Client",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/crop-barber-styling-beard-customer_23-2147778885.jpg"},
         {
-          id: "t2",
-          name: "Alex",
-          role: "Regular",
-          company: "Client",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-gray-checkered-suit_158538-4219.jpg",
-        },
+          id: "t2",          name: "Alex",          role: "Regular",          company: "Client",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-gray-checkered-suit_158538-4219.jpg"},
         {
-          id: "t3",
-          name: "Jordi",
-          role: "Regular",
-          company: "Client",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/stylish-blond-bearded-male-dressed-suit-sunglasses_613910-11932.jpg",
-        },
+          id: "t3",          name: "Jordi",          role: "Regular",          company: "Client",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/stylish-blond-bearded-male-dressed-suit-sunglasses_613910-11932.jpg"},
         {
-          id: "t4",
-          name: "Luca",
-          role: "Regular",
-          company: "Client",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-blond-bearded-male-dressed-black-leather-jacket_613910-11927.jpg",
-        },
+          id: "t4",          name: "Luca",          role: "Regular",          company: "Client",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-blond-bearded-male-dressed-black-leather-jacket_613910-11927.jpg"},
         {
-          id: "t5",
-          name: "Sam",
-          role: "Regular",
-          company: "Client",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-selfcare-products_23-2149313037.jpg",
-        },
+          id: "t5",          name: "Sam",          role: "Regular",          company: "Client",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-selfcare-products_23-2149313037.jpg"},
       ]}
       title="What Clients Say"
       description="Authentic experiences from our Barcelona community."
@@ -324,16 +200,13 @@ export default function LandingPage() {
       <ContactCTA
       useInvertedBackground={true}
       background={{
-        variant: "sparkles-gradient",
-      }}
+        variant: "sparkles-gradient"}}
       tag="Booking"
       title="Secure Your Session"
       description="Get in touch via WhatsApp to book your appointment in Barcelona today."
       buttons={[
         {
-          text: "WhatsApp Us",
-          href: "https://wa.me/34674508699",
-        },
+          text: "WhatsApp Us",          href: "https://wa.me/34674508699"},
       ]}
     />
   </div>
@@ -344,20 +217,11 @@ export default function LandingPage() {
       useInvertedBackground={false}
       faqs={[
         {
-          id: "q1",
-          title: "Where are you located?",
-          content: "We are centrally located in the vibrant heart of Barcelona.",
-        },
+          id: "q1",          title: "Where are you located?",          content: "We are centrally located in the vibrant heart of Barcelona."},
         {
-          id: "q2",
-          title: "How can I contact you?",
-          content: "You can reach us at 674508699 or via DM on Instagram.",
-        },
+          id: "q2",          title: "How can I contact you?",          content: "You can reach us at 674508699 or via DM on Instagram."},
         {
-          id: "q3",
-          title: "Are walk-ins welcome?",
-          content: "We prefer bookings but check for availability via WhatsApp.",
-        },
+          id: "q3",          title: "Are walk-ins welcome?",          content: "We prefer bookings but check for availability via WhatsApp."},
       ]}
       title="Location & Details"
       description="Find us in the heart of Barcelona."
@@ -372,42 +236,27 @@ export default function LandingPage() {
       logoText="EL KHAL"
       columns={[
         {
-          title: "Navigation",
-          items: [
+          title: "Navigation",          items: [
             {
-              label: "Home",
-              href: "#hero",
-            },
+              label: "Home",              href: "#hero"},
             {
-              label: "Services",
-              href: "#services",
-            },
+              label: "Services",              href: "#services"},
             {
-              label: "Booking",
-              href: "#booking",
-            },
+              label: "Booking",              href: "#booking"},
           ],
         },
         {
-          title: "Connect",
-          items: [
+          title: "Connect",          items: [
             {
-              label: "Instagram",
-              href: "https://www.instagram.com/barberia_el_khal",
-            },
+              label: "Instagram",              href: "https://www.instagram.com/barberia_el_khal"},
             {
-              label: "WhatsApp",
-              href: "https://wa.me/34674508699",
-            },
+              label: "WhatsApp",              href: "https://wa.me/34674508699"},
           ],
         },
         {
-          title: "Legal",
-          items: [
+          title: "Legal",          items: [
             {
-              label: "Privacy Policy",
-              href: "#",
-            },
+              label: "Privacy Policy",              href: "#"},
           ],
         },
       ]}
@@ -417,4 +266,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}