diff --git a/src/pages/HomePage.tsx b/src/pages/HomePage.tsx
index 68a2c21..23e67b0 100644
--- a/src/pages/HomePage.tsx
+++ b/src/pages/HomePage.tsx
@@ -1,215 +1,39 @@
-import AboutText from '@/components/sections/about/AboutText';
-import ContactCta from '@/components/sections/contact/ContactCta';
-import FaqTwoColumn from '@/components/sections/faq/FaqTwoColumn';
-import FeaturesArrowCards from '@/components/sections/features/FeaturesArrowCards';
-import HeroBillboard from '@/components/sections/hero/HeroBillboard';
-import MetricsSimpleCards from '@/components/sections/metrics/MetricsSimpleCards';
-import SocialProofMarquee from '@/components/sections/social-proof/SocialProofMarquee';
-import TestimonialColumnMarqueeCards from '@/components/sections/testimonial/TestimonialColumnMarqueeCards';
-import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+// AUTO-GENERATED shell by per-section-migrate.
+// Section bodies live in ./<PageBase>/sections/<X>.tsx. Edit the section
+// files directly. Non-block content (wrappers, non-inlinable sections) is
+// preserved inline; extracted section blocks become <XSection/> refs.
 
-export default function HomePage() {
+import React from 'react';
+import HeroSection from './HomePage/sections/Hero';
+import AboutSection from './HomePage/sections/About';
+import FeaturesSection from './HomePage/sections/Features';
+import MetricsSection from './HomePage/sections/Metrics';
+import SocialSection from './HomePage/sections/Social';
+import TestimonialsSection from './HomePage/sections/Testimonials';
+import FaqSection from './HomePage/sections/Faq';
+import ContactSection from './HomePage/sections/Contact';
+
+
+{/* webild-stub @2026-06-14T13:39:30.455Z: Build the Boom brand experience website as outlined with a dramatic, high-energy, and sensual aesthetic. */}
+
+export default function HomePage(): React.JSX.Element {
   return (
-    <>
-  <div id="hero" data-section="hero">
-    <SectionErrorBoundary name="hero">
-          <HeroBillboard
-      title="Ignite Your Reality"
-      description="Boom is the ultimate catalyst for those who live on the edge. Experience unfiltered intensity, refined luxury, and bold design."
-      primaryButton={{
-        text: "Enter the Experience",
-        href: "#about",
-      }}
-      secondaryButton={{
-        text: "Discover More",
-        href: "#features",
-      }}
-      imageSrc="http://img.b2bpic.net/free-photo/handsome-man-posing-studio_23-2151643117.jpg"
-    />
-    </SectionErrorBoundary>
-  </div>
+<>
+  <HeroSection />
 
-  <div id="about" data-section="about">
-    <SectionErrorBoundary name="about">
-          <AboutText
-      title="Redefining the Standard of Intensity"
-      primaryButton={{
-        text: "Join the Movement",
-        href: "#contact",
-      }}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <AboutSection />
 
-  <div id="features" data-section="features">
-    <SectionErrorBoundary name="features">
-          <FeaturesArrowCards
-      tag="Capabilities"
-      title="Built for Impact"
-      description="Engineered with precision, designed for maximum aesthetic appeal."
-      items={[
-        {
-          title: "Precision Design",
-          tags: [
-            "Modern",
-            "Sleek",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/closeup-shuttlecock_53876-32069.jpg",
-        },
-        {
-          title: "Futuristic Vision",
-          tags: [
-            "Tech",
-            "Bold",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/modern-office-space-with-futuristic-decor-furniture_23-2151797687.jpg",
-        },
-        {
-          title: "Dynamic Performance",
-          tags: [
-            "Fast",
-            "Raw",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/abstract-blast-background_1048-14639.jpg",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <FeaturesSection />
 
-  <div id="metrics" data-section="metrics">
-    <SectionErrorBoundary name="metrics">
-          <MetricsSimpleCards
-      tag="Performance"
-      title="Data Driven Intensity"
-      description="Numbers don't lie. We deliver consistent, high-impact results for the elite."
-      metrics={[
-        {
-          value: "98%",
-          description: "Client Satisfaction",
-        },
-        {
-          value: "5M+",
-          description: "Unique Impressions",
-        },
-        {
-          value: "120+",
-          description: "Global Projects",
-        },
-        {
-          value: "100%",
-          description: "Design Fidelity",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <MetricsSection />
 
-  <div id="social" data-section="social">
-    <SectionErrorBoundary name="social">
-          <SocialProofMarquee
-      tag="Partners"
-      title="Trusted by Visionaries"
-      names={[
-        "Luxe Inc",
-        "Bold Motion",
-        "Red Gear",
-        "Stellar Studio",
-        "Apex Designs",
-        "Neon Pulse",
-        "Velocity Creative",
-      ]}
-      description="Collaborating with industry leaders to redefine the digital landscape."
-    />
-    </SectionErrorBoundary>
-  </div>
+  <SocialSection />
 
-  <div id="testimonials" data-section="testimonials">
-    <SectionErrorBoundary name="testimonials">
-          <TestimonialColumnMarqueeCards
-      tag="Feedback"
-      title="What They Say"
-      description="Voices from the front line of our experience."
-      testimonials={[
-        {
-          name: "Elena V.",
-          role: "Creative Lead",
-          quote: "Absolutely transformative experience.",
-          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-serious-blond-girl-trench-coat-confidently-looking-camera-city-street_574295-3880.jpg",
-        },
-        {
-          name: "Marcus R.",
-          role: "Director",
-          quote: "Unmatched aesthetic and intensity.",
-          imageSrc: "http://img.b2bpic.net/free-photo/man-with-moustache-wearing-hoodie_250224-229.jpg",
-        },
-        {
-          name: "Sophie L.",
-          role: "Designer",
-          quote: "The new standard in luxury.",
-          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-drag-queen-posing_23-2149247371.jpg",
-        },
-        {
-          name: "David K.",
-          role: "Innovator",
-          quote: "Bold, clean, and incredibly fast.",
-          imageSrc: "http://img.b2bpic.net/free-photo/abstract-red-light_1017-2657.jpg",
-        },
-        {
-          name: "Julia M.",
-          role: "CEO",
-          quote: "A truly premium presence.",
-          imageSrc: "http://img.b2bpic.net/free-photo/cute-hipster-woman-taking-photos-retro-camera_176420-16727.jpg",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <TestimonialsSection />
 
-  <div id="faq" data-section="faq">
-    <SectionErrorBoundary name="faq">
-          <FaqTwoColumn
-      tag="Assistance"
-      title="Common Questions"
-      description="Everything you need to know about starting your Boom experience."
-      items={[
-        {
-          question: "What is Boom?",
-          answer: "Boom is a premium lifestyle brand focused on intensity and high-end aesthetic.",
-        },
-        {
-          question: "Can I join early?",
-          answer: "Yes, subscribe to our newsletter for exclusive early access.",
-        },
-        {
-          question: "Where are you based?",
-          answer: "We operate globally with a remote-first approach.",
-        },
-        {
-          question: "How to contact sales?",
-          answer: "Use our contact form and our team will get back to you within 24 hours.",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <FaqSection />
 
-  <div id="contact" data-section="contact">
-    <SectionErrorBoundary name="contact">
-          <ContactCta
-      tag="Get Started"
-      text="Ready to ignite your brand? Let’s create something explosive together."
-      primaryButton={{
-        text: "Get in Touch",
-        href: "#",
-      }}
-      secondaryButton={{
-        text: "Learn More",
-        href: "#",
-      }}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <ContactSection />
     </>
   );
 }
diff --git a/src/pages/HomePage/sections/About.tsx b/src/pages/HomePage/sections/About.tsx
new file mode 100644
index 0000000..1aded92
--- /dev/null
+++ b/src/pages/HomePage/sections/About.tsx
@@ -0,0 +1,22 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "about" section.
+
+import React from 'react';
+import AboutText from '@/components/sections/about/AboutText';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function AboutSection(): React.JSX.Element {
+  return (
+    <div id="about" data-section="about">
+        <SectionErrorBoundary name="about">
+              <AboutText
+          title="Redefining the Standard of Intensity"
+          primaryButton={{
+            text: "Join the Movement",
+            href: "#contact",
+          }}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
diff --git a/src/pages/HomePage/sections/Contact.tsx b/src/pages/HomePage/sections/Contact.tsx
new file mode 100644
index 0000000..de84e9a
--- /dev/null
+++ b/src/pages/HomePage/sections/Contact.tsx
@@ -0,0 +1,27 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "contact" section.
+
+import React from 'react';
+import ContactCta from '@/components/sections/contact/ContactCta';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function ContactSection(): React.JSX.Element {
+  return (
+    <div id="contact" data-section="contact">
+        <SectionErrorBoundary name="contact">
+              <ContactCta
+          tag="Get Started"
+          text="Ready to ignite your brand? Let’s create something explosive together."
+          primaryButton={{
+            text: "Get in Touch",
+            href: "#",
+          }}
+          secondaryButton={{
+            text: "Learn More",
+            href: "#",
+          }}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
diff --git a/src/pages/HomePage/sections/Faq.tsx b/src/pages/HomePage/sections/Faq.tsx
new file mode 100644
index 0000000..819c803
--- /dev/null
+++ b/src/pages/HomePage/sections/Faq.tsx
@@ -0,0 +1,38 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "faq" section.
+
+import React from 'react';
+import FaqTwoColumn from '@/components/sections/faq/FaqTwoColumn';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function FaqSection(): React.JSX.Element {
+  return (
+    <div id="faq" data-section="faq">
+        <SectionErrorBoundary name="faq">
+              <FaqTwoColumn
+          tag="Assistance"
+          title="Common Questions"
+          description="Everything you need to know about starting your Boom experience."
+          items={[
+            {
+              question: "What is Boom?",
+              answer: "Boom is a premium lifestyle brand focused on intensity and high-end aesthetic.",
+            },
+            {
+              question: "Can I join early?",
+              answer: "Yes, subscribe to our newsletter for exclusive early access.",
+            },
+            {
+              question: "Where are you based?",
+              answer: "We operate globally with a remote-first approach.",
+            },
+            {
+              question: "How to contact sales?",
+              answer: "Use our contact form and our team will get back to you within 24 hours.",
+            },
+          ]}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
diff --git a/src/pages/HomePage/sections/Features.tsx b/src/pages/HomePage/sections/Features.tsx
new file mode 100644
index 0000000..5f2b436
--- /dev/null
+++ b/src/pages/HomePage/sections/Features.tsx
@@ -0,0 +1,46 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "features" section.
+
+import React from 'react';
+import FeaturesArrowCards from '@/components/sections/features/FeaturesArrowCards';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function FeaturesSection(): React.JSX.Element {
+  return (
+    <div id="features" data-section="features">
+        <SectionErrorBoundary name="features">
+              <FeaturesArrowCards
+          tag="Capabilities"
+          title="Built for Impact"
+          description="Engineered with precision, designed for maximum aesthetic appeal."
+          items={[
+            {
+              title: "Precision Design",
+              tags: [
+                "Modern",
+                "Sleek",
+              ],
+              imageSrc: "http://img.b2bpic.net/free-photo/closeup-shuttlecock_53876-32069.jpg",
+            },
+            {
+              title: "Futuristic Vision",
+              tags: [
+                "Tech",
+                "Bold",
+              ],
+              imageSrc: "http://img.b2bpic.net/free-photo/modern-office-space-with-futuristic-decor-furniture_23-2151797687.jpg",
+            },
+            {
+              title: "Dynamic Performance",
+              tags: [
+                "Fast",
+                "Raw",
+              ],
+              imageSrc: "http://img.b2bpic.net/free-photo/abstract-blast-background_1048-14639.jpg",
+            },
+          ]}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
diff --git a/src/pages/HomePage/sections/Hero.tsx b/src/pages/HomePage/sections/Hero.tsx
new file mode 100644
index 0000000..ff5eb69
--- /dev/null
+++ b/src/pages/HomePage/sections/Hero.tsx
@@ -0,0 +1,28 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "hero" section.
+
+import React from 'react';
+import HeroBillboard from '@/components/sections/hero/HeroBillboard';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function HeroSection(): React.JSX.Element {
+  return (
+    <div id="hero" data-section="hero">
+        <SectionErrorBoundary name="hero">
+              <HeroBillboard
+          title="Ignite Your Reality"
+          description="Boom is the ultimate catalyst for those who live on the edge. Experience unfiltered intensity, refined luxury, and bold design."
+          primaryButton={{
+            text: "Enter the Experience",
+            href: "#about",
+          }}
+          secondaryButton={{
+            text: "Discover More",
+            href: "#features",
+          }}
+          imageSrc="http://img.b2bpic.net/free-photo/handsome-man-posing-studio_23-2151643117.jpg"
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
diff --git a/src/pages/HomePage/sections/Metrics.tsx b/src/pages/HomePage/sections/Metrics.tsx
new file mode 100644
index 0000000..3536012
--- /dev/null
+++ b/src/pages/HomePage/sections/Metrics.tsx
@@ -0,0 +1,38 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "metrics" section.
+
+import React from 'react';
+import MetricsSimpleCards from '@/components/sections/metrics/MetricsSimpleCards';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function MetricsSection(): React.JSX.Element {
+  return (
+    <div id="metrics" data-section="metrics">
+        <SectionErrorBoundary name="metrics">
+              <MetricsSimpleCards
+          tag="Performance"
+          title="Data Driven Intensity"
+          description="Numbers don't lie. We deliver consistent, high-impact results for the elite."
+          metrics={[
+            {
+              value: "98%",
+              description: "Client Satisfaction",
+            },
+            {
+              value: "5M+",
+              description: "Unique Impressions",
+            },
+            {
+              value: "120+",
+              description: "Global Projects",
+            },
+            {
+              value: "100%",
+              description: "Design Fidelity",
+            },
+          ]}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
diff --git a/src/pages/HomePage/sections/Social.tsx b/src/pages/HomePage/sections/Social.tsx
new file mode 100644
index 0000000..05076ee
--- /dev/null
+++ b/src/pages/HomePage/sections/Social.tsx
@@ -0,0 +1,29 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "social" section.
+
+import React from 'react';
+import SocialProofMarquee from '@/components/sections/social-proof/SocialProofMarquee';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function SocialSection(): React.JSX.Element {
+  return (
+    <div id="social" data-section="social">
+        <SectionErrorBoundary name="social">
+              <SocialProofMarquee
+          tag="Partners"
+          title="Trusted by Visionaries"
+          names={[
+            "Luxe Inc",
+            "Bold Motion",
+            "Red Gear",
+            "Stellar Studio",
+            "Apex Designs",
+            "Neon Pulse",
+            "Velocity Creative",
+          ]}
+          description="Collaborating with industry leaders to redefine the digital landscape."
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
diff --git a/src/pages/HomePage/sections/Testimonials.tsx b/src/pages/HomePage/sections/Testimonials.tsx
new file mode 100644
index 0000000..f25fbe9
--- /dev/null
+++ b/src/pages/HomePage/sections/Testimonials.tsx
@@ -0,0 +1,52 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "testimonials" section.
+
+import React from 'react';
+import TestimonialColumnMarqueeCards from '@/components/sections/testimonial/TestimonialColumnMarqueeCards';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function TestimonialsSection(): React.JSX.Element {
+  return (
+    <div id="testimonials" data-section="testimonials">
+        <SectionErrorBoundary name="testimonials">
+              <TestimonialColumnMarqueeCards
+          tag="Feedback"
+          title="What They Say"
+          description="Voices from the front line of our experience."
+          testimonials={[
+            {
+              name: "Elena V.",
+              role: "Creative Lead",
+              quote: "Absolutely transformative experience.",
+              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-serious-blond-girl-trench-coat-confidently-looking-camera-city-street_574295-3880.jpg",
+            },
+            {
+              name: "Marcus R.",
+              role: "Director",
+              quote: "Unmatched aesthetic and intensity.",
+              imageSrc: "http://img.b2bpic.net/free-photo/man-with-moustache-wearing-hoodie_250224-229.jpg",
+            },
+            {
+              name: "Sophie L.",
+              role: "Designer",
+              quote: "The new standard in luxury.",
+              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-drag-queen-posing_23-2149247371.jpg",
+            },
+            {
+              name: "David K.",
+              role: "Innovator",
+              quote: "Bold, clean, and incredibly fast.",
+              imageSrc: "http://img.b2bpic.net/free-photo/abstract-red-light_1017-2657.jpg",
+            },
+            {
+              name: "Julia M.",
+              role: "CEO",
+              quote: "A truly premium presence.",
+              imageSrc: "http://img.b2bpic.net/free-photo/cute-hipster-woman-taking-photos-retro-camera_176420-16727.jpg",
+            },
+          ]}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}