src/components/ui/NavbarFloatingLogo.tsx

@@ -46,7 +46,7 @@ const NavbarFloatingLogo = ({ logo, logoImageSrc, navItems, ctaButton }: NavbarF
         )}
       </AnimatePresence>
 
-      <nav data-section="navbar" className="fixed z-1000 top-5 left-1/2 -translate-x-1/2 w-content-width">
+      <nav data-section="navbar" className="fixed md:absolute z-1000 top-5 left-1/2 -translate-x-1/2 w-content-width">
         <div className="mx-auto w-full md:w-1/2 overflow-hidden rounded backdrop-blur-sm card">
           <div className="relative z-10 flex items-center justify-between gap-3 xl:gap-4 2xl:gap-5 p-3 xl:p-4 2xl:p-5">
             <a href="/" className="flex items-center gap-2">

src/pages/HomePage.tsx

@@ -1,108 +1,31 @@
-import HeroSplitVerticalMarqueeTall from '@/components/sections/hero/HeroSplitVerticalMarqueeTall';
-import AboutMediaOverlay from '@/components/sections/about/AboutMediaOverlay';
-import FeaturesBento from '@/components/sections/features/FeaturesBento';
-import MetricsFeatureCards from '@/components/sections/metrics/MetricsFeatureCards';
-import TestimonialColumnMarqueeCards from '@/components/sections/testimonial/TestimonialColumnMarqueeCards';
-import ContactCta from '@/components/sections/contact/ContactCta';
-import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+// AUTO-GENERATED shell by per-section-migrate.
+// Section bodies live in the sibling sections/ folder (one file per section).
+// Edit those section files directly. Non-block content (wrappers,
+// non-inlinable sections) is preserved inline; extracted section blocks
+// become component 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 TestimonialSection from './HomePage/sections/Testimonial';
+import ContactSection from './HomePage/sections/Contact';
+
+export default function HomePage(): React.JSX.Element {
   return (
-    <>
-      <div id="hero" data-section="hero">
-        <SectionErrorBoundary name="hero">
-          <HeroSplitVerticalMarqueeTall
-            tag="Nervous System Regulation Expert"
-            title="There's no universal way to regulate a nervous system. There's yours."
-            description="Most nervous system advice is built for a system that isn't yours. Take the 2-minute quiz built by a practicing clinician — find out exactly which way your nervous system is stuck, and the protocol built for that, not someone else's."
-            primaryButton={{ text: "Take the Free Nervous System Quiz", href: "#" }}
-            secondaryButton={{ text: "Learn More", href: "/about" }}
-            leftItems={[
-              { imageSrc: "http://img.b2bpic.net/free-photo/attractive-smiling-doctor-holding-hand-heart-dreamily-looking-camera-isolated-tender-touched-expression_574295-2653.jpg" },
-              { imageSrc: "http://img.b2bpic.net/free-photo/braille-alpahbet-pills-container-top-view_23-2148718145.jpg" },
-              { imageSrc: "http://img.b2bpic.net/free-photo/pleased-young-male-doctor-wearing-medical-coat-stethoscope-around-his-neck-looking-side-isolated-blue-background_141793-133933.jpg" }
-            ]}
-            rightItems={[
-              { imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-pills-container_23-2148718176.jpg" },
-              { imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-pills-containers-stethoscope_23-2148718178.jpg" },
-              { imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-joyful-male-doctor_171337-1489.jpg" }
-            ]}
-            textAnimation="slide-up"
-          />
-        </SectionErrorBoundary>
-      </div>
+<>
+      <HeroSection />
 
-      <div id="about" data-section="about">
-        <SectionErrorBoundary name="about">
-          <AboutMediaOverlay
-            tag="The Framework"
-            title="You're not failing at regulation. You were given the wrong protocol."
-            description="The nervous system space is full of generic advice — breathe this way, cold plunge, 'just relax' — handed to everyone the same way. It fails constantly, because a system stuck in shutdown needs the opposite of one stuck in high-alert. Tell a wired system to slow down, it helps. Tell a shut-down system the same thing, it sinks deeper. Same advice, opposite result. That's not a personal failure. That's a category error in the advice itself."
-            textAnimation="slide-up"
-            imageSrc="https://storage.googleapis.com/webild/users/user_3FsC0wB8czDFk8S4DfiXOATKTCs/uploaded-1782927149388-8rsakfoc.jpg"
-          />
-        </SectionErrorBoundary>
-      </div>
+      <AboutSection />
 
-      <div id="features" data-section="features">
-        <SectionErrorBoundary name="features">
-          <FeaturesBento
-            tag="The Three Types"
-            title="Every nervous system runs one of three ways."
-            description="Stop chasing generic health trends and understand your biological baseline."
-            features={[
-              { title: "Hyperactive", description: "Fight-or-Flight. Racing thoughts, anxious, 'tired but wired,' shallow sleep, jaw and neck tension.", bentoComponent: "info-card-marquee", infoCards: [{ icon: "Zap", label: "State", value: "High Alert" }] },
-              { title: "Hypoactive", description: "Freeze-Shutdown. Fatigue that sleep doesn't fix, brain fog, numbness, low motivation, checked out.", bentoComponent: "info-card-marquee", infoCards: [{ icon: "Snowflake", label: "State", value: "Shutdown" }] },
-              { title: "Regulated", description: "Flexible. Spikes under real stress, recovers, comes back to baseline.", bentoComponent: "info-card-marquee", infoCards: [{ icon: "CheckCircle", label: "State", value: "Baseline" }] }
-            ]}
-            textAnimation="slide-up"
-          />
-        </SectionErrorBoundary>
-      </div>
+      <FeaturesSection />
 
-      <div id="metrics" data-section="metrics">
-        <SectionErrorBoundary name="metrics">
-          <MetricsFeatureCards
-            tag="Clinical Rigor"
-            title="Built by a clinician who sees this every day."
-            description="Dr. Cam Daniels uses objective metrics to guide care, not intuition."
-            metrics={[
-              { value: "80+", title: "Peer-Reviewed Studies", features: ["Advanced Neurological Research", "Validated Biomechanical Mapping", "System-Specific Protocols"] }
-            ]}
-            textAnimation="slide-up"
-          />
-        </SectionErrorBoundary>
-      </div>
+      <MetricsSection />
 
-      <div id="testimonial" data-section="testimonial">
-        <SectionErrorBoundary name="testimonial">
-          <TestimonialColumnMarqueeCards
-            tag="Social Proof"
-            title="Real systems. Real results."
-            description="What our clients are saying about the regulation framework."
-            testimonials={[
-              { name: "Sarah J.", role: "Professional", quote: "Finally understood why my anxiety wouldn't subside. The protocol changed everything.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-senior-entrepreneur_1098-15359.jpg" },
-              { name: "Mark D.", role: "Entrepreneur", quote: "I was stuck in shutdown for years. Cam's clarity was the lever I needed.", imageSrc: "http://img.b2bpic.net/free-photo/smiling-female-doctor-medical-setting_23-2152005921.jpg" },
-              { name: "Emily R.", role: "Creative", quote: "Stop guessing. This framework actually works for my biology.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-beautiful-female-doctor-happily-looking-camera-smiling-white-background_574295-2641.jpg" },
-              { name: "David K.", role: "Developer", quote: "Data-backed, simple, and effective. The regulation protocol is genius.", imageSrc: "http://img.b2bpic.net/free-photo/physician-having-conversation-with-adult-medical-cabinet-taking-notes-about-health-care-diagnosis-general-practitioner-talking-mother-about-recovery-treatment-appointment_482257-41817.jpg" },
-              { name: "Lisa B.", role: "Teacher", quote: "Shifted my daily fatigue in weeks. I'm finally recovering.", imageSrc: "http://img.b2bpic.net/free-photo/closeup-patient-man-looking-into-camera-waiting-doctors-start-stomatology-surgery-sitting-dental-chair_482257-4877.jpg" }
-            ]}
-            textAnimation="slide-up"
-          />
-        </SectionErrorBoundary>
-      </div>
+      <TestimonialSection />
 
-      <div id="contact" data-section="contact">
-        <SectionErrorBoundary name="contact">
-          <ContactCta
-            tag="Pick your path"
-            text="Start your regulation journey today."
-            primaryButton={{ text: "Take the Quiz", href: "#" }}
-            secondaryButton={{ text: "Join the Blueprint", href: "/blueprint" }}
-            textAnimation="slide-up"
-          />
-        </SectionErrorBoundary>
-      </div>
+      <ContactSection />
     </>
   );
-}
+}

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 AboutMediaOverlay from '@/components/sections/about/AboutMediaOverlay';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function AboutSection(): React.JSX.Element {
+  return (
+    <div id="about" data-section="about">
+            <SectionErrorBoundary name="about">
+              <AboutMediaOverlay
+                tag="The Framework"
+                title="You're not failing at regulation. You were given the wrong protocol."
+                description="The nervous system space is full of generic advice — breathe this way, cold plunge, 'just relax' — handed to everyone the same way. It fails constantly, because a system stuck in shutdown needs the opposite of one stuck in high-alert. Tell a wired system to slow down, it helps. Tell a shut-down system the same thing, it sinks deeper. Same advice, opposite result. That's not a personal failure. That's a category error in the advice itself."
+                textAnimation="slide-up"
+                imageSrc="https://storage.googleapis.com/webild/users/user_3FsC0wB8czDFk8S4DfiXOATKTCs/uploaded-1782927149388-8rsakfoc.jpg"
+              />
+            </SectionErrorBoundary>
+          </div>
+  );
+}

src/pages/HomePage/sections/Contact.tsx

@@ -0,0 +1,22 @@
+// 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="Pick your path"
+                text="Start your regulation journey today."
+                primaryButton={{ text: "Take the Quiz", href: "#" }}
+                secondaryButton={{ text: "Join the Blueprint", href: "/blueprint" }}
+                textAnimation="slide-up"
+              />
+            </SectionErrorBoundary>
+          </div>
+  );
+}

src/pages/HomePage/sections/Features.tsx

@@ -0,0 +1,107 @@
+/* eslint-disable */
+// @ts-nocheck — generated by catalog-eject; runtime-correct but TS strict-mode false-positives on inlined catalog body
+import TextAnimation from "@/components/ui/TextAnimation";
+import Button from "@/components/ui/Button";
+import HoverPattern from "@/components/ui/HoverPattern";
+import GridOrCarousel from "@/components/ui/GridOrCarousel";
+import ScrollReveal from "@/components/ui/ScrollReveal";
+import type { LucideIcon } from "lucide-react";
+import { resolveIcon } from "@/utils/resolve-icon";
+
+const features = [
+  {
+    description: "Fight-or-Flight. Racing thoughts, anxious, 'tired but wired,' shallow sleep, jaw and neck tension. Stop the cycle of burnout with targeted recovery.\n\nAKA sympathetic dominance",
+    icon: "Zap",
+    title: "Hyperactive"
+  },
+  {
+    description: "Freeze-Shutdown. Fatigue that sleep doesn't fix, brain fog, numbness, low motivation, checked out. Stop the cycle of burnout with targeted recovery.\n\nAKA parasympathetic dominance",
+    icon: "Snowflake",
+    title: "Hypoactive"
+  },
+  {
+    title: "Regulated",
+    icon: "CheckCircle",
+    description: "Flexible. Spikes under real stress, recovers, comes back to baseline. Stop the cycle of burnout with targeted recovery.\n\nAKA homeostasis"
+  }
+];
+
+type FeatureItem = {
+  icon: string | LucideIcon;
+  title: string;
+  description: string;
+};
+
+interface FeaturesIconCardsProps {
+  tag: string;
+  title: string;
+  description: string;
+  primaryButton?: { text: string; href: string };
+  secondaryButton?: { text: string; href: string };
+  features: FeatureItem[];
+  textAnimation: "slide-up" | "fade-blur" | "fade";
+}
+
+const FeaturesInline = () => {
+  return (
+    <section aria-label="Features icon cards section" className="flex flex-col gap-8 md:gap-10 py-20">
+      <div className="flex flex-col items-center gap-2 w-content-width mx-auto">
+        <div className="px-3 py-1 mb-1 text-sm card rounded w-fit">
+          <p>{"The Three Types"}</p>
+        </div>
+
+        <TextAnimation
+          text={"Every nervous system runs one of three ways."}
+          variant={"slide-up"}
+          gradientText={true}
+          tag="h2"
+          className="md:max-w-8/10 text-6xl 2xl:text-7xl leading-[1.15] font-semibold text-center text-balance"
+        />
+
+        <TextAnimation
+          text={"Stop chasing generic health trends and understand your biological baseline."}
+          variant={"slide-up"}
+          gradientText={false}
+          tag="p"
+          className="md:max-w-7/10 text-lg md:text-xl leading-snug text-center text-balance"
+        />
+
+        {(undefined || undefined) && (
+          <div className="flex flex-wrap justify-center gap-3 mt-2 md:mt-3">
+            {undefined && <Button text={undefined.text} href={undefined.href} variant="primary"/>}
+            {undefined && <Button text={undefined.text} href={undefined.href} variant="secondary"animationDelay={0.1} />}
+          </div>
+        )}
+      </div>
+
+      <ScrollReveal variant="fade-blur">
+        <GridOrCarousel>
+          {features.map((feature) => {
+            const FeatureIcon = resolveIcon(feature.icon);
+            return (
+            <div key={feature.title} className="flex flex-col gap-3 xl:gap-3.5 2xl:gap-4 p-3 xl:p-3.5 2xl:p-4 h-full card rounded">
+              <HoverPattern className="flex items-center justify-center rounded bg-foreground/5 shadow shadow-foreground/5 h-48">
+                <div className="relative z-10 flex items-center justify-center size-12 md:size-14 2xl:size-16 primary-button rounded shadow">
+                  <FeatureIcon className="size-4 text-primary-cta-text" strokeWidth={1.5} />
+                </div>
+              </HoverPattern>
+              <div className="flex flex-col gap-1 p-3 xl:p-3.5 2xl:p-4">
+                <h3 className="text-2xl font-semibold leading-snug">{feature.title}</h3>
+                <p className="text-base leading-snug">{feature.description}</p>
+              </div>
+            </div>
+            );
+          })}
+        </GridOrCarousel>
+      </ScrollReveal>
+    </section>
+  );
+};
+
+export default function FeaturesSection() {
+  return (
+    <div data-webild-section="features" id="features">
+      <FeaturesInline />
+    </div>
+  );
+}

src/pages/HomePage/sections/Hero.tsx

@@ -0,0 +1,110 @@
+/* eslint-disable */
+// @ts-nocheck — generated by catalog-eject; runtime-correct but TS strict-mode false-positives on inlined catalog body
+import Button from "@/components/ui/Button";
+import HeroBackgroundSlot from "@/components/ui/HeroBackgroundSlot";
+import TextAnimation from "@/components/ui/TextAnimation";
+import ImageOrVideo from "@/components/ui/ImageOrVideo";
+
+const primaryButton = {
+  text: "Take the Free Nervous System Quiz",
+  href: "#"
+};
+const secondaryButton = {
+  text: "Learn More",
+  href: "/about"
+};
+const leftItems = [
+  {
+    imageSrc: "http://img.b2bpic.net/free-photo/attractive-smiling-doctor-holding-hand-heart-dreamily-looking-camera-isolated-tender-touched-expression_574295-2653.jpg"
+  },
+  {
+    imageSrc: "http://img.b2bpic.net/free-photo/braille-alpahbet-pills-container-top-view_23-2148718145.jpg"
+  },
+  {
+    imageSrc: "http://img.b2bpic.net/free-photo/pleased-young-male-doctor-wearing-medical-coat-stethoscope-around-his-neck-looking-side-isolated-blue-background_141793-133933.jpg"
+  }
+];
+const rightItems = [
+  {
+    imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-pills-container_23-2148718176.jpg"
+  },
+  {
+    imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-pills-containers-stethoscope_23-2148718178.jpg"
+  },
+  {
+    imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-joyful-male-doctor_171337-1489.jpg"
+  }
+];
+
+type HeroSplitVerticalMarqueeTallProps = {
+  tag: string;
+  title: string;
+  description: string;
+  primaryButton: { text: string; href: string };
+  secondaryButton: { text: string; href: string };
+  leftItems: ({ imageSrc: string; videoSrc?: never } | { videoSrc: string; imageSrc?: never })[];
+  rightItems: ({ imageSrc: string; videoSrc?: never } | { videoSrc: string; imageSrc?: never })[];
+  textAnimation: "slide-up" | "fade-blur" | "fade";
+};
+
+const HeroInline = () => {
+  const duplicatedLeft = [...leftItems, ...leftItems, ...leftItems, ...leftItems];
+  const duplicatedRight = [...rightItems, ...rightItems, ...rightItems, ...rightItems];
+
+  return (
+    <section aria-label="Hero section" className="relative flex items-center h-fit md:h-svh pt-25 pb-20 md:py-0">
+      <HeroBackgroundSlot />
+      <div className="flex flex-col md:flex-row items-center gap-12 md:gap-20 w-content-width mx-auto">
+        <div className="w-full md:w-1/2">
+          <div className="flex flex-col items-center md:items-start gap-3">
+
+
+            <TextAnimation
+              text={"Stop guessing your nervous system state. Get a personalized, clinician-built protocol in 2 minutes."}
+              variant={"slide-up"}
+              gradientText={false}
+              tag="h1"
+              className="text-5xl md:text-6xl lg:text-7xl leading-[1.15] font-semibold text-center md:text-left text-balance text-foreground"
+            />
+
+            <p className="md:max-w-8/10 text-lg md:text-xl leading-relaxed text-center md:text-left text-balance text-accent">
+              There&apos;s no universal way to regulate a nervous system. <span className="text-primary-cta font-medium">There&apos;s yours.</span> Most nervous system advice is built for a system that isn&apos;t yours. If you&apos;ve tried everything and are still stuck, <span className="text-primary-cta font-medium">you were given the wrong protocol.</span> Take the 2-minute quiz built by a practicing clinician — find out exactly which way your nervous system is stuck, and the protocol built for that, not someone else&apos;s.
+            </p>
+
+            <div className="flex flex-wrap max-md:justify-center gap-3 mt-2 md:mt-3">
+              <Button text={primaryButton.text} href={primaryButton.href} variant="primary"/>
+              <Button text={secondaryButton.text} href={secondaryButton.href} variant="secondary"animationDelay={0.1} />
+            </div>
+          </div>
+        </div>
+
+        <div className="w-full md:w-1/2 flex justify-center">
+          <div className="w-full max-w-md aspect-[4/5] rounded-lg overflow-hidden card p-2">
+            <ImageOrVideo 
+              imageSrc="https://storage.googleapis.com/webild/users/user_3FsC0wB8czDFk8S4DfiXOATKTCs/uploaded-1782928869659-ksina2wv.png" 
+              className="w-full h-full object-cover rounded"
+            />
+          </div>
+        </div>
+      </div>
+
+      <div className="w-content-width mx-auto mt-24 pt-12 border-t border-white/10">
+        <p className="text-center text-sm text-accent mb-8 uppercase tracking-widest">Trusted by & Featured In</p>
+        <div className="flex flex-wrap justify-center items-center gap-8 md:gap-16 opacity-70 grayscale">
+          <div className="text-xl font-bold font-serif text-foreground">The Specific</div>
+          <div className="text-xl font-bold font-serif text-foreground">Upper Cervical Care</div>
+          <div className="text-xl font-bold font-serif text-foreground">Functional Neurology</div>
+          <div className="text-xl font-bold font-serif text-foreground">HRV Science</div>
+        </div>
+      </div>
+    </section>
+  );
+};
+
+export default function HeroSection() {
+  return (
+    <div data-webild-section="hero" id="hero">
+      <HeroInline />
+    </div>
+  );
+}

src/pages/HomePage/sections/Metrics.tsx

@@ -0,0 +1,24 @@
+// 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 MetricsFeatureCards from '@/components/sections/metrics/MetricsFeatureCards';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function MetricsSection(): React.JSX.Element {
+  return (
+    <div id="metrics" data-section="metrics">
+            <SectionErrorBoundary name="metrics">
+              <MetricsFeatureCards
+                tag="Clinical Rigor"
+                title="Built by a clinician who sees this every day."
+                description="Dr. Cam Daniels uses objective metrics to guide care, not intuition."
+                metrics={[
+                  { value: "80+", title: "Peer-Reviewed Studies", features: ["Advanced Neurological Research", "Validated Biomechanical Mapping", "System-Specific Protocols"] }
+                ]}
+                textAnimation="slide-up"
+              />
+            </SectionErrorBoundary>
+          </div>
+  );
+}

src/pages/HomePage/sections/Testimonial.tsx

@@ -0,0 +1,28 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "testimonial" section.
+
+import React from 'react';
+import TestimonialColumnMarqueeCards from '@/components/sections/testimonial/TestimonialColumnMarqueeCards';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function TestimonialSection(): React.JSX.Element {
+  return (
+    <div id="testimonial" data-section="testimonial">
+            <SectionErrorBoundary name="testimonial">
+              <TestimonialColumnMarqueeCards
+                tag="Social Proof"
+                title="Real systems. Real results."
+                description="What our clients are saying about the regulation framework."
+                testimonials={[
+                  { name: "Sarah J.", role: "Professional", quote: "Finally understood why my anxiety wouldn't subside. The protocol changed everything.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-senior-entrepreneur_1098-15359.jpg" },
+                  { name: "Mark D.", role: "Entrepreneur", quote: "I was stuck in shutdown for years. Cam's clarity was the lever I needed.", imageSrc: "http://img.b2bpic.net/free-photo/smiling-female-doctor-medical-setting_23-2152005921.jpg" },
+                  { name: "Emily R.", role: "Creative", quote: "Stop guessing. This framework actually works for my biology.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-beautiful-female-doctor-happily-looking-camera-smiling-white-background_574295-2641.jpg" },
+                  { name: "David K.", role: "Developer", quote: "Data-backed, simple, and effective. The regulation protocol is genius.", imageSrc: "http://img.b2bpic.net/free-photo/physician-having-conversation-with-adult-medical-cabinet-taking-notes-about-health-care-diagnosis-general-practitioner-talking-mother-about-recovery-treatment-appointment_482257-41817.jpg" },
+                  { name: "Lisa B.", role: "Teacher", quote: "Shifted my daily fatigue in weeks. I'm finally recovering.", imageSrc: "http://img.b2bpic.net/free-photo/closeup-patient-man-looking-into-camera-waiting-doctors-start-stomatology-surgery-sitting-dental-chair_482257-4877.jpg" }
+                ]}
+                textAnimation="slide-up"
+              />
+            </SectionErrorBoundary>
+          </div>
+  );
+}