From 066f6a63c9d1caf9613fa97b04ff25e92ad50604 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Tue, 12 May 2026 18:51:20 +0000
Subject: [PATCH] Update src/app/page.tsx

---
 src/app/page.tsx | 388 +++++++++++++----------------------------------
 1 file changed, 108 insertions(+), 280 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 6764fee..0b0de03 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -28,294 +28,122 @@ export default function LandingPage() {
         headingFontWeight="semibold"
     >
       <ReactLenis root>
-  <div id="nav" data-section="nav">
-      <NavbarStyleApple
-      navItems={[
-        {
-          name: "Home",
-          id: "hero",
-        },
-        {
-          name: "About",
-          id: "about",
-        },
-        {
-          name: "Services",
-          id: "pricing",
-        },
-        {
-          name: "Gallery",
-          id: "gallery",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
-      ]}
-      brandName="Trejo Cutzzz"
-    />
-  </div>
+        <div id="nav" data-section="nav">
+            <NavbarStyleApple
+              navItems={[
+                { name: "Home", id: "hero" },
+                { name: "About", id: "about" },
+                { name: "Pricing", id: "pricing" },
+                { name: "Gallery", id: "gallery" },
+                { name: "Contact", id: "contact" }
+              ]}
+              brandName="Trejo Cutzzz"
+            />
+        </div>
 
-  <div id="hero" data-section="hero">
-      <HeroOverlay
-      title="Trust the Process. Stay Fresh."
-      description="Just starting out as a barber and building my craft. Book a cut and grow with me."
-      buttons={[
-        {
-          text: "Book Your Cut",
-          href: "#contact",
-        },
-      ]}
-      imageSrc="http://img.b2bpic.net/free-photo/composition-shaving-objects-with-copyspace_23-2148122058.jpg?_wi=1"
-      avatars={[
-        {
-          src: "http://img.b2bpic.net/free-photo/portrait-male-customer-with-beard_23-2147839828.jpg",
-          alt: "Portrait of a male customer with beard",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/crop-barber-shaving-hair-unrecognizable-man_23-2147778749.jpg",
-          alt: "Crop barber shaving hair of unrecognizable man",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/brown-vintage-leather-chair-stylish-barber-shop_627829-6180.jpg",
-          alt: "Brown vintage leather chair at stylish barber shop",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/professional-barber-shop-chairs-close-up_23-2148353478.jpg",
-          alt: "Professional barber shop chairs close-up",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/close-up-view-barbershop-concept_23-2148506210.jpg",
-          alt: "Close-up view of barbershop concept",
-        },
-      ]}
-    />
-  </div>
+        <div id="hero" data-section="hero">
+          <HeroOverlay
+            title="Trust the Process. Stay Fresh."
+            description="Just starting out as a barber and building my craft. Book a cut and grow with me."
+            buttons={[{ text: "Book Your Cut", href: "#contact" }]}
+            imageSrc="http://img.b2bpic.net/free-photo/composition-shaving-objects-with-copyspace_23-2148122058.jpg"
+            avatars={[
+              { src: "http://img.b2bpic.net/free-photo/portrait-male-customer-with-beard_23-2147839828.jpg", alt: "Portrait of a male customer with beard" },
+              { src: "http://img.b2bpic.net/free-photo/crop-barber-shaving-hair-unrecognizable-man_23-2147778749.jpg", alt: "Crop barber shaving hair of unrecognizable man" },
+              { src: "http://img.b2bpic.net/free-photo/brown-vintage-leather-chair-stylish-barber-shop_627829-6180.jpg", alt: "Brown vintage leather chair at stylish barber shop" },
+              { src: "http://img.b2bpic.net/free-photo/professional-barber-shop-chairs-close-up_23-2148353478.jpg", alt: "Professional barber shop chairs close-up" },
+              { src: "http://img.b2bpic.net/free-photo/close-up-view-barbershop-concept_23-2148506210.jpg", alt: "Close-up view of barbershop concept" }
+            ]}
+          />
+        </div>
 
-  <div id="about" data-section="about">
-      <MediaAbout
-      useInvertedBackground={false}
-      title="About Trejo"
-      description="I’m Trejo, a beginner barber working to get better with every cut. My goal is clean work, sharp lines, and great customer energy."
-      imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DdVBOoka88wUKYwZ9x3OdzZTLv/uploaded-1778611830411-rkvswulw.jpg?_wi=1"
-    />
-  </div>
+        <div id="about" data-section="about">
+          <MediaAbout
+            useInvertedBackground={false}
+            title="About Trejo"
+            description="I’m Trejo, a beginner barber working to get better with every cut. My goal is clean work, sharp lines, and great customer energy."
+            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DdVBOoka88wUKYwZ9x3OdzZTLv/uploaded-1778611830411-rkvswulw.jpg"
+          />
+        </div>
 
-  <div id="pricing" data-section="pricing">
-      <PricingCardTwo
-      animationType="slide-up"
-      textboxLayout="split"
-      useInvertedBackground={true}
-      plans={[
-        {
-          id: "fade",
-          badge: "Popular",
-          price: "$15",
-          subtitle: "Fade cut",
-          features: [
-            "Classic fade",
-            "Style included",
-          ],
-          buttons: [
-            {
-              text: "Book now",
-              href: "#contact",
-            },
-          ],
-        },
-        {
-          id: "lineup",
-          badge: "Basic",
-          price: "$10",
-          subtitle: "Edge-up",
-          features: [
-            "Line-up",
-            "Detailed finish",
-          ],
-          buttons: [
-            {
-              text: "Book now",
-              href: "#contact",
-            },
-          ],
-        },
-        {
-          id: "full",
-          badge: "Premium",
-          price: "$20",
-          subtitle: "Full Cut",
-          features: [
-            "Full cut",
-            "Style included",
-            "Beard trim",
-          ],
-          buttons: [
-            {
-              text: "Book now",
-              href: "#contact",
-            },
-          ],
-        },
-      ]}
-      title="Services & Pricing"
-      description="Prices may change as I level up my skills."
-    />
-  </div>
+        <div id="pricing" data-section="pricing">
+          <PricingCardTwo
+            animationType="slide-up"
+            textboxLayout="split"
+            useInvertedBackground={true}
+            plans={[
+              { id: "fade", badge: "Popular", price: "$15", subtitle: "Fade cut", features: ["Classic fade", "Style included"], buttons: [{ text: "Book now", href: "#contact" }] },
+              { id: "lineup", badge: "Basic", price: "$10", subtitle: "Edge-up", features: ["Line-up", "Detailed finish"], buttons: [{ text: "Book now", href: "#contact" }] },
+              { id: "full", badge: "Premium", price: "$20", subtitle: "Full Cut", features: ["Full cut", "Style included", "Beard trim"], buttons: [{ text: "Book now", href: "#contact" }] }
+            ]}
+            title="Services & Pricing"
+            description="Prices may change as I level up my skills."
+          />
+        </div>
 
-  <div id="gallery" data-section="gallery">
-      <FeatureCardTwentyFive
-      animationType="slide-up"
-      textboxLayout="default"
-      useInvertedBackground={false}
-      features={[
-        {
-          title: "Coming Soon",
-          description: "Work in progress.",
-          icon: Scissors,
-          mediaItems: [
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/scissors-towel-beauty-salon_23-2148181999.jpg",
-            },
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/teenager-girl-shows-fist-white-background-isolated-side-view_169016-55171.jpg",
-            },
-          ],
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DdVBOoka88wUKYwZ9x3OdzZTLv/uploaded-1778611830411-rkvswulw.jpg?_wi=2",
-          imageAlt: "barber haircut sharp lines",
-        },
-        {
-          title: "Coming Soon",
-          description: "Stay tuned for updates.",
-          icon: Zap,
-          mediaItems: [
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/man-doing-his-face-care-routine_23-2149288069.jpg",
-            },
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/set-razors-table_23-2147736987.jpg",
-            },
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/composition-shaving-objects-with-copyspace_23-2148122058.jpg?_wi=2",
-          imageAlt: "barber haircut sharp lines",
-        },
-        {
-          title: "Coming Soon",
-          description: "More styles coming.",
-          icon: Star,
-          mediaItems: [
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/process-creating-stand-up-comedy_23-2151058815.jpg",
-            },
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/male-hipster-hairdresser-working-with-beard-senior-client_23-2148181893.jpg",
-            },
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/smart-pensive-redhead-hipster-with-full-beard-glasses-dressed-casual-clothes-poses-with-hand-chin-studio-isolated-dark-background_613910-4679.jpg",
-          imageAlt: "barber haircut sharp lines",
-        },
-      ]}
-      title="Portfolio"
-      description="New portfolio loading… check back as I post my latest cuts."
-    />
-  </div>
+        <div id="gallery" data-section="gallery">
+          <FeatureCardTwentyFive
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            features={[
+              { title: "Coming Soon", description: "Work in progress.", icon: Scissors, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/scissors-towel-beauty-salon_23-2148181999.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/teenager-girl-shows-fist-white-background-isolated-side-view_169016-55171.jpg" }] },
+              { title: "Coming Soon", description: "Stay tuned for updates.", icon: Zap, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/man-doing-his-face-care-routine_23-2149288069.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/set-razors-table_23-2147736987.jpg" }] },
+              { title: "Coming Soon", description: "More styles coming.", icon: Star, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/process-creating-stand-up-comedy_23-2151058815.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/male-hipster-hairdresser-working-with-beard-senior-client_23-2148181893.jpg" }] }
+            ]}
+            title="Portfolio"
+            description="New portfolio loading… check back as I post my latest cuts."
+          />
+        </div>
 
-  <div id="social" data-section="social">
-      <SocialProofOne
-      textboxLayout="default"
-      useInvertedBackground={false}
-      names={[
-        "@trejo_cutz",
-        "Bookings open",
-        "Fresh cuts",
-        "Daily updates",
-        "Clean lines",
-        "Skill growth",
-        "Customer energy",
-      ]}
-      title="Connect"
-      description="Follow my journey on Instagram."
-    />
-  </div>
+        <div id="social" data-section="social">
+          <SocialProofOne
+            textboxLayout="default"
+            useInvertedBackground={false}
+            names={"@trejo_cutz,Bookings open,Fresh cuts,Daily updates,Clean lines,Skill growth,Customer energy".split(",")}
+            title="Connect"
+            description="Follow my journey on Instagram."
+          />
+        </div>
 
-  <div id="faq" data-section="faq">
-      <FaqSplitMedia
-      textboxLayout="default"
-      useInvertedBackground={true}
-      faqs={[
-        {
-          id: "1",
-          title: "Pricing?",
-          content: "Prices start at $10.",
-        },
-        {
-          id: "2",
-          title: "Booking?",
-          content: "Use the contact form.",
-        },
-        {
-          id: "3",
-          title: "Skill level?",
-          content: "I am a learner committed to excellence.",
-        },
-      ]}
-      mediaAnimation="slide-up"
-      title="FAQ"
-      description="Common questions about my services."
-      faqsAnimation="slide-up"
-      imageSrc="http://img.b2bpic.net/free-photo/handsome-hipster-bearded-male-sitting-armchair-barber-shop-while-hairdresser-shaves-his-beard-with-dangerous-razor_613910-18507.jpg"
-    />
-  </div>
+        <div id="faq" data-section="faq">
+          <FaqSplitMedia
+            textboxLayout="default"
+            useInvertedBackground={true}
+            faqs={[
+              { id: "1", title: "Pricing?", content: "Prices start at $10." },
+              { id: "2", title: "Booking?", content: "Use the contact form." },
+              { id: "3", title: "Skill level?", content: "I am a learner committed to excellence." }
+            ]}
+            mediaAnimation="slide-up"
+            title="FAQ"
+            description="Common questions about my services."
+            faqsAnimation="slide-up"
+            imageSrc="http://img.b2bpic.net/free-photo/handsome-hipster-bearded-male-sitting-armchair-barber-shop-while-hairdresser-shaves-his-beard-with-dangerous-razor_613910-18507.jpg"
+          />
+        </div>
 
-  <div id="contact" data-section="contact">
-      <ContactSplitForm
-      useInvertedBackground={true}
-      title="Book Your Cut"
-      description="I’m still growing, so thanks for trusting me!"
-      inputs={[
-        {
-          name: "name",
-          type: "text",
-          placeholder: "Your Name",
-          required: true,
-        },
-        {
-          name: "email",
-          type: "email",
-          placeholder: "Email/Instagram Handle",
-          required: true,
-        },
-      ]}
-      textarea={{
-        name: "style",
-        placeholder: "Style you want (Fade, Taper, etc.)",
-        rows: 4,
-        required: true,
-      }}
-      imageSrc="http://img.b2bpic.net/free-photo/master-hairdresser-prepares-face-shaving-smears-face-with-foam-hairdressing-salon_613910-18406.jpg"
-    />
-  </div>
+        <div id="contact" data-section="contact">
+          <ContactSplitForm
+            useInvertedBackground={true}
+            title="Book Your Cut"
+            description="I’m still growing, so thanks for trusting me!"
+            inputs={[
+              { name: "name", type: "text", placeholder: "Your Name", required: true },
+              { name: "email", type: "email", placeholder: "Email/Instagram Handle", required: true }
+            ]}
+            textarea={{ name: "style", placeholder: "Style you want (Fade, Taper, etc.)", rows: 4, required: true }}
+            imageSrc="http://img.b2bpic.net/free-photo/master-hairdresser-prepares-face-shaving-smears-face-with-foam-hairdressing-salon_613910-18406.jpg"
+          />
+        </div>
 
-  <div id="footer" data-section="footer">
-      <FooterSimple
-      columns={[
-        {
-          title: "Links",
-          items: [
-            {
-              label: "Instagram",
-              href: "https://instagram.com",
-            },
-            {
-              label: "Booking",
-              href: "#contact",
-            },
-          ],
-        },
-      ]}
-      bottomLeftText="© 2024 Trejo Cutzzz"
-      bottomRightText="Built for growth"
-    />
-  </div>
+        <div id="footer" data-section="footer">
+          <FooterSimple
+            columns={[{ title: "Links", items: [{ label: "Instagram", href: "https://instagram.com" }, { label: "Booking", href: "#contact" }] }]}
+            bottomLeftText="© 2024 Trejo Cutzzz"
+            bottomRightText="Built for growth"
+          />
+        </div>
       </ReactLenis>
     </ThemeProvider>
   );
-- 
2.49.1