diff --git a/assets/dashboard-dark.png b/assets/dashboard-dark.png
index d406da22c..cfbcd48c3 100644
Binary files a/assets/dashboard-dark.png and b/assets/dashboard-dark.png differ
diff --git a/assets/dashboard-light.png b/assets/dashboard-light.png
index b14477136..5731ada44 100644
Binary files a/assets/dashboard-light.png and b/assets/dashboard-light.png differ
diff --git a/assets/wordpress-paybutton.png b/assets/wordpress-paybutton.png
new file mode 100644
index 000000000..18d8b456c
Binary files /dev/null and b/assets/wordpress-paybutton.png differ
diff --git a/assets/wordpress.png b/assets/wordpress.png
new file mode 100644
index 000000000..e455839a6
Binary files /dev/null and b/assets/wordpress.png differ
diff --git a/components/LandingPage/CTASection.tsx b/components/LandingPage/CTASection.tsx
new file mode 100644
index 000000000..92a22b9f9
--- /dev/null
+++ b/components/LandingPage/CTASection.tsx
@@ -0,0 +1,42 @@
+import Link from 'next/link'
+import style from 'styles/landing.module.css'
+
+export default function CTASection (): JSX.Element {
+  return (
+    <div className={style.cta_ctn}>
+      <div className={style.container}>
+        <div className={style.cta_content}>
+          <h2>
+            Ready to Start Accepting <span>eCash</span>?
+          </h2>
+          <div className={style.cta_buttons}>
+            <Link href="/signup" className="button_main button_large">
+              Get Started Free
+            </Link>
+            <Link
+              href="https://docs.paybutton.org"
+              target="_blank"
+              className="button_outline button_large"
+            >
+              View Documentation
+            </Link>
+          </div>
+          <div className={style.cta_features}>
+            <div className={style.cta_feature}>
+              <span className={style.cta_check}>✓</span>
+              <span>No setup fees</span>
+            </div>
+            <div className={style.cta_feature}>
+              <span className={style.cta_check}>✓</span>
+              <span>Instant activation</span>
+            </div>
+            <div className={style.cta_feature}>
+              <span className={style.cta_check}>✓</span>
+              <span>Easy to use</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}
diff --git a/components/LandingPage/Dashboard.tsx b/components/LandingPage/Dashboard.tsx
index f77cccf97..aaa023cf4 100644
--- a/components/LandingPage/Dashboard.tsx
+++ b/components/LandingPage/Dashboard.tsx
@@ -1,16 +1,14 @@
-import Link from 'next/link';
-import Image from 'next/image';
-import style from '/styles/landing.module.css';
-import DashboardScreen from 'assets/dashboard-light.png';
-import DashboardScreenDark from 'assets/dashboard-dark.png';
-import Wave from 'assets/wave2.svg';
+import Image from 'next/image'
+import style from 'styles/landing.module.css'
+import DashboardScreen from 'assets/dashboard-light.png'
+import DashboardScreenDark from 'assets/dashboard-dark.png'
 
-export default function Dashboard(): JSX.Element {
+export default function Dashboard (): JSX.Element {
   return (
     <div className={style.dashboard_ctn}>
       <div className={style.container}>
         <h2>
-          Dashboard<span>New!</span>
+          Dashboard
         </h2>
         <p>
           Track transactions and revenue through the PayButton dashboard. Create
@@ -30,8 +28,18 @@ export default function Dashboard(): JSX.Element {
           />
         </div>
       </div>
-      <Image src={Wave} alt="wave" className={style.wave2} />
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 1440 181"
+        className={style.wave2}
+      >
+        <path
+          fill="var(--wave-fill-color, #e5e4e4)"
+          fillOpacity="1"
+          d="M 0 160 L 80 149.3 C 160 139 320 117 480 122.7 C 640 128 800 160 960 170.7 C 1120 181 1280 171 1440 117 L 1440 181 L 0 181 Z"
+        />
+      </svg>
       <div className={style.whitebackground} />
     </div>
-  );
+  )
 }
diff --git a/components/LandingPage/FeaturesSection.tsx b/components/LandingPage/FeaturesSection.tsx
new file mode 100644
index 000000000..233c7bbbd
--- /dev/null
+++ b/components/LandingPage/FeaturesSection.tsx
@@ -0,0 +1,76 @@
+import style from 'styles/landing.module.css'
+
+export default function FeaturesSection (): JSX.Element {
+  return (
+    <div className={style.features_ctn}>
+      <div className={style.container}>
+        <div className={style.features_header}>
+          <h2>
+            Why Choose <span>PayButton</span>?
+          </h2>
+          <p>
+            The most reliable and user-friendly way to accept eCash payments
+            online
+          </p>
+        </div>
+        <div className={style.features_grid}>
+          <div className={style.feature_card}>
+            <div className={style.feature_icon_wrapper}>
+              <div className={style.feature_icon}>⚡</div>
+            </div>
+            <h3>Lightning Fast</h3>
+            <p>
+              Instant payment processing with eCash's fast blockchain. No
+              waiting for confirmations or dealing with slow traditional payment
+              methods.
+            </p>
+          </div>
+          <div className={style.feature_card}>
+            <div className={style.feature_icon_wrapper}>
+              <div className={style.feature_icon}>🔒</div>
+            </div>
+            <h3>Secure & Private</h3>
+            <p>
+              Built on eCash's secure blockchain with privacy features. Your
+              customers' payment data stays private and secure.
+            </p>
+          </div>
+          <div className={style.feature_card}>
+            <div className={style.feature_icon_wrapper}>
+              <div className={style.feature_icon}>💰</div>
+            </div>
+            <h3>Low Fees</h3>
+            <p>
+              Minimal transaction fees compared to traditional payment
+              processors. Keep more of your revenue with eCash's efficient
+              network.
+            </p>
+          </div>
+
+          <div className={style.feature_card}>
+            <div className={style.feature_icon_wrapper}>
+              <div className={style.feature_icon}>🛠️</div>
+            </div>
+            <h3>Easy Integration</h3>
+            <p>
+              Simple code snippets, WordPress plugin, and comprehensive
+              documentation make integration effortless.
+            </p>
+          </div>
+        </div>
+
+        <div className={style.use_cases}>
+          <h3>Perfect for:</h3>
+          <div className={style.use_cases_features}>
+            <span>🛒 E-commerce</span>
+            <span>📝 Content Creators</span>
+            <span>🎓 Online Courses</span>
+            <span>🎨 Digital Downloads</span>
+            <span>🎁 Donations</span>
+            <span>🔧 Freelancers</span>
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}
diff --git a/components/LandingPage/Footer.tsx b/components/LandingPage/Footer.tsx
index 26f4a5b2d..b0617fd87 100644
--- a/components/LandingPage/Footer.tsx
+++ b/components/LandingPage/Footer.tsx
@@ -1,12 +1,16 @@
-import Link from 'next/link';
-import Image from 'next/image';
-import style from '/styles/landing.module.css';
-import logoImageSource from 'assets/logo.png';
+import Link from 'next/link'
+import Image from 'next/image'
+import style from 'styles/landing.module.css'
+import logoImageSource from 'assets/logo.png'
 import LogoutButton from './LogoutButton'
 
-export default function Footer ({ userId }): JSX.Element {
-  const currentYear = new Date().getFullYear();
-  const copyrightSymbol = '\u00A9';
+interface FooterProps {
+  userId?: string
+}
+
+export default function Footer ({ userId }: FooterProps): JSX.Element {
+  const currentYear = new Date().getFullYear()
+  const copyrightSymbol = '\u00A9'
   return (
     <div className={style.footer_ctn}>
       <div className={style.container}>
@@ -14,6 +18,7 @@ export default function Footer ({ userId }): JSX.Element {
           <Image src={logoImageSource} alt="PayButton" />
           <div className={style.footerlink_ctn}>
             <Link href="#button-generator">Button Generator</Link>
+            <Link href="#wordpress">WordPress</Link>
             <Link
               href="https://github.com/paybutton"
               target="_blank"
@@ -32,24 +37,30 @@ export default function Footer ({ userId }): JSX.Element {
               Docs
             </Link>
             {userId === undefined
-              ? <>
-              <Link href="/signin">Sign In</Link>
-              <Link href="/signup" className="button_outline button_small footer_signup_btn">
-                Sign up
-              </Link>
-            </>
-              : <>
-            <Link href="/dashboard">Dashboard</Link>
-            <LogoutButton footer/>
-          </>
-          }
+              ? (
+              <>
+                <Link href="/signin">Sign In</Link>
+                <Link
+                  href="/signup"
+                  className="button_outline button_small footer_signup_btn"
+                >
+                  Sign up
+                </Link>
+              </>
+                )
+              : (
+              <>
+                <Link href="/dashboard">Dashboard</Link>
+                <LogoutButton footer={true} onClick={() => {}} />
+              </>
+                )}
           </div>
         </div>
         <div className={style.copyright}>
-          {copyrightSymbol} 
+          {copyrightSymbol}
           {currentYear} Blockchain Ventures Corp. All Rights Reserved.
         </div>
       </div>
     </div>
-  );
+  )
 }
diff --git a/components/LandingPage/Hero.tsx b/components/LandingPage/Hero.tsx
index 09cc88309..90bc475ea 100644
--- a/components/LandingPage/Hero.tsx
+++ b/components/LandingPage/Hero.tsx
@@ -1,9 +1,9 @@
 import Link from 'next/link'
 import Image from 'next/image'
-import style from '/styles/landing.module.css'
-import button from 'assets/button-pointer.png'
-import Wave from 'assets/wave.svg'
-import Blocks from 'assets/blocks.png'
+import style from '../../styles/landing.module.css'
+import button from '../../assets/button-pointer.png'
+import Wave from '../../assets/wave.svg'
+import Blocks from '../../assets/blocks.png'
 
 export default function Hero (): JSX.Element {
   return (
@@ -15,10 +15,16 @@ export default function Hero (): JSX.Element {
               The easiest way to accept <span>eCash</span> online
             </h1>
             <p>
-              Start accepting XEC or BCH on your website with only a few lines of code
+              Start accepting XEC or BCH on your website with only a few lines
+              of code
             </p>
+            <div className={style.hero_features}>
+              <span>⚡ Fast</span>
+              <span>🔒 Secure</span>
+              <span>💰 Low fees</span>
+            </div>
             <div className={style.button_ctn}>
-              <Link href="/signup" className='button_main'>
+              <Link href="/signup" className="button_main">
                 Sign up for free
               </Link>
             </div>
diff --git a/components/LandingPage/Navbar.tsx b/components/LandingPage/Navbar.tsx
index f3c746166..2fe93e9e7 100644
--- a/components/LandingPage/Navbar.tsx
+++ b/components/LandingPage/Navbar.tsx
@@ -42,8 +42,13 @@ export default function Navbar ({ userId }: IProps): JSX.Element {
           className={style.navlink_ctn}
           style={mobileMenu ? { left: '0' } : { left: '-200px' }}
         >
-          <ThemeToggle landingpage />
-          <a href="#button-generator" onClick={() => setMobileMenu(false)}>Button Generator</a>
+          <ThemeToggle chart={false} setChart={() => {}} landingpage={true} />
+          <a href="#button-generator" onClick={() => setMobileMenu(false)}>
+            Button Generator
+          </a>
+          <a href="#wordpress" onClick={() => setMobileMenu(false)}>
+            WordPress
+          </a>
           <Link
             href="https://github.com/paybutton"
             target="_blank"
@@ -60,19 +65,35 @@ export default function Navbar ({ userId }: IProps): JSX.Element {
           >
             Telegram
           </Link>
-          <Link href="https://docs.paybutton.org/#/?id=what-is-paybutton" onClick={() => setMobileMenu(false)}>Docs</Link>
+          <Link
+            href="https://docs.paybutton.org/#/?id=what-is-paybutton"
+            onClick={() => setMobileMenu(false)}
+          >
+            Docs
+          </Link>
           {userId === undefined
-            ? <>
-            <a href="/signin" onClick={() => setMobileMenu(false)}>Sign In</a>
-            <a href="/signup" className="button_outline button_small" onClick={() => setMobileMenu(false)}>
-              Sign up
-            </a>
-          </>
-            : <>
-            <a href="/dashboard" onClick={() => setMobileMenu(false)}>Dashboard</a>
-            <LogoutButton />
-          </>
-          }
+            ? (
+            <>
+              <a href="/signin" onClick={() => setMobileMenu(false)}>
+                Sign In
+              </a>
+              <a
+                href="/signup"
+                className="button_outline button_small"
+                onClick={() => setMobileMenu(false)}
+              >
+                Sign up
+              </a>
+            </>
+              )
+            : (
+            <>
+              <a href="/dashboard" onClick={() => setMobileMenu(false)}>
+                Dashboard
+              </a>
+              <LogoutButton onClick={() => {}} footer={false} />
+            </>
+              )}
         </div>
       </div>
     </div>
diff --git a/components/LandingPage/WordPressSection.tsx b/components/LandingPage/WordPressSection.tsx
new file mode 100644
index 000000000..4cee2a449
--- /dev/null
+++ b/components/LandingPage/WordPressSection.tsx
@@ -0,0 +1,66 @@
+import Link from 'next/link'
+import Image from 'next/image'
+import style from 'styles/landing.module.css'
+import WordPressPayButton from 'assets/wordpress-paybutton.png'
+
+export default function WordPressSection (): JSX.Element {
+  return (
+    <div className={style.wordpress_ctn} id="wordpress">
+      <div className={style.container}>
+        <div className={style.wordpress_content}>
+          <div className={style.wordpress_text}>
+            <h2>
+              WordPress <span>Plugin</span>
+            </h2>
+            <p>
+              Integrate PayButton seamlessly into your WordPress site with our
+              official plugin. Accept eCash payments with just a few clicks - no
+              coding required.
+            </p>
+            <div className={style.wordpress_features}>
+              <div className={style.feature_item}>
+                <div className={style.feature_icon}>🚀</div>
+                <div>
+                  <h4>Easy Setup</h4>
+                  <p>Install and configure in minutes</p>
+                </div>
+              </div>
+              <div className={style.feature_item}>
+                <div className={style.feature_icon}>🎨</div>
+                <div>
+                  <h4>Customizable</h4>
+                  <p>Match your site's design perfectly</p>
+                </div>
+              </div>
+              <div className={style.feature_item}>
+                <div className={style.feature_icon}>📊</div>
+                <div>
+                  <h4>Analytics</h4>
+                  <p>Track payments and revenue</p>
+                </div>
+              </div>
+            </div>
+            <div className={style.wordpress_buttons}>
+              <Link
+                href="https://wordpress.org/plugins/paybutton/"
+                target="_blank"
+                className="button_main"
+              >
+                Get Plugin
+              </Link>
+            </div>
+          </div>
+          <div className={style.wordpress_visual}>
+            <Image
+              src={WordPressPayButton}
+              alt="WordPress PayButton Plugin Interface"
+              width={450}
+              height={300}
+              className={style.wordpress_image}
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}
diff --git a/components/Sidebar/index.tsx b/components/Sidebar/index.tsx
index 03080baac..766d9d242 100644
--- a/components/Sidebar/index.tsx
+++ b/components/Sidebar/index.tsx
@@ -13,6 +13,7 @@ import ButtonsIcon from 'assets/button-icon.png'
 import Wallets from 'assets/wallet-icon.png'
 import Networks from 'assets/network-icon.png'
 import Account from 'assets/user-icon.png'
+import WordPress from 'assets/wordpress.png'
 import Docs from 'assets/docs.png'
 import Admin from 'assets/admin-icon.png'
 import Logout from 'assets/logout-icon.png'
@@ -155,6 +156,10 @@ const Sidebar: React.FC = ({ chart, setChart, loggedUser }: IProps) => {
           <Image src={Docs} alt='docs' width={20} height={20} />
           <span className={style.tooltiptext}>Docs</span>
         </a>
+        <a href='/#wordpress'>
+          <Image src={WordPress} alt='wordpress' width={20} height={20} />
+          <span className={style.tooltiptext}>WordPress</span>
+        </a>
       </div>
     </aside>
     </>
diff --git a/components/Sidebar/sidebar.module.css b/components/Sidebar/sidebar.module.css
index 6cec9b458..c710134e6 100644
--- a/components/Sidebar/sidebar.module.css
+++ b/components/Sidebar/sidebar.module.css
@@ -47,17 +47,21 @@ body[data-theme='dark'] .socialctn .moon {
 }
 
 .socialctn {
-  padding: 0 25px;
+  padding: 0 25px 0 20px;
   display: flex;
   align-items: center;
 }
 
 .socialctn a {
-  margin-right: 15px;
+  margin-right: 10px;
   display: flex;
   align-items: center;
 }
 
+.socialctn a:last-child {
+  margin-right: 0;
+}
+
 .socialctn a:hover img {
   filter: invert(60%) sepia(14%) saturate(5479%) hue-rotate(195deg)
     brightness(100%) contrast(102%);
diff --git a/pages/index.tsx b/pages/index.tsx
index 164862f91..6f74a6060 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -2,6 +2,9 @@ import style from '../styles/landing.module.css'
 import Navbar from 'components/LandingPage/Navbar'
 import Hero from 'components/LandingPage/Hero'
 import Dashboard from 'components/LandingPage/Dashboard'
+import WordPressSection from 'components/LandingPage/WordPressSection'
+import FeaturesSection from 'components/LandingPage/FeaturesSection'
+import CTASection from 'components/LandingPage/CTASection'
 import Footer from 'components/LandingPage/Footer'
 import dynamic from 'next/dynamic'
 import supertokensNode from 'supertokens-node'
@@ -50,9 +53,12 @@ export default function LandingPage ({ userId }: IProps): JSX.Element {
     <div className={style.landing_ctn}>
       <Navbar userId={userId} />
       <Hero />
+      <FeaturesSection />
       <Dashboard />
+      <WordPressSection />
       <DynamicButtonGenerator />
-      <Footer userId={userId}/>
+      <CTASection />
+      <Footer userId={userId} />
     </div>
   )
 }
diff --git a/styles/landing.module.css b/styles/landing.module.css
index 174d90c67..f7a8a2dd5 100644
--- a/styles/landing.module.css
+++ b/styles/landing.module.css
@@ -1,7 +1,7 @@
 .landing_ctn {
   box-sizing: border-box;
   background-color: var(--secondary-bg-color);
-  font-family: 'Poppins';
+  font-family: "Poppins";
 }
 
 .landing_ctn a {
@@ -39,7 +39,7 @@
   color: var(--primary-text-color) !important;
 }
 
-body[data-theme='dark'] .button:hover {
+body[data-theme="dark"] .button:hover {
   color: #231f20 !important;
   border-color: #231f20;
 }
@@ -48,6 +48,49 @@ body[data-theme='dark'] .button:hover {
   padding: 5px 25px;
 }
 
+.button_main {
+  background-color: var(--accent-color);
+  color: white !important;
+  border: 1px solid var(--accent-color);
+  padding: 12px 40px;
+  border-radius: 10px;
+  text-decoration: none;
+  display: inline-block;
+  transition: all 0.3s ease;
+  font-weight: 500;
+}
+
+.button_main:hover {
+  background-color: var(--hover-accent-color);
+  border-color: var(--hover-accent-color);
+  color: white !important;
+  transform: translateY(-2px);
+  box-shadow: 0 5px 15px rgba(102, 156, 254, 0.3);
+}
+
+.button_outline {
+  background-color: transparent;
+  color: var(--primary-text-color) !important;
+  border: 1px solid var(--primary-text-color);
+  padding: 12px 40px;
+  border-radius: 10px;
+  text-decoration: none;
+  display: inline-block;
+  transition: all 0.3s ease;
+  font-weight: 500;
+}
+
+.button_outline:hover {
+  background-color: var(--primary-text-color);
+  color: var(--secondary-bg-color) !important;
+  transform: translateY(-2px);
+}
+
+body[data-theme="dark"] .button_outline:hover {
+  background-color: var(--primary-text-color);
+  color: var(--primary-bg-color) !important;
+}
+
 /*************************** NAVBAR **************************/
 
 .navbar_ctn {
@@ -71,7 +114,7 @@ body[data-theme='dark'] .button:hover {
   width: 140px;
 }
 
-body[data-theme='dark'] .navbar_ctn img {
+body[data-theme="dark"] .navbar_ctn img {
   filter: brightness(0) invert(1);
 }
 
@@ -92,7 +135,7 @@ body[data-theme='dark'] .navbar_ctn img {
   display: none;
 }
 
-@media (max-width: 915px) {
+@media (max-width: 1000px) {
   .navlink_ctn {
     position: absolute;
     width: 200px;
@@ -200,12 +243,12 @@ body[data-theme='dark'] .navbar_ctn img {
     border-radius: 4px;
   }
   .menu_btn > span::before {
-    content: '';
+    content: "";
     top: -8px;
     width: 80%;
   }
   .menu_btn > span::after {
-    content: '';
+    content: "";
     top: 8px;
     width: 60%;
   }
@@ -239,6 +282,7 @@ body[data-theme='dark'] .navbar_ctn img {
   margin: 0;
   font-size: 65px;
   font-weight: 500;
+  margin-bottom: 30px;
 }
 
 .col h1 span {
@@ -248,7 +292,54 @@ body[data-theme='dark'] .navbar_ctn img {
 
 .col p {
   font-size: 18px;
-  margin: 40px 0;
+  line-height: 1.6;
+  color: var(--primary-text-color);
+  margin: 0 0 30px 0;
+}
+
+.hero_features {
+  display: flex;
+  gap: 30px;
+  margin-bottom: 40px;
+  flex-wrap: wrap;
+}
+
+.hero_features span {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 16px;
+  font-weight: 500;
+  color: var(--primary-text-color);
+  padding: 8px 16px;
+  background: rgba(102, 156, 254, 0.1);
+  border-radius: 8px;
+  border: none;
+}
+
+.use_cases_features {
+  display: flex;
+  gap: 30px;
+  margin-bottom: 40px;
+  flex-wrap: wrap;
+  justify-content: center;
+}
+
+.use_cases_features span {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 16px;
+  font-weight: 500;
+  color: var(--primary-text-color);
+  padding: 8px 16px;
+  background: rgba(255, 255, 255, 0.3);
+  border-radius: 8px;
+  border: none;
+}
+
+body[data-theme="dark"] .use_cases_features span {
+  color: #231f20;
 }
 
 .button_ctn {
@@ -329,6 +420,36 @@ body[data-theme='dark'] .navbar_ctn img {
     font-size: 16px;
   }
 
+  .hero_features {
+    justify-content: center;
+    gap: 20px;
+  }
+
+  .hero_features span {
+    font-size: 14px;
+    padding: 6px 12px;
+    background: rgba(102, 156, 254, 0.1);
+    border-radius: 6px;
+    border: none;
+  }
+
+  .use_cases_features {
+    justify-content: center;
+    gap: 20px;
+  }
+
+  .use_cases_features span {
+    font-size: 14px;
+    padding: 6px 12px;
+    background: rgba(255, 255, 255, 0.1);
+    border-radius: 6px;
+    border: none;
+  }
+
+  body[data-theme="dark"] .use_cases_features span {
+    color: #231f20;
+  }
+
   .image_col {
     display: none;
   }
@@ -341,7 +462,7 @@ body[data-theme='dark'] .navbar_ctn img {
 /*************************** DASHBOARD **************************/
 
 .dashboard_ctn {
-  background-color: var(--accent-color);
+  background-color: var(--hover-accent-color);
   text-align: center;
   padding: 100px 0 20px;
   position: relative;
@@ -393,7 +514,7 @@ body[data-theme='dark'] .navbar_ctn img {
   color: #231f20;
 }
 
-body[data-theme='dark'] .centerp {
+body[data-theme="dark"] .centerp {
   color: #fff;
 }
 
@@ -412,7 +533,7 @@ body[data-theme='dark'] .centerp {
   box-shadow: 0px 10px 17px 0px rgba(0, 0, 0, 0.55);
 }
 
-body[data-theme='dark'] .dashboard_img_light {
+body[data-theme="dark"] .dashboard_img_light {
   display: none;
 }
 
@@ -420,7 +541,7 @@ body[data-theme='dark'] .dashboard_img_light {
   display: none;
 }
 
-body[data-theme='dark'] .dashboard_img_dark {
+body[data-theme="dark"] .dashboard_img_dark {
   display: inline-block;
 }
 
@@ -433,22 +554,25 @@ body[data-theme='dark'] .dashboard_img_dark {
   left: 0;
   right: 0;
   z-index: 1;
-  filter: invert(100%);
+  --wave-fill-color: #e5e4e4;
 }
 
-body[data-theme='dark'] .wave2 {
-  filter: invert(11%) sepia(0%) saturate(1098%) hue-rotate(206deg)
-    brightness(94%) contrast(79%);
+body[data-theme="dark"] .wave2 {
+  --wave-fill-color: #1a1a1a;
 }
 
 .whitebackground {
-  background-color: var(--secondary-bg-color);
+  background-color: #e5e4e4;
   height: 200px;
   width: 100%;
   position: absolute;
   bottom: 0;
 }
 
+body[data-theme="dark"] .whitebackground {
+  background-color: #1a1a1a;
+}
+
 /*************************** GETSTARTED **************************/
 
 .get_started_ctn {
@@ -504,17 +628,17 @@ body[data-theme='dark'] .wave2 {
   filter: none;
 }
 
-body[data-theme='dark'] .get_started_ctn h2,
-body[data-theme='dark'] .get_started_ctn p {
+body[data-theme="dark"] .get_started_ctn h2,
+body[data-theme="dark"] .get_started_ctn p {
   color: #fff;
 }
 
-body[data-theme='dark'] .get_started_ctn pre {
+body[data-theme="dark"] .get_started_ctn pre {
   background-color: var(--primary-bg-color);
   border: none;
 }
 
-body[data-theme='dark'] .get_started_ctn pre code {
+body[data-theme="dark"] .get_started_ctn pre code {
   color: #fff;
 }
 
@@ -539,8 +663,8 @@ body[data-theme='dark'] .get_started_ctn pre code {
   margin-top: 150px;
 }
 
-body[data-theme='dark'] .supporters_ctn h2,
-body[data-theme='dark'] .supporters_ctn p {
+body[data-theme="dark"] .supporters_ctn h2,
+body[data-theme="dark"] .supporters_ctn p {
   color: #fff;
 }
 
@@ -558,7 +682,7 @@ body[data-theme='dark'] .supporters_ctn p {
   margin-bottom: 30px;
 }
 
-body[data-theme='dark'] .supporters_ctn h3 {
+body[data-theme="dark"] .supporters_ctn h3 {
   border-color: rgba(254, 254, 254, 0.3);
 }
 
@@ -616,7 +740,7 @@ body[data-theme='dark'] .supporters_ctn h3 {
   font-size: 14px;
 }
 
-@media (max-width: 750px) {
+@media (max-width: 1000px) {
   .footer {
     flex-direction: column;
     align-items: center;
@@ -639,3 +763,613 @@ body[data-theme='dark'] .supporters_ctn h3 {
     font-size: 12px;
   }
 }
+
+/*************************** FEATURES SECTION **************************/
+
+.features_ctn {
+  padding: 100px 0;
+  background: linear-gradient(
+    180deg,
+    var(--accent-color) 0%,
+    var(--hover-accent-color) 100%
+  );
+  position: relative;
+  overflow: hidden;
+}
+
+.features_ctn::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Ccircle cx='30' cy='30' r='2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
+  pointer-events: none;
+}
+
+.features_header {
+  text-align: center;
+  margin-bottom: 80px;
+  position: relative;
+  z-index: 2;
+}
+
+.features_header h2 {
+  font-size: 48px;
+  font-weight: 500;
+  margin: 0 0 20px 0;
+  color: var(--primary-text-color);
+}
+
+.features_header h2 span {
+  color: var(--primary-text-color);
+  font-weight: 700;
+}
+
+.features_header p {
+  font-size: 18px;
+  color: var(--primary-text-color);
+  margin: 0;
+}
+
+.features_grid {
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  gap: 40px;
+  margin-top: 60px;
+  position: relative;
+  z-index: 2;
+}
+
+.feature_card {
+  background: rgba(255, 255, 255, 0.3);
+  padding: 30px 25px;
+  border-radius: 20px;
+  text-align: center;
+  transition: all 0.3s ease;
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
+}
+
+.feature_card:hover {
+  transform: translateY(-5px);
+  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
+  background: rgba(255, 255, 255, 0.25);
+  border-color: rgba(255, 255, 255, 0.3);
+}
+
+.feature_icon_wrapper {
+  width: 80px;
+  height: 80px;
+  background: rgba(255, 255, 255, 0.2);
+  backdrop-filter: blur(10px);
+  -webkit-backdrop-filter: blur(10px);
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin: 0 auto 25px;
+  border: 1px solid rgba(255, 255, 255, 0.3);
+  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
+}
+
+.feature_icon {
+  font-size: 32px;
+}
+
+.feature_card h3 {
+  font-size: 24px;
+  font-weight: 600;
+  margin: 0 0 15px 0;
+  color: var(--primary-text-color);
+}
+
+.feature_card p {
+  font-size: 16px;
+  line-height: 1.6;
+  color: var(--primary-text-color);
+  margin: 0;
+}
+
+/* Dark mode overrides to keep text colors consistent */
+body[data-theme="dark"] .features_header h2,
+body[data-theme="dark"] .features_header h2 span,
+body[data-theme="dark"] .features_header p,
+body[data-theme="dark"] .feature_card h3,
+body[data-theme="dark"] .feature_card p {
+  color: #231f20;
+}
+
+/*************************** WORDPRESS SECTION **************************/
+
+.wordpress_ctn {
+  padding: 120px 0;
+  background: #e5e4e4;
+  position: relative;
+  overflow: hidden;
+}
+
+body[data-theme="dark"] .wordpress_ctn {
+  background: #1a1a1a;
+}
+
+.wordpress_content {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 80px;
+  align-items: center;
+}
+
+.wordpress_text h2 {
+  font-size: 48px;
+  font-weight: 500;
+  margin: 0 0 25px 0;
+}
+
+.wordpress_text h2 span {
+  color: var(--accent-color);
+  font-weight: 700;
+}
+
+.wordpress_text > p {
+  font-size: 18px;
+  line-height: 1.6;
+  color: var(--secondary-text-color);
+  margin: 0 0 40px 0;
+}
+
+.wordpress_features {
+  margin-bottom: 40px;
+}
+
+.wordpress_image {
+  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
+}
+
+.feature_item {
+  display: flex;
+  align-items: center;
+  margin-bottom: 20px;
+}
+
+.feature_item .feature_icon {
+  font-size: 24px;
+  margin-right: 15px;
+  width: 40px;
+  text-align: center;
+}
+
+.feature_item h4 {
+  font-size: 18px;
+  font-weight: 600;
+  margin: 0 0 5px 0;
+  color: var(--primary-text-color);
+}
+
+.feature_item p {
+  font-size: 14px;
+  color: var(--secondary-text-color);
+  margin: 0;
+}
+
+.wordpress_buttons {
+  display: flex;
+  gap: 20px;
+  flex-wrap: wrap;
+}
+
+.wordpress_visual {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.wordpress_mockup {
+  background: #fff;
+  border-radius: 20px;
+  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1);
+  overflow: hidden;
+  width: 100%;
+  max-width: 500px;
+}
+
+.wordpress_header {
+  background: #f1f1f1;
+  padding: 15px 20px;
+  display: flex;
+  align-items: center;
+  gap: 15px;
+}
+
+.wp_dots {
+  display: flex;
+  gap: 8px;
+}
+
+.wp_dots span {
+  width: 12px;
+  height: 12px;
+  border-radius: 50%;
+  background: #ff5f57;
+}
+
+.wp_dots span:nth-child(2) {
+  background: #ffbd2e;
+}
+
+.wp_dots span:nth-child(3) {
+  background: #28ca42;
+}
+
+.wp_title {
+  font-size: 14px;
+  font-weight: 500;
+  color: #333;
+}
+
+.wordpress_content_mockup {
+  display: flex;
+  min-height: 400px;
+}
+
+.wp_sidebar {
+  width: 200px;
+  background: #f8f9fa;
+  padding: 20px;
+  border-right: 1px solid #e9ecef;
+}
+
+.wp_menu_item {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  padding: 12px 15px;
+  border-radius: 8px;
+  background: var(--accent-color);
+  color: white;
+  font-weight: 500;
+  font-size: 14px;
+}
+
+.wp_icon {
+  font-size: 16px;
+}
+
+.wp_main {
+  flex: 1;
+  padding: 30px;
+}
+
+.wp_main h3 {
+  font-size: 24px;
+  font-weight: 600;
+  margin: 0 0 30px 0;
+  color: #333;
+}
+
+.wp_form {
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+}
+
+.wp_field {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.wp_field label {
+  font-size: 14px;
+  font-weight: 500;
+  color: #333;
+}
+
+.wp_field input {
+  padding: 12px 15px;
+  border: 1px solid #ddd;
+  border-radius: 8px;
+  font-size: 14px;
+  background: #f8f9fa;
+}
+
+.wp_save_btn {
+  background: var(--accent-color);
+  color: white;
+  border: none;
+  padding: 12px 24px;
+  border-radius: 8px;
+  font-weight: 500;
+  cursor: pointer;
+  margin-top: 10px;
+  align-self: flex-start;
+}
+
+.wave_wordpress {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: auto;
+  z-index: 1;
+}
+
+/*************************** TESTIMONIALS SECTION **************************/
+
+.testimonials_ctn {
+  padding: 100px 0;
+  background: var(--primary-bg-color);
+}
+
+.testimonials_header {
+  text-align: center;
+  margin-bottom: 80px;
+}
+
+.testimonials_header h2 {
+  font-size: 48px;
+  font-weight: 500;
+  margin: 0 0 20px 0;
+}
+
+.testimonials_header h2 span {
+  color: var(--accent-color);
+  font-weight: 700;
+}
+
+.testimonials_header p {
+  font-size: 18px;
+  color: var(--secondary-text-color);
+  margin: 0;
+}
+
+.testimonials_grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
+  gap: 30px;
+  margin-bottom: 80px;
+}
+
+.testimonial_card {
+  background: var(--secondary-bg-color);
+  padding: 30px;
+  border-radius: 20px;
+  border: 1px solid var(--border-color);
+  transition: transform 0.3s ease;
+}
+
+.testimonial_card:hover {
+  transform: translateY(-5px);
+}
+
+.testimonial_content p {
+  font-size: 16px;
+  line-height: 1.6;
+  color: var(--secondary-text-color);
+  margin: 0 0 25px 0;
+  font-style: italic;
+}
+
+.testimonial_author {
+  display: flex;
+  align-items: center;
+  gap: 15px;
+}
+
+.author_avatar {
+  width: 50px;
+  height: 50px;
+  background: var(--accent-color);
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 20px;
+}
+
+.testimonial_author h4 {
+  font-size: 18px;
+  font-weight: 600;
+  margin: 0 0 5px 0;
+  color: var(--primary-text-color);
+}
+
+.testimonial_author span {
+  font-size: 14px;
+  color: var(--secondary-text-color);
+}
+
+.use_cases {
+  margin-top: 80px;
+}
+
+.use_cases h3 {
+  text-align: center;
+  font-size: 36px;
+  font-weight: 500;
+  margin: 0 0 50px 0;
+  color: var(--primary-text-color);
+}
+
+body[data-theme="dark"] .use_cases h3 {
+  color: #231f20;
+}
+
+.use_cases_grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+  gap: 30px;
+}
+
+.use_case {
+  text-align: center;
+  padding: 30px 20px;
+  background: var(--secondary-bg-color);
+  border-radius: 15px;
+  border: 1px solid var(--border-color);
+  transition: transform 0.3s ease;
+}
+
+.use_case:hover {
+  transform: translateY(-3px);
+}
+
+.use_case_icon {
+  font-size: 40px;
+  margin-bottom: 20px;
+  display: block;
+}
+
+.use_case h4 {
+  font-size: 20px;
+  font-weight: 600;
+  margin: 0 0 15px 0;
+  color: var(--primary-text-color);
+}
+
+.use_case p {
+  font-size: 14px;
+  color: var(--secondary-text-color);
+  margin: 0;
+  line-height: 1.5;
+}
+
+/*************************** CTA SECTION **************************/
+
+.cta_ctn {
+  padding: 100px 0;
+  background: linear-gradient(135deg, var(--accent-color), #ff6b35);
+  color: white;
+  text-align: center;
+}
+
+.cta_content h2 {
+  font-size: 48px;
+  font-weight: 500;
+  margin: 0 0 25px 0;
+}
+
+.cta_content h2 span {
+  font-weight: 700;
+}
+
+.cta_content > p {
+  font-size: 18px;
+  line-height: 1.6;
+  margin: 0 0 40px 0;
+  opacity: 0.9;
+  max-width: 600px;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.cta_buttons {
+  display: flex;
+  gap: 20px;
+  justify-content: center;
+  margin-bottom: 50px;
+  flex-wrap: wrap;
+}
+
+.button_large {
+  padding: 16px 32px !important;
+  font-size: 18px !important;
+  font-weight: 600 !important;
+}
+
+.cta_features {
+  display: flex;
+  gap: 40px;
+  justify-content: center;
+  flex-wrap: wrap;
+}
+
+.cta_feature {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+.cta_check {
+  font-size: 20px;
+  font-weight: bold;
+}
+
+/*************************** RESPONSIVE DESIGN **************************/
+
+@media (max-width: 1200px) {
+  .wordpress_content {
+    grid-template-columns: 1fr;
+    gap: 60px;
+  }
+
+  .features_grid {
+    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+  }
+
+  .testimonials_grid {
+    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+  }
+}
+
+@media (max-width: 750px) {
+  .features_header h2,
+  .wordpress_text h2,
+  .testimonials_header h2,
+  .cta_content h2 {
+    font-size: 36px;
+  }
+
+  .features_header p,
+  .wordpress_text > p,
+  .testimonials_header p,
+  .cta_content > p {
+    font-size: 16px;
+  }
+
+  .features_grid {
+    grid-template-columns: repeat(2, 1fr);
+    gap: 5px;
+  }
+
+  .wordpress_buttons {
+    flex-direction: column;
+    align-items: center;
+  }
+
+  .testimonials_grid {
+    grid-template-columns: 1fr;
+  }
+
+  .use_cases_grid {
+    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+  }
+
+  .cta_buttons {
+    flex-direction: column;
+    align-items: center;
+  }
+
+  .cta_features {
+    flex-direction: column;
+    align-items: center;
+    gap: 20px;
+  }
+
+  .wordpress_mockup {
+    max-width: 100%;
+  }
+
+  .wordpress_content_mockup {
+    flex-direction: column;
+  }
+
+  .wp_sidebar {
+    width: 100%;
+    border-right: none;
+    border-bottom: 1px solid #e9ecef;
+  }
+}