From 1c9cf55257fb48b09e178bd5361b2c2d30e548f7 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Tue, 24 Mar 2026 16:15:56 +0000
Subject: [PATCH] Update src/app/page.tsx

---
 src/app/page.tsx | 410 ++++++++++++++---------------------------------
 1 file changed, 120 insertions(+), 290 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 1a4c411..636cca8 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -11,7 +11,7 @@ import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
 import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
 import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
 import TextAbout from '@/components/sections/about/TextAbout';
-import { Book, BookOpen, Clock, Instagram, Lightbulb, PenTool, Star, Twitter, Users } from "lucide-react";
+import { Book, BookOpen, Clock, Coffee, Instagram, Lightbulb, PenTool, Star, Twitter, Users } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -19,305 +19,135 @@ export default function LandingPage() {
         defaultButtonVariant="text-stagger"
         defaultTextAnimation="entrance-slide"
         borderRadius="rounded"
+        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: "About",
-          id: "about",
-        },
-        {
-          name: "Features",
-          id: "features",
-        },
-        {
-          name: "Testimonials",
-          id: "testimonials",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
-      ]}
-      brandName="Together"
-      button={{
-        text: "Join Club",
-        href: "#contact",
-      }}
-    />
-  </div>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingInline
+            navItems={[
+              { name: "Home", id: "hero" },
+              { name: "About", id: "about" },
+              { name: "Features", id: "features" },
+              { name: "Testimonials", id: "testimonials" },
+              { name: "Contact", id: "contact" },
+            ]}
+            brandName="Together"
+            button={{ text: "Join Club", href: "#contact" }}
+          />
+        </div>
 
-  <div id="hero" data-section="hero">
-      <HeroSplitKpi
-      background={{
-        variant: "plain",
-      }}
-      title="Stories Best Shared Together"
-      description="Join our community of passionate readers. Discover your next favorite book, engage in deep discussions, and build lasting friendships one page at a time."
-      kpis={[
-        {
-          value: "500+",
-          label: "Active Members",
-        },
-        {
-          value: "120+",
-          label: "Books Read",
-        },
-        {
-          value: "12+",
-          label: "Chapters Worldwide",
-        },
-      ]}
-      enableKpiAnimation={true}
-      buttons={[
-        {
-          text: "Join The Club",
-          href: "#contact",
-        },
-      ]}
-      imageSrc="https://pixabay.com/get/gbbb368d4f269a90dc37047aa9b0f07abb653ddbdab583e747ab7b5b657cd590f31e3460c1b06968f7773095b6a07a33074de66977e1d8fe667ae264c0a71c7f9_1280.jpg"
-      imageAlt="Reading environment"
-      mediaAnimation="slide-up"
-    />
-  </div>
+        <div id="hero" data-section="hero">
+          <HeroSplitKpi
+            title="Stories Best Shared Together"
+            description="Join our community of passionate readers. Discover your next favorite book, engage in deep discussions, and build lasting friendships one page at a time."
+            background={{ variant: "plain" }}
+            kpis={[
+              { value: "500+", label: "Active Members" },
+              { value: "120+", label: "Books Read" },
+              { value: "12+", label: "Chapters Worldwide" },
+            ]}
+            enableKpiAnimation={true}
+            buttons={[{ text: "Join The Club", href: "#contact" }]}
+            imageSrc="https://pixabay.com/get/gbbb368d4f269a90dc37047aa9b0f07abb653ddbdab583e747ab7b5b657cd590f31e3460c1b06968f7773095b6a07a33074de66977e1d8fe667ae264c0a71c7f9_1280.jpg"
+            imageAlt="Reading environment"
+            mediaAnimation="slide-up"
+          />
+        </div>
 
-  <div id="about" data-section="about">
-      <TextAbout
-      useInvertedBackground={false}
-      tag="Our Mission"
-      title="Building a Community Where Every Book Has a Voice"
-      buttons={[
-        {
-          text: "Learn More",
-        },
-      ]}
-    />
-  </div>
+        <div id="about" data-section="about">
+          <TextAbout
+            tag="Our Mission"
+            title="Building a Community Where Every Book Has a Voice"
+            buttons={[{ text: "Learn More" }]}
+            useInvertedBackground={false}
+          />
+        </div>
 
-  <div id="features" data-section="features">
-      <FeatureCardNineteen
-      textboxLayout="split"
-      useInvertedBackground={true}
-      features={[
-        {
-          id: 1,
-          tag: "Discussions",
-          title: "Deep Dive Sessions",
-          subtitle: "Weekly meetings",
-          description: "Engage in meaningful conversations about themes, characters, and personal interpretations of every book we select.",
-          imageSrc: "https://pixabay.com/get/ga56715e86f4a993d2485c545be1cec9c1c1718f1a3201ed3556f023997130d59b87858bbbc561e597cdfaac5fb63c2b71fc348142d76fc4f4420c2c4e70399c5_1280.jpg?_wi=1",
-        },
-        {
-          id: 2,
-          tag: "Curated",
-          title: "Curated Reading Tracks",
-          subtitle: "Discover new genres",
-          description: "Explore curated lists designed to challenge your perspectives and broaden your literary horizons comfortably.",
-          imageSrc: "https://pixabay.com/get/g3206dd8c4ae854b0606bb1cb41bcd9d41761386b5b5e796bd6b72c2d314a12f2af6347c6d6c6b2982285a6259641ac7d1f551538b090c3d939a723862263e7c2_1280.jpg?_wi=1",
-        },
-        {
-          id: 3,
-          tag: "Social",
-          title: "Author Q&A Events",
-          subtitle: "Connect directly",
-          description: "Exclusive opportunities to engage with contemporary authors and gain insights behind the creative process.",
-          imageSrc: "https://pixabay.com/get/ga56715e86f4a993d2485c545be1cec9c1c1718f1a3201ed3556f023997130d59b87858bbbc561e597cdfaac5fb63c2b71fc348142d76fc4f4420c2c4e70399c5_1280.jpg?_wi=2",
-        },
-      ]}
-      title="Why Members Love Us"
-      description="Everything you need to enrich your reading journey."
-    />
-  </div>
+        <div id="features" data-section="features">
+          <FeatureCardNineteen
+            textboxLayout="split"
+            useInvertedBackground={true}
+            features={[
+              { id: 1, tag: "Discussions", title: "Deep Dive Sessions", subtitle: "Weekly meetings", description: "Engage in meaningful conversations about themes, characters, and personal interpretations of every book we select.", imageSrc: "https://pixabay.com/get/ga56715e86f4a993d2485c545be1cec9c1c1718f1a3201ed3556f023997130d59b87858bbbc561e597cdfaac5fb63c2b71fc348142d76fc4f4420c2c4e70399c5_1280.jpg" },
+              { id: 2, tag: "Curated", title: "Curated Reading Tracks", subtitle: "Discover new genres", description: "Explore curated lists designed to challenge your perspectives and broaden your literary horizons comfortably.", imageSrc: "https://pixabay.com/get/g3206dd8c4ae854b0606bb1cb41bcd9d41761386b5b5e796bd6b72c2d314a12f2af6347c6d6c6b2982285a6259641ac7d1f551538b090c3d939a723862263e7c2_1280.jpg" },
+              { id: 3, tag: "Social", title: "Author Q&A Events", subtitle: "Connect directly", description: "Exclusive opportunities to engage with contemporary authors and gain insights behind the creative process.", imageSrc: "https://pixabay.com/get/ga56715e86f4a993d2485c545be1cec9c1c1718f1a3201ed3556f023997130d59b87858bbbc561e597cdfaac5fb63c2b71fc348142d76fc4f4420c2c4e70399c5_1280.jpg" },
+            ]}
+            title="Why Members Love Us"
+            description="Everything you need to enrich your reading journey."
+          />
+        </div>
 
-  <div id="metrics" data-section="metrics">
-      <MetricCardOne
-      animationType="slide-up"
-      textboxLayout="default"
-      gridVariant="uniform-all-items-equal"
-      useInvertedBackground={false}
-      metrics={[
-        {
-          id: "m1",
-          value: "1.2k",
-          title: "Total Discussions",
-          description: "Lively conversations held",
-          icon: BookOpen,
-        },
-        {
-          id: "m2",
-          value: "45",
-          title: "Genres Covered",
-          description: "Diverse literary exploration",
-          icon: BookOpen,
-        },
-        {
-          id: "m3",
-          value: "98%",
-          title: "Member Satisfaction",
-          description: "Highly engaged community",
-          icon: Star,
-        },
-      ]}
-      title="Club Milestones"
-      description="Celebrating our growth and shared passion for literature."
-    />
-  </div>
+        <div id="metrics" data-section="metrics">
+          <MetricCardOne
+            animationType="slide-up"
+            textboxLayout="default"
+            gridVariant="uniform-all-items-equal"
+            useInvertedBackground={false}
+            metrics={[
+              { id: "m1", value: "1.2k", title: "Total Discussions", description: "Lively conversations held", icon: BookOpen },
+              { id: "m2", value: "45", title: "Genres Covered", description: "Diverse literary exploration", icon: BookOpen },
+              { id: "m3", value: "98%", title: "Member Satisfaction", description: "Highly engaged community", icon: Star },
+            ]}
+            title="Club Milestones"
+            description="Celebrating our growth and shared passion for literature."
+          />
+        </div>
 
-  <div id="testimonials" data-section="testimonials">
-      <TestimonialCardFive
-      textboxLayout="default"
-      useInvertedBackground={true}
-      testimonials={[
-        {
-          id: "t1",
-          name: "Sarah J.",
-          date: "Jan 2025",
-          title: "Transformative",
-          quote: "Together has completely transformed how I consume literature. The discussions are life-changing.",
-          tag: "Verified",
-          avatarSrc: "https://pixabay.com/get/gc86d602594759328954f6a8dd6abb91158d1acf1de4d980efc833d7a052df7fae3c7fd2c80f95fa606384b58597ec3e6193f6a3b7fc6ee1f20f8fbdb9789b8bc_1280.jpg",
-        },
-        {
-          id: "t2",
-          name: "Mark D.",
-          date: "Dec 2024",
-          title: "Inclusive",
-          quote: "I love the diverse reading tracks. It pushes me outside my comfort zone every single month.",
-          tag: "Verified",
-          avatarSrc: "https://pixabay.com/get/g2ddb3bdfce780ca9037326e547a961fe28772c6c8fbb6d536c06572f52e87186f993dcd17e608e9f11b0441588197400efe469a77ecd011945e594f200c9e080_1280.jpg",
-        },
-        {
-          id: "t3",
-          name: "Elena R.",
-          date: "Nov 2024",
-          title: "Engaging",
-          quote: "The author sessions are fantastic. Connecting directly with the writers is a dream come true.",
-          tag: "Verified",
-          avatarSrc: "https://pixabay.com/get/g2ec11fa8dc1d6766bdf1038e81ec640ac3aca501d08ebc285cd0b1bb89023d72dc96fa6ddea44897d06dfc425b1d0307f3be149dd1eaff272553219a88a06bfc_1280.jpg",
-        },
-        {
-          id: "t4",
-          name: "James L.",
-          date: "Oct 2024",
-          title: "Cozy Atmosphere",
-          quote: "Such a warm, friendly community. I’ve made lifelong friends through our monthly meetings.",
-          tag: "Verified",
-          avatarSrc: "https://pixabay.com/get/g69ff47130051e8513df3b693176897462556daa780e6a06ed71c0e6daf83d08fb66b1cefd143742e80f1ee6f7b169dc4a001366b0658570d9e3abe325f0e3982_1280.jpg",
-        },
-      ]}
-      title="What Readers Say"
-      description="Hear about the experiences of our wonderful club members."
-    />
-  </div>
+        <div id="testimonials" data-section="testimonials">
+          <TestimonialCardFive
+            textboxLayout="default"
+            useInvertedBackground={true}
+            testimonials={[
+              { id: "t1", name: "Sarah J.", date: "Jan 2025", title: "Transformative", quote: "Together has completely transformed how I consume literature. The discussions are life-changing.", tag: "Verified", avatarSrc: "https://pixabay.com/get/gc86d602594759328954f6a8dd6abb91158d1acf1de4d980efc833d7a052df7fae3c7fd2c80f95fa606384b58597ec3e6193f6a3b7fc6ee1f20f8fbdb9789b8bc_1280.jpg" },
+              { id: "t2", name: "Mark D.", date: "Dec 2024", title: "Inclusive", quote: "I love the diverse reading tracks. It pushes me outside my comfort zone every single month.", tag: "Verified", avatarSrc: "https://pixabay.com/get/g2ddb3bdfce780ca9037326e547a961fe28772c6c8fbb6d536c06572f52e87186f993dcd17e608e9f11b0441588197400efe469a77ecd011945e594f200c9e080_1280.jpg" },
+              { id: "t3", name: "Elena R.", date: "Nov 2024", title: "Engaging", quote: "The author sessions are fantastic. Connecting directly with the writers is a dream come true.", tag: "Verified", avatarSrc: "https://pixabay.com/get/g2ec11fa8dc1d6766bdf1038e81ec640ac3aca501d08ebc285cd0b1bb89023d72dc96fa6ddea44897d06dfc425b1d0307f3be149dd1eaff272553219a88a06bfc_1280.jpg" },
+              { id: "t4", name: "James L.", date: "Oct 2024", title: "Cozy Atmosphere", quote: "Such a warm, friendly community. I’ve made lifelong friends through our monthly meetings.", tag: "Verified", avatarSrc: "https://pixabay.com/get/g69ff47130051e8513df3b693176897462556daa780e6a06ed71c0e6daf83d08fb66b1cefd143742e80f1ee6f7b169dc4a001366b0658570d9e3abe325f0e3982_1280.jpg" },
+            ]}
+            title="What Readers Say"
+            description="Hear about the experiences of our wonderful club members."
+          />
+        </div>
 
-  <div id="features-track" data-section="features-track">
-      <FeatureCardTen
-      animationType="slide-up"
-      textboxLayout="default"
-      useInvertedBackground={false}
-      features={[
-        {
-          id: "f1",
-          title: "Fiction & Classics",
-          description: "Timeless stories for the soul.",
-          media: {
-            imageSrc: "https://pixabay.com/get/ga56715e86f4a993d2485c545be1cec9c1c1718f1a3201ed3556f023997130d59b87858bbbc561e597cdfaac5fb63c2b71fc348142d76fc4f4420c2c4e70399c5_1280.jpg?_wi=3",
-          },
-          items: [
-            {
-              icon: Book,
-              text: "Monthly classics discussion",
-            },
-            {
-              icon: PenTool,
-              text: "Deep character analysis",
-            },
-          ],
-          reverse: false,
-        },
-        {
-          id: "f2",
-          title: "Non-Fiction Growth",
-          description: "Learning and expanding knowledge.",
-          media: {
-            imageSrc: "https://pixabay.com/get/g3206dd8c4ae854b0606bb1cb41bcd9d41761386b5b5e796bd6b72c2d314a12f2af6347c6d6c6b2982285a6259641ac7d1f551538b090c3d939a723862263e7c2_1280.jpg?_wi=2",
-          },
-          items: [
-            {
-              icon: Lightbulb,
-              text: "Practical application",
-            },
-            {
-              icon: Users,
-              text: "Expert-led dialogues",
-            },
-          ],
-          reverse: true,
-        },
-        {
-          id: "f3",
-          title: "Short Story Cycle",
-          description: "Bitesize literature for busy lives.",
-          media: {
-            imageSrc: "https://pixabay.com/get/ga56715e86f4a993d2485c545be1cec9c1c1718f1a3201ed3556f023997130d59b87858bbbc561e597cdfaac5fb63c2b71fc348142d76fc4f4420c2c4e70399c5_1280.jpg?_wi=4",
-          },
-          items: [
-            {
-              icon: Clock,
-              text: "Weekly rapid reads",
-            },
-            {
-              icon: Coffee,
-              text: "Relaxed atmosphere",
-            },
-          ],
-          reverse: false,
-        },
-      ]}
-      title="How We Read"
-      description="Structured paths for every type of reader."
-    />
-  </div>
+        <div id="features-track" data-section="features-track">
+          <FeatureCardTen
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            features={[
+              { id: "f1", title: "Fiction & Classics", description: "Timeless stories for the soul.", media: { imageSrc: "https://pixabay.com/get/ga56715e86f4a993d2485c545be1cec9c1c1718f1a3201ed3556f023997130d59b87858bbbc561e597cdfaac5fb63c2b71fc348142d76fc4f4420c2c4e70399c5_1280.jpg" }, items: [{ icon: Book, text: "Monthly classics discussion" }, { icon: PenTool, text: "Deep character analysis" }], reverse: false },
+              { id: "f2", title: "Non-Fiction Growth", description: "Learning and expanding knowledge.", media: { imageSrc: "https://pixabay.com/get/g3206dd8c4ae854b0606bb1cb41bcd9d41761386b5b5e796bd6b72c2d314a12f2af6347c6d6c6b2982285a6259641ac7d1f551538b090c3d939a723862263e7c2_1280.jpg" }, items: [{ icon: Lightbulb, text: "Practical application" }, { icon: Users, text: "Expert-led dialogues" }], reverse: true },
+              { id: "f3", title: "Short Story Cycle", description: "Bitesize literature for busy lives.", media: { imageSrc: "https://pixabay.com/get/ga56715e86f4a993d2485c545be1cec9c1c1718f1a3201ed3556f023997130d59b87858bbbc561e597cdfaac5fb63c2b71fc348142d76fc4f4420c2c4e70399c5_1280.jpg" }, items: [{ icon: Clock, text: "Weekly rapid reads" }, { icon: Coffee, text: "Relaxed atmosphere" }], reverse: false },
+            ]}
+            title="How We Read"
+            description="Structured paths for every type of reader."
+          />
+        </div>
 
-  <div id="contact" data-section="contact">
-      <ContactText
-      useInvertedBackground={true}
-      background={{
-        variant: "sparkles-gradient",
-      }}
-      text="Ready to write the next chapter with us? Join 'Together' today and find your literary family."
-      buttons={[
-        {
-          text: "Apply to Join",
-        },
-      ]}
-    />
-  </div>
+        <div id="contact" data-section="contact">
+          <ContactText
+            text="Ready to write the next chapter with us? Join 'Together' today and find your literary family."
+            background={{ variant: "sparkles-gradient" }}
+            buttons={[{ text: "Apply to Join" }]}
+            useInvertedBackground={true}
+          />
+        </div>
 
-  <div id="footer" data-section="footer">
-      <FooterCard
-      logoText="Together"
-      copyrightText="© 2025 Together Reading Club"
-      socialLinks={[
-        {
-          icon: Twitter,
-          href: "#",
-          ariaLabel: "Twitter",
-        },
-        {
-          icon: Instagram,
-          href: "#",
-          ariaLabel: "Instagram",
-        },
-      ]}
-    />
-  </div>
+        <div id="footer" data-section="footer">
+          <FooterCard
+            logoText="Together"
+            copyrightText="© 2025 Together Reading Club"
+            socialLinks={[
+              { icon: Twitter, href: "#", ariaLabel: "Twitter" },
+              { icon: Instagram, href: "#", ariaLabel: "Instagram" },
+            ]}
+          />
+        </div>
       </ReactLenis>
     </ThemeProvider>
   );
-- 
2.49.1