Update src/app/page.tsx

Merge version_2 into main

src/app/page.tsx

@@ -33,21 +33,13 @@ export default function LandingPage() {
       <NavbarLayoutFloatingOverlay
       navItems={[
         {
-          name: "Home",
-          id: "hero",
-        },
+          name: "Home",          id: "hero"},
         {
-          name: "Products",
-          id: "products",
-        },
+          name: "Products",          id: "products"},
         {
-          name: "About",
-          id: "about",
-        },
+          name: "About",          id: "about"},
         {
-          name: "Contact",
-          id: "contact",
-        },
+          name: "Contact",          id: "contact"},
       ]}
       brandName="MediStore"
     />
@@ -56,23 +48,17 @@ export default function LandingPage() {
   <div id="hero" data-section="hero">
       <HeroSplitKpi
       background={{
-        variant: "gradient-bars",
-      }}
+        variant: "gradient-bars"}}
       title="Your Trusted Online Pharmacy for Quality Tablets"
       description="Providing convenient, reliable, and affordable access to daily medications and wellness products delivered to your door."
+      buttons={[{ text: "Browse Products", href: "#products" }]}
       kpis={[
         {
-          value: "10k+",
-          label: "Orders Delivered",
-        },
+          value: "10k+",          label: "Orders Delivered"},
         {
-          value: "500+",
-          label: "Available Medicines",
-        },
+          value: "500+",          label: "Available Medicines"},
         {
-          value: "24/7",
-          label: "Customer Support",
-        },
+          value: "24/7",          label: "Customer Support"},
       ]}
       enableKpiAnimation={true}
       imageSrc="http://img.b2bpic.net/free-photo/female-pharmacist-working-drugstore_259150-57972.jpg?_wi=1"
@@ -80,52 +66,32 @@ export default function LandingPage() {
       mediaAnimation="slide-up"
       avatars={[
         {
-          src: "http://img.b2bpic.net/free-photo/middle-age-woman-with-tattoos-working-pharmacy-drugstore-hurry-pointing-watch-time-impatience-looking-camera-with-relaxed-expression_839833-14122.jpg",
-          alt: "Pharmacist working",
-        },
+          src: "http://img.b2bpic.net/free-photo/middle-age-woman-with-tattoos-working-pharmacy-drugstore-hurry-pointing-watch-time-impatience-looking-camera-with-relaxed-expression_839833-14122.jpg",          alt: "Pharmacist working"},
         {
-          src: "http://img.b2bpic.net/free-photo/warehouse-pharmacy_1161-231.jpg",
-          alt: "Warehouse of pharmacy",
-        },
+          src: "http://img.b2bpic.net/free-photo/warehouse-pharmacy_1161-231.jpg",          alt: "Warehouse of pharmacy"},
         {
-          src: "http://img.b2bpic.net/free-photo/man-working-as-pharmacist_23-2151734681.jpg",
-          alt: "Man working as pharmacist",
-        },
+          src: "http://img.b2bpic.net/free-photo/man-working-as-pharmacist_23-2151734681.jpg",          alt: "Man working as pharmacist"},
         {
-          src: "http://img.b2bpic.net/free-photo/empty-drugstore-with-bottles-packages-full-with-medicaments-retail-shop-shelves-with-pharmaceutical-products-pharmacy-space-filled-with-medical-drugs-pills-vitamins-boxes_482257-62215.jpg",
-          alt: "Empty drugstore shelves",
-        },
+          src: "http://img.b2bpic.net/free-photo/empty-drugstore-with-bottles-packages-full-with-medicaments-retail-shop-shelves-with-pharmaceutical-products-pharmacy-space-filled-with-medical-drugs-pills-vitamins-boxes_482257-62215.jpg",          alt: "Empty drugstore shelves"},
         {
-          src: "http://img.b2bpic.net/free-photo/pharmacist-work_23-2150600112.jpg",
-          alt: "Pharmacist at work",
-        },
+          src: "http://img.b2bpic.net/free-photo/pharmacist-work_23-2150600112.jpg",          alt: "Pharmacist at work"},
       ]}
       avatarText="Trusted by 10,000+ happy customers"
       marqueeItems={[
         {
-          type: "text-icon",
-          text: "Fast Delivery",
-          icon: Truck,
+          type: "text-icon",          text: "Fast Delivery",          icon: Truck,
         },
         {
-          type: "text-icon",
-          text: "Genuine Products",
-          icon: ShieldCheck,
+          type: "text-icon",          text: "Genuine Products",          icon: ShieldCheck,
         },
         {
-          type: "text-icon",
-          text: "24/7 Support",
-          icon: Headphones,
+          type: "text-icon",          text: "24/7 Support",          icon: Headphones,
         },
         {
-          type: "text-icon",
-          text: "Easy Payments",
-          icon: CreditCard,
+          type: "text-icon",          text: "Easy Payments",          icon: CreditCard,
         },
         {
-          type: "text-icon",
-          text: "Secure Packaging",
-          icon: Package,
+          type: "text-icon",          text: "Secure Packaging",          icon: Package,
         },
       ]}
     />
@@ -145,32 +111,17 @@ export default function LandingPage() {
       useInvertedBackground={false}
       features={[
         {
-          id: "f1",
-          title: "Fast Home Delivery",
-          tags: [
-            "Convenient",
-            "Reliable",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/old-man-with-laptop_1157-45381.jpg?_wi=1",
-        },
+          id: "f1",          title: "Fast Home Delivery",          tags: [
+            "Convenient",            "Reliable"],
+          imageSrc: "http://img.b2bpic.net/free-photo/old-man-with-laptop_1157-45381.jpg?_wi=1"},
         {
-          id: "f2",
-          title: "Certified Products",
-          tags: [
-            "Safety",
-            "Quality",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/sanitary-products-copy-space-assortment_23-2148911582.jpg?_wi=1",
-        },
+          id: "f2",          title: "Certified Products",          tags: [
+            "Safety",            "Quality"],
+          imageSrc: "http://img.b2bpic.net/free-photo/sanitary-products-copy-space-assortment_23-2148911582.jpg?_wi=1"},
         {
-          id: "f3",
-          title: "Expert Assistance",
-          tags: [
-            "Support",
-            "Consult",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/african-american-asisstant-explaining-surgery-symptoms-remote-doctor_482257-21320.jpg?_wi=1",
-        },
+          id: "f3",          title: "Expert Assistance",          tags: [
+            "Support",            "Consult"],
+          imageSrc: "http://img.b2bpic.net/free-photo/african-american-asisstant-explaining-surgery-symptoms-remote-doctor_482257-21320.jpg?_wi=1"},
       ]}
       title="Why Choose MediStore"
       description="We prioritize your health and safety above all else."
@@ -185,47 +136,17 @@ export default function LandingPage() {
       useInvertedBackground={false}
       products={[
         {
-          id: "p1",
-          name: "Pain Relief Tablet",
-          price: "$12.00",
-          variant: "General",
-          imageSrc: "http://img.b2bpic.net/free-photo/sealed-bottle-dairy_23-2147895674.jpg?_wi=1",
-        },
+          id: "p1",          name: "Pain Relief Tablet",          price: "$12.00",          variant: "General",          imageSrc: "http://img.b2bpic.net/free-photo/sealed-bottle-dairy_23-2147895674.jpg?_wi=1"},
         {
-          id: "p2",
-          name: "Daily Multivitamin",
-          price: "$25.00",
-          variant: "Health",
-          imageSrc: "http://img.b2bpic.net/free-photo/packings-pills-capsules-medicines_1339-2422.jpg",
-        },
+          id: "p2",          name: "Daily Multivitamin",          price: "$25.00",          variant: "Health",          imageSrc: "http://img.b2bpic.net/free-photo/packings-pills-capsules-medicines_1339-2422.jpg"},
         {
-          id: "p3",
-          name: "Antibiotic Tablet",
-          price: "$18.00",
-          variant: "General",
-          imageSrc: "http://img.b2bpic.net/free-photo/white-round-pills-arranged-isolated-backdrop_23-2147827900.jpg",
-        },
+          id: "p3",          name: "Antibiotic Tablet",          price: "$18.00",          variant: "General",          imageSrc: "http://img.b2bpic.net/free-photo/white-round-pills-arranged-isolated-backdrop_23-2147827900.jpg"},
         {
-          id: "p4",
-          name: "Calcium Supplement",
-          price: "$15.00",
-          variant: "Health",
-          imageSrc: "http://img.b2bpic.net/free-photo/medical-background_93675-130399.jpg",
-        },
+          id: "p4",          name: "Calcium Supplement",          price: "$15.00",          variant: "Health",          imageSrc: "http://img.b2bpic.net/free-photo/medical-background_93675-130399.jpg"},
         {
-          id: "p5",
-          name: "Cold Relief Tablet",
-          price: "$10.00",
-          variant: "General",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-white-yellow-pills-red-background_23-2147906048.jpg",
-        },
+          id: "p5",          name: "Cold Relief Tablet",          price: "$10.00",          variant: "General",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-white-yellow-pills-red-background_23-2147906048.jpg"},
         {
-          id: "p6",
-          name: "Vitamin C Boost",
-          price: "$20.00",
-          variant: "Health",
-          imageSrc: "http://img.b2bpic.net/free-photo/delicious-tomatoes-gmo-modified-food_23-2148747364.jpg",
-        },
+          id: "p6",          name: "Vitamin C Boost",          price: "$20.00",          variant: "Health",          imageSrc: "http://img.b2bpic.net/free-photo/delicious-tomatoes-gmo-modified-food_23-2148747364.jpg"},
       ]}
       title="Essential Tablet Inventory"
       description="Order your daily supplements and medicines easily."
@@ -239,26 +160,11 @@ export default function LandingPage() {
       useInvertedBackground={false}
       metrics={[
         {
-          id: "m1",
-          value: "100+",
-          title: "Verified Sellers",
-          description: "Global partners",
-          imageSrc: "http://img.b2bpic.net/free-photo/patient-filling-online-form-out_1098-16972.jpg",
-        },
+          id: "m1",          value: "100+",          title: "Verified Sellers",          description: "Global partners",          imageSrc: "http://img.b2bpic.net/free-photo/patient-filling-online-form-out_1098-16972.jpg"},
         {
-          id: "m2",
-          value: "99.9%",
-          title: "Customer Satisfaction",
-          description: "Highly rated",
-          imageSrc: "http://img.b2bpic.net/free-photo/still-life-arrangement-test-tubes_23-2149132626.jpg",
-        },
+          id: "m2",          value: "99.9%",          title: "Customer Satisfaction",          description: "Highly rated",          imageSrc: "http://img.b2bpic.net/free-photo/still-life-arrangement-test-tubes_23-2149132626.jpg"},
         {
-          id: "m3",
-          value: "50k",
-          title: "Successful Deliveries",
-          description: "Total orders",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-working-pharmaceutical-industry_23-2151684874.jpg",
-        },
+          id: "m3",          value: "50k",          title: "Successful Deliveries",          description: "Total orders",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-working-pharmaceutical-industry_23-2151684874.jpg"},
       ]}
       title="Our Impact"
       description="Serving thousands of families with health care."
@@ -271,60 +177,15 @@ export default function LandingPage() {
       useInvertedBackground={false}
       testimonials={[
         {
-          id: "1",
-          name: "Alice Johnson",
-          date: "2023-10-01",
-          title: "Very reliable",
-          quote: "Quick delivery and great prices.",
-          tag: "Verified",
-          avatarSrc: "http://img.b2bpic.net/free-photo/middle-age-brunette-woman-working-pharmacy-drugstore-covering-one-eye-with-hand-confident-smile-face-surprise-emotion_839833-4472.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/female-pharmacist-working-drugstore_259150-57972.jpg?_wi=2",
-          imageAlt: "happy pharmacy customer profile",
-        },
+          id: "1",          name: "Alice Johnson",          date: "2023-10-01",          title: "Very reliable",          quote: "Quick delivery and great prices.",          tag: "Verified",          avatarSrc: "http://img.b2bpic.net/free-photo/middle-age-brunette-woman-working-pharmacy-drugstore-covering-one-eye-with-hand-confident-smile-face-surprise-emotion_839833-4472.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/female-pharmacist-working-drugstore_259150-57972.jpg?_wi=2",          imageAlt: "happy pharmacy customer profile"},
         {
-          id: "2",
-          name: "Robert Smith",
-          date: "2023-10-05",
-          title: "Life saver",
-          quote: "Easy to order medicine online.",
-          tag: "Verified",
-          avatarSrc: "http://img.b2bpic.net/free-photo/couple-suffering-from-infertility_23-2149430773.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/old-man-with-laptop_1157-45381.jpg?_wi=2",
-          imageAlt: "happy pharmacy customer profile",
-        },
+          id: "2",          name: "Robert Smith",          date: "2023-10-05",          title: "Life saver",          quote: "Easy to order medicine online.",          tag: "Verified",          avatarSrc: "http://img.b2bpic.net/free-photo/couple-suffering-from-infertility_23-2149430773.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/old-man-with-laptop_1157-45381.jpg?_wi=2",          imageAlt: "happy pharmacy customer profile"},
         {
-          id: "3",
-          name: "Jane Doe",
-          date: "2023-10-10",
-          title: "Consistent",
-          quote: "Products are always fresh and genuine.",
-          tag: "Verified",
-          avatarSrc: "http://img.b2bpic.net/free-photo/happy-woman-african-american-female-doctor-shaking-hands-after-medical-appointment-clinic_637285-1164.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/sanitary-products-copy-space-assortment_23-2148911582.jpg?_wi=2",
-          imageAlt: "happy pharmacy customer profile",
-        },
+          id: "3",          name: "Jane Doe",          date: "2023-10-10",          title: "Consistent",          quote: "Products are always fresh and genuine.",          tag: "Verified",          avatarSrc: "http://img.b2bpic.net/free-photo/happy-woman-african-american-female-doctor-shaking-hands-after-medical-appointment-clinic_637285-1164.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/sanitary-products-copy-space-assortment_23-2148911582.jpg?_wi=2",          imageAlt: "happy pharmacy customer profile"},
         {
-          id: "4",
-          name: "John Miller",
-          date: "2023-10-15",
-          title: "Great service",
-          quote: "Support team is helpful.",
-          tag: "Verified",
-          avatarSrc: "http://img.b2bpic.net/free-photo/front-view-romantic-senior-couple-enjoying-their-time-bench-outdoors_23-2148645454.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/african-american-asisstant-explaining-surgery-symptoms-remote-doctor_482257-21320.jpg?_wi=2",
-          imageAlt: "happy pharmacy customer profile",
-        },
+          id: "4",          name: "John Miller",          date: "2023-10-15",          title: "Great service",          quote: "Support team is helpful.",          tag: "Verified",          avatarSrc: "http://img.b2bpic.net/free-photo/front-view-romantic-senior-couple-enjoying-their-time-bench-outdoors_23-2148645454.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/african-american-asisstant-explaining-surgery-symptoms-remote-doctor_482257-21320.jpg?_wi=2",          imageAlt: "happy pharmacy customer profile"},
         {
-          id: "5",
-          name: "Emily Davis",
-          date: "2023-10-20",
-          title: "Top notch",
-          quote: "My go-to store for meds.",
-          tag: "Verified",
-          avatarSrc: "http://img.b2bpic.net/free-photo/happy-mature-woman-talking-her-doctor-medical-clinic_637285-9073.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/sealed-bottle-dairy_23-2147895674.jpg?_wi=2",
-          imageAlt: "happy pharmacy customer profile",
-        },
+          id: "5",          name: "Emily Davis",          date: "2023-10-20",          title: "Top notch",          quote: "My go-to store for meds.",          tag: "Verified",          avatarSrc: "http://img.b2bpic.net/free-photo/happy-mature-woman-talking-her-doctor-medical-clinic_637285-9073.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/sealed-bottle-dairy_23-2147895674.jpg?_wi=2",          imageAlt: "happy pharmacy customer profile"},
       ]}
       title="What Our Customers Say"
       description="Trusted by thousands for their medical needs."
@@ -336,20 +197,11 @@ export default function LandingPage() {
       useInvertedBackground={false}
       faqs={[
         {
-          id: "f1",
-          title: "Do you need a prescription?",
-          content: "Yes, for prescription items we require a valid prescription upload.",
-        },
+          id: "f1",          title: "Do you need a prescription?",          content: "Yes, for prescription items we require a valid prescription upload."},
         {
-          id: "f2",
-          title: "How long is delivery?",
-          content: "Within 24 hours locally.",
-        },
+          id: "f2",          title: "How long is delivery?",          content: "Within 24 hours locally."},
         {
-          id: "f3",
-          title: "Can I return medicines?",
-          content: "Due to safety, we cannot accept returns.",
-        },
+          id: "f3",          title: "Can I return medicines?",          content: "Due to safety, we cannot accept returns."},
       ]}
       sideTitle="Common Questions"
       sideDescription="Everything you need to know about ordering."
@@ -361,8 +213,7 @@ export default function LandingPage() {
       <ContactText
       useInvertedBackground={false}
       background={{
-        variant: "plain",
-      }}
+        variant: "plain"}}
       text="Need assistance? Call us at +1-800-MEDICINE or email support@medistore.com."
     />
   </div>
@@ -372,29 +223,19 @@ export default function LandingPage() {
       logoText="MediStore"
       columns={[
         {
-          title: "Shop",
-          items: [
+          title: "Shop",          items: [
             {
-              label: "Tablets",
-              href: "#products",
-            },
+              label: "Tablets",              href: "#products"},
             {
-              label: "Vitamins",
-              href: "#products",
-            },
+              label: "Vitamins",              href: "#products"},
           ],
         },
         {
-          title: "Company",
-          items: [
+          title: "Company",          items: [
             {
-              label: "About",
-              href: "#about",
-            },
+              label: "About",              href: "#about"},
             {
-              label: "Support",
-              href: "#contact",
-            },
+              label: "Support",              href: "#contact"},
           ],
         },
       ]}
@@ -403,4 +244,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/variables.css

@@ -11,14 +11,14 @@
   --background-accent: #ffffff; */
 
   --background: #ffffff;
-  --card: #f8f9fa;
-  --foreground: #0a0a0a;
-  --primary-cta: #0a7039;
+  --card: #f9f9f9;
+  --foreground: #000000;
+  --primary-cta: #000000;
   --primary-cta-text: #ffffff;
-  --secondary-cta: #ffffff;
+  --secondary-cta: #f9f9f9;
   --secondary-cta-text: #0a0a0a;
-  --accent: #00ff99;
-  --background-accent: #e8f5e9;
+  --accent: #e2e2e2;
+  --background-accent: #f9f9f9;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);