diff --git a/public/img/hero/bg-012.png b/public/img/hero/bg-012.png
new file mode 100644
index 00000000..6c262664
Binary files /dev/null and b/public/img/hero/bg-012.png differ
diff --git a/public/img/hero/bg-02.png b/public/img/hero/bg-02.png
index 6c262664..1e337232 100644
Binary files a/public/img/hero/bg-02.png and b/public/img/hero/bg-02.png differ
diff --git a/src/pages/Home/LandingPage.css b/src/pages/Home/LandingPage.css
index b3aeb04a..26522e7d 100644
--- a/src/pages/Home/LandingPage.css
+++ b/src/pages/Home/LandingPage.css
@@ -142,6 +142,7 @@ body {
 
 .section-py {
   padding: 6.25rem 0;
+  min-height: 100vh !important;
 }
 
 .btn-primary {
diff --git a/src/pages/Home/LandingPage.jsx b/src/pages/Home/LandingPage.jsx
index 19916352..d8eec31b 100644
--- a/src/pages/Home/LandingPage.jsx
+++ b/src/pages/Home/LandingPage.jsx
@@ -288,7 +288,7 @@ const LandingPage = () => {
       </section>
 
       {/* <!-- Pricing Section (Bootstrap 5) --> */}
-      <section id="pricing" className="bg-light section-py vh-100">
+      <section id="pricing" className="bg-light section-py vh-auto">
         <div className="container text-center">
           <h3 className="mb-5">Simple & Transparent Pricing</h3>
           <h5>Tailored pricing plans designed for you.</h5>
@@ -358,7 +358,7 @@ const LandingPage = () => {
         </div>
       </section>
       {/* <!-- About --> */}
-      <section id="about" className="section-py vh-100">
+      <section id="about" className="section-py vh-auto">
         <div className="container text-start" style={{ maxWidth: "75%" }}>
           <h2 className="fw-bold mb-4  text-center">
             About{" "}
@@ -478,7 +478,7 @@ const LandingPage = () => {
         </div>
       </section>
 
-      <section id="faq" className="bg-light  section-py vh-100">
+      <section id="faq" className="bg-light  section-py vh-auto">
         <div className="container text-center">
           <h3>
             Frequently AskedQuestions <br />