From d20a34d1e25ddbc98c5e6d87b8f80498452a0e4c Mon Sep 17 00:00:00 2001
From: kudinDmitriyUp <kudin.dmitriy.up@gmail.com>
Date: Mon, 15 Jun 2026 12:36:22 +0000
Subject: [PATCH] Bob AI: Replaced hero section with HeroOverlay to fix layout
 issues

---
 src/pages/HomePage.tsx                       | 248 ++-----------------
 src/pages/HomePage/sections/About.tsx        |  22 ++
 src/pages/HomePage/sections/Bento.tsx        |  57 +++++
 src/pages/HomePage/sections/Contact.tsx      |  27 ++
 src/pages/HomePage/sections/Faq.tsx          |  38 +++
 src/pages/HomePage/sections/Features.tsx     |  37 +++
 src/pages/HomePage/sections/Hero.tsx         |  19 ++
 src/pages/HomePage/sections/Metrics.tsx      |  34 +++
 src/pages/HomePage/sections/Testimonials.tsx |  57 +++++
 9 files changed, 315 insertions(+), 224 deletions(-)
 create mode 100644 src/pages/HomePage/sections/About.tsx
 create mode 100644 src/pages/HomePage/sections/Bento.tsx
 create mode 100644 src/pages/HomePage/sections/Contact.tsx
 create mode 100644 src/pages/HomePage/sections/Faq.tsx
 create mode 100644 src/pages/HomePage/sections/Features.tsx
 create mode 100644 src/pages/HomePage/sections/Hero.tsx
 create mode 100644 src/pages/HomePage/sections/Metrics.tsx
 create mode 100644 src/pages/HomePage/sections/Testimonials.tsx

diff --git a/src/pages/HomePage.tsx b/src/pages/HomePage.tsx
index 5ac9456..6190fa1 100644
--- a/src/pages/HomePage.tsx
+++ b/src/pages/HomePage.tsx
@@ -1,236 +1,36 @@
-import AboutText from '@/components/sections/about/AboutText';
-import ContactCta from '@/components/sections/contact/ContactCta';
-import FaqTwoColumn from '@/components/sections/faq/FaqTwoColumn';
-import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
-import FeaturesMediaCards from '@/components/sections/features/FeaturesMediaCards';
-import HeroOverlay from '@/components/sections/hero/HeroOverlay';
-import MetricsMediaCards from '@/components/sections/metrics/MetricsMediaCards';
-import TestimonialRatingCards from '@/components/sections/testimonial/TestimonialRatingCards';
-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 BentoSection from './HomePage/sections/Bento';
+import MetricsSection from './HomePage/sections/Metrics';
+import TestimonialsSection from './HomePage/sections/Testimonials';
+import FaqSection from './HomePage/sections/Faq';
+import ContactSection from './HomePage/sections/Contact';
+
+export default function HomePage(): React.JSX.Element {
   return (
-    <>
-  <div id="hero" data-section="hero">
-    <SectionErrorBoundary name="hero">
-          <HeroOverlay
-      tag="Discover Cinema's Greatest Stories"
-      title="Explore Potsdam's Legendary Film Heritage"
-      description="Experience the magic of cinema where history meets innovation. Immerse yourself in our world-class exhibitions and rare archives."
-      primaryButton={{
-        text: "Explore Exhibitions",
-        href: "#features",
-      }}
-      secondaryButton={{
-        text: "Plan Your Visit",
-        href: "#contact",
-      }}
-      imageSrc="http://img.b2bpic.net/free-photo/vintage-bicycle_1203-3622.jpg"
-    />
-    </SectionErrorBoundary>
-  </div>
+<>
+  <HeroSection />
 
-  <div id="about" data-section="about">
-    <SectionErrorBoundary name="about">
-          <AboutText
-      title="A Beacon for Cinema History in the Heart of Potsdam"
-      primaryButton={{
-        text: "Learn About Our History",
-        href: "#",
-      }}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <AboutSection />
 
-  <div id="features" data-section="features">
-    <SectionErrorBoundary name="features">
-          <FeaturesMediaCards
-      tag="What We Offer"
-      title="Diverse Cultural Experiences"
-      description="Engage with cinema through our curated exhibitions, academic archives, and special programming."
-      items={[
-        {
-          title: "Rare Archive Access",
-          description: "Delve into our extensive film archives.",
-          imageSrc: "http://img.b2bpic.net/free-photo/view-black-white-theatre-stage_23-2151184649.jpg",
-        },
-        {
-          title: "Educational Programs",
-          description: "Interactive workshops for students and educators.",
-          imageSrc: "http://img.b2bpic.net/free-photo/press-reporter-fallowing-leads-case_23-2149579722.jpg",
-        },
-        {
-          title: "Special Events",
-          description: "Screenings, talks, and festivals throughout the year.",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-happy-friends-watching-movie_23-2149269335.jpg",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <FeaturesSection />
 
-  <div id="bento" data-section="bento">
-    <SectionErrorBoundary name="bento">
-          <FeaturesImageBento
-      tag="Collection"
-      title="Explore Our Curated Film Collection"
-      description="Discover historical artifacts, lenses, and posters from the golden age of German film."
-      items={[
-        {
-          title: "Scripts",
-          description: "Rare originals",
-          imageSrc: "http://img.b2bpic.net/free-photo/still-life-vintage-objects_23-2150244550.jpg",
-        },
-        {
-          title: "Lenses",
-          description: "Precision optics",
-          imageSrc: "http://img.b2bpic.net/free-photo/view-vintage-camera_23-2150315166.jpg",
-        },
-        {
-          title: "Editing",
-          description: "Vintage tools",
-          imageSrc: "http://img.b2bpic.net/free-photo/view-3d-cinema-projector_23-2151067016.jpg",
-        },
-        {
-          title: "Posters",
-          description: "Art & design",
-          imageSrc: "http://img.b2bpic.net/free-photo/hanging-eye-mask-burnt-blank-paper-closed-locker-door_23-2148051752.jpg",
-        },
-        {
-          title: "Restoration",
-          description: "Archival care",
-          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-retro-vhs-packaging_23-2149854386.jpg",
-        },
-        {
-          title: "Iconography",
-          description: "Legendary items",
-          imageSrc: "http://img.b2bpic.net/free-photo/simple-wooden-barber-chair-studio-lights_181624-44106.jpg",
-        },
-        {
-          title: "Archives",
-          description: "Complete records",
-          imageSrc: "http://img.b2bpic.net/free-photo/view-luxurious-hotel-interior-space_23-2150683407.jpg",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <BentoSection />
 
-  <div id="metrics" data-section="metrics">
-    <SectionErrorBoundary name="metrics">
-          <MetricsMediaCards
-      tag="Museum by Numbers"
-      title="Our Cultural Impact"
-      description="Keeping history alive through preservation and engagement."
-      metrics={[
-        {
-          value: "120K+",
-          title: "Historical Objects",
-          description: "Carefully preserved artifacts.",
-          imageSrc: "http://img.b2bpic.net/free-photo/3d-render-grunge-wooden-room-interior-with-blank-picture-frames_1048-6495.jpg",
-        },
-        {
-          value: "50+",
-          title: "Annual Events",
-          description: "Special screenings and educational talks.",
-          imageSrc: "http://img.b2bpic.net/free-photo/playful-teens-with-dog-couch_23-2147768032.jpg",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <MetricsSection />
 
-  <div id="testimonials" data-section="testimonials">
-    <SectionErrorBoundary name="testimonials">
-          <TestimonialRatingCards
-      tag="Voices of Our Visitors"
-      title="Experience Stories"
-      description="What our guests say about their journey through cinema history."
-      testimonials={[
-        {
-          name: "Sarah J.",
-          role: "Film Scholar",
-          quote: "An absolute treasure trove of cinematic gems.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/female-tourist-with-binoculars_23-2147981983.jpg",
-        },
-        {
-          name: "Thomas K.",
-          role: "History Teacher",
-          quote: "Excellent educational resources for my students.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-old-man-holding-camera_23-2148997276.jpg",
-        },
-        {
-          name: "Lena M.",
-          role: "Visitor",
-          quote: "So much to learn, beautifully presented exhibits.",
-          rating: 4,
-          imageSrc: "http://img.b2bpic.net/free-photo/front-view-male-tourist-with-his-backpack-pink-wall-color-tourist-emotion_140725-122628.jpg",
-        },
-        {
-          name: "David W.",
-          role: "Cinematographer",
-          quote: "The lens collection alone is worth the visit.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/man-watching-movie-cinema_23-2148202096.jpg",
-        },
-        {
-          name: "Julia H.",
-          role: "Tourist",
-          quote: "A must-see highlight of Potsdam culture.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-with-bicycle_23-2149213188.jpg",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <TestimonialsSection />
 
-  <div id="faq" data-section="faq">
-    <SectionErrorBoundary name="faq">
-          <FaqTwoColumn
-      tag="Plan Your Trip"
-      title="Frequently Asked Questions"
-      description="Everything you need to know before visiting."
-      items={[
-        {
-          question: "What are your opening hours?",
-          answer: "Daily from 10:00 AM to 6:00 PM.",
-        },
-        {
-          question: "Is there a guided tour available?",
-          answer: "Yes, weekend guided tours start at 11:00 AM.",
-        },
-        {
-          question: "How can I book tickets for groups?",
-          answer: "Please use our ticketing portal or contact booking@filmmuseum-potsdam.de.",
-        },
-        {
-          question: "Are student discounts available?",
-          answer: "Students get reduced entry fees with valid IDs.",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <FaqSection />
 
-  <div id="contact" data-section="contact">
-    <SectionErrorBoundary name="contact">
-          <ContactCta
-      tag="Visit Us"
-      text="Ready to discover cinema's greatest stories? Book your tickets today."
-      primaryButton={{
-        text: "Buy Tickets",
-        href: "#",
-      }}
-      secondaryButton={{
-        text: "Contact Us",
-        href: "mailto:info@filmmuseum-potsdam.de",
-      }}
-    />
-    </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..8196892
--- /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="A Beacon for Cinema History in the Heart of Potsdam"
+          primaryButton={{
+            text: "Learn About Our History",
+            href: "#",
+          }}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
diff --git a/src/pages/HomePage/sections/Bento.tsx b/src/pages/HomePage/sections/Bento.tsx
new file mode 100644
index 0000000..2ceb226
--- /dev/null
+++ b/src/pages/HomePage/sections/Bento.tsx
@@ -0,0 +1,57 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "bento" section.
+
+import React from 'react';
+import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function BentoSection(): React.JSX.Element {
+  return (
+    <div id="bento" data-section="bento">
+        <SectionErrorBoundary name="bento">
+              <FeaturesImageBento
+          tag="Collection"
+          title="Explore Our Curated Film Collection"
+          description="Discover historical artifacts, lenses, and posters from the golden age of German film."
+          items={[
+            {
+              title: "Scripts",
+              description: "Rare originals",
+              imageSrc: "http://img.b2bpic.net/free-photo/still-life-vintage-objects_23-2150244550.jpg",
+            },
+            {
+              title: "Lenses",
+              description: "Precision optics",
+              imageSrc: "http://img.b2bpic.net/free-photo/view-vintage-camera_23-2150315166.jpg",
+            },
+            {
+              title: "Editing",
+              description: "Vintage tools",
+              imageSrc: "http://img.b2bpic.net/free-photo/view-3d-cinema-projector_23-2151067016.jpg",
+            },
+            {
+              title: "Posters",
+              description: "Art & design",
+              imageSrc: "http://img.b2bpic.net/free-photo/hanging-eye-mask-burnt-blank-paper-closed-locker-door_23-2148051752.jpg",
+            },
+            {
+              title: "Restoration",
+              description: "Archival care",
+              imageSrc: "http://img.b2bpic.net/free-photo/high-angle-retro-vhs-packaging_23-2149854386.jpg",
+            },
+            {
+              title: "Iconography",
+              description: "Legendary items",
+              imageSrc: "http://img.b2bpic.net/free-photo/simple-wooden-barber-chair-studio-lights_181624-44106.jpg",
+            },
+            {
+              title: "Archives",
+              description: "Complete records",
+              imageSrc: "http://img.b2bpic.net/free-photo/view-luxurious-hotel-interior-space_23-2150683407.jpg",
+            },
+          ]}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
diff --git a/src/pages/HomePage/sections/Contact.tsx b/src/pages/HomePage/sections/Contact.tsx
new file mode 100644
index 0000000..f5ce15f
--- /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="Visit Us"
+          text="Ready to discover cinema's greatest stories? Book your tickets today."
+          primaryButton={{
+            text: "Buy Tickets",
+            href: "#",
+          }}
+          secondaryButton={{
+            text: "Contact Us",
+            href: "mailto:info@filmmuseum-potsdam.de",
+          }}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
diff --git a/src/pages/HomePage/sections/Faq.tsx b/src/pages/HomePage/sections/Faq.tsx
new file mode 100644
index 0000000..31b991d
--- /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="Plan Your Trip"
+          title="Frequently Asked Questions"
+          description="Everything you need to know before visiting."
+          items={[
+            {
+              question: "What are your opening hours?",
+              answer: "Daily from 10:00 AM to 6:00 PM.",
+            },
+            {
+              question: "Is there a guided tour available?",
+              answer: "Yes, weekend guided tours start at 11:00 AM.",
+            },
+            {
+              question: "How can I book tickets for groups?",
+              answer: "Please use our ticketing portal or contact booking@filmmuseum-potsdam.de.",
+            },
+            {
+              question: "Are student discounts available?",
+              answer: "Students get reduced entry fees with valid IDs.",
+            },
+          ]}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
diff --git a/src/pages/HomePage/sections/Features.tsx b/src/pages/HomePage/sections/Features.tsx
new file mode 100644
index 0000000..7469925
--- /dev/null
+++ b/src/pages/HomePage/sections/Features.tsx
@@ -0,0 +1,37 @@
+// 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 FeaturesMediaCards from '@/components/sections/features/FeaturesMediaCards';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function FeaturesSection(): React.JSX.Element {
+  return (
+    <div id="features" data-section="features">
+        <SectionErrorBoundary name="features">
+              <FeaturesMediaCards
+          tag="What We Offer"
+          title="Diverse Cultural Experiences"
+          description="Engage with cinema through our curated exhibitions, academic archives, and special programming."
+          items={[
+            {
+              title: "Rare Archive Access",
+              description: "Delve into our extensive film archives.",
+              imageSrc: "http://img.b2bpic.net/free-photo/view-black-white-theatre-stage_23-2151184649.jpg",
+            },
+            {
+              title: "Educational Programs",
+              description: "Interactive workshops for students and educators.",
+              imageSrc: "http://img.b2bpic.net/free-photo/press-reporter-fallowing-leads-case_23-2149579722.jpg",
+            },
+            {
+              title: "Special Events",
+              description: "Screenings, talks, and festivals throughout the year.",
+              imageSrc: "http://img.b2bpic.net/free-photo/close-up-happy-friends-watching-movie_23-2149269335.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..0a7bb59
--- /dev/null
+++ b/src/pages/HomePage/sections/Hero.tsx
@@ -0,0 +1,19 @@
+// Created by add_section_from_catalog (HeroOverlay).
+
+import React from 'react';
+import HeroOverlay from '@/components/sections/hero/HeroOverlay';
+
+export default function HeroSection(): React.JSX.Element {
+  return (
+    <div data-webild-section="hero" id="hero">
+      <HeroOverlay
+        tag="Filmmuseum Potsdam"
+        primaryButton={{"text":"Explore Exhibitions","href":"#features"}}
+        imageSrc="https://images.unsplash.com/photo-1485846234645-a62644f84728?q=80&w=2059&auto=format&fit=crop"
+        title="Potsdam's Legendary Film Heritage"
+        secondaryButton={{"text":"Plan Your Visit","href":"#contact"}}
+        description="Experience the magic of cinema where history meets innovation. Immerse yourself in our world-class exhibitions and rare archives."
+      />
+    </div>
+  );
+}
diff --git a/src/pages/HomePage/sections/Metrics.tsx b/src/pages/HomePage/sections/Metrics.tsx
new file mode 100644
index 0000000..ea5792e
--- /dev/null
+++ b/src/pages/HomePage/sections/Metrics.tsx
@@ -0,0 +1,34 @@
+// 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 MetricsMediaCards from '@/components/sections/metrics/MetricsMediaCards';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function MetricsSection(): React.JSX.Element {
+  return (
+    <div id="metrics" data-section="metrics">
+        <SectionErrorBoundary name="metrics">
+              <MetricsMediaCards
+          tag="Museum by Numbers"
+          title="Our Cultural Impact"
+          description="Keeping history alive through preservation and engagement."
+          metrics={[
+            {
+              value: "120K+",
+              title: "Historical Objects",
+              description: "Carefully preserved artifacts.",
+              imageSrc: "http://img.b2bpic.net/free-photo/3d-render-grunge-wooden-room-interior-with-blank-picture-frames_1048-6495.jpg",
+            },
+            {
+              value: "50+",
+              title: "Annual Events",
+              description: "Special screenings and educational talks.",
+              imageSrc: "http://img.b2bpic.net/free-photo/playful-teens-with-dog-couch_23-2147768032.jpg",
+            },
+          ]}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
diff --git a/src/pages/HomePage/sections/Testimonials.tsx b/src/pages/HomePage/sections/Testimonials.tsx
new file mode 100644
index 0000000..14539fb
--- /dev/null
+++ b/src/pages/HomePage/sections/Testimonials.tsx
@@ -0,0 +1,57 @@
+// 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 TestimonialRatingCards from '@/components/sections/testimonial/TestimonialRatingCards';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function TestimonialsSection(): React.JSX.Element {
+  return (
+    <div id="testimonials" data-section="testimonials">
+        <SectionErrorBoundary name="testimonials">
+              <TestimonialRatingCards
+          tag="Voices of Our Visitors"
+          title="Experience Stories"
+          description="What our guests say about their journey through cinema history."
+          testimonials={[
+            {
+              name: "Sarah J.",
+              role: "Film Scholar",
+              quote: "An absolute treasure trove of cinematic gems.",
+              rating: 5,
+              imageSrc: "http://img.b2bpic.net/free-photo/female-tourist-with-binoculars_23-2147981983.jpg",
+            },
+            {
+              name: "Thomas K.",
+              role: "History Teacher",
+              quote: "Excellent educational resources for my students.",
+              rating: 5,
+              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-old-man-holding-camera_23-2148997276.jpg",
+            },
+            {
+              name: "Lena M.",
+              role: "Visitor",
+              quote: "So much to learn, beautifully presented exhibits.",
+              rating: 4,
+              imageSrc: "http://img.b2bpic.net/free-photo/front-view-male-tourist-with-his-backpack-pink-wall-color-tourist-emotion_140725-122628.jpg",
+            },
+            {
+              name: "David W.",
+              role: "Cinematographer",
+              quote: "The lens collection alone is worth the visit.",
+              rating: 5,
+              imageSrc: "http://img.b2bpic.net/free-photo/man-watching-movie-cinema_23-2148202096.jpg",
+            },
+            {
+              name: "Julia H.",
+              role: "Tourist",
+              quote: "A must-see highlight of Potsdam culture.",
+              rating: 5,
+              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-with-bicycle_23-2149213188.jpg",
+            },
+          ]}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
-- 
2.49.1