feat: Hero-Hintergrundvideo im Admin, ScrollReveal + Bild-Perf auf Unterseiten

Neues admin-editierbares Hintergrundvideo fuer den Startseiten-Hero
(home.hero.video, MP4/WebM) mit eigenem, magic-byte-validiertem
Upload-Endpunkt (app/api/admin/upload-video) analog zur bestehenden
Bild-Upload-Pipeline. Ausserdem: ScrollReveal-Animation von der
Startseite auf Imkerei, Herkunft, Unternehmen, Ernten, Wissen, Kontakt,
Shop sowie die Produkt-/Ernte-/Chargen-Detailseiten ausgerollt (bisher
nur Startseite), priority auf bislang lazy geladene Above-the-fold-Bilder
(Herkunft/Unternehmen) gesetzt, und passende sizes-Hints auf Grid-Bilder
(Produktkarten, Origin/Regional/Business-Teaser, Ernten-Liste) ergaenzt
statt voller Viewport-Breite.

Co-Authored-By: Claude Sonnet 5 <[email protected]>

src/app/unternehmen/page.tsx

@@ -2,6 +2,7 @@ import type { Metadata } from "next";
 import { Container, SectionHeading } from "@/components/ui";
 import { ContentImage } from "@/components/content-image";
 import { BusinessInquiryForm } from "@/components/business-inquiry-form";
+import { ScrollReveal } from "@/components/scroll-reveal";
 import { getLocale } from "@/i18n/locale";
 import { getDictionary } from "@/i18n/get-dictionary";
 import { getContentValue } from "@/lib/content";
@@ -27,28 +28,31 @@ export default async function UnternehmenPage() {
         tone="honey"
         className="h-[45vh] min-h-[320px] w-full"
         label={t.unternehmenPage.eyebrow}
+        priority
       />
       <Container className="py-20">
-        <SectionHeading
-          level="h1"
-          eyebrow={t.unternehmenPage.eyebrow}
-          title={t.unternehmenPage.title}
-          subtitle={t.unternehmenPage.subtitle}
-        />
+        <ScrollReveal>
+          <SectionHeading
+            level="h1"
+            eyebrow={t.unternehmenPage.eyebrow}
+            title={t.unternehmenPage.title}
+            subtitle={t.unternehmenPage.subtitle}
+          />
+        </ScrollReveal>
 
         <div className="mt-14 grid sm:grid-cols-3 gap-8">
-          {t.unternehmenPage.packages.map((pkg) => (
-            <div key={pkg.key} className="border border-ink/10 p-8">
+          {t.unternehmenPage.packages.map((pkg, i) => (
+            <ScrollReveal key={pkg.key} delay={i * 0.08} className="border border-ink/10 p-8">
               <h3 className="text-lg text-forest">{pkg.title}</h3>
               <p className="mt-2 text-sm text-ink/65">{pkg.text}</p>
-            </div>
+            </ScrollReveal>
           ))}
         </div>
 
-        <div className="mt-20 max-w-2xl">
+        <ScrollReveal className="mt-20 max-w-2xl">
           <h2 className="text-2xl text-forest mb-8">{t.unternehmenPage.inquiryHeading}</h2>
           <BusinessInquiryForm />
-        </div>
+        </ScrollReveal>
       </Container>
     </div>
   );