From 646a42b782af66890c8d52a9cebece9bfd85c33d Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Sun, 19 Apr 2026 03:06:50 +0000
Subject: [PATCH] Update src/app/page.tsx

---
 src/app/page.tsx | 461 ++++++++++++++---------------------------------
 1 file changed, 138 insertions(+), 323 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 2154637..992efe9 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -2,346 +2,161 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
-import FaqBase from '@/components/sections/faq/FaqBase';
-import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
-import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
+import { Shield, TrendingUp, Zap } from "lucide-react";
+import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
 import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
+import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
+import ProductCardFour from '@/components/sections/product/ProductCardFour';
 import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
 import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
-import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
-import ProductCardFour from '@/components/sections/product/ProductCardFour';
-import { Shield, TrendingUp, Zap } from "lucide-react";
+import FaqBase from '@/components/sections/faq/FaqBase';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
+import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
 
 export default function LandingPage() {
   return (
     <ThemeProvider
-        defaultButtonVariant="bounce-effect"
-        defaultTextAnimation="background-highlight"
-        borderRadius="pill"
+      defaultButtonVariant="bounce-effect"
+      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: "Features",
-          id: "#features",
-        },
-        {
-          name: "Pricing",
-          id: "#pricing",
-        },
-        {
-          name: "FAQ",
-          id: "#faq",
-        },
-      ]}
-      brandName="Webild"
-      button={{
-        text: "Log in",
-        href: "#contact",
-      }}
-    />
-  </div>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingInline
+            navItems={[
+              { name: "Features", id: "features" },
+              { name: "Pricing", id: "pricing" },
+              { name: "FAQ", id: "faq" }
+            ]}
+            brandName="Webild"
+            button={{ text: "Log in", href: "#contact" }}
+          />
+        </div>
 
-  <div id="hero" data-section="hero">
-      <HeroBillboardGallery
-      background={{
-        variant: "sparkles-gradient",
-      }}
-      title="Turn Your Idea Into a Professional Website In Minutes"
-      description="Generate Websites Instantly, Customize to Perfection. No coding required, just your ideas brought to life."
-      buttons={[
-        {
-          text: "Get Started",
-          href: "#contact",
-        },
-      ]}
-      mediaItems={[
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169856.jpg",
-          imageAlt: "Idea Generation Interface",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/smart-car-navigator-interface-windshield-hologram_53876-103040.jpg",
-          imageAlt: "Digital Process",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29668.jpg",
-          imageAlt: "Professional Studio",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/top-view-digital-tablet-with-search-job-screen-male-hands_169016-38637.jpg",
-          imageAlt: "Responsive Display",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/building-construction-worker-site-with-architect_23-2149124313.jpg",
-          imageAlt: "Instant Launch",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/abstract-low-poly-with-connecting-lines-dots_1048-7721.jpg",
-          imageAlt: "Data Network",
-        },
-      ]}
-      mediaAnimation="slide-up"
-    />
-  </div>
+        <div id="hero" data-section="hero">
+          <HeroBillboardGallery
+            background={{ variant: "sparkles-gradient" }}
+            title="Turn Your Idea Into a Professional Website In Minutes"
+            description="Generate Websites Instantly, Customize to Perfection. No coding required, just your ideas brought to life."
+            buttons={[{ text: "Get Started", href: "#contact" }]}
+            mediaItems={[
+              { imageSrc: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169856.jpg", imageAlt: "Idea Generation Interface" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/smart-car-navigator-interface-windshield-hologram_53876-103040.jpg", imageAlt: "Digital Process" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29668.jpg", imageAlt: "Professional Studio" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/top-view-digital-tablet-with-search-job-screen-male-hands_169016-38637.jpg", imageAlt: "Responsive Display" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/building-construction-worker-site-with-architect_23-2149124313.jpg", imageAlt: "Instant Launch" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/abstract-low-poly-with-connecting-lines-dots_1048-7721.jpg", imageAlt: "Data Network" }
+            ]}
+            mediaAnimation="slide-up"
+          />
+        </div>
 
-  <div id="features" data-section="features">
-      <FeatureCardNineteen
-      textboxLayout="split"
-      useInvertedBackground={true}
-      features={[
-        {
-          tag: "Speed",
-          title: "Build in Minutes",
-          subtitle: "Ultra-fast generation",
-          description: "Start with a single prompt and watch Webild turn your idea into a production-grade site.",
-          imageSrc: "http://img.b2bpic.net/free-photo/graph-growth-success-strategy-marketing-computer-concept_53876-47081.jpg",
-        },
-        {
-          tag: "AI",
-          title: "Smart Customization",
-          subtitle: "Tailored to you",
-          description: "Edit text, swap images, and move elements with a single click — everything feels made for you.",
-          imageSrc: "http://img.b2bpic.net/free-photo/man-using-digital-tablet-holding-stylus-pen-working-office_169016-48707.jpg",
-        },
-        {
-          tag: "Cloud",
-          title: "Instant Deployment",
-          subtitle: "Ready to launch",
-          description: "Launch your site in seconds with free built-in hosting and your own custom domain.",
-          imageSrc: "http://img.b2bpic.net/free-photo/website-hosting-concept-with-cloud_23-2149406772.jpg",
-        },
-      ]}
-      title="Everything you need to grow online"
-      description="Powerful tools designed to build, manage, and scale your digital presence instantly."
-    />
-  </div>
+        <div id="features" data-section="features">
+          <FeatureCardNineteen
+            textboxLayout="split"
+            useInvertedBackground={true}
+            title="Everything you need to grow online"
+            description="Powerful tools designed to build, manage, and scale your digital presence instantly."
+            features={[
+              { tag: "Speed", title: "Build in Minutes", subtitle: "Ultra-fast generation", description: "Start with a single prompt and watch Webild turn your idea into a production-grade site.", imageSrc: "http://img.b2bpic.net/free-photo/graph-growth-success-strategy-marketing-computer-concept_53876-47081.jpg" },
+              { tag: "AI", title: "Smart Customization", subtitle: "Tailored to you", description: "Edit text, swap images, and move elements with a single click — everything feels made for you.", imageSrc: "http://img.b2bpic.net/free-photo/man-using-digital-tablet-holding-stylus-pen-working-office_169016-48707.jpg" },
+              { tag: "Cloud", title: "Instant Deployment", subtitle: "Ready to launch", description: "Launch your site in seconds with free built-in hosting and your own custom domain.", imageSrc: "http://img.b2bpic.net/free-photo/website-hosting-concept-with-cloud_23-2149406772.jpg" }
+            ]}
+          />
+        </div>
 
-  <div id="pricing" data-section="pricing">
-      <ProductCardFour
-      animationType="slide-up"
-      textboxLayout="default"
-      gridVariant="asymmetric-60-wide-40-narrow"
-      useInvertedBackground={false}
-      products={[
-        {
-          id: "p1",
-          name: "HVAC Pro",
-          price: "$15/mo",
-          variant: "Template",
-          imageSrc: "http://img.b2bpic.net/free-psd/flat-design-dance-studio-landing-page-template_23-2149483751.jpg",
-        },
-        {
-          id: "p2",
-          name: "Web Agency Studio",
-          price: "$25/mo",
-          variant: "Template",
-          imageSrc: "http://img.b2bpic.net/free-vector/album-release-website-design_53876-67220.jpg",
-        },
-        {
-          id: "p3",
-          name: "Retail Store",
-          price: "$20/mo",
-          variant: "Template",
-          imageSrc: "http://img.b2bpic.net/free-photo/blank-paper-marble-texture-against-white-background_23-2148061589.jpg",
-        },
-        {
-          id: "p4",
-          name: "Portfolio Elite",
-          price: "$10/mo",
-          variant: "Template",
-          imageSrc: "http://img.b2bpic.net/free-vector/beautiful-landing-page_52683-32841.jpg",
-        },
-        {
-          id: "p5",
-          name: "Business Coach",
-          price: "$18/mo",
-          variant: "Template",
-          imageSrc: "http://img.b2bpic.net/free-vector/business-landing-page-with-photo_23-2148248050.jpg",
-        },
-        {
-          id: "p6",
-          name: "AI Agency",
-          price: "$30/mo",
-          variant: "Template",
-          imageSrc: "http://img.b2bpic.net/free-photo/3d-graph-computer-illustration_23-2151884868.jpg",
-        },
-      ]}
-      title="Browse Our Template Collection"
-      description="Choose from our vast library of industry-specific designs built for conversion."
-    />
-  </div>
+        <div id="pricing" data-section="pricing">
+          <ProductCardFour
+            animationType="slide-up"
+            textboxLayout="default"
+            gridVariant="asymmetric-60-wide-40-narrow"
+            useInvertedBackground={false}
+            title="Browse Our Template Collection"
+            description="Choose from our vast library of industry-specific designs built for conversion."
+            products={[
+              { id: "p1", name: "HVAC Pro", price: "$15/mo", variant: "Template", imageSrc: "http://img.b2bpic.net/free-psd/flat-design-dance-studio-landing-page-template_23-2149483751.jpg" },
+              { id: "p2", name: "Web Agency Studio", price: "$25/mo", variant: "Template", imageSrc: "http://img.b2bpic.net/free-vector/album-release-website-design_53876-67220.jpg" },
+              { id: "p3", name: "Retail Store", price: "$20/mo", variant: "Template", imageSrc: "http://img.b2bpic.net/free-photo/blank-paper-marble-texture-against-white-background_23-2148061589.jpg" },
+              { id: "p4", name: "Portfolio Elite", price: "$10/mo", variant: "Template", imageSrc: "http://img.b2bpic.net/free-vector/beautiful-landing-page_52683-32841.jpg" },
+              { id: "p5", name: "Business Coach", price: "$18/mo", variant: "Template", imageSrc: "http://img.b2bpic.net/free-vector/business-landing-page-with-photo_23-2148248050.jpg" },
+              { id: "p6", name: "AI Agency", price: "$30/mo", variant: "Template", imageSrc: "http://img.b2bpic.net/free-photo/3d-graph-computer-illustration_23-2151884868.jpg" }
+            ]}
+          />
+        </div>
 
-  <div id="about" data-section="about">
-      <InlineImageSplitTextAbout
-      useInvertedBackground={true}
-      heading={[
-        {
-          type: "text",
-          content: "How It Works",
-        },
-        {
-          type: "image",
-          src: "http://img.b2bpic.net/free-photo/man-works-with-sound-laptop-early-morning_169016-26471.jpg",
-          alt: "Webild Interface",
-        },
-      ]}
-      buttons={[
-        {
-          text: "Get Started",
-          href: "#contact",
-        },
-      ]}
-    />
-  </div>
+        <div id="about" data-section="about">
+          <InlineImageSplitTextAbout
+            useInvertedBackground={true}
+            heading={[
+              { type: "text", content: "How It Works" },
+              { type: "image", src: "http://img.b2bpic.net/free-photo/man-works-with-sound-laptop-early-morning_169016-26471.jpg", alt: "Webild Interface" }
+            ]}
+            buttons={[{ text: "Get Started", href: "#contact" }]}
+          />
+        </div>
 
-  <div id="metrics" data-section="metrics">
-      <MetricCardOne
-      animationType="slide-up"
-      textboxLayout="split"
-      gridVariant="bento-grid"
-      useInvertedBackground={false}
-      metrics={[
-        {
-          id: "m1",
-          value: "100%",
-          title: "Uptime",
-          description: "Guaranteed performance.",
-          icon: Shield,
-        },
-        {
-          id: "m2",
-          value: "24/7",
-          title: "Monitoring",
-          description: "Real-time insights.",
-          icon: Zap,
-        },
-        {
-          id: "m3",
-          value: "5x",
-          title: "SEO Boost",
-          description: "AI-driven visibility.",
-          icon: TrendingUp,
-        },
-      ]}
-      title="Performance Focused"
-      description="Scale without changing platforms. Track real-time data and boost your traffic with AI-driven SEO."
-    />
-  </div>
+        <div id="metrics" data-section="metrics">
+          <MetricCardOne
+            animationType="slide-up"
+            textboxLayout="split"
+            gridVariant="bento-grid"
+            useInvertedBackground={false}
+            title="Performance Focused"
+            description="Scale without changing platforms. Track real-time data and boost your traffic with AI-driven SEO."
+            metrics={[
+              { id: "m1", value: "100%", title: "Uptime", description: "Guaranteed performance.", icon: Shield },
+              { id: "m2", value: "24/7", title: "Monitoring", description: "Real-time insights.", icon: Zap },
+              { id: "m3", value: "5x", title: "SEO Boost", description: "AI-driven visibility.", icon: TrendingUp }
+            ]}
+          />
+        </div>
 
-  <div id="faq" data-section="faq">
-      <FaqBase
-      textboxLayout="split"
-      useInvertedBackground={true}
-      faqs={[
-        {
-          id: "q1",
-          title: "What is Webild?",
-          content: "Webild is an AI-powered website builder that lets you create fully functional, professional websites with a single prompt.",
-        },
-        {
-          id: "q2",
-          title: "What can I build?",
-          content: "Anything from personal portfolios to e-commerce stores, landing pages, or business websites.",
-        },
-        {
-          id: "q3",
-          title: "Is hosting included?",
-          content: "Yes, we provide free built-in hosting so you can go live instantly without ever leaving our platform.",
-        },
-      ]}
-      title="Frequently Asked Questions"
-      description="Still have questions about Webild?"
-      faqsAnimation="blur-reveal"
-    />
-  </div>
+        <div id="faq" data-section="faq">
+          <FaqBase
+            textboxLayout="split"
+            useInvertedBackground={true}
+            title="Frequently Asked Questions"
+            description="Still have questions about Webild?"
+            faqsAnimation="blur-reveal"
+            faqs={[
+              { id: "q1", title: "What is Webild?", content: "Webild is an AI-powered website builder that lets you create fully functional, professional websites with a single prompt." },
+              { id: "q2", title: "What can I build?", content: "Anything from personal portfolios to e-commerce stores, landing pages, or business websites." },
+              { id: "q3", title: "Is hosting included?", content: "Yes, we provide free built-in hosting so you can go live instantly without ever leaving our platform." }
+            ]}
+          />
+        </div>
 
-  <div id="contact" data-section="contact">
-      <ContactSplitForm
-      useInvertedBackground={false}
-      title="Start Creating Today"
-      description="Ready to launch your online presence? Drop us a line and let's get building."
-      inputs={[
-        {
-          name: "name",
-          type: "text",
-          placeholder: "Your Name",
-          required: true,
-        },
-        {
-          name: "email",
-          type: "email",
-          placeholder: "Email Address",
-          required: true,
-        },
-      ]}
-      textarea={{
-        name: "message",
-        placeholder: "Tell us about your project",
-        rows: 4,
-      }}
-      imageSrc="http://img.b2bpic.net/free-photo/close-up-computer-supplies-wooden-desk-empty-startup-space-monitor-with-business-charts-display-instruments-work-financial-project-modern-workspace-decor_482257-36859.jpg"
-    />
-  </div>
+        <div id="contact" data-section="contact">
+          <ContactSplitForm
+            useInvertedBackground={false}
+            title="Start Creating Today"
+            description="Ready to launch your online presence? Drop us a line and let's get building."
+            inputs={[
+              { name: "name", type: "text", placeholder: "Your Name", required: true },
+              { name: "email", type: "email", placeholder: "Email Address", required: true }
+            ]}
+            textarea={{ name: "message", placeholder: "Tell us about your project", rows: 4 }}
+            imageSrc="http://img.b2bpic.net/free-photo/close-up-computer-supplies-wooden-desk-empty-startup-space-monitor-with-business-charts-display-instruments-work-financial-project-modern-workspace-decor_482257-36859.jpg"
+          />
+        </div>
 
-  <div id="footer" data-section="footer">
-      <FooterLogoEmphasis
-      columns={[
-        {
-          items: [
-            {
-              label: "How It Works",
-              href: "#about",
-            },
-            {
-              label: "Features",
-              href: "#features",
-            },
-            {
-              label: "Pricing",
-              href: "#pricing",
-            },
-          ],
-        },
-        {
-          items: [
-            {
-              label: "Twitter",
-              href: "https://x.com",
-            },
-            {
-              label: "LinkedIn",
-              href: "https://linkedin.com",
-            },
-            {
-              label: "Instagram",
-              href: "https://instagram.com",
-            },
-          ],
-        },
-        {
-          items: [
-            {
-              label: "Privacy Policy",
-              href: "#",
-            },
-            {
-              label: "Terms of Service",
-              href: "#",
-            },
-            {
-              label: "Cookie Policy",
-              href: "#",
-            },
-          ],
-        },
-      ]}
-      logoText="Webild"
-    />
-  </div>
+        <div id="footer" data-section="footer">
+          <FooterLogoEmphasis
+            logoText="Webild"
+            columns={[
+              { items: [{ label: "How It Works", href: "#about" }, { label: "Features", href: "#features" }, { label: "Pricing", href: "#pricing" }] },
+              { items: [{ label: "Twitter", href: "https://x.com" }, { label: "LinkedIn", href: "https://linkedin.com" }, { label: "Instagram", href: "https://instagram.com" }] },
+              { items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }, { label: "Cookie Policy", href: "#" }] }
+            ]}
+          />
+        </div>
       </ReactLenis>
     </ThemeProvider>
   );
-- 
2.49.1