feat: add boilerplate homepage video

src/app/(landing-routes)/(home)/page.tsx

@@ -1,16 +1,20 @@
 import Hero from "~/components/layouts/homepage/Hero";
 import HowItWorks from "~/components/layouts/homepage/HowItWorks";
+import MarketingAd from "~/components/layouts/homepage/MarketingAd";
 import PerfectFit from "~/components/layouts/homepage/PerfectFit";
 import Testimonials from "~/components/layouts/homepage/Testimonials";
 import UserSection from "~/components/layouts/homepage/UserSection";
+import Video from "~/components/layouts/homepage/Video";
 
 export default function Home() {
   return (
     <>
       <Hero />
       <UserSection />
+      <Video />
       <HowItWorks />
       <Testimonials />
+      <MarketingAd />
       <PerfectFit />
     </>
   );

src/app/dashboard/(admin)/admin/(settings)/settings/account/_component.tsx/password.tsx

@@ -60,7 +60,7 @@ const Password = () => {
   };
 
   return (
-    <div className="w-full max-w-[674px] px-8 pt-[50px]">
+    <div className="w-full px-3 pt-[50px] md:px-8">
       <div className="mb-8">
         <h2 className="mb-2 text-2xl font-semibold text-neutral-dark-1">
           Password Settings

src/components/layouts/homepage/MarketingAd.tsx

@@ -0,0 +1,12 @@
+const MarketingAd = () => {
+  return (
+    <div className="mx-auto flex w-full items-center justify-center">
+      <video width="1000" controls>
+        <source src="/video/boilerplate-mkt-ad.mp4" type="video/mp4" />
+        Your browser does not support the video tag.
+      </video>
+    </div>
+  );
+};
+
+export default MarketingAd;

src/components/layouts/homepage/Video.tsx

@@ -0,0 +1,12 @@
+const Video = () => {
+  return (
+    <div className="mx-auto flex w-full items-center justify-center">
+      <video width="1000" controls>
+        <source src="/video/php-boilerplate.mp4" type="video/mp4" />
+        Your browser does not support the video tag.
+      </video>
+    </div>
+  );
+};
+
+export default Video;