Merge version_14_1780587851932 into main

Merge version_14_1780587851932 into main

src/pages/HomePage.tsx

@@ -1,28 +1,38 @@
-// AUTO-GENERATED shell by per-section-migrate.
-// Section bodies live in ./<PageBase>/sections/<X>.tsx. Edit the section
-// files directly; this shell only fixes render order.
-
 import React from 'react';
 import HomeSection from './HomePage/sections/Home';
 import AboutSection from './HomePage/sections/About';
 import ProductsSection from './HomePage/sections/Products';
+import HowItWorksSection from './HomePage/sections/HowItWorks';
 import WhyUsSection from './HomePage/sections/WhyUs';
 import TestimonialsSection from './HomePage/sections/Testimonials';
 import SocialProofSection from './HomePage/sections/SocialProof';
+import PricingSection from './HomePage/sections/Pricing';
 import FaqSection from './HomePage/sections/Faq';
+import NewsletterSection from './HomePage/sections/Newsletter';
+import CaseStudiesCardsSection from './HomePage/sections/CaseStudiesCards';
 import ContactSection from './HomePage/sections/Contact';
 
+
+
+{/* webild-stub @2026-06-04T15:44:44.030Z: remove all sections except hero and contact form */}
+
+{/* webild-stub @2026-06-04T15:43:28.905Z: remove all sections except hero and contact form */}
+
 export default function HomePage(): React.JSX.Element {
   return (
     <>
       <HomeSection />
       <AboutSection />
       <ProductsSection />
+      <HowItWorksSection />
       <WhyUsSection />
       <TestimonialsSection />
       <SocialProofSection />
+      <PricingSection />
       <FaqSection />
+      <NewsletterSection />
+      <CaseStudiesCardsSection />
       <ContactSection />
     </>
   );
-}
+}

src/pages/HomePage/sections/CaseStudiesCards.tsx

@@ -0,0 +1,17 @@
+// Created by add_section_from_catalog (BlogSimpleCards).
+
+import React from 'react';
+import BlogSimpleCards from '@/components/sections/blog/BlogSimpleCards';
+
+export default function CaseStudiesCardsSection(): React.JSX.Element {
+  return (
+    <div data-webild-section="case-studies-cards" id="case-studies-cards">
+      <BlogSimpleCards
+        tag="Case Studies"
+        items={[{"imageSrc":"https://images.unsplash.com/photo-1460925895917-afdab827c52f?auto=format&fit=crop&q=80&w=800&h=600","title":"Scaling Revenue by 300% in 6 Months","category":"E-commerce","date":"Oct 12, 2023","authorImageSrc":"https://images.unsplash.com/photo-1494790108377-be9c29b29330?auto=format&fit=crop&q=80&w=150&h=150","authorName":"Sarah Jenkins","excerpt":"Learn how we helped a boutique fashion brand optimize their conversion funnel and scale their ad spend profitably."},{"authorName":"David Chen","excerpt":"Discover the strategies we implemented to help a B2B SaaS company reduce their churn rate by 40%.","authorImageSrc":"https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?auto=format&fit=crop&q=80&w=150&h=150","date":"Nov 05, 2023","imageSrc":"https://images.unsplash.com/photo-1551288049-bebda4e38f71?auto=format&fit=crop&q=80&w=800&h=600","category":"SaaS","title":"Reducing Churn and Boosting Retention"},{"authorImageSrc":"https://images.unsplash.com/photo-1438761681033-6461ffad8d80?auto=format&fit=crop&q=80&w=150&h=150","excerpt":"See how our custom software solution reduced patient onboarding time by 60% for a regional clinic network.","authorName":"Emily Rodriguez","date":"Dec 18, 2023","title":"Streamlining Patient Onboarding","category":"Healthcare","imageSrc":"https://images.unsplash.com/photo-1576091160399-112ba8d25d1d?auto=format&fit=crop&q=80&w=800&h=600"}]}
+        title="Real Results from Real Clients"
+        description="Dive deep into how we've helped businesses achieve their goals and overcome their biggest challenges."
+      />
+    </div>
+  );
+}

src/pages/HomePage/sections/Home.tsx

@@ -1,88 +1,61 @@
-import React from 'react';
-import HeroTiltedCards from '@/components/sections/hero/HeroTiltedCards';
-import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
-import ScrollReveal from "@/components/ui/ScrollReveal";
-import Tag from "@/components/ui/Tag";
+import React from "react";
 import Button from "@/components/ui/Button";
-import ImageOrVideo from "@/components/ui/ImageOrVideo";
+import ScrollReveal from "@/components/ui/ScrollReveal";
+import TextAnimation from "@/components/ui/TextAnimation";
 
-export default function HomeSection(): React.JSX.Element {
+export default function HomeSection() {
   return (
-    <div id="home" data-webild-section="home" className="relative overflow-hidden bg-background">
-  {React.createElement(() => {
-    const [selectedImage, setSelectedImage] = React.useState<string | null>(null);
-    const items = [
-      "http://img.b2bpic.net/free-photo/top-view-challah-dish-hanukkah_23-2151129284.jpg",
-      "http://img.b2bpic.net/free-photo/high-angle-people-wearing-linen-clothing_23-2151030585.jpg",
-      "http://img.b2bpic.net/free-photo/delicious-freshly-bakery-products-wooden-background-close-up-photo-freshly-baked-bread-products_613910-6800.jpg",
-      "https://images.unsplash.com/photo-1509440159596-0249088772ff?q=80&w=2072&auto=format&fit=crop",
-      "https://images.unsplash.com/photo-1558961363-fa8fdf82db35?q=80&w=1965&auto=format&fit=crop"
-    ];
-
-    return (
-      <>
-        <div className="container mx-auto px-4 text-center">
+    <div data-webild-section="home">
+      <section id="home" className="relative w-full overflow-hidden flex flex-col items-center justify-center text-center py-20 md:py-32">
+        <div className="container px-4 md:px-6 z-10">
           <ScrollReveal variant="slide-up">
-            <Tag text="Welcome to Our Bakery" className="mb-6 mx-auto" />
-            <h1 className="text-5xl md:text-7xl font-bold text-foreground mb-6 tracking-tight">
-              Freshly Baked, Made<br />Daily, Just for You
-            </h1>
-            <p className="text-xl text-muted-foreground max-w-content-width mx-auto">
+            <span className="text-sm uppercase tracking-widest text-muted-foreground mb-4 block">
+              Welcome to Our Bakery
+            </span>
+          </ScrollReveal>
+          
+          <TextAnimation
+            text="Start Your Day Right with Oven-Fresh Artisan Breads & Pastries"
+            variant="slide-up"
+            gradientText={false}
+            tag="h1"
+            className="text-5xl md:text-6xl lg:text-7xl font-bold tracking-tight text-foreground mb-6 max-w-content-width mx-auto"
+          />
+          
+          <ScrollReveal variant="slide-up" delay={0.2}>
+            <p className="text-lg md:text-xl text-muted-foreground mb-8 max-w-content-width mx-auto">
               Handcrafted pastries, custom cakes, and artisan breads using premium ingredients. Order online or visit us today.
             </p>
-            <div className="flex flex-wrap justify-center gap-4">
-              <Button text="Order Now" variant="primary" href="#contact" />
-              <Button text="Our Menu" variant="secondary" href="#products" />
+          </ScrollReveal>
+          
+          <ScrollReveal variant="slide-up" delay={0.3}>
+            <div className="flex flex-col sm:flex-row items-center justify-center gap-4">
+              <Button text="Order Now" variant="primary" href="/#contact" />
+              <Button text="Our Menu" variant="secondary" href="/#products" />
             </div>
           </ScrollReveal>
 
-          <ScrollReveal variant="slide-up">
-            <div className="relative max-w-content-width mx-auto h-[400px] flex justify-center items-center">
-              {items.map((src, idx) => {
-                const rotations = ['-rotate-12', '-rotate-6', 'rotate-0', 'rotate-6', 'rotate-12'];
-                const zIndexes = ['z-10', 'z-20', 'z-30', 'z-20', 'z-10'];
-                const translates = ['-translate-x-40', '-translate-x-20', 'translate-x-0', 'translate-x-20', 'translate-x-40'];
-                
-                return (
-                  <div 
-                    key={idx}
-                    className={`absolute w-48 h-64 md:w-64 md:h-80 rounded-theme overflow-hidden border-8 border-white shadow-xl cursor-pointer transition-transform hover:scale-110 hover:z-50 ${rotations[idx]} ${zIndexes[idx]} ${translates[idx]}`}
-                    onClick={() => setSelectedImage(src)}
-                  >
-                    <ImageOrVideo imageSrc={src} className="w-full h-full object-cover" />
-                  </div>
-                );
-              })}
+          <ScrollReveal variant="slide-up" delay={0.4}>
+            <div className="flex w-full max-w-content-width mx-auto h-[300px] md:h-[400px] gap-2 md:gap-4 mt-12">
+              <div className="group relative flex-1 hover:flex-[3] transition-all duration-500 ease-in-out overflow-hidden rounded-theme shadow-md cursor-pointer">
+                <img src="https://images.unsplash.com/photo-1509440159596-0249088772ff?w=800&q=80" alt="Freshly baked pastry" className="w-full h-full object-cover" />
+              </div>
+              <div className="group relative flex-1 hover:flex-[3] transition-all duration-500 ease-in-out overflow-hidden rounded-theme shadow-md cursor-pointer">
+                <img src="https://images.unsplash.com/photo-1483695028939-5bb13f8648b0?w=800&q=80" alt="Artisan bread loaf" className="w-full h-full object-cover" />
+              </div>
+              <div className="group relative flex-1 hover:flex-[3] transition-all duration-500 ease-in-out overflow-hidden rounded-theme shadow-md cursor-pointer">
+                <img src="https://images.unsplash.com/photo-1549931319-a545dcf3bc73?w=800&q=80" alt="Sourdough bread" className="w-full h-full object-cover" />
+              </div>
+              <div className="group relative flex-1 hover:flex-[3] transition-all duration-500 ease-in-out overflow-hidden rounded-theme shadow-md cursor-pointer">
+                <img src="https://images.unsplash.com/photo-1550617931-e17a7b70dce2?w=800&q=80" alt="Custom cake" className="w-full h-full object-cover" />
+              </div>
+              <div className="group relative flex-1 hover:flex-[3] transition-all duration-500 ease-in-out overflow-hidden rounded-theme shadow-md cursor-pointer">
+                <img src="https://images.unsplash.com/photo-1608198093002-ad4e005484ec?w=800&q=80" alt="Chocolate chip cookies" className="w-full h-full object-cover" />
+              </div>
             </div>
           </ScrollReveal>
         </div>
-
-        {selectedImage && (
-          <div 
-            className="fixed inset-0 z-[100] flex items-center justify-center bg-black/80 p-4 backdrop-blur-sm"
-            onClick={() => setSelectedImage(null)}
-          >
-            <button 
-              className="absolute top-6 right-6 text-white hover:text-gray-300 transition-colors"
-              onClick={() => setSelectedImage(null)}
-            >
-              <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>
-            </button>
-            <div 
-              className="relative max-w-content-width max-h-[90vh] w-full h-full flex items-center justify-center"
-              onClick={(e) => e.stopPropagation()}
-            >
-              <img 
-                src={selectedImage} 
-                alt="Expanded view" 
-                className="max-w-full max-h-full object-contain rounded-lg shadow-2xl" 
-              />
-            </div>
-          </div>
-        )}
-      </>
-    );
-  })}
-</div>
+      </section>
+    </div>
   );
 }

src/pages/HomePage/sections/HowItWorks.tsx

@@ -0,0 +1,17 @@
+// Created by add_section_from_catalog (FeaturesDetailedSteps).
+
+import React from 'react';
+import FeaturesDetailedSteps from '@/components/sections/features/FeaturesDetailedSteps';
+
+export default function HowItWorksSection(): React.JSX.Element {
+  return (
+    <div data-webild-section="how-it-works" id="how-it-works">
+      <FeaturesDetailedSteps
+        title="Get started in 3 simple steps"
+        steps={[{"tag":"Step 1","imageSrc":"https://images.unsplash.com/photo-1551288049-bebda4e38f71?q=80&w=2070&auto=format&fit=crop","description":"Enter your details and verify your email to get instant access to our platform.","title":"Create your account","subtitle":"Sign up in seconds"},{"subtitle":"Tailor it to your needs","imageSrc":"https://images.unsplash.com/photo-1460925895917-afdab827c52f?q=80&w=2015&auto=format&fit=crop","tag":"Step 2","title":"Configure your workspace","description":"Set up your preferences, invite team members, and connect your favorite tools."},{"subtitle":"See results immediately","imageSrc":"https://images.unsplash.com/photo-1551434678-e076c223a692?q=80&w=2070&auto=format&fit=crop","tag":"Step 3","title":"Start achieving goals","description":"Launch your first project and track your progress with our intuitive dashboard."}]}
+        description="Our onboarding process is designed to be quick and painless so you can start seeing value immediately."
+        tag="How It Works"
+      />
+    </div>
+  );
+}

src/pages/HomePage/sections/Newsletter.tsx

@@ -0,0 +1,18 @@
+// Created by add_section_from_catalog (ContactCenter).
+
+import React from 'react';
+import ContactCenter from '@/components/sections/contact/ContactCenter';
+
+export default function NewsletterSection(): React.JSX.Element {
+  return (
+    <div data-webild-section="newsletter" id="newsletter">
+      <ContactCenter
+        inputPlaceholder="Enter your email address"
+        title="Stay in the Loop"
+        description="Join our newsletter to get the latest news, updates, and special offers delivered directly to your inbox."
+        tag="Newsletter"
+        buttonText="Subscribe"
+      />
+    </div>
+  );
+}

src/pages/HomePage/sections/Pricing.tsx

@@ -0,0 +1,17 @@
+// Created by add_section_from_catalog (PricingHighlightedCards).
+
+import React from 'react';
+import PricingHighlightedCards from '@/components/sections/pricing/PricingHighlightedCards';
+
+export default function PricingSection(): React.JSX.Element {
+  return (
+    <div data-webild-section="pricing" id="pricing">
+      <PricingHighlightedCards
+        title="Simple, Transparent Pricing"
+        plans={[{"features":["1 Artisan Loaf per week","Choice of Sourdough or Rye","Free in-store pickup"],"tag":"Basic","primaryButton":{"href":"#","text":"Subscribe Now"},"price":"$15/wk","description":"Perfect for individuals who want fresh bread weekly."},{"highlight":"Most Popular","tag":"Family","description":"Ideal for families who love fresh baked goods.","price":"$35/wk","primaryButton":{"href":"#","text":"Subscribe Now"},"features":["3 Artisan Loaves per week","Assorted Pastries box (4 pcs)","Free local delivery"]},{"features":["Custom cake orders","Large pastry platters","Dedicated catering manager"],"description":"For parties, corporate events, and special occasions.","primaryButton":{"href":"#","text":"Contact Us"},"price":"Custom","tag":"Event"}]}
+        tag="Pricing"
+        description="Choose the perfect plan for your daily bread and pastry needs."
+      />
+    </div>
+  );
+}