Update src/app/page.tsx

Merge version_4 into main

src/app/page.tsx

@@ -16,35 +16,27 @@ export default function LandingPage() {
     <ThemeProvider
         defaultButtonVariant="text-stagger"
         defaultTextAnimation="background-highlight"
-        borderRadius="soft"
+        borderRadius="pill"
         contentWidth="mediumLarge"
         sizing="large"
-        background="noise"
-        cardStyle="gradient-bordered"
-        primaryButtonStyle="shadow"
-        secondaryButtonStyle="layered"
-        headingFontWeight="light"
+        background="noiseDiagonalGradient"
+        cardStyle="glass-elevated"
+        primaryButtonStyle="gradient"
+        secondaryButtonStyle="glass"
+        headingFontWeight="semibold"
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
       <NavbarLayoutFloatingOverlay
       navItems={[
         {
-          name: "Home",
-          id: "hero",
-        },
+          name: "Home",          id: "hero"},
         {
-          name: "Services",
-          id: "services",
-        },
+          name: "Services",          id: "services"},
         {
-          name: "About",
-          id: "about",
-        },
+          name: "About",          id: "about"},
         {
-          name: "Contact",
-          id: "contact",
-        },
+          name: "Contact",          id: "contact"},
       ]}
       brandName="Face N Nails"
     />
@@ -53,64 +45,39 @@ export default function LandingPage() {
   <div id="hero" data-section="hero">
       <HeroCentered
       background={{
-        variant: "radial-gradient",
-      }}
+        variant: "radial-gradient"}}
       title="Professional Nail & Beauty Studio in Lanham"
       description="Face N Nails is the leading beauty service that delivers professional stylists straight to your door or in our studio. Experience premium pampering in the comfort of your home, office, or our Lanham studio."
       avatars={[
         {
-          src: "http://img.b2bpic.net/free-photo/man-wearing-make-up-sing-brush-his-face_23-2148784333.jpg",
-          alt: "Stylist 1",
-        },
+          src: "http://img.b2bpic.net/free-photo/man-wearing-make-up-sing-brush-his-face_23-2148784333.jpg",          alt: "Stylist 1"},
         {
-          src: "http://img.b2bpic.net/free-photo/man-wearing-make-up-sing-brush-his-face_23-2148784333.jpg",
-          alt: "Stylist 2",
-        },
+          src: "http://img.b2bpic.net/free-photo/man-wearing-make-up-sing-brush-his-face_23-2148784333.jpg",          alt: "Stylist 2"},
         {
-          src: "http://img.b2bpic.net/free-photo/man-wearing-make-up-sing-brush-his-face_23-2148784333.jpg",
-          alt: "Stylist 3",
-        },
+          src: "http://img.b2bpic.net/free-photo/man-wearing-make-up-sing-brush-his-face_23-2148784333.jpg",          alt: "Stylist 3"},
         {
-          src: "http://img.b2bpic.net/free-photo/man-wearing-make-up-sing-brush-his-face_23-2148784333.jpg",
-          alt: "Stylist 4",
-        },
+          src: "http://img.b2bpic.net/free-photo/man-wearing-make-up-sing-brush-his-face_23-2148784333.jpg",          alt: "Stylist 4"},
         {
-          src: "http://img.b2bpic.net/free-photo/man-wearing-make-up-sing-brush-his-face_23-2148784333.jpg",
-          alt: "Stylist 5",
-        },
+          src: "http://img.b2bpic.net/free-photo/man-wearing-make-up-sing-brush-his-face_23-2148784333.jpg",          alt: "Stylist 5"},
       ]}
       buttons={[
         {
-          text: "Call Now",
-          href: "tel:240-299-0337",
-        },
+          text: "Call Now",          href: "tel:240-299-0337"},
         {
-          text: "Book Your Session Today",
-          href: "#contact",
-        },
+          text: "Book Your Session Today",          href: "#contact"},
       ]}
       buttonAnimation="slide-up"
       marqueeItems={[
         {
-          type: "text",
-          text: "Premium Nail Art",
-        },
+          type: "text",          text: "Premium Nail Art"},
         {
-          type: "text",
-          text: "Expert Lash Extensions",
-        },
+          type: "text",          text: "Expert Lash Extensions"},
         {
-          type: "text",
-          text: "Professional Waxing",
-        },
+          type: "text",          text: "Professional Waxing"},
         {
-          type: "text",
-          text: "Mobile Services Available",
-        },
+          type: "text",          text: "Mobile Services Available"},
         {
-          type: "text",
-          text: "Quality Guaranteed",
-        },
+          type: "text",          text: "Quality Guaranteed"},
       ]}
     />
   </div>
@@ -123,47 +90,17 @@ export default function LandingPage() {
       useInvertedBackground={false}
       products={[
         {
-          id: "s1",
-          name: "Lash Extensions",
-          price: "View Details",
-          variant: "Eyelash Application",
-          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-wearing-eye-patches_23-2149628033.jpg?_wi=1",
-        },
+          id: "s1",          name: "Lash Extensions",          price: "From $65",          variant: "Eyelash Application",          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-wearing-eye-patches_23-2149628033.jpg?_wi=1"},
         {
-          id: "s2",
-          name: "Nail Services",
-          price: "View Details",
-          variant: "Manicure & Pedicure",
-          imageSrc: "http://img.b2bpic.net/free-photo/man-vaping-from-hookah-indoors_23-2149173629.jpg?_wi=1",
-        },
+          id: "s2",          name: "Nail Services",          price: "From $45",          variant: "Manicure & Pedicure",          imageSrc: "http://img.b2bpic.net/free-photo/man-vaping-from-hookah-indoors_23-2149173629.jpg?_wi=1"},
         {
-          id: "s3",
-          name: "Brow & Waxing",
-          price: "View Details",
-          variant: "Precision Grooming",
-          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-going-through-microblading-treatment_23-2149238663.jpg?_wi=1",
-        },
+          id: "s3",          name: "Brow & Waxing",          price: "From $30",          variant: "Precision Grooming",          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-going-through-microblading-treatment_23-2149238663.jpg?_wi=1"},
         {
-          id: "s4",
-          name: "Makeup Services",
-          price: "View Details",
-          variant: "Professional Artistry",
-          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-wearing-eye-patches_23-2149628033.jpg?_wi=2",
-        },
+          id: "s4",          name: "Makeup Services",          price: "From $80",          variant: "Professional Artistry",          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-wearing-eye-patches_23-2149628033.jpg?_wi=2"},
         {
-          id: "s5",
-          name: "Full Set Nails",
-          price: "View Details",
-          variant: "Premium Care",
-          imageSrc: "http://img.b2bpic.net/free-photo/man-vaping-from-hookah-indoors_23-2149173629.jpg?_wi=2",
-        },
+          id: "s5",          name: "Full Set Nails",          price: "From $55",          variant: "Premium Care",          imageSrc: "http://img.b2bpic.net/free-photo/man-vaping-from-hookah-indoors_23-2149173629.jpg?_wi=2"},
         {
-          id: "s6",
-          name: "Brow Tinting",
-          price: "View Details",
-          variant: "Expert Shaping",
-          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-going-through-microblading-treatment_23-2149238663.jpg?_wi=2",
-        },
+          id: "s6",          name: "Brow Tinting",          price: "From $25",          variant: "Expert Shaping",          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-going-through-microblading-treatment_23-2149238663.jpg?_wi=2"},
       ]}
       title="Our Services"
       description="Beauty isn't about having a pretty face. It is about having a pretty mind, a pretty heart, and most importantly a beautiful soul."
@@ -190,25 +127,13 @@ export default function LandingPage() {
       description="We prioritize quality and precision in every service to ensure our clients feel their best."
       metrics={[
         {
-          id: "m1",
-          value: "10+",
-          title: "Years Experience",
-          description: "Professional beauty expertise",
-          icon: Award,
+          id: "m1",          value: "10+",          title: "Years Experience",          description: "Professional beauty expertise",          icon: Award,
         },
         {
-          id: "m2",
-          value: "5k+",
-          title: "Happy Clients",
-          description: "Delighted with our service",
-          icon: Smile,
+          id: "m2",          value: "5k+",          title: "Happy Clients",          description: "Delighted with our service",          icon: Smile,
         },
         {
-          id: "m3",
-          value: "100%",
-          title: "Satisfaction Rate",
-          description: "Our commitment to you",
-          icon: CheckCircle,
+          id: "m3",          value: "100%",          title: "Satisfaction Rate",          description: "Our commitment to you",          icon: CheckCircle,
         },
       ]}
     />
@@ -218,18 +143,13 @@ export default function LandingPage() {
       <ContactText
       useInvertedBackground={false}
       background={{
-        variant: "downward-rays-static",
-      }}
-      text="Book Your Session Today! Reach out to us at 240-299-0337 or info@facennails.net. Visit our studio at 9841 Greenbelt Rd. #207, Lanham, MD 20706."
+        variant: "downward-rays-static"}}
+      text="Book Your Session Today! Reach out to us at 240-299-0337 or lafacennails@gmail.com. Visit our studio at 9841 Greenbelt Rd. #207, Lanham, MD 20706."
       buttons={[
         {
-          text: "Call Now: 240-299-0337",
-          href: "tel:240-299-0337",
-        },
+          text: "Call Now: 240-299-0337",          href: "tel:240-299-0337"},
         {
-          text: "Email Us",
-          href: "mailto:info@facennails.net",
-        },
+          text: "Email Us",          href: "mailto:lafacennails@gmail.com"},
       ]}
     />
   </div>
@@ -239,38 +159,25 @@ export default function LandingPage() {
       logoText="FACE N NAILS"
       columns={[
         {
-          title: "Information",
-          items: [
+          title: "Information",          items: [
             {
-              label: "Contact Us",
-              href: "#contact",
-            },
+              label: "Contact Us",              href: "#contact"},
             {
-              label: "Booking Policy",
-              href: "#",
-            },
+              label: "Booking Policy",              href: "#"},
           ],
         },
         {
-          title: "Location",
-          items: [
+          title: "Location",          items: [
             {
-              label: "9841 Greenbelt Rd. #207, Lanham, MD 20706",
-              href: "#",
-            },
+              label: "9841 Greenbelt Rd. #207, Lanham, MD 20706",              href: "#"},
           ],
         },
         {
-          title: "Follow Us",
-          items: [
+          title: "Follow Us",          items: [
             {
-              label: "Instagram",
-              href: "#",
-            },
+              label: "Instagram",              href: "#"},
             {
-              label: "Facebook",
-              href: "#",
-            },
+              label: "Facebook",              href: "#"},
           ],
         },
       ]}
@@ -280,4 +187,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #ffffff;
-  --card: #f9f9f9;
-  --foreground: #000612e6;
-  --primary-cta: #15479c;
+  --background: #fdf2f8;
+  --card: #ffffff;
+  --foreground: #4c1d95;
+  --primary-cta: #db2777;
   --primary-cta-text: #ffffff;
-  --secondary-cta: #f9f9f9;
+  --secondary-cta: #fbcfe8;
   --secondary-cta-text: #000612e6;
-  --accent: #e2e2e2;
-  --background-accent: #c4c4c4;
+  --accent: #fce7f3;
+  --background-accent: #fbcfe8;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);