src/components/sections/about/MediaAbout.tsx

@@ -1,6 +1,5 @@
 "use client";
 
-
 import MediaContent from "@/components/shared/MediaContent";
 import TextBox from "@/components/Textbox";
 import { cls } from "@/lib/utils";
@@ -31,6 +30,8 @@ interface MediaAboutProps {
     buttonTextClassName?: string;
     mediaWrapperClassName?: string;
     mediaClassName?: string;
+    backgroundVideoSrc?: string;
+    backgroundVideoAriaLabel?: string;
 }
 
 const MediaAbout = ({
@@ -57,11 +58,15 @@ const MediaAbout = ({
     buttonTextClassName = "",
     mediaWrapperClassName = "",
     mediaClassName = "",
+    backgroundVideoSrc,
+    backgroundVideoAriaLabel,
 }: MediaAboutProps) => {
 
     return (
         <section
             aria-label={ariaLabel}
+            style={backgroundVideoSrc ? { position: "relative" } : undefined}
+            className={cls("relative", backgroundVideoSrc && "overflow-hidden")}
             className={cls("relative py-20 w-full", useInvertedBackground && "bg-foreground", className)}
         >
             <div className={cls("relative w-content-width mx-auto aspect-auto min-h-70 md:aspect-video md:min-h-0 rounded-theme-capped overflow-hidden", mediaWrapperClassName)}>