From 6199fe70a8d01b66544669018ada6751ee690683 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Fri, 22 May 2026 09:26:59 +0000
Subject: [PATCH] Update src/app/page.tsx

---
 src/app/page.tsx | 490 +++++++++++++++--------------------------------
 1 file changed, 157 insertions(+), 333 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 89da30f..d305bbf 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -29,348 +29,172 @@ export default function LandingPage() {
         headingFontWeight="normal"
     >
       <ReactLenis root>
-  <div id="nav" data-section="nav">
-      <NavbarLayoutFloatingInline
-      navItems={[
-        {
-          name: "Home",
-          id: "hero",
-        },
-        {
-          name: "About",
-          id: "about",
-        },
-        {
-          name: "Work",
-          id: "work",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
-      ]}
-      brandName="Editorial Studio"
-    />
-  </div>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingInline
+            navItems={[
+              { name: "Home", id: "hero" },
+              { name: "About", id: "about" },
+              { name: "Work", id: "work" },
+              { name: "Contact", id: "contact" },
+            ]}
+            brandName="Editorial Studio"
+            button={{ text: "Contact Me", href: "#contact" }}
+          />
+        </div>
 
-  <div id="hero" data-section="hero">
-      <HeroBillboardCarousel
-      background={{
-        variant: "gradient-bars",
-      }}
-      title="Precision Editorial for High-Impact Storytelling"
-      description="I transform raw footage into compelling narratives. Bringing clarity, emotion, and technical excellence to every frame."
-      buttons={[
-        {
-          text: "View My Work",
-          href: "#work",
-        },
-        {
-          text: "Get In Touch",
-          href: "#contact",
-        },
-      ]}
-      mediaItems={[
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-notebook-store-desk_23-2149142185.jpg",
-          imageAlt: "editorial desk professional workspace",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/content-specialist-working-graphic-design-media-company-selecting-best-editorial-pictures-social-media-post-expert-editing-photos-advertising-agency-office-close-up-shot_482257-73457.jpg",
-          imageAlt: "video editing interface closeup",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/pensive-tailor-sitting-table-with-hand-chin-sewing-workshop_613910-5306.jpg",
-          imageAlt: "modern film production editing",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/empty-specialized-post-processing-studio-with-editing-software-interface-pc-screens_482257-82272.jpg",
-          imageAlt: "cinematic color grading screen",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/minimalist-spacious-interior-design_23-2150378903.jpg",
-          imageAlt: "creative content editing desk",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/electronic-gadgets-used-podcasting_482257-91517.jpg",
-          imageAlt: "film editing equipment professional",
-        },
-      ]}
-    />
-  </div>
+        <div id="hero" data-section="hero">
+          <HeroBillboardCarousel
+            background={{ variant: "gradient-bars" }}
+            title="Precision Editorial for High-Impact Storytelling"
+            description="I transform raw footage into compelling narratives. Bringing clarity, emotion, and technical excellence to every frame."
+            buttons={[
+              { text: "View My Work", href: "#work" },
+              { text: "Get In Touch", href: "#contact" },
+            ]}
+            mediaItems={[
+              { imageSrc: "http://img.b2bpic.net/free-photo/high-angle-notebook-store-desk_23-2149142185.jpg", imageAlt: "editorial desk professional workspace" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/content-specialist-working-graphic-design-media-company-selecting-best-editorial-pictures-social-media-post-expert-editing-photos-advertising-agency-office-close-up-shot_482257-73457.jpg", imageAlt: "video editing interface closeup" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/pensive-tailor-sitting-table-with-hand-chin-sewing-workshop_613910-5306.jpg", imageAlt: "modern film production editing" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/empty-specialized-post-processing-studio-with-editing-software-interface-pc-screens_482257-82272.jpg", imageAlt: "cinematic color grading screen" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/minimalist-spacious-interior-design_23-2150378903.jpg", imageAlt: "creative content editing desk" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/electronic-gadgets-used-podcasting_482257-91517.jpg", imageAlt: "film editing equipment professional" },
+            ]}
+          />
+        </div>
 
-  <div id="about" data-section="about">
-      <TestimonialAboutCard
-      useInvertedBackground={true}
-      tag="About Me"
-      title="Editor, Storyteller, Creator"
-      description="With over 8 years in the industry, I specialize in crafting narratives that resonate. My philosophy is simple: clean cuts for clean stories."
-      subdescription="Whether it's long-form documentaries or high-energy marketing campaigns, I bring a meticulous eye to every project."
-      icon={PenTool}
-      imageSrc="http://img.b2bpic.net/free-photo/software-developer-agency-office-coding-her-computer_482257-126122.jpg"
-      mediaAnimation="slide-up"
-      imageAlt="professional headshot creative editor"
-    />
-  </div>
+        <div id="about" data-section="about">
+          <TestimonialAboutCard
+            useInvertedBackground={true}
+            tag="About Me"
+            title="Editor, Storyteller, Creator"
+            description="With over 8 years in the industry, I specialize in crafting narratives that resonate. My philosophy is simple: clean cuts for clean stories."
+            subdescription="Whether it's long-form documentaries or high-energy marketing campaigns, I bring a meticulous eye to every project."
+            icon={PenTool}
+            imageSrc="http://img.b2bpic.net/free-photo/software-developer-agency-office-coding-her-computer_482257-126122.jpg"
+            mediaAnimation="slide-up"
+            imageAlt="professional headshot creative editor"
+          />
+        </div>
 
-  <div id="features" data-section="features">
-      <FeatureCardTwentyOne
-      useInvertedBackground={false}
-      title="My Creative Workflow"
-      description="Tailored solutions for every editing challenge."
-      accordionItems={[
-        {
-          id: "1",
-          title: "Narrative Crafting",
-          content: "I focus on pacing and emotional arc to ensure your audience stays engaged.",
-        },
-        {
-          id: "2",
-          title: "Technical Precision",
-          content: "Mastering color grading, sound design, and complex visual effects for seamless delivery.",
-        },
-        {
-          id: "3",
-          title: "Collaborative Process",
-          content: "Your vision is paramount. I ensure clear communication and fast turnaround at every stage.",
-        },
-      ]}
-      imageSrc="http://img.b2bpic.net/free-photo/smart-medical-lab-workstation-background-with-digital-apps-computer-screen_482257-124525.jpg"
-      mediaAnimation="blur-reveal"
-      imageAlt="editorial desk professional workspace"
-    />
-  </div>
+        <div id="features" data-section="features">
+          <FeatureCardTwentyOne
+            useInvertedBackground={false}
+            title="My Creative Workflow"
+            description="Tailored solutions for every editing challenge."
+            accordionItems={[
+              { id: "1", title: "Narrative Crafting", content: "I focus on pacing and emotional arc to ensure your audience stays engaged." },
+              { id: "2", title: "Technical Precision", content: "Mastering color grading, sound design, and complex visual effects for seamless delivery." },
+              { id: "3", title: "Collaborative Process", content: "Your vision is paramount. I ensure clear communication and fast turnaround at every stage." },
+            ]}
+            imageSrc="http://img.b2bpic.net/free-photo/smart-medical-lab-workstation-background-with-digital-apps-computer-screen_482257-124525.jpg"
+            mediaAnimation="blur-reveal"
+            imageAlt="editorial desk professional workspace"
+          />
+        </div>
 
-  <div id="work" data-section="work">
-      <ProductCardTwo
-      animationType="slide-up"
-      textboxLayout="default"
-      gridVariant="asymmetric-60-wide-40-narrow"
-      useInvertedBackground={true}
-      products={[
-        {
-          id: "1",
-          brand: "Documentary",
-          name: "Life in Focus",
-          price: "Featured",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/girl-with-pigtails-white-blouse-old-library_627829-6499.jpg",
-        },
-        {
-          id: "2",
-          brand: "Branded",
-          name: "Echoes of Modernism",
-          price: "Client-Work",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/it-s-movie-time-lettering-vintage-movie-camera_23-2148416753.jpg",
-        },
-        {
-          id: "3",
-          brand: "Film",
-          name: "Silent Horizon",
-          price: "Indie",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/interconnected-screens-collage-showing-modern-social-media-feed-clips_482257-129691.jpg",
-        },
-        {
-          id: "4",
-          brand: "Social",
-          name: "The Brand Pulse",
-          price: "Campaign",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/still-life-small-decorative-objects_23-2149865501.jpg",
-        },
-        {
-          id: "5",
-          brand: "Music",
-          name: "Midnight Flow",
-          price: "Clip",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-male-with-camera-cave-taking-picture_181624-3533.jpg",
-        },
-        {
-          id: "6",
-          brand: "Editorial",
-          name: "Modern Muse",
-          price: "Feature",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/top-view-compostable-containers-arrangement_23-2149353101.jpg",
-        },
-      ]}
-      title="Selected Editorial Work"
-      description="A showcase of recent narratives, films, and branded content."
-    />
-  </div>
+        <div id="work" data-section="work">
+          <ProductCardTwo
+            animationType="slide-up"
+            textboxLayout="default"
+            gridVariant="asymmetric-60-wide-40-narrow"
+            useInvertedBackground={true}
+            products={[
+              { id: "1", brand: "Documentary", name: "Life in Focus", price: "Featured", rating: 5, reviewCount: "48", imageSrc: "http://img.b2bpic.net/free-photo/girl-with-pigtails-white-blouse-old-library_627829-6499.jpg" },
+              { id: "2", brand: "Branded", name: "Echoes of Modernism", price: "Client-Work", rating: 5, reviewCount: "32", imageSrc: "http://img.b2bpic.net/free-photo/it-s-movie-time-lettering-vintage-movie-camera_23-2148416753.jpg" },
+              { id: "3", brand: "Film", name: "Silent Horizon", price: "Indie", rating: 5, reviewCount: "25", imageSrc: "http://img.b2bpic.net/free-photo/interconnected-screens-collage-showing-modern-social-media-feed-clips_482257-129691.jpg" },
+              { id: "4", brand: "Social", name: "The Brand Pulse", price: "Campaign", rating: 5, reviewCount: "89", imageSrc: "http://img.b2bpic.net/free-photo/still-life-small-decorative-objects_23-2149865501.jpg" },
+              { id: "5", brand: "Music", name: "Midnight Flow", price: "Clip", rating: 5, reviewCount: "41", imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-male-with-camera-cave-taking-picture_181624-3533.jpg" },
+              { id: "6", brand: "Editorial", name: "Modern Muse", price: "Feature", rating: 5, reviewCount: "15", imageSrc: "http://img.b2bpic.net/free-photo/top-view-compostable-containers-arrangement_23-2149353101.jpg" },
+            ]}
+            title="Selected Editorial Work"
+            description="A showcase of recent narratives, films, and branded content."
+          />
+        </div>
 
-  <div id="testimonials" data-section="testimonials">
-      <TestimonialCardOne
-      animationType="slide-up"
-      textboxLayout="default"
-      gridVariant="uniform-all-items-equal"
-      useInvertedBackground={false}
-      testimonials={[
-        {
-          id: "1",
-          name: "Sarah Miller",
-          role: "Creative Director",
-          company: "Studio B",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/closeup-serious-business-leader-sitting_1262-4831.jpg",
-        },
-        {
-          id: "2",
-          name: "Marcus Thorne",
-          role: "Film Producer",
-          company: "Global Media",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/browneyed-shorthaired-young-lady-stylish-floral-summer-dress-looks-into-camera-smiles-gently-poses-cozy-room_197531-29853.jpg",
-        },
-        {
-          id: "3",
-          name: "Elena Rodriguez",
-          role: "Lead Editor",
-          company: "Creative Lab",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-businessman-with-tie_1098-2867.jpg",
-        },
-        {
-          id: "4",
-          name: "David Chen",
-          role: "Content Lead",
-          company: "Innovate",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiley-woman_23-2149022640.jpg",
-        },
-        {
-          id: "5",
-          name: "Sophia Lee",
-          role: "Founder",
-          company: "StartUp HQ",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-business-woman-with-executive-job-working-with-management-marketing-statistics-computer-office-worker-analyzing-research-charts-data-reports_482257-41126.jpg",
-        },
-      ]}
-      title="Client Perspectives"
-      description="Words from those I've had the pleasure to work with."
-    />
-  </div>
+        <div id="testimonials" data-section="testimonials">
+          <TestimonialCardOne
+            animationType="slide-up"
+            textboxLayout="default"
+            gridVariant="uniform-all-items-equal"
+            useInvertedBackground={false}
+            testimonials={[
+              { id: "1", name: "Sarah Miller", role: "Creative Director", company: "Studio B", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/closeup-serious-business-leader-sitting_1262-4831.jpg" },
+              { id: "2", name: "Marcus Thorne", role: "Film Producer", company: "Global Media", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/browneyed-shorthaired-young-lady-stylish-floral-summer-dress-looks-into-camera-smiles-gently-poses-cozy-room_197531-29853.jpg" },
+              { id: "3", name: "Elena Rodriguez", role: "Lead Editor", company: "Creative Lab", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-businessman-with-tie_1098-2867.jpg" },
+              { id: "4", name: "David Chen", role: "Content Lead", company: "Innovate", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiley-woman_23-2149022640.jpg" },
+              { id: "5", name: "Sophia Lee", role: "Founder", company: "StartUp HQ", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-business-woman-with-executive-job-working-with-management-marketing-statistics-computer-office-worker-analyzing-research-charts-data-reports_482257-41126.jpg" },
+            ]}
+            title="Client Perspectives"
+            description="Words from those I've had the pleasure to work with."
+          />
+        </div>
 
-  <div id="metrics" data-section="metrics">
-      <MetricCardThree
-      animationType="slide-up"
-      textboxLayout="default"
-      useInvertedBackground={true}
-      metrics={[
-        {
-          id: "m1",
-          icon: Film,
-          title: "Projects Completed",
-          value: "150+",
-        },
-        {
-          id: "m2",
-          icon: Clock,
-          title: "Hours Edited",
-          value: "2000+",
-        },
-        {
-          id: "m3",
-          icon: Award,
-          title: "Awards & Distinctions",
-          value: "12",
-        },
-      ]}
-      title="Impact by the Numbers"
-      description="Quantifying the creative editorial results."
-    />
-  </div>
+        <div id="metrics" data-section="metrics">
+          <MetricCardThree
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={true}
+            metrics={[
+              { id: "m1", icon: Film, title: "Projects Completed", value: "150+" },
+              { id: "m2", icon: Clock, title: "Hours Edited", value: "2000+" },
+              { id: "m3", icon: Award, title: "Awards & Distinctions", value: "12" },
+            ]}
+            title="Impact by the Numbers"
+            description="Quantifying the creative editorial results."
+          />
+        </div>
 
-  <div id="faq" data-section="faq">
-      <FaqDouble
-      textboxLayout="default"
-      useInvertedBackground={false}
-      faqs={[
-        {
-          id: "1",
-          title: "What is your typical turnaround?",
-          content: "Turnaround depends on complexity, but I prioritize clear timelines to meet your launch dates.",
-        },
-        {
-          id: "2",
-          title: "Do you offer remote collaboration?",
-          content: "Yes, I am fully equipped for remote editorial workflows and project management.",
-        },
-        {
-          id: "3",
-          title: "What editing suites do you work with?",
-          content: "I am proficient in Premiere Pro, DaVinci Resolve, and Final Cut Pro.",
-        },
-      ]}
-      title="Common Inquiries"
-      description="Clear answers about how we can work together."
-      faqsAnimation="slide-up"
-    />
-  </div>
+        <div id="faq" data-section="faq">
+          <FaqDouble
+            textboxLayout="default"
+            useInvertedBackground={false}
+            faqs={[
+              { id: "1", title: "What is your typical turnaround?", content: "Turnaround depends on complexity, but I prioritize clear timelines to meet your launch dates." },
+              { id: "2", title: "Do you offer remote collaboration?", content: "Yes, I am fully equipped for remote editorial workflows and project management." },
+              { id: "3", title: "What editing suites do you work with?", content: "I am proficient in Premiere Pro, DaVinci Resolve, and Final Cut Pro." },
+            ]}
+            title="Common Inquiries"
+            description="Clear answers about how we can work together."
+            faqsAnimation="slide-up"
+          />
+        </div>
 
-  <div id="contact" data-section="contact">
-      <ContactCenter
-      useInvertedBackground={true}
-      background={{
-        variant: "gradient-bars",
-      }}
-      tag="Let's Connect"
-      title="Ready for your next project?"
-      description="Send a message and let's bring your vision to life."
-    />
-  </div>
+        <div id="contact" data-section="contact">
+          <ContactCenter
+            useInvertedBackground={true}
+            background={{ variant: "gradient-bars" }}
+            tag="Let's Connect"
+            title="Ready for your next project?"
+            description="Send a message and let's bring your vision to life."
+          />
+        </div>
 
-  <div id="footer" data-section="footer">
-      <FooterBaseCard
-      logoText="Editorial Studio"
-      columns={[
-        {
-          title: "Portfolio",
-          items: [
-            {
-              label: "Selected Work",
-              href: "#work",
-            },
-            {
-              label: "Services",
-              href: "#features",
-            },
-          ],
-        },
-        {
-          title: "Connect",
-          items: [
-            {
-              label: "Contact",
-              href: "#contact",
-            },
-            {
-              label: "LinkedIn",
-              href: "#",
-            },
-          ],
-        },
-        {
-          title: "Legal",
-          items: [
-            {
-              label: "Privacy Policy",
-              href: "#",
-            },
-            {
-              label: "Terms",
-              href: "#",
-            },
-          ],
-        },
-      ]}
-    />
-  </div>
+        <div id="footer" data-section="footer">
+          <FooterBaseCard
+            logoText="Editorial Studio"
+            columns={[
+              {
+                title: "Portfolio",                items: [
+                  { label: "Selected Work", href: "#work" },
+                  { label: "Services", href: "#features" },
+                ],
+              },
+              {
+                title: "Connect",                items: [
+                  { label: "Contact", href: "#contact" },
+                  { label: "LinkedIn", href: "#" },
+                ],
+              },
+              {
+                title: "Legal",                items: [
+                  { label: "Privacy Policy", href: "#" },
+                  { label: "Terms", href: "#" },
+                ],
+              },
+            ]}
+          />
+        </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}
\ No newline at end of file
-- 
2.49.1