From c902126d2d874bbda558f5a8d0749dc3c6db9f7c Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Wed, 22 Apr 2026 13:20:11 +0000
Subject: [PATCH] Update src/app/page.tsx

---
 src/app/page.tsx | 491 +++++++++++++++--------------------------------
 1 file changed, 150 insertions(+), 341 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 49f9362..db36645 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -16,358 +16,167 @@ import TextAbout from '@/components/sections/about/TextAbout';
 export default function LandingPage() {
   return (
     <ThemeProvider
-        defaultButtonVariant="bounce-effect"
-        defaultTextAnimation="entrance-slide"
-        borderRadius="soft"
+      defaultButtonVariant="bounce-effect"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="soft"
+      contentWidth="medium"
+      sizing="medium"
+      background="circleGradient"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="normal"
     >
       <ReactLenis root>
-  <div id="nav" data-section="nav">
-      <NavbarStyleFullscreen
-      navItems={[
-        {
-          name: "Home",
-          id: "hero",
-        },
-        {
-          name: "Services",
-          id: "features",
-        },
-        {
-          name: "About",
-          id: "about",
-        },
-        {
-          name: "Pricing",
-          id: "pricing",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
-      ]}
-      brandName="Andrea Barber & Beauty"
-    />
-  </div>
+        <div id="nav" data-section="nav">
+          <NavbarStyleFullscreen
+            navItems={[
+              { name: "Home", id: "hero" },
+              { name: "Services", id: "features" },
+              { name: "About", id: "about" },
+              { name: "Pricing", id: "pricing" },
+              { name: "Contact", id: "contact" },
+            ]}
+            brandName="Andrea Barber & Beauty"
+          />
+        </div>
 
-  <div id="hero" data-section="hero">
-      <HeroSplit
-      background={{
-        variant: "gradient-bars",
-      }}
-      title="Andrea Barber Shop & Estetica"
-      description="Experience professional grooming and beauty treatments in the heart of our studio. Where style meets excellence."
-      buttons={[
-        {
-          text: "Book Now",
-          href: "#contact",
-        },
-      ]}
-      imageSrc="http://img.b2bpic.net/free-photo/barber-cutting-client-s-hair-his-shop_23-2149186530.jpg"
-      imageAlt="barbershop interior modern professional"
-      mediaAnimation="blur-reveal"
-      avatars={[
-        {
-          src: "http://img.b2bpic.net/free-photo/male-barber-sitting-his-shop_23-2149186516.jpg",
-          alt: "Male barber sitting at his shop",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/barber-doing-haircut-bearded-aged-client-hair-salon_23-2148182013.jpg",
-          alt: "Barber doing haircut bearded aged client in hair salon",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/medium-shot-man-getting-his-hair-washed_23-2149220571.jpg",
-          alt: "Medium shot man getting his hair washed",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/full-shot-man-getting-haircut_23-2149220553.jpg",
-          alt: "Full shot man getting haircut",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/cosmetics-palettes-table_23-2147783933.jpg",
-          alt: "Cosmetics palettes on table",
-        },
-      ]}
-      avatarText="Join 500+ satisfied clients"
-      marqueeItems={[
-        {
-          type: "text",
-          text: "Professional Grooming",
-        },
-        {
-          type: "text",
-          text: "Precision Styling",
-        },
-        {
-          type: "text",
-          text: "Premium Skincare",
-        },
-        {
-          type: "text",
-          text: "Hot Towel Shave",
-        },
-        {
-          type: "text",
-          text: "Expert Beauty",
-        },
-      ]}
-    />
-  </div>
+        <div id="hero" data-section="hero">
+          <HeroSplit
+            background={{ variant: "gradient-bars" }}
+            title="Andrea Barber Shop & Estetica"
+            description="Experience professional grooming and beauty treatments in the heart of our studio. Where style meets excellence."
+            buttons={[{ text: "Book Now", href: "#contact" }]}
+            imageSrc="http://img.b2bpic.net/free-photo/barber-cutting-client-s-hair-his-shop_23-2149186530.jpg"
+            imageAlt="barbershop interior modern professional"
+            mediaAnimation="blur-reveal"
+            avatars={[
+              { src: "http://img.b2bpic.net/free-photo/male-barber-sitting-his-shop_23-2149186516.jpg", alt: "Male barber sitting at his shop" },
+              { src: "http://img.b2bpic.net/free-photo/barber-doing-haircut-bearded-aged-client-hair-salon_23-2148182013.jpg", alt: "Barber doing haircut bearded aged client in hair salon" },
+              { src: "http://img.b2bpic.net/free-photo/medium-shot-man-getting-his-hair-washed_23-2149220571.jpg", alt: "Medium shot man getting his hair washed" },
+              { src: "http://img.b2bpic.net/free-photo/full-shot-man-getting-haircut_23-2149220553.jpg", alt: "Full shot man getting haircut" },
+              { src: "http://img.b2bpic.net/free-photo/cosmetics-palettes-table_23-2147783933.jpg", alt: "Cosmetics palettes on table" },
+            ]}
+            avatarText="Join 500+ satisfied clients"
+            marqueeItems={[
+              { type: "text", text: "Professional Grooming" },
+              { type: "text", text: "Precision Styling" },
+              { type: "text", text: "Premium Skincare" },
+              { type: "text", text: "Hot Towel Shave" },
+              { type: "text", text: "Expert Beauty" },
+            ]}
+          />
+        </div>
 
-  <div id="about" data-section="about">
-      <TextAbout
-      useInvertedBackground={true}
-      title="Unico nel suo genere: Artigianato e Bellezza"
-      buttons={[
-        {
-          text: "Learn More",
-        },
-      ]}
-    />
-  </div>
+        <div id="about" data-section="about">
+          <TextAbout
+            useInvertedBackground={true}
+            title="Unico nel suo genere: Artigianato e Bellezza"
+            buttons={[{ text: "Learn More" }]}
+          />
+        </div>
 
-  <div id="features" data-section="features">
-      <FeatureCardTwentyEight
-      animationType="slide-up"
-      textboxLayout="split"
-      useInvertedBackground={false}
-      features={[
-        {
-          id: "f1",
-          title: "Precision Haircut",
-          subtitle: "Expert styling for all hair types.",
-          category: "Hair",
-          value: "€30",
-        },
-        {
-          id: "f2",
-          title: "Beard Grooming",
-          subtitle: "Hot towel shave and beard contouring.",
-          category: "Beard",
-          value: "€20",
-        },
-        {
-          id: "f3",
-          title: "Estetica",
-          subtitle: "Skincare and beauty treatments.",
-          category: "Beauty",
-          value: "€45",
-        },
-      ]}
-      title="Our Services"
-      description="Premium grooming and beauty treatments tailored to you."
-    />
-  </div>
+        <div id="features" data-section="features">
+          <FeatureCardTwentyEight
+            animationType="slide-up"
+            textboxLayout="split"
+            useInvertedBackground={false}
+            features={[
+              { id: "f1", title: "Precision Haircut", subtitle: "Expert styling for all hair types.", category: "Hair", value: "€30" },
+              { id: "f2", title: "Beard Grooming", subtitle: "Hot towel shave and beard contouring.", category: "Beard", value: "€20" },
+              { id: "f3", title: "Estetica", subtitle: "Skincare and beauty treatments.", category: "Beauty", value: "€45" },
+            ]}
+            title="Our Services"
+            description="Premium grooming and beauty treatments tailored to you."
+          />
+        </div>
 
-  <div id="products" data-section="products">
-      <ProductCardThree
-      textboxLayout="default"
-      gridVariant="four-items-2x2-equal-grid"
-      useInvertedBackground={true}
-      products={[
-        {
-          id: "p1",
-          name: "Pomade Gold",
-          price: "€18",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-selfcare-products_23-2149313063.jpg",
-        },
-        {
-          id: "p2",
-          name: "Beard Oil",
-          price: "€22",
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-getting-her-hair-washed-beauty-salon_23-2149167389.jpg",
-        },
-        {
-          id: "p3",
-          name: "Shampoo",
-          price: "€15",
-          imageSrc: "http://img.b2bpic.net/free-photo/product-branding-packaging_23-2150965835.jpg",
-        },
-        {
-          id: "p4",
-          name: "Texture Clay",
-          price: "€19",
-          imageSrc: "http://img.b2bpic.net/free-photo/ecofriendly-beauty-product_23-2150669105.jpg",
-        },
-        {
-          id: "p5",
-          name: "Aftershave",
-          price: "€25",
-          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-using-dry-shampoo-home_23-2150706337.jpg",
-        },
-        {
-          id: "p6",
-          name: "Comb Set",
-          price: "€10",
-          imageSrc: "http://img.b2bpic.net/free-photo/product-branding-packaging_23-2150965827.jpg",
-        },
-      ]}
-      title="Shop Professional"
-      description="Products we use, products you can take home."
-    />
-  </div>
+        <div id="products" data-section="products">
+          <ProductCardThree
+            animationType="blur-reveal"
+            textboxLayout="default"
+            gridVariant="four-items-2x2-equal-grid"
+            useInvertedBackground={true}
+            products={[
+              { id: "p1", name: "Pomade Gold", price: "€18", imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-selfcare-products_23-2149313063.jpg" },
+              { id: "p2", name: "Beard Oil", price: "€22", imageSrc: "http://img.b2bpic.net/free-photo/woman-getting-her-hair-washed-beauty-salon_23-2149167389.jpg" },
+              { id: "p3", name: "Shampoo", price: "€15", imageSrc: "http://img.b2bpic.net/free-photo/product-branding-packaging_23-2150965835.jpg" },
+              { id: "p4", name: "Texture Clay", price: "€19", imageSrc: "http://img.b2bpic.net/free-photo/ecofriendly-beauty-product_23-2150669105.jpg" },
+              { id: "p5", name: "Aftershave", price: "€25", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-using-dry-shampoo-home_23-2150706337.jpg" },
+              { id: "p6", name: "Comb Set", price: "€10", imageSrc: "http://img.b2bpic.net/free-photo/product-branding-packaging_23-2150965827.jpg" },
+            ]}
+            title="Shop Professional"
+            description="Products we use, products you can take home."
+          />
+        </div>
 
-  <div id="pricing" data-section="pricing">
-      <PricingCardThree
-      animationType="slide-up"
-      textboxLayout="default"
-      useInvertedBackground={false}
-      plans={[
-        {
-          id: "b1",
-          price: "€30",
-          name: "Basic Cut",
-          features: [
-            "Style Consultation",
-            "Wash & Condition",
-            "Precision Cut",
-          ],
-          buttons: [
-            {
-              text: "Select",
-            },
-          ],
-        },
-        {
-          id: "b2",
-          price: "€50",
-          name: "Full Service",
-          features: [
-            "Haircut & Styling",
-            "Beard Trim",
-            "Scalp Treatment",
-          ],
-          buttons: [
-            {
-              text: "Select",
-            },
-          ],
-        },
-        {
-          id: "b3",
-          price: "€75",
-          name: "Luxury Groom",
-          features: [
-            "Full Haircut",
-            "Hot Towel Facial",
-            "Premium Products",
-          ],
-          buttons: [
-            {
-              text: "Select",
-            },
-          ],
-        },
-      ]}
-      title="Membership & Services"
-      description="Fair and transparent pricing for top-tier service."
-    />
-  </div>
+        <div id="pricing" data-section="pricing">
+          <PricingCardThree
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            plans={[
+              { id: "b1", price: "€30", name: "Basic Cut", features: ["Style Consultation", "Wash & Condition", "Precision Cut"], buttons: [{ text: "Select" }] },
+              { id: "b2", price: "€50", name: "Full Service", features: ["Haircut & Styling", "Beard Trim", "Scalp Treatment"], buttons: [{ text: "Select" }] },
+              { id: "b3", price: "€75", name: "Luxury Groom", features: ["Full Haircut", "Hot Towel Facial", "Premium Products"], buttons: [{ text: "Select" }] },
+            ]}
+            title="Membership & Services"
+            description="Fair and transparent pricing for top-tier service."
+          />
+        </div>
 
-  <div id="testimonials" data-section="testimonials">
-      <TestimonialCardFifteen
-      useInvertedBackground={true}
-      testimonial="The best barbershop experience in town. Andrea is extremely skilled and professional."
-      rating={5}
-      author="Marco Rossi"
-      avatars={[
-        {
-          src: "http://img.b2bpic.net/free-photo/happy-people-working-photography-studio_23-2148424423.jpg",
-          alt: "Marco Rossi",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/process-creating-stand-up-comedy_23-2151058839.jpg",
-          alt: "Satisfied client 1",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/man-holding-professional-camera_23-2148503561.jpg",
-          alt: "Satisfied client 2",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/people-recording-their-house-tour_23-2151139118.jpg",
-          alt: "Satisfied client 3",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/man-taking-photo-woman-model_23-2148532620.jpg",
-          alt: "Satisfied client 4",
-        },
-      ]}
-      ratingAnimation="blur-reveal"
-      avatarsAnimation="blur-reveal"
-    />
-  </div>
+        <div id="testimonials" data-section="testimonials">
+          <TestimonialCardFifteen
+            useInvertedBackground={true}
+            testimonial="The best barbershop experience in town. Andrea is extremely skilled and professional."
+            rating={5}
+            author="Marco Rossi"
+            avatars={[
+              { src: "http://img.b2bpic.net/free-photo/happy-people-working-photography-studio_23-2148424423.jpg", alt: "Marco Rossi" },
+              { src: "http://img.b2bpic.net/free-photo/process-creating-stand-up-comedy_23-2151058839.jpg", alt: "Satisfied client 1" },
+              { src: "http://img.b2bpic.net/free-photo/man-holding-professional-camera_23-2148503561.jpg", alt: "Satisfied client 2" },
+              { src: "http://img.b2bpic.net/free-photo/people-recording-their-house-tour_23-2151139118.jpg", alt: "Satisfied client 3" },
+              { src: "http://img.b2bpic.net/free-photo/man-taking-photo-woman-model_23-2148532620.jpg", alt: "Satisfied client 4" },
+            ]}
+            ratingAnimation="blur-reveal"
+            avatarsAnimation="blur-reveal"
+          />
+        </div>
 
-  <div id="faq" data-section="faq">
-      <FaqDouble
-      textboxLayout="default"
-      useInvertedBackground={false}
-      faqs={[
-        {
-          id: "q1",
-          title: "Do I need an appointment?",
-          content: "Yes, we highly recommend booking in advance.",
-        },
-        {
-          id: "q2",
-          title: "What payment methods do you accept?",
-          content: "We accept cash and all major credit cards.",
-        },
-        {
-          id: "q3",
-          title: "Can I buy gift cards?",
-          content: "Yes, please ask at the front desk.",
-        },
-      ]}
-      title="Common Questions"
-      description="Answers to help you prepare for your visit."
-      faqsAnimation="blur-reveal"
-    />
-  </div>
+        <div id="faq" data-section="faq">
+          <FaqDouble
+            textboxLayout="default"
+            useInvertedBackground={false}
+            faqs={[
+              { id: "q1", title: "Do I need an appointment?", content: "Yes, we highly recommend booking in advance." },
+              { id: "q2", title: "What payment methods do you accept?", content: "We accept cash and all major credit cards." },
+              { id: "q3", title: "Can I buy gift cards?", content: "Yes, please ask at the front desk." },
+            ]}
+            title="Common Questions"
+            description="Answers to help you prepare for your visit."
+            faqsAnimation="blur-reveal"
+          />
+        </div>
 
-  <div id="contact" data-section="contact">
-      <ContactCenter
-      useInvertedBackground={true}
-      background={{
-        variant: "plain",
-      }}
-      tag="Visit Us"
-      title="Get in touch today"
-      description="Ready for a refresh? Contact us to book an appointment."
-    />
-  </div>
+        <div id="contact" data-section="contact">
+          <ContactCenter
+            useInvertedBackground={true}
+            background={{ variant: "plain" }}
+            tag="Visit Us"
+            title="Get in touch today"
+            description="Ready for a refresh? Contact us to book an appointment."
+          />
+        </div>
 
-  <div id="footer" data-section="footer">
-      <FooterBaseReveal
-      logoText="Andrea Barber & Beauty"
-      columns={[
-        {
-          title: "Navigation",
-          items: [
-            {
-              label: "Home",
-              href: "#hero",
-            },
-            {
-              label: "Services",
-              href: "#features",
-            },
-          ],
-        },
-        {
-          title: "Legal",
-          items: [
-            {
-              label: "Privacy Policy",
-              href: "#",
-            },
-            {
-              label: "Terms",
-              href: "#",
-            },
-          ],
-        },
-      ]}
-    />
-  </div>
+        <div id="footer" data-section="footer">
+          <FooterBaseReveal
+            logoText="Andrea Barber & Beauty"
+            columns={[
+              { title: "Navigation", items: [{ label: "Home", href: "#hero" }, { label: "Services", href: "#features" }] },
+              { title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms", href: "#" }] },
+            ]}
+          />
+        </div>
       </ReactLenis>
     </ThemeProvider>
   );
-- 
2.49.1