From 5618fe6fd7390d590933caa0900794b39de4e2a6 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Fri, 17 Apr 2026 18:55:22 +0000
Subject: [PATCH] Update src/app/page.tsx

---
 src/app/page.tsx | 421 +++++++++++++++--------------------------------
 1 file changed, 129 insertions(+), 292 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 9fb0215..10794b3 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -18,308 +18,145 @@ export default function LandingPage() {
         defaultButtonVariant="text-stagger"
         defaultTextAnimation="background-highlight"
         borderRadius="pill"
+        contentWidth="medium"
+        sizing="medium"
+        background="circleGradient"
+        cardStyle="glass-elevated"
+        primaryButtonStyle="gradient"
+        secondaryButtonStyle="glass"
+        headingFontWeight="normal"
     >
       <ReactLenis root>
-  <div id="nav" data-section="nav">
-      <NavbarLayoutFloatingInline
-      navItems={[
-        {
-          name: "Home",
-          id: "hero",
-        },
-        {
-          name: "Services",
-          id: "services",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
-      ]}
-      brandName="Glow Beauty Salon"
-    />
-  </div>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingInline
+            navItems={[
+              { name: "Home", id: "hero" },
+              { name: "Services", id: "services" },
+              { name: "Contact", id: "contact" },
+            ]}
+            brandName="Glow Beauty Salon"
+            button={{ text: "Book Now", href: "#contact" }}
+          />
+        </div>
 
-  <div id="hero" data-section="hero">
-      <HeroBillboardCarousel
-      background={{
-        variant: "sparkles-gradient",
-      }}
-      title="Glow Beauty Salon"
-      description="Your beauty, our duty. Experience world-class beauty services in a calming and luxurious environment."
-      mediaItems={[
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/fuzzy-room-with-armchairs_1203-958.jpg",
-          imageAlt: "Salon Interior",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/top-view-asmr-microphone-with-make-up-brushes_23-2149319261.jpg",
-          imageAlt: "Professional Makeup",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/wellness-concept-with-woman-massage-salon_23-2147816971.jpg",
-          imageAlt: "Skincare Treatment",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/cozy-spa-composition-with-aroma-diffuser-candle-flowers_169016-26840.jpg",
-          imageAlt: "Hair Styling",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/serene-minimalist-spa-interior-meditation-space_23-2151935120.jpg",
-          imageAlt: "Beauty Tools",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/side-view-female-friends-indulging-skin-care_23-2148655787.jpg",
-          imageAlt: "Salon Staff",
-        },
-      ]}
-    />
-  </div>
+        <div id="hero" data-section="hero">
+          <HeroBillboardCarousel
+            background={{ variant: "sparkles-gradient" }}
+            title="Glow Beauty Salon"
+            description="Your beauty, our duty. Experience world-class beauty services in a calming and luxurious environment."
+            mediaItems={[
+              { imageSrc: "http://img.b2bpic.net/free-photo/fuzzy-room-with-armchairs_1203-958.jpg", imageAlt: "Salon Interior" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/top-view-asmr-microphone-with-make-up-brushes_23-2149319261.jpg", imageAlt: "Professional Makeup" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/wellness-concept-with-woman-massage-salon_23-2147816971.jpg", imageAlt: "Skincare Treatment" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/cozy-spa-composition-with-aroma-diffuser-candle-flowers_169016-26840.jpg", imageAlt: "Hair Styling" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/serene-minimalist-spa-interior-meditation-space_23-2151935120.jpg", imageAlt: "Beauty Tools" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/side-view-female-friends-indulging-skin-care_23-2148655787.jpg", imageAlt: "Salon Staff" },
+            ]}
+          />
+        </div>
 
-  <div id="services" data-section="services">
-      <ProductCardThree
-      animationType="slide-up"
-      textboxLayout="default"
-      gridVariant="three-columns-all-equal-width"
-      useInvertedBackground={false}
-      products={[
-        {
-          id: "p1",
-          name: "Facial",
-          price: "Rs 2000",
-          imageSrc: "http://img.b2bpic.net/free-photo/modern-beauty-salon-interior_23-2148910541.jpg",
-        },
-        {
-          id: "p2",
-          name: "Haircut",
-          price: "Rs 1000",
-          imageSrc: "http://img.b2bpic.net/free-photo/comparison-different-types-brush-strokes_23-2150105277.jpg",
-        },
-        {
-          id: "p3",
-          name: "Makeup",
-          price: "Rs 5000",
-          imageSrc: "http://img.b2bpic.net/free-photo/teen-girl-with-healthy-oily-skin_633478-70.jpg",
-        },
-        {
-          id: "p4",
-          name: "Manicure",
-          price: "Rs 1500",
-          imageSrc: "http://img.b2bpic.net/free-photo/spa-treatment-dark-wall_176420-11893.jpg",
-        },
-        {
-          id: "p5",
-          name: "Pedicure",
-          price: "Rs 1800",
-          imageSrc: "http://img.b2bpic.net/free-photo/makeup-brush-compact-blusher_23-2148208961.jpg",
-        },
-        {
-          id: "p6",
-          name: "Waxing",
-          price: "Rs 800",
-          imageSrc: "http://img.b2bpic.net/free-photo/empty-startup-coworking-space-with-office-workspaces-computers-professional-business-space-company-department-spacious-agency-building-interior-modern-executive-environment_482257-67835.jpg",
-        },
-      ]}
-      title="Our Services"
-      description="Explore our wide range of professional beauty services."
-    />
-  </div>
+        <div id="services" data-section="services">
+          <ProductCardThree
+            animationType="slide-up"
+            textboxLayout="default"
+            gridVariant="three-columns-all-equal-width"
+            useInvertedBackground={false}
+            products={[
+              { id: "p1", name: "Facial", price: "Rs 2000", imageSrc: "http://img.b2bpic.net/free-photo/modern-beauty-salon-interior_23-2148910541.jpg" },
+              { id: "p2", name: "Haircut", price: "Rs 1000", imageSrc: "http://img.b2bpic.net/free-photo/comparison-different-types-brush-strokes_23-2150105277.jpg" },
+              { id: "p3", name: "Makeup", price: "Rs 5000", imageSrc: "http://img.b2bpic.net/free-photo/teen-girl-with-healthy-oily-skin_633478-70.jpg" },
+              { id: "p4", name: "Manicure", price: "Rs 1500", imageSrc: "http://img.b2bpic.net/free-photo/spa-treatment-dark-wall_176420-11893.jpg" },
+              { id: "p5", name: "Pedicure", price: "Rs 1800", imageSrc: "http://img.b2bpic.net/free-photo/makeup-brush-compact-blusher_23-2148208961.jpg" },
+              { id: "p6", name: "Waxing", price: "Rs 800", imageSrc: "http://img.b2bpic.net/free-photo/empty-startup-coworking-space-with-office-workspaces-computers-professional-business-space-company-department-spacious-agency-building-interior-modern-executive-environment_482257-67835.jpg" },
+            ]}
+            title="Our Services"
+            description="Explore our wide range of professional beauty services."
+          />
+        </div>
 
-  <div id="team" data-section="team">
-      <TeamCardOne
-      animationType="slide-up"
-      textboxLayout="default"
-      gridVariant="three-columns-all-equal-width"
-      useInvertedBackground={true}
-      members={[
-        {
-          id: "m1",
-          name: "Sarah",
-          role: "Head Stylist",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-female-holding-few-makeup-brushes-table_23-2148113077.jpg",
-        },
-        {
-          id: "m2",
-          name: "Anna",
-          role: "Senior Makeup Artist",
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-with-orange-dough-fingers_1208-321.jpg",
-        },
-        {
-          id: "m3",
-          name: "Emma",
-          role: "Skincare Expert",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-67053.jpg",
-        },
-      ]}
-      title="Our Experts"
-      description="Meet our professional team dedicated to your beauty."
-    />
-  </div>
+        <div id="team" data-section="team">
+          <TeamCardOne
+            animationType="slide-up"
+            textboxLayout="default"
+            gridVariant="three-columns-all-equal-width"
+            useInvertedBackground={true}
+            members={[
+              { id: "m1", name: "Sarah", role: "Head Stylist", imageSrc: "http://img.b2bpic.net/free-photo/young-female-holding-few-makeup-brushes-table_23-2148113077.jpg" },
+              { id: "m2", name: "Anna", role: "Senior Makeup Artist", imageSrc: "http://img.b2bpic.net/free-photo/woman-with-orange-dough-fingers_1208-321.jpg" },
+              { id: "m3", name: "Emma", role: "Skincare Expert", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-67053.jpg" },
+            ]}
+            title="Our Experts"
+            description="Meet our professional team dedicated to your beauty."
+          />
+        </div>
 
-  <div id="testimonials" data-section="testimonials">
-      <TestimonialCardTwo
-      animationType="slide-up"
-      textboxLayout="default"
-      useInvertedBackground={false}
-      testimonials={[
-        {
-          id: "t1",
-          name: "Sarah",
-          role: "Loyal Client",
-          testimonial: "Excellent service and very relaxing!",
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-beauty-salon-looking-into-mirror_1303-16737.jpg",
-        },
-        {
-          id: "t2",
-          name: "John",
-          role: "First-time Client",
-          testimonial: "Loved the haircut! Highly recommended.",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-getting-haircut_23-2149220548.jpg",
-        },
-        {
-          id: "t3",
-          name: "Emily",
-          role: "Regular",
-          testimonial: "Best facial I've ever had.",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-relaxing-spa-salon_176420-14869.jpg",
-        },
-        {
-          id: "t4",
-          name: "Mark",
-          role: "Client",
-          testimonial: "Great experience, very professional staff.",
-          imageSrc: "http://img.b2bpic.net/free-photo/girls-relaxing_1098-14662.jpg",
-        },
-        {
-          id: "t5",
-          name: "Lucy",
-          role: "Loyal Client",
-          testimonial: "Amazing makeup services for my event.",
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-getting-treatment-hairdresser-shop_23-2149230959.jpg",
-        },
-      ]}
-      title="Client Reviews"
-      description="Hear what our clients have to say about us."
-    />
-  </div>
+        <div id="testimonials" data-section="testimonials">
+          <TestimonialCardTwo
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            testimonials={[
+              { id: "t1", name: "Sarah", role: "Loyal Client", testimonial: "Excellent service and very relaxing!", imageSrc: "http://img.b2bpic.net/free-photo/woman-beauty-salon-looking-into-mirror_1303-16737.jpg" },
+              { id: "t2", name: "John", role: "First-time Client", testimonial: "Loved the haircut! Highly recommended.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-getting-haircut_23-2149220548.jpg" },
+              { id: "t3", name: "Emily", role: "Regular", testimonial: "Best facial I've ever had.", imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-relaxing-spa-salon_176420-14869.jpg" },
+              { id: "t4", name: "Mark", role: "Client", testimonial: "Great experience, very professional staff.", imageSrc: "http://img.b2bpic.net/free-photo/girls-relaxing_1098-14662.jpg" },
+              { id: "t5", name: "Lucy", role: "Loyal Client", testimonial: "Amazing makeup services for my event.", imageSrc: "http://img.b2bpic.net/free-photo/woman-getting-treatment-hairdresser-shop_23-2149230959.jpg" },
+            ]}
+            title="Client Reviews"
+            description="Hear what our clients have to say about us."
+          />
+        </div>
 
-  <div id="faq" data-section="faq">
-      <FaqDouble
-      textboxLayout="default"
-      useInvertedBackground={true}
-      faqs={[
-        {
-          id: "q1",
-          title: "Do I need an appointment?",
-          content: "Yes, booking in advance is recommended.",
-        },
-        {
-          id: "q2",
-          title: "Are walk-ins accepted?",
-          content: "We try our best to accommodate walk-ins, but appointments are prioritized.",
-        },
-        {
-          id: "q3",
-          title: "What payment methods do you accept?",
-          content: "We accept cash and bank transfers.",
-        },
-      ]}
-      title="Common Questions"
-      description="Have questions? We've got answers."
-      faqsAnimation="slide-up"
-    />
-  </div>
+        <div id="faq" data-section="faq">
+          <FaqDouble
+            textboxLayout="default"
+            useInvertedBackground={true}
+            faqs={[
+              { id: "q1", title: "Do I need an appointment?", content: "Yes, booking in advance is recommended." },
+              { id: "q2", title: "Are walk-ins accepted?", content: "We try our best to accommodate walk-ins, but appointments are prioritized." },
+              { id: "q3", title: "What payment methods do you accept?", content: "We accept cash and bank transfers." },
+            ]}
+            title="Common Questions"
+            description="Have questions? We've got answers."
+            faqsAnimation="slide-up"
+          />
+        </div>
 
-  <div id="metrics" data-section="metrics">
-      <MetricCardSeven
-      animationType="slide-up"
-      textboxLayout="default"
-      useInvertedBackground={false}
-      metrics={[
-        {
-          id: "m1",
-          value: "10+",
-          title: "Years Experience",
-          items: [
-            "Serving beauty",
-            "Expert staff",
-          ],
-        },
-        {
-          id: "m2",
-          value: "5k+",
-          title: "Happy Clients",
-          items: [
-            "Satisfied",
-            "Repeatedly visited",
-          ],
-        },
-        {
-          id: "m3",
-          value: "100%",
-          title: "Satisfaction",
-          items: [
-            "Guaranteed quality",
-            "Best results",
-          ],
-        },
-      ]}
-      title="Salon Stats"
-      description="Our commitment to quality service."
-    />
-  </div>
+        <div id="metrics" data-section="metrics">
+          <MetricCardSeven
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            metrics={[
+              { id: "m1", value: "10+", title: "Years Experience", items: ["Serving beauty", "Expert staff"] },
+              { id: "m2", value: "5k+", title: "Happy Clients", items: ["Satisfied", "Repeatedly visited"] },
+              { id: "m3", value: "100%", title: "Satisfaction", items: ["Guaranteed quality", "Best results"] },
+            ]}
+            title="Salon Stats"
+            description="Our commitment to quality service."
+          />
+        </div>
 
-  <div id="contact" data-section="contact">
-      <ContactCTA
-      useInvertedBackground={true}
-      background={{
-        variant: "plain",
-      }}
-      tag="Ready to glow?"
-      title="Book Your Appointment"
-      description="Connect with us on WhatsApp for bookings and queries: 0300-1234567"
-      buttons={[
-        {
-          text: "Book Now",
-          href: "https://wa.me/923001234567",
-        },
-      ]}
-    />
-  </div>
+        <div id="contact" data-section="contact">
+          <ContactCTA
+            useInvertedBackground={true}
+            background={{ variant: "plain" }}
+            tag="Ready to glow?"
+            title="Book Your Appointment"
+            description="Connect with us on WhatsApp for bookings and queries: 0300-1234567"
+            buttons={[{ text: "Book Now", href: "https://wa.me/923001234567" }]}
+          />
+        </div>
 
-  <div id="footer" data-section="footer">
-      <FooterBaseCard
-      logoText="Glow Beauty Salon"
-      columns={[
-        {
-          title: "Company",
-          items: [
-            {
-              label: "About Us",
-              href: "#",
-            },
-            {
-              label: "Services",
-              href: "#services",
-            },
-          ],
-        },
-        {
-          title: "Legal",
-          items: [
-            {
-              label: "Privacy Policy",
-              href: "#",
-            },
-            {
-              label: "Terms of Service",
-              href: "#",
-            },
-          ],
-        },
-      ]}
-    />
-  </div>
+        <div id="footer" data-section="footer">
+          <FooterBaseCard
+            logoText="Glow Beauty Salon"
+            columns={[
+              { title: "Company", items: [{ label: "About Us", href: "#" }, { label: "Services", href: "#services" }] },
+              { title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] },
+            ]}
+          />
+        </div>
       </ReactLenis>
     </ThemeProvider>
   );
-- 
2.49.1