Update src/app/page.tsx

Merge version_1 into main

src/app/page.tsx

@@ -2,9 +2,9 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactSplit from '@/components/sections/contact/ContactSplit';
+import ContactCenter from '@/components/sections/contact/ContactCenter';
 import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
-import FooterBase from '@/components/sections/footer/FooterBase';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
 import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
 import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
 import TeamCardSix from '@/components/sections/team/TeamCardSix';
@@ -30,77 +30,31 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarLayoutFloatingInline
       navItems={[
-        {
-          name: "Home",
-          id: "hero",
-        },
-        {
-          name: "About",
-          id: "about",
-        },
-        {
-          name: "Services",
-          id: "features",
-        },
-        {
-          name: "Team",
-          id: "team",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
+        { name: "Home", id: "hero" },
+        { name: "About", id: "about" },
+        { name: "Services", id: "features" },
+        { name: "Team", id: "team" },
+        { name: "Contact", id: "contact" },
       ]}
       brandName="Affiliate Barbershop"
       button={{
-        text: "Book Now",
-        href: "#contact",
-      }}
+        text: "Book Now",        href: "#contact"}}
     />
   </div>
 
   <div id="hero" data-section="hero">
       <HeroBillboardCarousel
-      background={{
-        variant: "gradient-bars",
-      }}
+      background={{ variant: "gradient-bars" }}
       title="Crafting Excellence at Affiliate"
       description="Premium grooming experiences for the modern gentleman. Elevate your style with our master barbers."
-      buttons={[
-        {
-          text: "Book Appointment",
-          href: "#contact",
-        },
-        {
-          text: "Our Services",
-          href: "#features",
-        },
-      ]}
+      buttons={[{ text: "Book Appointment", href: "#contact" }, { text: "Our Services", href: "#features" }]}
       mediaItems={[
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/male-hairdresser-combing-hair-senior-client_23-2148181882.jpg?_wi=1",
-          imageAlt: "Barbershop interior",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/man-hair-salon-facing-camera_23-2148242763.jpg",
-          imageAlt: "Professional grooming",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-getting-haircut_23-2149220553.jpg",
-          imageAlt: "Modern salon",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-is-trimming-man-s-hair_8353-11416.jpg",
-          imageAlt: "Straight razor shave",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-putting-face-client-towel_23-2147737012.jpg",
-          imageAlt: "Tools of the trade",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-hairdresser-s-hand-holding-shaving-brush_23-2147839824.jpg?_wi=1",
-          imageAlt: "Grooming detail",
-        },
+        { imageSrc: "http://img.b2bpic.net/free-photo/male-hairdresser-combing-hair-senior-client_23-2148181882.jpg?_wi=1", imageAlt: "Barbershop interior" },
+        { imageSrc: "http://img.b2bpic.net/free-photo/man-hair-salon-facing-camera_23-2148242763.jpg", imageAlt: "Professional grooming" },
+        { imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-getting-haircut_23-2149220553.jpg", imageAlt: "Modern salon" },
+        { imageSrc: "http://img.b2bpic.net/free-photo/woman-is-trimming-man-s-hair_8353-11416.jpg", imageAlt: "Straight razor shave" },
+        { imageSrc: "http://img.b2bpic.net/free-photo/woman-putting-face-client-towel_23-2147737012.jpg", imageAlt: "Tools of the trade" },
+        { imageSrc: "http://img.b2bpic.net/free-photo/close-up-hairdresser-s-hand-holding-shaving-brush_23-2147839824.jpg?_wi=1", imageAlt: "Grooming detail" },
       ]}
     />
   </div>
@@ -125,64 +79,12 @@ export default function LandingPage() {
       textboxLayout="split"
       useInvertedBackground={false}
       features={[
-        {
-          id: "f1",
-          title: "Signature Haircut",
-          author: "Tailored to you",
-          description: "Precision haircut, wash, and style consultation to match your features and lifestyle perfectly.",
-          tags: [
-            "Styling",
-            "Essentials",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/anonymous-woman-trimming-beard-man_23-2147778907.jpg",
-        },
-        {
-          id: "f2",
-          title: "Traditional Hot Shave",
-          author: "Relax and refresh",
-          description: "Experience the classic art of the straight-razor shave with premium hot towels and soothing balm.",
-          tags: [
-            "Shave",
-            "Relax",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/synthetic-shaving-brush-foam-razor-white-folded-napkin-wooden-desk_23-2148088539.jpg",
-        },
-        {
-          id: "f3",
-          title: "Beard Sculpting",
-          author: "Sharp definitions",
-          description: "Expert trimming and grooming for beards of all lengths, ensuring clean lines and soft texture.",
-          tags: [
-            "Beard",
-            "Care",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/half-naked-caucasian-bearded-man-shaving-with-serious-face-expression_181624-46966.jpg",
-        },
-        {
-          id: "f4",
-          title: "Scalp Treatment",
-          author: "Revitalizing care",
-          description: "Deep-cleansing scalp treatments designed to promote hair health and provide ultimate relaxation.",
-          tags: [
-            "Care",
-            "Wellness",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-hairdresser-s-hand-holding-shaving-brush_23-2147839824.jpg?_wi=2",
-        },
-        {
-          id: "f5",
-          title: "Grey Blending",
-          author: "Natural look",
-          description: "Subtle, natural-looking grey coverage services tailored for the discerning modern gentleman.",
-          tags: [
-            "Styling",
-            "Ageing",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/male-hairdresser-combing-hair-senior-client_23-2148181882.jpg?_wi=2",
-        },
+        { id: "f1", title: "Signature Haircut", author: "Tailored to you", description: "Precision haircut, wash, and style consultation.", tags: ["Styling", "Essentials"], imageSrc: "http://img.b2bpic.net/free-photo/anonymous-woman-trimming-beard-man_23-2147778907.jpg" },
+        { id: "f2", title: "Traditional Hot Shave", author: "Relax and refresh", description: "Experience the classic art of the straight-razor shave.", tags: ["Shave", "Relax"], imageSrc: "http://img.b2bpic.net/free-photo/synthetic-shaving-brush-foam-razor-white-folded-napkin-wooden-desk_23-2148088539.jpg" },
+        { id: "f3", title: "Beard Sculpting", author: "Sharp definitions", description: "Expert trimming and grooming for all lengths.", tags: ["Beard", "Care"], imageSrc: "http://img.b2bpic.net/free-photo/half-naked-caucasian-bearded-man-shaving-with-serious-face-expression_181624-46966.jpg" }
       ]}
       title="Refined Services"
-      description="From classic cuts to modern styling, our menu is designed to leave you looking and feeling your absolute best."
+      description="Our menu is designed to leave you looking and feeling your absolute best."
     />
   </div>
 
@@ -193,39 +95,12 @@ export default function LandingPage() {
       gridVariant="three-columns-all-equal-width"
       useInvertedBackground={true}
       members={[
-        {
-          id: "t1",
-          name: "Marcus V.",
-          role: "Master Barber",
-          imageSrc: "http://img.b2bpic.net/free-photo/female-hairdresser-cutting-hair-bearded-hipster-male-saloon_613910-5643.jpg?_wi=1",
-        },
-        {
-          id: "t2",
-          name: "Elena R.",
-          role: "Senior Stylist",
-          imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-sexy-handsome-fashion-male-model-man-dressed-elegant-suit-black-studio-lights-background_158538-9664.jpg",
-        },
-        {
-          id: "t3",
-          name: "Julian D.",
-          role: "Grooming Specialist",
-          imageSrc: "http://img.b2bpic.net/free-photo/pleased-young-handsome-barber-wearing-uniform-holding-scissors-isolated-purple-wall_141793-94222.jpg",
-        },
-        {
-          id: "t4",
-          name: "Leo K.",
-          role: "Junior Barber",
-          imageSrc: "http://img.b2bpic.net/free-photo/positive-bearded-black-male-with-tattoo-cross-arms-dressed-white-shirt_613910-15917.jpg",
-        },
-        {
-          id: "t5",
-          name: "Sarah W.",
-          role: "Lead Barber",
-          imageSrc: "http://img.b2bpic.net/free-photo/female-hairdresser-cutting-hair-bearded-hipster-male-saloon_613910-5643.jpg?_wi=2",
-        },
+        { id: "t1", name: "Marcus V.", role: "Master Barber", imageSrc: "http://img.b2bpic.net/free-photo/female-hairdresser-cutting-hair-bearded-hipster-male-saloon_613910-5643.jpg?_wi=1" },
+        { id: "t2", name: "Elena R.", role: "Senior Stylist", imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-sexy-handsome-fashion-male-model-man-dressed-elegant-suit-black-studio-lights-background_158538-9664.jpg" },
+        { id: "t3", name: "Julian D.", role: "Grooming Specialist", imageSrc: "http://img.b2bpic.net/free-photo/pleased-young-handsome-barber-wearing-uniform-holding-scissors-isolated-purple-wall_141793-94222.jpg" }
       ]}
       title="Meet Your Stylists"
-      description="Our team of dedicated professionals brings years of expertise and a passion for grooming."
+      description="Our team of dedicated professionals brings years of expertise."
     />
   </div>
 
@@ -236,102 +111,53 @@ export default function LandingPage() {
       gridVariant="uniform-all-items-equal"
       useInvertedBackground={false}
       testimonials={[
-        {
-          id: "1",
-          name: "James P.",
-          role: "Client",
-          company: "Regular",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/happiness-concept-glad-positive-afro-american-man-with-trendy-hairstyle-poses-naked_273609-8552.jpg",
-        },
-        {
-          id: "2",
-          name: "David L.",
-          role: "Client",
-          company: "Regular",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/man-plaid-shirt-standing-looking-mirror_171337-19878.jpg",
-        },
-        {
-          id: "3",
-          name: "Sam M.",
-          role: "Client",
-          company: "Regular",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-getting-haircut_23-2150665403.jpg",
-        },
-        {
-          id: "4",
-          name: "Robert B.",
-          role: "Client",
-          company: "Regular",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/barber-trimming-beard-client_23-2147778816.jpg",
-        },
-        {
-          id: "5",
-          name: "Kevin J.",
-          role: "Client",
-          company: "Regular",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/reflection-male-client-grooming-his-beard-mirror_23-2147839835.jpg",
-        },
+        { id: "1", name: "James P.", role: "Client", company: "Regular", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happiness-concept-glad-positive-afro-american-man-with-trendy-hairstyle-poses-naked_273609-8552.jpg" },
+        { id: "2", name: "David L.", role: "Client", company: "Regular", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/man-plaid-shirt-standing-looking-mirror_171337-19878.jpg" }
       ]}
       title="Client Experiences"
-      description="Don't just take our word for it—see what our regular clients have to say about their experience."
+      description="See what our regular clients have to say."
     />
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactSplit
-      useInvertedBackground={true}
-      background={{
-        variant: "plain",
-      }}
-      title="Visit Affiliate Today"
-      description="Ready for a transformation? Book your spot and experience the premium standard of grooming."
-      imageSrc="http://img.b2bpic.net/free-photo/young-man-barber-shop-after-getting-haircut_23-2149186513.jpg"
-      mediaAnimation="slide-up"
-      inputPlaceholder="Enter your email for booking updates"
-      buttonText="Book Appointment"
-      tag="Contact Us"
+      <ContactCenter
+      tag="Book Now"
+      title="Ready for a Transformation?"
+      description="Contact us to schedule your next premium grooming session or inquire about services. We are open daily for your convenience."
+      background={{ variant: "gradient-bars" }}
+      useInvertedBackground={false}
+      inputPlaceholder="Enter your email for updates"
+      buttonText="Send Booking Request"
+      termsText="By clicking send, you confirm you're interested in booking an appointment."
+      onSubmit={(email) => console.log("Book request from:", email)}
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterBase
+      <FooterSimple
       columns={[
-        {
-          title: "Contact",
-          items: [
-            {
-              label: "123 Grooming Way",
-              href: "#",
-            },
-            {
-              label: "info@affiliate.com",
-              href: "#",
-            },
-          ],
-        },
-        {
-          title: "Navigation",
-          items: [
-            {
-              label: "Services",
-              href: "#features",
-            },
-            {
-              label: "Team",
-              href: "#team",
-            },
-          ],
+        { 
+            title: "Contact", 
+            items: [ 
+                { label: "123 Grooming Way, City" }, 
+                { label: "info@affiliate.com" },
+                { label: "(555) 123-4567" }
+            ] 
         },
+        { 
+            title: "Business Hours", 
+            items: [ 
+                { label: "Mon-Fri: 9am - 7pm" }, 
+                { label: "Sat: 10am - 5pm" }, 
+                { label: "Sun: By Appointment" } 
+            ] 
+        }
       ]}
-      logoText="Affiliate"
+      bottomLeftText="© 2025 Affiliate Barbershop. All rights reserved."
+      bottomRightText="Designed for Excellence"
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #f5f4ef;
-  --card: #dad6cd;
-  --foreground: #2a2928;
-  --primary-cta: #2a2928;
+  --background: #fbfbfb;
+  --card: #ffffff;
+  --foreground: #0a0a0a;
+  --primary-cta: #15479c;
   --primary-cta-text: #f5f4ef;
-  --secondary-cta: #ecebea;
+  --secondary-cta: #efefef;
   --secondary-cta-text: #2a2928;
-  --accent: #ffffff;
-  --background-accent: #c6b180;
+  --accent: #e5e5e5;
+  --background-accent: #15479c;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);