From 0560b86b87fbd591d415622361f0449226693688 Mon Sep 17 00:00:00 2001
From: Aravind R <aravind@tenext.in>
Date: Mon, 15 Jun 2026 18:20:48 +0530
Subject: [PATCH] fix mobile view issue

---
 public/css/site.css                           |  95 ++++++++-
 src/app/globals.css                           | 188 ++++++++++++++++--
 src/components/layout/Header.tsx              |   5 +-
 src/components/layout/LoadingScreen.tsx       |  13 +-
 src/components/sections/AboutCTA.tsx          |  27 ++-
 src/components/sections/AboutHero.tsx         |   2 +-
 src/components/sections/BlogGrid.tsx          |  33 ++-
 src/components/sections/BlogPostFooter.tsx    |   6 +
 src/components/sections/BlogsHero.tsx         |  15 +-
 src/components/sections/CompetitiveEdge.tsx   |   6 +-
 .../sections/ConnectedLogistics.tsx           |  45 ++++-
 src/components/sections/EVLogisticSection.tsx |  53 ++++-
 src/components/sections/EVSection.tsx         | 113 ++++++++++-
 src/components/sections/HowItWorksHero.tsx    |  27 ++-
 src/components/sections/IndustrySolutions.tsx |  63 +++++-
 src/components/sections/IndustryStack.tsx     |   2 +-
 src/components/sections/IntelligenceGrid.tsx  |  16 +-
 src/components/sections/MileTruthHero.tsx     |  19 +-
 src/components/sections/OurTeam.tsx           |  29 ++-
 src/components/sections/SingleBlog.tsx        |   6 +
 src/components/sections/SolutionsHero.tsx     |  29 ++-
 src/components/sections/WhyChooseDoormile.tsx |   8 +-
 src/components/sections/WomenSection.tsx      | 146 +++++++++++++-
 src/components/strategy/StrategyCanvas.tsx    |  56 +++++-
 src/components/strategy/StrategySection.tsx   |  53 ++++-
 25 files changed, 956 insertions(+), 99 deletions(-)

diff --git a/public/css/site.css b/public/css/site.css
index afba797..2fdabe1 100644
--- a/public/css/site.css
+++ b/public/css/site.css
@@ -5776,12 +5776,12 @@ body:not(.block-editor-page) .content-wrapper .widget p {
 @media (max-width: 1024px) {
     .elementor-element.elementor-element-99768ba .elementor-widget-container img.wp-image-4481 {
         width: 100% !important;
-        max-width: 450px !important;
+        max-width: 600px !important;
         /* Prevent oversized/zoomed appearance on tablets */
         height: auto !important;
         aspect-ratio: auto !important;
         /* Maintain original proportions */
-        object-fit: contain !important;
+        object-fit: cover !important;
         /* Ensure no cropping of important content */
         margin: 0 auto !important;
         /* Centering */
@@ -5799,10 +5799,10 @@ body:not(.block-editor-page) .content-wrapper .widget p {
 /* Specific scaling for small mobile phones */
 @media (max-width: 767px) {
     .elementor-element.elementor-element-99768ba .elementor-widget-container img.wp-image-4481 {
-        max-width: 90% !important;
+        max-width: 100% !important;
         /* Reduce scale on small screens */
         margin: 0 auto !important;
-        border-radius: 18px !important;
+        border-radius: 25px !important;
         /* Consistent rounded edges */
     }
 }
@@ -18154,3 +18154,90 @@ img:is([sizes=auto i]){contain-intrinsic-size:3000px 1500px}
         background-repeat: no-repeat !important;
         background-size: cover !important;
     }
+
+/* STYLE BLOCK 51: unified mobile gutters for card/content sections */
+@media (max-width: 767px) {
+    :root { --dm-mobile-gutter: 10px; }
+
+    .elementor.elementor-61 .elementor-element.elementor-element-89a0ca1,
+    .elementor.elementor-61 .elementor-element.elementor-element-88745f4,
+    .elementor.elementor-86 .elementor-element.elementor-element-c2c601a,
+    .elementor.elementor-104 .elementor-element.elementor-element-c70681e {
+        --padding-left: var(--dm-mobile-gutter) !important;
+        --padding-right: var(--dm-mobile-gutter) !important;
+        padding-left: var(--dm-mobile-gutter) !important;
+        padding-right: var(--dm-mobile-gutter) !important;
+        box-sizing: border-box !important;
+    }
+
+    .elementor.elementor-61 .elementor-element.elementor-element-3b4a7cc {
+        --padding-left: 10px !important;
+        --padding-right: 10px !important;
+        padding-left: 10px !important;
+        padding-right: 10px !important;
+        box-sizing: border-box !important;
+    }
+
+    .elementor.elementor-61 .elementor-element.elementor-element-89a0ca1 > .e-con-inner,
+    .elementor.elementor-61 .elementor-element.elementor-element-88745f4 > .e-con-inner,
+    .elementor.elementor-61 .elementor-element.elementor-element-3b4a7cc > .e-con-inner,
+    .elementor.elementor-86 .elementor-element.elementor-element-c2c601a > .e-con-inner,
+    .elementor.elementor-104 .elementor-element.elementor-element-c70681e > .e-con-inner {
+        width: 100% !important;
+        max-width: 100% !important;
+        margin-left: auto !important;
+        margin-right: auto !important;
+        padding-left: 0 !important;
+        padding-right: 0 !important;
+        box-sizing: border-box !important;
+    }
+
+    .elementor.elementor-61 .elementor-element.elementor-element-89a0ca1 > .e-con-inner > .e-con,
+    .elementor.elementor-61 .elementor-element.elementor-element-88745f4 > .e-con-inner > .e-con,
+    .elementor.elementor-61 .elementor-element.elementor-element-3b4a7cc > .e-con-inner > .e-con,
+    .elementor.elementor-86 .elementor-element.elementor-element-c2c601a > .e-con-inner > .e-con,
+    .elementor.elementor-104 .elementor-element.elementor-element-c70681e > .e-con-inner > .e-con {
+        --padding-left: 0px !important;
+        --padding-right: 0px !important;
+        width: 100% !important;
+        max-width: 100% !important;
+        padding-left: 0 !important;
+        padding-right: 0 !important;
+        box-sizing: border-box !important;
+    }
+
+    .elementor.elementor-61 .elementor-element.elementor-element-6829276 {
+        --e-con-grid-template-columns: minmax(0, 1fr) !important;
+        --grid-justify-content: stretch !important;
+        --justify-items: stretch !important;
+        grid-template-columns: minmax(0, 1fr) !important;
+        justify-content: stretch !important;
+        justify-items: stretch !important;
+        min-width: 0 !important;
+    }
+
+    .elementor.elementor-61 .industry-solutions-grid,
+    .elementor.elementor-61 .industry-card-link {
+        width: 100% !important;
+        max-width: 100% !important;
+        min-width: 0 !important;
+    }
+
+    .comparison-section .container {
+        width: calc(100% - (var(--dm-mobile-gutter) * 2)) !important;
+        max-width: calc(100% - (var(--dm-mobile-gutter) * 2)) !important;
+        margin-left: auto !important;
+        margin-right: auto !important;
+        padding-left: 0 !important;
+        padding-right: 0 !important;
+        box-sizing: border-box !important;
+    }
+
+    .wcd-inner {
+        width: 100% !important;
+        max-width: 100% !important;
+        padding-left: 0 !important;
+        padding-right: 0 !important;
+        box-sizing: border-box !important;
+    }
+}
diff --git a/src/app/globals.css b/src/app/globals.css
index c9ec0ec..068e7e5 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -25,6 +25,7 @@ html {
   --space-section: clamp(40px, 5vw, 64px);
   --space-section-lg: clamp(52px, 6vw, 80px);
   --space-hero-gap: clamp(36px, 4.5vw, 64px);
+  --dm-mobile-gutter: 10px;
 }
 
 .dm-section {
@@ -460,7 +461,7 @@ body {
 @media (max-width: 720px) {
   .dm-contact-left {
     min-height: auto;
-    padding: 42px 22px 58px;
+    padding: 42px 20px 58px;
   }
 
   .dm-contact-title {
@@ -478,43 +479,43 @@ body {
   }
 
   .dm-contact-card {
-    margin: 0 16px 32px;
-    padding: 44px 22px 34px;
-    border-radius: 24px;
+    margin: 0 20px 28px;
+    padding: 28px 20px 24px;
+    border-radius: 28px;
   }
 
   .dm-contact-card h3 {
-    margin-bottom: 34px;
+    margin-bottom: 24px;
   }
 
   .dm-contact-form {
-    gap: 20px;
+    gap: 18px;
   }
 
   .dm-contact-form input {
-    height: 60px;
-    padding: 0 20px;
+    height: 56px;
+    padding: 0 18px;
   }
 
   .dm-contact-form textarea {
-    min-height: 190px;
-    padding: 20px;
+    min-height: 170px;
+    padding: 18px;
   }
 
   .dm-contact-submit {
     width: 100%;
-    height: 64px;
+    height: 60px;
   }
 
   .dm-contact-submit span:first-child {
     flex: 1 1 auto;
     min-width: 0;
-    padding: 0 22px;
+    padding: 0 20px;
   }
 
   .dm-contact-submit-icon {
-    width: 64px;
-    min-width: 64px;
+    width: 60px;
+    min-width: 60px;
   }
 }
 
@@ -537,7 +538,131 @@ body {
   .industry-solutions-grid {
     grid-template-columns: 1fr;
   }
-}.industry-card-link {
+  .elementor.elementor-61 .elementor-element.elementor-element-3b4a7cc {
+    --padding-left: 10px !important;
+    --padding-right: 10px !important;
+    padding-left: 10px !important;
+    padding-right: 10px !important;
+    box-sizing: border-box !important;
+  }
+  .elementor.elementor-61 .elementor-element.elementor-element-3b4a7cc > .e-con-inner {
+    width: 100% !important;
+    max-width: 100% !important;
+    margin-left: auto !important;
+    margin-right: auto !important;
+    padding-left: 0 !important;
+    padding-right: 0 !important;
+  }
+}
+
+@media (max-width: 767px) {
+  .elementor.elementor-61 .elementor-element.elementor-element-3b4a7cc > .e-con-inner {
+    max-width: 100% !important;
+    width: 100% !important;
+    margin-left: auto !important;
+    margin-right: auto !important;
+    padding-left: 0 !important;
+    padding-right: 0 !important;
+  }
+
+  .elementor.elementor-61 .elementor-element.elementor-element-d602f7f,
+  .elementor.elementor-61 .elementor-element.elementor-element-f64bd88,
+  .elementor.elementor-61 .elementor-element.elementor-element-5ed2dbb,
+  .elementor.elementor-61 .elementor-element.elementor-element-6829276 {
+    --padding-left: 0px !important;
+    --padding-right: 0px !important;
+    --margin-left: 0px !important;
+    --margin-right: 0px !important;
+    width: 100% !important;
+    max-width: 100% !important;
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+    padding-left: 0 !important;
+    padding-right: 0 !important;
+    box-sizing: border-box;
+  }
+
+  .elementor.elementor-61 .elementor-element.elementor-element-6829276 {
+    --e-con-grid-template-columns: minmax(0, 1fr) !important;
+    --grid-justify-content: stretch !important;
+    --justify-items: stretch !important;
+    grid-template-columns: minmax(0, 1fr) !important;
+    justify-content: stretch !important;
+    justify-items: stretch !important;
+    min-width: 0 !important;
+  }
+
+  .elementor.elementor-61 .industry-solutions-grid,
+  .elementor.elementor-61 .industry-card-link {
+    max-width: 100%;
+    width: 100%;
+    min-width: 0;
+  }
+
+  .elementor.elementor-61 .industry-solutions-grid {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+  }
+}
+
+@media (max-width: 767px) {
+  .elementor.elementor-61 .elementor-element.elementor-element-89a0ca1,
+  .elementor.elementor-61 .elementor-element.elementor-element-88745f4,
+  .elementor.elementor-86 .elementor-element.elementor-element-c2c601a,
+  .elementor.elementor-104 .elementor-element.elementor-element-c70681e {
+    --padding-left: var(--dm-mobile-gutter) !important;
+    --padding-right: var(--dm-mobile-gutter) !important;
+    padding-left: var(--dm-mobile-gutter) !important;
+    padding-right: var(--dm-mobile-gutter) !important;
+    box-sizing: border-box !important;
+  }
+
+  .elementor.elementor-61 .elementor-element.elementor-element-89a0ca1 > .e-con-inner,
+  .elementor.elementor-61 .elementor-element.elementor-element-88745f4 > .e-con-inner,
+  .elementor.elementor-86 .elementor-element.elementor-element-c2c601a > .e-con-inner,
+  .elementor.elementor-104 .elementor-element.elementor-element-c70681e > .e-con-inner {
+    width: 100% !important;
+    max-width: 100% !important;
+    margin-left: auto !important;
+    margin-right: auto !important;
+    padding-left: 0 !important;
+    padding-right: 0 !important;
+    box-sizing: border-box !important;
+  }
+
+  .elementor.elementor-61 .elementor-element.elementor-element-89a0ca1 > .e-con-inner > .e-con,
+  .elementor.elementor-61 .elementor-element.elementor-element-88745f4 > .e-con-inner > .e-con,
+  .elementor.elementor-86 .elementor-element.elementor-element-c2c601a > .e-con-inner > .e-con,
+  .elementor.elementor-104 .elementor-element.elementor-element-c70681e > .e-con-inner > .e-con {
+    --padding-left: 0px !important;
+    --padding-right: 0px !important;
+    width: 100% !important;
+    max-width: 100% !important;
+    padding-left: 0 !important;
+    padding-right: 0 !important;
+    box-sizing: border-box !important;
+  }
+
+  .comparison-section .container {
+    width: calc(100% - (var(--dm-mobile-gutter) * 2)) !important;
+    max-width: calc(100% - (var(--dm-mobile-gutter) * 2)) !important;
+    margin-left: auto !important;
+    margin-right: auto !important;
+    padding-left: 0 !important;
+    padding-right: 0 !important;
+    box-sizing: border-box !important;
+  }
+
+  .wcd-inner {
+    width: 100% !important;
+    max-width: 100% !important;
+    padding-left: 0 !important;
+    padding-right: 0 !important;
+    box-sizing: border-box !important;
+  }
+}
+
+.industry-card-link {
   position: relative;
   height: 600px;
   border-radius: 30px;
@@ -899,12 +1024,14 @@ body {
    to 600px at <= 840px. Earlier this card shrank at <= 1536px, which is why the
    About hero looked smaller than Home on MacBook M1/Pro (their ~1440-1512px logical
    width falls below 1536px). Match the home breakpoint instead. */
-@media (max-width: 840px) {
+@media (max-width: 1024px) {
   .custom-standard-hero-container {
-    /* No top gap on mobile: the hero card sits flush to the top so the floating
+    /* No top gap on mobile/tablet: the hero card sits flush to the top so the floating
        navbar rests directly on the hero instead of leaving a band above it. */
     padding: 0 10px 10px 10px !important;
   }
+}
+@media (max-width: 840px) {
   .custom-standard-hero-card {
     height: 600px !important;
     min-height: 600px !important;
@@ -929,5 +1056,30 @@ body {
   .miletruth-hero-container {
     margin-top: 0 !important;
   }
-}
 
+  /* Audit & align section rhythm on mobile/tablet across all content pages */
+  .elementor-86 #women-entrepreneurship.elementor-element-bbc6760,
+  .elementor-86 .comparison-section,
+  .elementor-86 .elementor-element.elementor-element-bbc6760:not(#women-entrepreneurship),
+  .elementor-86 .elementor-element.elementor-element-c2c601a,
+  .elementor-59 .elementor-element.elementor-element-bbc6760,
+  .elementor-104 .elementor-element.elementor-element-c70681e {
+    margin-top: var(--space-section) !important;
+    margin-bottom: 0 !important;
+  }
+
+  /* Solutions page: First section under Solutions Hero gets the hero gap */
+  .elementor-59 .elementor-element.elementor-element-3b4a7cc {
+    margin-top: var(--space-hero-gap) !important;
+    margin-bottom: 0 !important;
+  }
+  
+  /* About page: First section under About Hero gets the hero gap */
+  .elementor-86 .elementor-element.elementor-element-88745f4:first-of-type {
+    margin-top: var(--space-hero-gap) !important;
+  }
+  /* About page: Subsequent sections get standard section spacing */
+  .elementor-86 .elementor-element.elementor-element-88745f4 ~ .elementor-element.elementor-element-88745f4 {
+    margin-top: var(--space-section) !important;
+  }
+}
diff --git a/src/components/layout/Header.tsx b/src/components/layout/Header.tsx
index 18862c5..787172e 100644
--- a/src/components/layout/Header.tsx
+++ b/src/components/layout/Header.tsx
@@ -775,6 +775,9 @@ export default function Header() {
 
             /* Responsive logo adjustment on mobile/tablet */
             @media (max-width: 1024px) {
+                #masthead .elementor-element.elementor-element-466de1b {
+                    top: 18px !important;
+                }
                 #masthead .elementor-element.elementor-element-846e53d .hfe-site-logo .hfe-site-logo-container img {
                     width: 150px !important;
                     height: auto !important;
@@ -793,7 +796,7 @@ export default function Header() {
                    to the top once scrolled past 50px, matching desktop behaviour. */
                 #masthead .elementor-element.elementor-element-466de1b.dm-header-scrolled {
                     position: fixed !important;
-                    top: 0 !important;
+                    top: 18px !important;
                     left: 0 !important;
                     right: 0 !important;
                 }
diff --git a/src/components/layout/LoadingScreen.tsx b/src/components/layout/LoadingScreen.tsx
index 6023a36..3ce3315 100644
--- a/src/components/layout/LoadingScreen.tsx
+++ b/src/components/layout/LoadingScreen.tsx
@@ -118,11 +118,20 @@ export default function LoadingScreen() {
     const originalPushState = window.history.pushState;
     const originalReplaceState = window.history.replaceState;
 
+    const scheduleHistoryTransition = (targetPath: string) => {
+      const currentPath = getRoutePath(new URL(window.location.href));
+      if (targetPath === currentPath) return;
+
+      window.setTimeout(() => {
+        startTransition(targetPath, true);
+      }, 0);
+    };
+
     window.history.pushState = function patchedPushState(...args) {
       const urlArg = args[2];
       if (typeof urlArg === "string" || urlArg instanceof URL) {
         const url = new URL(urlArg, window.location.href);
-        if (url.origin === window.location.origin) startTransition(getRoutePath(url));
+        if (url.origin === window.location.origin) scheduleHistoryTransition(getRoutePath(url));
       }
       return originalPushState.apply(this, args);
     };
@@ -131,7 +140,7 @@ export default function LoadingScreen() {
       const urlArg = args[2];
       if (typeof urlArg === "string" || urlArg instanceof URL) {
         const url = new URL(urlArg, window.location.href);
-        if (url.origin === window.location.origin) startTransition(getRoutePath(url));
+        if (url.origin === window.location.origin) scheduleHistoryTransition(getRoutePath(url));
       }
       return originalReplaceState.apply(this, args);
     };
diff --git a/src/components/sections/AboutCTA.tsx b/src/components/sections/AboutCTA.tsx
index b6502f1..fc3cdf2 100644
--- a/src/components/sections/AboutCTA.tsx
+++ b/src/components/sections/AboutCTA.tsx
@@ -3,7 +3,31 @@ import Link from "next/link";
 
 export default function AboutCTA() {
   return (
-    <div className="we-container">
+    <>
+      <style dangerouslySetInnerHTML={{ __html: `
+        @media (max-width: 768px) {
+          .we-container {
+            margin-top: 40px !important;
+            margin-bottom: 40px !important;
+            padding: 0 10px !important;
+          }
+          .we-cta {
+            padding: 48px 20px !important;
+            border-radius: 22px !important;
+          }
+          .we-cta-title {
+            font-size: clamp(28px, 6vw, 38px) !important;
+            line-height: 1.25 !important;
+            margin-bottom: 16px !important;
+          }
+          .we-cta-sub {
+            font-size: 15px !important;
+            line-height: 1.5 !important;
+            margin-bottom: 24px !important;
+          }
+        }
+      `}} />
+      <div className="we-container">
       <div className="we-cta reveal">
         <div className="we-cta-inner">
           <h2 className="we-cta-title">
@@ -26,5 +50,6 @@ export default function AboutCTA() {
         </div>
       </div>
     </div>
+    </>
   );
 }
diff --git a/src/components/sections/AboutHero.tsx b/src/components/sections/AboutHero.tsx
index 3f2889a..9720d03 100644
--- a/src/components/sections/AboutHero.tsx
+++ b/src/components/sections/AboutHero.tsx
@@ -9,7 +9,7 @@ export default function AboutHero() {
             width: 100% !important;
             text-align: center !important;
             color: #fff !important;
-            padding: 40px !important;
+            padding: 0 15px !important;
             z-index: 2;
             display: flex !important;
             flex-direction: column !important;
diff --git a/src/components/sections/BlogGrid.tsx b/src/components/sections/BlogGrid.tsx
index 96efa7b..7f7f2fe 100644
--- a/src/components/sections/BlogGrid.tsx
+++ b/src/components/sections/BlogGrid.tsx
@@ -26,9 +26,40 @@ export default function BlogGrid() {
             }
         }
         @media (max-width: 768px) {
+            .elementor-104 .elementor-element.elementor-element-c70681e {
+                margin-top: var(--space-section) !important;
+                margin-bottom: 16px !important;
+            }
             .custom-blog-grid {
                 grid-template-columns: 1fr !important;
-                gap: 48px !important;
+                gap: 28px !important;
+                padding: 24px 20px !important;
+            }
+        }
+
+        @media (max-width: 767px) {
+            .elementor-104 .elementor-element.elementor-element-c70681e {
+                --padding-left: 10px !important;
+                --padding-right: 10px !important;
+                padding-left: 10px !important;
+                padding-right: 10px !important;
+            }
+            .elementor-104 .elementor-element.elementor-element-3dec5cf {
+                --padding-left: 0px !important;
+                --padding-right: 0px !important;
+                padding-left: 0 !important;
+                padding-right: 0 !important;
+            }
+            .elementor-104 .elementor-element.elementor-element-aa12479,
+            .elementor-104 .elementor-element.elementor-element-aa12479 > .elementor-widget-container,
+            .elementor-104 .archive-listing,
+            .elementor-104 .custom-blog-grid {
+                width: 100% !important;
+                max-width: 100% !important;
+            }
+            .elementor-104 .custom-blog-grid {
+                padding-left: 0 !important;
+                padding-right: 0 !important;
             }
         }
 
diff --git a/src/components/sections/BlogPostFooter.tsx b/src/components/sections/BlogPostFooter.tsx
index cc09bd3..ab164d0 100644
--- a/src/components/sections/BlogPostFooter.tsx
+++ b/src/components/sections/BlogPostFooter.tsx
@@ -147,6 +147,12 @@ const STYLES = `
     padding: clamp(24px, 3vw, 32px) clamp(20px, 4vw, 40px) clamp(8px, 1.5vw, 16px);
     display: flex; flex-direction: column; gap: clamp(32px, 4vw, 48px);
   }
+  @media (max-width: 767px) {
+    .dm-blog-footer-inner {
+      padding-left: 16px;
+      padding-right: 16px;
+    }
+  }
 
   /* Prev / Next */
   .dm-prevnext {
diff --git a/src/components/sections/BlogsHero.tsx b/src/components/sections/BlogsHero.tsx
index 0b45004..59124dd 100644
--- a/src/components/sections/BlogsHero.tsx
+++ b/src/components/sections/BlogsHero.tsx
@@ -15,6 +15,19 @@ export default function BlogsHero() {
             letter-spacing: -1.5px !important;
             margin: 0 !important;
         }
+        .blogs-hero-content {
+            position: relative !important;
+            width: 100% !important;
+            height: 100% !important;
+            display: flex !important;
+            align-items: center !important;
+            justify-content: center !important;
+            flex-direction: column !important;
+            max-width: 1000px !important;
+            margin: 0 auto !important;
+            padding: 0 15px !important;
+            box-sizing: border-box !important;
+        }
       `}} />
       <div className="custom-standard-hero-container">
         <div 
@@ -26,7 +39,7 @@ export default function BlogsHero() {
           }} 
           className="custom-standard-hero-card"
         >
-          <div className="e-con-inner" style={{ position: "relative", width: "100%", height: "100%", display: "flex", alignItems: "center", justifyContent: "center", flexDirection: "column" }}>
+          <div className="blogs-hero-content">
             
             {/* Title / Heading for Blogs */}
             <div style={{ textAlign: "center", color: "#fff", zIndex: 5 }}>
diff --git a/src/components/sections/CompetitiveEdge.tsx b/src/components/sections/CompetitiveEdge.tsx
index ead04e8..3e2b65f 100644
--- a/src/components/sections/CompetitiveEdge.tsx
+++ b/src/components/sections/CompetitiveEdge.tsx
@@ -492,7 +492,11 @@ export default function CompetitiveEdge() {
 
         @media (max-width: 768px) {
           .comparison-section {
-            padding: 80px 0;
+            padding: 56px 0;
+          }
+
+          .comparison-section .container {
+            padding: 0 10px;
           }
 
           .moat-heading {
diff --git a/src/components/sections/ConnectedLogistics.tsx b/src/components/sections/ConnectedLogistics.tsx
index 96ce80a..642c3b2 100644
--- a/src/components/sections/ConnectedLogistics.tsx
+++ b/src/components/sections/ConnectedLogistics.tsx
@@ -86,9 +86,20 @@ export default function ConnectedLogistics() {
             padding-right: 0 !important;
           }
 
+          /* Force ScrollReveal wrapper div to span full width */
+          .elementor-element-96343ba > div {
+            width: 100% !important;
+            height: auto !important;
+          }
+
           /* Show image at the bottom or top depending on order */
           .elementor-element-96343ba {
-            margin-top: 30px !important;
+            margin-top: 0px !important;
+          }
+
+          /* Reduce padding bottom of the content section on tablet */
+          .elementor-element-71c3e1d {
+            padding-bottom: 24px !important;
           }
 
           /* Override desktop fixed widths on mobile/tablet */
@@ -98,27 +109,49 @@ export default function ConnectedLogistics() {
             max-width: 100% !important;
           }
 
-          /* Tablet overrides: ~15% smaller than site.css's 450px with centered layout */
+          /* Allow widget container to take 100% width on mobile/tablet */
+          .elementor-element-99768ba {
+            width: 100% !important;
+            max-width: 100% !important;
+          }
+
+          /* Tablet overrides */
           .elementor-element-99768ba .elementor-widget-container {
-            padding: 30px !important;
+            padding: 10px !important;
+            display: block !important; /* Disable flex centering layout on mobile/tablet */
+            width: 100% !important;
           }
 
           .elementor-element.elementor-element-99768ba .elementor-widget-container img.wp-image-4481 {
             width: 100% !important;
-            max-width: 382px !important;
+            max-width: 600px !important; /* allow up to 600px on tablet */
             border-radius: 25px !important; /* Explicitly keep 25px */
           }
         }
 
         @media (max-width: 767px) {
-          /* Mobile overrides: ~15% smaller than site.css's 90% with 10% identical padding on all 4 sides */
+          /* Mobile overrides: let container take 100% width and image fill it */
+          .elementor-element-99768ba {
+            width: 100% !important;
+            max-width: 100% !important;
+          }
+
+          /* Eliminate extra gap under the content column on mobile */
+          .elementor-element-71c3e1d {
+            padding-bottom: 12px !important;
+          }
+
           .elementor-element-99768ba .elementor-widget-container {
-            padding: 10% !important;
+            padding: 0px !important; /* Eliminate padding to maximize image width/height */
+            display: block !important; /* Disable flex centering layout on mobile/tablet */
+            width: 100% !important;
           }
 
           .elementor-element.elementor-element-99768ba .elementor-widget-container img.wp-image-4481 {
             width: 100% !important;
             max-width: 100% !important;
+            height: auto !important;
+            object-fit: cover !important;
             border-radius: 25px !important; /* Explicitly keep 25px */
           }
         }
diff --git a/src/components/sections/EVLogisticSection.tsx b/src/components/sections/EVLogisticSection.tsx
index f67b83e..1d498c6 100644
--- a/src/components/sections/EVLogisticSection.tsx
+++ b/src/components/sections/EVLogisticSection.tsx
@@ -346,10 +346,57 @@ export default function EVLogisticSection() {
 
         }
 
-        @media (max-width: 768px) {
+        @media (max-width: 767px) {
+          .ev-logistic-section {
+            --padding-left: 10px !important;
+            --padding-right: 10px !important;
+            padding-left: 10px !important;
+            padding-right: 10px !important;
+            box-sizing: border-box !important;
+          }
+
+          .ev-logistic-section > .e-con-inner {
+            width: 100% !important;
+            max-width: 100% !important;
+            padding-left: 0 !important;
+            padding-right: 0 !important;
+            margin-left: auto !important;
+            margin-right: auto !important;
+            box-sizing: border-box !important;
+          }
+
+          .ev-logistic-section .elementor-element-343b363 {
+            --padding-left: 0px !important;
+            --padding-right: 0px !important;
+            padding-left: 0 !important;
+            padding-right: 0 !important;
+            width: 100% !important;
+            max-width: 100% !important;
+            box-sizing: border-box !important;
+          }
+
+          .ev-logistic-body-grid {
+            width: 100% !important;
+            max-width: 100% !important;
+            align-items: stretch !important;
+          }
+
+          .ev-logistic-content-col {
+            width: 100% !important;
+            max-width: 100% !important;
+            align-self: center !important;
+          }
+
           .ev-feature-grid {
             grid-template-columns: 1fr !important;
             gap: 20px !important;
+            width: 100% !important;
+            max-width: 100% !important;
+          }
+
+          .ev-feature-card {
+            width: 100% !important;
+            max-width: 100% !important;
           }
         }
       `}} />
@@ -368,7 +415,7 @@ export default function EVLogisticSection() {
               <div className="ev-logistic-header">
                 <div className="elementor-element elementor-element-7afb238 elementor-widget elementor-widget-logico_heading ev-logistic-kicker-widget" data-id="7afb238" data-element_type="widget" data-e-type="widget" data-widget_type="logico_heading.default">
                   <div className="elementor-widget-container">
-                    <div className="logico-title ev-logistic-kicker">/ Build Electric Vehicles /</div>
+                    <div className="logico-title ev-logistic-kicker">/ Built for Electric Vehicles /</div>
                   </div>
                 </div>
                 <div className="ev-logistic-title-wrapper">
@@ -382,7 +429,7 @@ export default function EVLogisticSection() {
                           fontWeight: 800,
                         }}
                       >
-                        LOGISTICS BUILT FOR ELECTRIC VEHICLES
+                        Logistics Built for EV Vehicles
                       </div>
                     </div>
                   </div>
diff --git a/src/components/sections/EVSection.tsx b/src/components/sections/EVSection.tsx
index 45923de..7817879 100644
--- a/src/components/sections/EVSection.tsx
+++ b/src/components/sections/EVSection.tsx
@@ -390,6 +390,7 @@ export default function EVSection({
 
   const outerClass =
     "elementor-element elementor-element-bbc6760 e-con-full e-flex cut-corner-no sticky-container-off e-con e-parent" +
+    (useDashboard ? " evnd-workflow-shell" : "") +
     (gapTop ? " evnd-gap-top" : "") +
     (gapBottom ? " evnd-gap-bottom" : "");
 
@@ -1057,9 +1058,47 @@ export default function EVSection({
             .evnd__dash-kpis { grid-template-columns: repeat(4, 1fr); }
         }
         @media (max-width: 767px) {
+            .elementor.elementor-61 .elementor-element.elementor-element-bbc6760,
+            .elementor-element.elementor-element-bbc6760.evnd-workflow-shell {
+                width: calc(100% - 20px) !important;
+                margin-left: 10px !important;
+                margin-right: 10px !important;
+                padding-left: 0px !important;
+                padding-right: 0px !important;
+                box-sizing: border-box !important;
+            }
             .evnd-gap-top { margin-top: 24px !important; }
             .evnd-gap-bottom { margin-bottom: 24px !important; }
-            .evnd__bar { grid-template-columns: repeat(2, 1fr); gap: 24px 0; padding: 24px 0; margin-top: 24px; }
+            .evnd { padding-inline: 0; }
+            .evnd__heading {
+                padding-left: 26px;
+                padding-right: 26px;
+                box-sizing: border-box;
+                margin-bottom: 28px;
+                display: flow-root;
+            }
+            .evnd__inner {
+                padding-left: 4px;
+                padding-right: 4px;
+                box-sizing: border-box;
+            }
+            .evnd__dash {
+                padding-left: 12px !important;
+                padding-right: 12px !important;
+            }
+            .evnd__bar {
+                grid-template-columns: repeat(2, 1fr);
+                gap: 24px 0;
+                width: calc(100% - 8px);
+                max-width: calc(100% - 8px);
+                margin: 32px auto 0;
+                padding: 24px 0;
+                box-sizing: border-box;
+            }
+            .evnd.evnd--cards {
+                padding-bottom: 20px;
+                margin-bottom: 0;
+            }
             .evnd__bar-item:nth-child(even)::after { display: none; }
             .evnd__bar-item:nth-child(2)::after { display: none; }
             .evnd__bar-item { padding: 12px 16px; }
@@ -1080,12 +1119,66 @@ export default function EVSection({
             .evnd__grid--cards .evnd__left,
             .evnd__grid--cards .evnd__right,
             .evnd__grid--cards .evnd__media,
-            .evnd__grid--cards .evnd__dash { min-width: 0; }
+            .evnd__grid--cards .evnd__dash {
+                min-width: 0;
+                width: 100% !important;
+                max-width: 100% !important;
+                box-sizing: border-box !important;
+            }
             /* Keep the KPI row a tidy 2x2 on phones. */
             .evnd__dash-kpis { grid-template-columns: repeat(2, 1fr); }
+            /* Workflow feature cards: distribute content like the Women stats
+               rows so the icon balances the right side instead of everything
+               clustering at the left edge. */
+            .evnd-workflow-shell .evnd__dash-feats { gap: 10px; }
+            .evnd-workflow-shell .evnd__dfeat {
+                grid-template-columns: minmax(0, 1fr) 36px;
+                gap: 12px;
+                padding: 12px 14px;
+            }
+            .evnd-workflow-shell .evnd__dfeat-ico {
+                grid-column: 2;
+                grid-row: 1;
+                justify-self: end;
+                width: 36px;
+                height: 36px;
+            }
+            .evnd-workflow-shell .evnd__dfeat-body {
+                grid-column: 1;
+                grid-row: 1;
+            }
+
+            /* ---- Mobile-only overrides for Hero Image & EV Logistics Card ---- */
+            .elementor-element.elementor-element-7da6646 {
+                width: calc(100% - 16px) !important;
+                margin-left: 8px !important;
+                margin-right: 8px !important;
+                border-radius: 18px !important;
+                margin-top: 15px !important;
+                margin-bottom: -50px !important;
+                box-sizing: border-box !important;
+            }
+            .elementor-element.elementor-element-8b5d6e6 {
+                padding-left: 8px !important;
+                padding-right: 8px !important;
+                margin-left: 0px !important;
+                margin-right: 0px !important;
+                width: 100% !important;
+                max-width: 100% !important;
+                box-sizing: border-box !important;
+            }
+            .elementor-element.elementor-element-1f766ea {
+                padding-left: 0px !important;
+                padding-right: 0px !important;
+                margin-left: auto !important;
+                margin-right: auto !important;
+                width: 100% !important;
+                max-width: 100% !important;
+            }
         }
         @media (max-width: 480px) {
             .evnd { padding: 40px 16px 48px; }
+            .evnd { padding-inline: 0; }
             .evnd__bar { grid-template-columns: repeat(2, 1fr); gap: 18px 0; padding: 22px 0; }
             .evnd__bar-item { padding: 10px 12px; gap: 8px; }
             .evnd__bar-val { font-size: clamp(26px, 9vw, 34px); }
@@ -1104,13 +1197,13 @@ export default function EVSection({
             .evnd-feature__arrow { position: absolute; top: 16px; right: 16px; margin: 0; }
 
             /* ---- Compact dashboard (phones) ---- */
-            .evnd__dash { padding: 18px; gap: 14px; }
+            .evnd__dash { padding-top: 18px !important; padding-bottom: 18px !important; gap: 14px; }
             .evnd__dash-sys { display: none; }
             .evnd__dash-kpis { gap: 10px; }
             .evnd__kpi { padding: 12px 14px; gap: 4px; }
             .evnd__kpi-val { font-size: clamp(24px, 8vw, 30px); }
             .evnd__kpi-label { font-size: 12px; }
-            .evnd__dfeat { padding: 12px 14px; gap: 12px; grid-template-columns: 34px minmax(0, 1fr); }
+            .evnd-workflow-shell .evnd__dfeat { padding: 11px 12px; gap: 10px; grid-template-columns: minmax(0, 1fr) 34px; }
             .evnd__dfeat-ico { width: 34px; height: 34px; border-radius: 9px; }
             .evnd__dfeat-ico svg { width: 17px; height: 17px; }
             .evnd__dfeat-title { font-size: 13.5px; }
@@ -1241,11 +1334,13 @@ export default function EVSection({
               useDashboard && !mediaSlot ? " evnd__inner--img" : ""
             }`}
           >
-            <span className="evnd__eyebrow">{eyebrow}</span>
-            <h2 className="evnd__title">
-              {titleLead}
-              <span className="accent">{titleAccent}</span>
-            </h2>
+            <div className="evnd__heading">
+              <span className="evnd__eyebrow">{eyebrow}</span>
+              <h2 className="evnd__title">
+                {titleLead}
+                <span className="accent">{titleAccent}</span>
+              </h2>
+            </div>
 
             {/* MAIN GRID */}
             <div
diff --git a/src/components/sections/HowItWorksHero.tsx b/src/components/sections/HowItWorksHero.tsx
index c87ddf6..0738ddd 100644
--- a/src/components/sections/HowItWorksHero.tsx
+++ b/src/components/sections/HowItWorksHero.tsx
@@ -47,7 +47,7 @@ export default function HowItWorksHero() {
             text-align: center !important;
             width: 100% !important;
             height: 100% !important;
-            padding: 0 40px !important;
+            padding: 0 !important;
             box-sizing: border-box !important;
         }
 
@@ -73,6 +73,8 @@ export default function HowItWorksHero() {
             width: 100% !important;
             margin-left: auto !important;
             margin-right: auto !important;
+            padding-left: 15px !important;
+            padding-right: 15px !important;
         }
 
         .elementor-element.elementor-element-6c7cbcb .content-slider-item-text {
@@ -86,6 +88,8 @@ export default function HowItWorksHero() {
             text-align: center !important;
             max-width: 820px !important;
             margin: 0 auto !important;
+            padding-left: 15px !important;
+            padding-right: 15px !important;
         }
 
         /* Larger, more readable hero subtitle on large/4K screens */
@@ -109,10 +113,13 @@ export default function HowItWorksHero() {
 
         @media (max-width: 1024px) {
             .elementor-element.elementor-element-741f56c {
-                width: calc(100% - 40px) !important;
-                max-width: none !important;
+                width: 100% !important;
+                max-width: 100% !important;
                 margin-left: auto !important;
                 margin-right: auto !important;
+                --padding-top: 0px !important;
+                --padding-block-start: 0px !important;
+                padding: 0 10px 10px 10px !important;
                 overflow: hidden !important;
                 border-radius: 25px !important;
             }
@@ -134,15 +141,19 @@ export default function HowItWorksHero() {
             .elementor-element.elementor-element-6c7cbcb .slide-content {
                 width: 100% !important;
                 min-height: 620px !important;
-                padding-left: 48px !important;
-                padding-right: 48px !important;
+                padding-left: 0 !important;
+                padding-right: 0 !important;
                 box-sizing: border-box !important;
             }
         }
 
         @media (max-width: 767px) {
             .elementor-element.elementor-element-741f56c {
-                width: calc(100% - 24px) !important;
+                width: 100% !important;
+                max-width: 100% !important;
+                --padding-top: 0px !important;
+                --padding-block-start: 0px !important;
+                padding: 0 10px 10px 10px !important;
                 border-radius: 22px !important;
             }
 
@@ -162,8 +173,8 @@ export default function HowItWorksHero() {
                asymmetric top margin). */
             .elementor .elementor-element.elementor-element-6c7cbcb .slide-content {
                 min-height: 560px !important;
-                padding-left: 22px !important;
-                padding-right: 22px !important;
+                padding-left: 0 !important;
+                padding-right: 0 !important;
                 align-items: center !important;
                 justify-content: center !important;
                 text-align: center !important;
diff --git a/src/components/sections/IndustrySolutions.tsx b/src/components/sections/IndustrySolutions.tsx
index c2d0fb8..b7e7b17 100644
--- a/src/components/sections/IndustrySolutions.tsx
+++ b/src/components/sections/IndustrySolutions.tsx
@@ -5,6 +5,66 @@ import { ScrollReveal } from "@/animations/Reveal";
 
 export default function IndustrySolutions() {
   return (
+    <>
+    <style dangerouslySetInnerHTML={{ __html: `
+      @media (max-width: 768px) {
+        .elementor-element.elementor-element-3b4a7cc {
+          --padding-left: 10px !important;
+          --padding-right: 10px !important;
+          padding-left: 10px !important;
+          padding-right: 10px !important;
+          box-sizing: border-box !important;
+        }
+
+        .elementor-element.elementor-element-3b4a7cc > .e-con-inner {
+          width: 100% !important;
+          max-width: 100% !important;
+          margin-left: auto !important;
+          margin-right: auto !important;
+          padding-left: 0 !important;
+          padding-right: 0 !important;
+        }
+
+        .elementor-element.elementor-element-d602f7f,
+        .elementor-element.elementor-element-f64bd88,
+        .elementor-element.elementor-element-5ed2dbb,
+        .elementor-element.elementor-element-6829276 {
+          --padding-left: 0px !important;
+          --padding-right: 0px !important;
+          --margin-left: 0px !important;
+          --margin-right: 0px !important;
+          width: 100% !important;
+          max-width: 100% !important;
+          margin-left: 0 !important;
+          margin-right: 0 !important;
+          padding-left: 0 !important;
+          padding-right: 0 !important;
+          box-sizing: border-box !important;
+        }
+
+        .elementor-element.elementor-element-6829276 {
+          --e-con-grid-template-columns: minmax(0, 1fr) !important;
+          --grid-justify-content: stretch !important;
+          --justify-items: stretch !important;
+          grid-template-columns: minmax(0, 1fr) !important;
+          justify-content: stretch !important;
+          justify-items: stretch !important;
+          min-width: 0 !important;
+        }
+
+        .industry-solutions-grid,
+        .industry-card-link {
+          width: 100% !important;
+          max-width: 100% !important;
+          min-width: 0 !important;
+        }
+
+        .industry-solutions-grid {
+          margin-left: 0 !important;
+          margin-right: 0 !important;
+        }
+      }
+    `}} />
     <div className="elementor-element elementor-element-3b4a7cc e-flex e-con-boxed cut-corner-no sticky-container-off e-con e-parent" data-id="3b4a7cc" data-element_type="container" data-e-type="container">
         <div className="e-con-inner">
           <div className="elementor-element elementor-element-d602f7f e-con-full e-flex cut-corner-no sticky-container-off e-con e-child" data-id="d602f7f" data-element_type="container" data-e-type="container">
@@ -278,6 +338,7 @@ export default function IndustrySolutions() {
             </div>
           </div>
         </div>
-      </div>
+    </div>
+    </>
   );
 }
diff --git a/src/components/sections/IndustryStack.tsx b/src/components/sections/IndustryStack.tsx
index 9b63a98..bc90e8d 100644
--- a/src/components/sections/IndustryStack.tsx
+++ b/src/components/sections/IndustryStack.tsx
@@ -306,7 +306,7 @@ const CSS = `
   #ind-stack .istk__content { max-width: none; }
 }
 @media (max-width: 600px) {
-  #ind-stack .istk { padding: 10px 14px; }
+  #ind-stack .istk { padding: 10px; }
   #ind-stack .istk__card { padding: 22px 20px; border-radius: 24px; }
   #ind-stack .istk__media { height: 240px; }
   #ind-stack .istk__title { margin-bottom: 16px !important; }
diff --git a/src/components/sections/IntelligenceGrid.tsx b/src/components/sections/IntelligenceGrid.tsx
index cb65834..0d48a6f 100644
--- a/src/components/sections/IntelligenceGrid.tsx
+++ b/src/components/sections/IntelligenceGrid.tsx
@@ -234,7 +234,7 @@ export default function IntelligenceGrid() {
   return (
     <div 
       ref={containerRef}
-      className="elementor-element elementor-element-bbc6760 e-con-full e-flex cut-corner-no sticky-container-off e-con e-parent" 
+      className="elementor-element elementor-element-bbc6760 e-con-full e-flex cut-corner-no sticky-container-off e-con e-parent intelligence-grid-section" 
       data-id="bbc6760" 
       data-element_type="container" 
       data-e-type="container"
@@ -710,11 +710,19 @@ export default function IntelligenceGrid() {
             }
           }
 
-          @media (max-width: 768px) {
+          @media (max-width: 767px) {
+            .intelligence-grid-section {
+              --padding-left: 0px !important;
+              --padding-right: 0px !important;
+              padding-left: 0 !important;
+              padding-right: 0 !important;
+            }
+
             .roadmap-hero-section {
-              width: calc(100% - 24px); /* tighter 12px gutter so the band reads edge-to-edge on phones */
+              width: calc(100% - 32px) !important;
+              max-width: calc(100% - 32px) !important;
               padding: 52px 16px 44px;
-              border-radius: 22px;
+              border-radius: 22px !important;
             }
             .vision-main-subtitle { margin-bottom: 40px !important; }
 
diff --git a/src/components/sections/MileTruthHero.tsx b/src/components/sections/MileTruthHero.tsx
index 7669bc2..d568688 100644
--- a/src/components/sections/MileTruthHero.tsx
+++ b/src/components/sections/MileTruthHero.tsx
@@ -69,7 +69,7 @@ export default function MileTruthHero() {
           justify-content: center;
           border-radius: 25px 25px 0 0;
           margin-top: 20px;
-          padding: 100px 40px;
+          padding: 100px 0;
         }
         .miletruth-hero-container::before {
           display: none !important;
@@ -78,7 +78,7 @@ export default function MileTruthHero() {
           position: relative;
           z-index: 2;
           width: 100%;
-          padding: 0 40px !important;
+          padding: 0 !important;
           box-sizing: border-box;
         }
         .miletruth-hero .content-slider-item-heading,
@@ -114,7 +114,7 @@ export default function MileTruthHero() {
           text-align: center !important;
           width: 100% !important;
           height: 100% !important;
-          padding: 0 40px !important;
+          padding: 0 15px !important;
           box-sizing: border-box !important;
         }
         .miletruth-hero .slide-content,
@@ -258,9 +258,12 @@ export default function MileTruthHero() {
           }
         }
         @media (max-width: 1024px) {
+          .miletruth-hero .elementor-element-86f3204 {
+            padding: 0 10px !important;
+          }
           .miletruth-hero-container {
             min-height: 600px;
-            padding: 120px 0;
+            padding: 80px 0 !important;
           }
           .miletruth-hero .elementor-element-8e5c81e {
             padding: 40px 0 !important;
@@ -288,19 +291,19 @@ export default function MileTruthHero() {
         @media (max-width: 580px) {
           .miletruth-hero-container {
             min-height: 500px;
-            padding: 100px 0;
+            padding: 60px 0 !important;
           }
           .miletruth-hero .elementor-element-86f3204 {
-            padding: 0 12px;
+            padding: 0 10px !important;
           }
           /* Collapse the nested horizontal padding (was 40px + 40px on top of the
              12px wrapper) — at 320px that left only ~136px for text and the long
              heading words overflowed, causing horizontal scroll + off-center look. */
           .miletruth-content {
-            padding: 0 14px !important;
+            padding: 0 !important;
           }
           .miletruth-hero .slide-content {
-            padding: 0 !important;
+            padding: 0 15px !important;
           }
           .miletruth-hero .elementor-element-8e5c81e {
             padding: 30px 0 !important;
diff --git a/src/components/sections/OurTeam.tsx b/src/components/sections/OurTeam.tsx
index d899db4..44fdf47 100644
--- a/src/components/sections/OurTeam.tsx
+++ b/src/components/sections/OurTeam.tsx
@@ -87,8 +87,35 @@ export default function OurTeam() {
       @media (max-width: 800px) {
         .team-listing-wrapper.team-grid-listing .team-item-wrapper { width: 50%; }
       }
+      @media (max-width: 767px) {
+        .elementor-86 .elementor-element-c2c601a > .e-con-inner {
+          padding-left: 0 !important;
+          padding-right: 0 !important;
+          padding-top: 32px !important;
+          padding-bottom: 32px !important;
+        }
+        .elementor-86 .elementor-element-c46350e > .elementor-widget-container {
+          margin-top: 24px !important;
+          margin-bottom: 24px !important;
+        }
+        .team-listing-wrapper.team-grid-listing {
+          margin: 0 0 -28px;
+        }
+        .team-listing-wrapper.team-grid-listing .team-item-wrapper {
+          width: 100%;
+          padding: 0;
+          margin-bottom: 28px;
+        }
+      }
       @media (max-width: 480px) {
-        .team-listing-wrapper.team-grid-listing .team-item-wrapper { width: 100%; }
+        .team-listing-wrapper.team-grid-listing {
+          margin: 0 0 -28px;
+        }
+        .team-listing-wrapper.team-grid-listing .team-item-wrapper {
+          width: 100%;
+          padding: 0;
+          margin-bottom: 28px;
+        }
       }
  
       /* Card: photo on top, name/position at the bottom (down to image). */
diff --git a/src/components/sections/SingleBlog.tsx b/src/components/sections/SingleBlog.tsx
index 11de46b..4f875f6 100644
--- a/src/components/sections/SingleBlog.tsx
+++ b/src/components/sections/SingleBlog.tsx
@@ -227,6 +227,12 @@ const STYLES = `
     /* 20px mobile padding floor → 40px on desktop; matches the footer container. */
     padding: clamp(14px, 2vw, 26px) clamp(20px, 4vw, 40px) 0;
   }
+  @media (max-width: 767px) {
+    .dm-blog-wrap {
+      padding-left: 16px;
+      padding-right: 16px;
+    }
+  }
 
   /* ── Article meta bar (directly under the hero) ── */
   .dm-meta-bar {
diff --git a/src/components/sections/SolutionsHero.tsx b/src/components/sections/SolutionsHero.tsx
index f883e3e..f931435 100644
--- a/src/components/sections/SolutionsHero.tsx
+++ b/src/components/sections/SolutionsHero.tsx
@@ -45,7 +45,7 @@ export default function SolutionsHero() {
             text-align: center !important;
             width: 100% !important;
             height: 100% !important;
-            padding: 0 40px !important;
+            padding: 0 !important;
             box-sizing: border-box !important;
         }
 
@@ -71,6 +71,8 @@ export default function SolutionsHero() {
             width: 100% !important;
             margin-left: auto !important;
             margin-right: auto !important;
+            padding-left: 15px !important;
+            padding-right: 15px !important;
         }
 
         .elementor-element.elementor-element-6c7cbcb .content-slider-item-text {
@@ -84,6 +86,8 @@ export default function SolutionsHero() {
             text-align: center !important;
             max-width: 820px !important;
             margin: 0 auto !important;
+            padding-left: 15px !important;
+            padding-right: 15px !important;
         }
 
         /* Larger, more readable hero subtitle on large/4K screens */
@@ -107,10 +111,13 @@ export default function SolutionsHero() {
 
         @media (max-width: 1024px) {
             .elementor-element.elementor-element-741f56c {
-                width: calc(100% - 40px) !important;
-                max-width: none !important;
+                width: 100% !important;
+                max-width: 100% !important;
                 margin-left: auto !important;
                 margin-right: auto !important;
+                --padding-top: 0px !important;
+                --padding-block-start: 0px !important;
+                padding: 0 10px 10px 10px !important;
                 overflow: hidden !important;
                 border-radius: 25px !important;
             }
@@ -132,15 +139,19 @@ export default function SolutionsHero() {
             .elementor-element.elementor-element-6c7cbcb .slide-content {
                 width: 100% !important;
                 min-height: 620px !important;
-                padding-left: 48px !important;
-                padding-right: 48px !important;
+                padding-left: 0 !important;
+                padding-right: 0 !important;
                 box-sizing: border-box !important;
             }
         }
 
         @media (max-width: 767px) {
             .elementor-element.elementor-element-741f56c {
-                width: calc(100% - 24px) !important;
+                width: 100% !important;
+                max-width: 100% !important;
+                --padding-top: 0px !important;
+                --padding-block-start: 0px !important;
+                padding: 0 10px 10px 10px !important;
                 border-radius: 22px !important;
             }
 
@@ -156,8 +167,8 @@ export default function SolutionsHero() {
 
             .elementor-element.elementor-element-6c7cbcb .slide-content {
                 min-height: 560px !important;
-                padding-left: 22px !important;
-                padding-right: 22px !important;
+                padding-left: 0 !important;
+                padding-right: 0 !important;
             }
 
             .elementor-element.elementor-element-6c7cbcb .content-slider-item-heading {
@@ -165,6 +176,8 @@ export default function SolutionsHero() {
                 font-size: clamp(38px, 11vw, 48px) !important;
                 line-height: 1.05 !important;
                 overflow-wrap: break-word !important;
+                padding-left: 15px !important;
+                padding-right: 15px !important;
             }
 
             /* Pin the slide counter ("01/02") cleanly bottom-RIGHT — matching the
diff --git a/src/components/sections/WhyChooseDoormile.tsx b/src/components/sections/WhyChooseDoormile.tsx
index c0d9525..e4ac872 100644
--- a/src/components/sections/WhyChooseDoormile.tsx
+++ b/src/components/sections/WhyChooseDoormile.tsx
@@ -315,15 +315,15 @@ export default function WhyChooseDoormile() {
         }
 
          @media (max-width: 1020px) {
-          .wcd-section { margin: 0 15px 15px 15px; padding: 40px 0 80px; }
-          .wcd-inner { padding: 0 30px; }
+          .wcd-section { margin: 0 10px 10px 10px; padding: 40px 0 80px; }
+          .wcd-inner { padding: 0; }
           .wcd-grid { grid-template-columns: 1fr; gap: 24px; }
           .wcd-card-body { padding: 32px; }
           .logico-front-end .wcd-section h3.wcd-card-title { font-size: 24px; }
         }
         @media (max-width: 480px) {
-          .wcd-section { margin: 0 12px 12px 12px; border-radius: 0 0 20px 20px; padding: 30px 0 64px; }
-          .wcd-inner { padding: 0 20px; }
+          .wcd-section { margin: 0 10px 10px 10px; border-radius: 0 0 20px 20px; padding: 30px 0 64px; }
+          .wcd-inner { padding: 0; }
           .wcd-card-body { padding: 24px; }
         }
       `}} />
diff --git a/src/components/sections/WomenSection.tsx b/src/components/sections/WomenSection.tsx
index 90f613f..5a296fb 100644
--- a/src/components/sections/WomenSection.tsx
+++ b/src/components/sections/WomenSection.tsx
@@ -179,6 +179,41 @@ export default function WomenSection() {
             font-weight: 500;
         }
 
+        /* ---- Floating card sizing: content-driven, not container-driven ----
+           Matches the EV Logistics card height proportions exactly by trimming
+           red content padding and white footer min-height. */
+        .elementor-element.elementor-element-3b61435 {
+            --padding-top: 46px;
+            --padding-bottom: 38px;
+        }
+        .elementor-element.elementor-element-5aea22e {
+            --min-height: 38px;
+            --padding-top: 14px;
+            --padding-bottom: 14px;
+        }
+        @media (max-width: 1020px) {
+            .elementor-element.elementor-element-3b61435 {
+                --padding-top: 34px;
+                --padding-bottom: 28px;
+            }
+            .elementor-element.elementor-element-5aea22e {
+                --min-height: 32px;
+                --padding-top: 12px;
+                --padding-bottom: 12px;
+            }
+        }
+        @media (max-width: 660px) {
+            .elementor-element.elementor-element-3b61435 {
+                --padding-top: 26px;
+                --padding-bottom: 22px;
+            }
+            .elementor-element.elementor-element-5aea22e {
+                --min-height: 24px;
+                --padding-top: 10px;
+                --padding-bottom: 10px;
+            }
+        }
+
         .elementor-element-778840d .logico-title {
             white-space: nowrap !important;
         }
@@ -192,9 +227,9 @@ export default function WomenSection() {
                 background-position: 78% center !important;
             }
         }
-        @media (max-width: 600px) {
+        @media (max-width: 767px) {
             .elementor-element.elementor-element-7da6646:not(.elementor-motion-effects-element-type-background) {
-                background-position: 82% center !important;
+                background-position: 82% 25% !important;
             }
         }
 
@@ -224,7 +259,108 @@ export default function WomenSection() {
                 margin-right: 0 !important;
             }
         }
-        @media (max-width: 600px) {
+
+        @media (max-width: 767px) {
+            #women-entrepreneurship {
+                width: calc(100% - 20px) !important;
+                margin-left: 10px !important;
+                margin-right: 10px !important;
+                border-radius: 22px !important;
+                padding-left: 0px !important;
+                padding-right: 0px !important;
+            }
+            #women-entrepreneurship .e-con-boxed > .e-con-inner {
+                padding-top: 32px !important;
+                padding-bottom: 32px !important;
+                padding-left: 0 !important;
+                padding-right: 0 !important;
+            }
+            #women-entrepreneurship .elementor-element-8b5d6e6,
+            #women-entrepreneurship .elementor-element-b6e14bd,
+            #women-entrepreneurship .elementor-element-90cc867,
+            #women-entrepreneurship .elementor-element-36efec7,
+            #women-entrepreneurship .elementor-element-b2c956f {
+                padding-left: 0 !important;
+                padding-right: 0 !important;
+                margin-left: 0 !important;
+                margin-right: 0 !important;
+            }
+            #women-entrepreneurship .elementor-element-1f766ea {
+                width: 100% !important;
+                max-width: 100% !important;
+                margin-left: auto !important;
+                margin-right: auto !important;
+                padding-left: 0 !important;
+                padding-right: 0 !important;
+            }
+            #women-entrepreneurship .elementor-element.elementor-element-2ed47f3 {
+                padding-left: 0 !important;
+                padding-right: 0 !important;
+                margin-left: 0 !important;
+                margin-right: 0 !important;
+                margin-top: 0 !important;
+                padding-top: 0 !important;
+                gap: 24px !important;
+            }
+            #women-entrepreneurship .elementor-element-36efec7 {
+                margin-top: 0px !important;
+                padding-top: 0px !important;
+                gap: 0px !important;
+            }
+            #women-entrepreneurship .elementor-element-24c0280 {
+                margin-bottom: 0px !important;
+                padding-left: 14px !important;
+                padding-right: 14px !important;
+                box-sizing: border-box !important;
+            }
+            #women-entrepreneurship .elementor-element-778840d {
+                margin-top: 14px !important;
+                margin-bottom: 14px !important;
+                padding-top: 0px !important;
+                padding-bottom: 0px !important;
+                padding-left: 14px !important;
+                padding-right: 14px !important;
+                box-sizing: border-box !important;
+            }
+            #women-entrepreneurship .elementor-element-778840d h3.logico-title,
+            #women-entrepreneurship .elementor-element-778840d > .elementor-widget-container {
+                margin: 0px !important;
+                padding: 0px !important;
+            }
+            #women-entrepreneurship .elementor-element-7da6646 {
+                width: calc(100% - 28px) !important;
+                margin-left: 14px !important;
+                margin-right: 14px !important;
+                border-radius: 18px !important;
+                min-height: 240px !important;
+                margin-top: 15px !important;
+                margin-bottom: -50px !important;
+                box-sizing: border-box !important;
+            }
+            #women-entrepreneurship .elementor-element-8b5d6e6 {
+                padding-left: 14px !important;
+                padding-right: 14px !important;
+                margin-left: 0px !important;
+                margin-right: 0px !important;
+                width: 100% !important;
+                max-width: 100% !important;
+                box-sizing: border-box !important;
+            }
+            #women-entrepreneurship .elementor-element-bbfb67f img {
+                width: 100% !important;
+            }
+            #women-entrepreneurship .elementor-element-bbfb67f {
+                margin-top: 0px !important;
+                margin-bottom: 16px !important;
+                padding-left: 14px !important;
+                padding-right: 14px !important;
+                box-sizing: border-box !important;
+            }
+            #ws-stories {
+                padding-left: 14px !important;
+                padding-right: 14px !important;
+                box-sizing: border-box !important;
+            }
             /* KPI stat cards stack one-per-row on mobile. Inside each card the big
                number sits on the left and the label on the right, vertically
                centered, so every stat reads as a clean full-width row instead of
@@ -235,7 +371,7 @@ export default function WomenSection() {
                 align-items: center;
                 justify-content: space-between;
                 gap: 16px;
-                padding: 20px 22px;
+                padding: 16px 20px;
                 min-width: 0;
             }
             #ws-stories .ws__stat-num { font-size: clamp(30px, 9vw, 40px); }
@@ -246,7 +382,7 @@ export default function WomenSection() {
                 text-align: right;
                 min-height: 0;
             }
-            #ws-stories .ws__cards { grid-template-columns: 1fr; }
+            #ws-stories .ws__cards { grid-template-columns: 1fr; gap: 12px; }
         }
       `}} />
 
diff --git a/src/components/strategy/StrategyCanvas.tsx b/src/components/strategy/StrategyCanvas.tsx
index b2a2c3d..c9ec1be 100644
--- a/src/components/strategy/StrategyCanvas.tsx
+++ b/src/components/strategy/StrategyCanvas.tsx
@@ -2,7 +2,7 @@
 
 import React, { Suspense, useEffect, useMemo, useRef, useState } from "react";
 import { Canvas, useFrame, useThree } from "@react-three/fiber";
-import { RoundedBox, Line, Sparkles, Html, useGLTF, ContactShadows, Environment, Lightformer, Preload } from "@react-three/drei";
+import { RoundedBox, Line, Sparkles, Html, useGLTF, useProgress, ContactShadows, Environment, Lightformer, Preload } from "@react-three/drei";
 import { EffectComposer, Bloom } from "@react-three/postprocessing";
 import { KernelSize } from "postprocessing";
 import * as THREE from "three";
@@ -14,6 +14,8 @@ type Props = {
   isMobile?: boolean;
   active?: boolean;
   stage?: number;
+  ready?: boolean;
+  onReady?: () => void;
 };
 
 const BG = "#eef1f6";
@@ -785,7 +787,50 @@ function Floor() {
   );
 }
 
-function Scene({ progress, reduced, isMobile, stage, active, perf }: { progress: React.RefObject<number>; reduced: boolean; isMobile: boolean; stage: number; active: boolean; perf: boolean }) {
+function SceneReadySignal({ onReady }: { onReady?: () => void }) {
+  const { active, progress } = useProgress();
+  const gl = useThree((s) => s.gl);
+  const scene = useThree((s) => s.scene);
+  const camera = useThree((s) => s.camera);
+  const fired = useRef(false);
+  const compiling = useRef(false);
+  const compiled = useRef(false);
+  const meaningfulFrames = useRef(0);
+
+  useEffect(() => {
+    if (fired.current || compiling.current || compiled.current || active || progress < 100) return;
+
+    compiling.current = true;
+    const renderer = gl as THREE.WebGLRenderer & {
+      compileAsync?: (scene: THREE.Scene, camera: THREE.Camera) => Promise<void>;
+    };
+    const compile = renderer.compileAsync
+      ? renderer.compileAsync(scene, camera)
+      : Promise.resolve(renderer.compile(scene, camera));
+
+    compile
+      .catch(() => undefined)
+      .finally(() => {
+        compiled.current = true;
+      });
+  }, [active, camera, gl, progress, scene]);
+
+  useFrame(() => {
+    if (fired.current || active || progress < 100 || !compiled.current) return;
+
+    const renderInfo = gl.info.render;
+    const hasMeaningfulScene = renderInfo.calls >= 12 && renderInfo.triangles >= 500;
+    meaningfulFrames.current = hasMeaningfulScene ? meaningfulFrames.current + 1 : 0;
+    if (meaningfulFrames.current < 4) return;
+
+    fired.current = true;
+    requestAnimationFrame(() => onReady?.());
+  });
+
+  return null;
+}
+
+function Scene({ progress, reduced, isMobile, stage, active, perf, onReady }: { progress: React.RefObject<number>; reduced: boolean; isMobile: boolean; stage: number; active: boolean; perf: boolean; onReady?: () => void }) {
   // Districts stay MOUNTED for the whole scroll (GLB cloned once, shaders compiled
   // once → no remount hitch, no blank frames). `near` only toggles per-district
   // visibility + per-frame work + <Html> mounting, so off-screen districts render
@@ -844,12 +889,13 @@ function Scene({ progress, reduced, isMobile, stage, active, perf }: { progress:
       {/* Compile every material/texture upfront (districts are all mounted) so the
          first time a district becomes visible there's no shader-compile stall. */}
       <Preload all />
+      <SceneReadySignal onReady={onReady} />
       {perf && <PerfHud />}
     </>
   );
 }
 
-export default function StrategyCanvas({ progress, reduced = false, isMobile = false, active = true, stage = 0 }: Props) {
+export default function StrategyCanvas({ progress, reduced = false, isMobile = false, active = true, stage = 0, ready = false, onReady }: Props) {
   // Opt-in dev metrics overlay: append ?perf to the URL.
   const perf = typeof window !== "undefined" && new URLSearchParams(window.location.search).has("perf");
   return (
@@ -857,9 +903,9 @@ export default function StrategyCanvas({ progress, reduced = false, isMobile = f
       dpr={[1, isMobile ? 1 : 1.25]}
       camera={{ position: [0, 4, 8.2], fov: 50, near: 0.1, far: 120 }}
       gl={{ antialias: false, powerPreference: "high-performance", alpha: false }}
-      frameloop={active ? "always" : "never"}
+      frameloop={active || !ready ? "always" : "never"}
     >
-      <Scene progress={progress} reduced={reduced} isMobile={isMobile} stage={stage} active={active} perf={perf} />
+      <Scene progress={progress} reduced={reduced} isMobile={isMobile} stage={stage} active={active} perf={perf} onReady={onReady} />
     </Canvas>
   );
 }
diff --git a/src/components/strategy/StrategySection.tsx b/src/components/strategy/StrategySection.tsx
index 8a6b8ca..81b0f73 100644
--- a/src/components/strategy/StrategySection.tsx
+++ b/src/components/strategy/StrategySection.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import React, { useEffect, useRef, useState, useSyncExternalStore } from "react";
+import React, { useEffect, useRef, useState } from "react";
 import dynamic from "next/dynamic";
 import { motion, useMotionValue, useTransform, type MotionValue } from "framer-motion";
 import gsap from "gsap";
@@ -83,6 +83,8 @@ export default function StrategySection({ connected = false }: { connected?: boo
   const [pinState, setPinState] = useState<"before" | "pinned" | "after">("before");
   const [active, setActive] = useState(0);
   const [mountScene, setMountScene] = useState(false);
+  const [sceneReady, setSceneReady] = useState(false);
+  const [showLoader, setShowLoader] = useState(true);
   const [sceneActive, setSceneActive] = useState(false);
   const [isMobile, setIsMobile] = useState(false);
   const [reduced, setReduced] = useState(false);
@@ -161,8 +163,30 @@ export default function StrategySection({ connected = false }: { connected?: boo
       <div className="dm-st-sticky">
         <div className="dm-st-card">
           {mountScene && (
-            <div className="dm-st-canvas">
-              <StrategyCanvas progress={progressRef} reduced={reduced} isMobile={isMobile} active={sceneActive && pinState === "pinned"} stage={active} />
+            <div className={`dm-st-canvas${sceneReady ? " is-ready" : ""}`} aria-hidden={!sceneReady}>
+              <StrategyCanvas
+                progress={progressRef}
+                reduced={reduced}
+                isMobile={isMobile}
+                active={sceneActive && pinState === "pinned"}
+                stage={active}
+                ready={sceneReady}
+                onReady={() => setSceneReady(true)}
+              />
+            </div>
+          )}
+
+          {showLoader && (
+            <div
+              className={`dm-st-loader${sceneReady ? " is-hiding" : ""}`}
+              role="status"
+              aria-live="polite"
+              aria-label="Loading MileTruth Strategy Engine"
+              onTransitionEnd={(e) => {
+                if (e.propertyName === "opacity" && sceneReady) setShowLoader(false);
+              }}
+            >
+              <span className="dm-st-loader__ring" />
             </div>
           )}
 
@@ -170,7 +194,7 @@ export default function StrategySection({ connected = false }: { connected?: boo
               can never be seen during the approach ("before"), where the sticky sits
               at the top of the tall section near the previous workflow's seam. */}
           {pinState !== "before" && (
-          <div className="dm-st-ui">
+          <div className={`dm-st-ui${sceneReady ? " is-ready" : ""}`} aria-hidden={!sceneReady}>
             {/* Persistent header */}
             <motion.div className="dm-st-top" style={{ opacity: headerOpacity }}>
               <div className="dm-st-eyebrow"><span className="dm-st-dot" /> MileTruth Strategy Engine</div>
@@ -285,11 +309,28 @@ const styles = `
   }
 }
 
-.dm-st-canvas { position: absolute; inset: 0; z-index: 1; }
+.dm-st-canvas { position: absolute; inset: 0; z-index: 1; opacity: 0; visibility: hidden;
+  transition: opacity 0.42s cubic-bezier(0.22,1,0.36,1), visibility 0s linear 0.42s; }
+.dm-st-canvas.is-ready { opacity: 1; visibility: visible; transition-delay: 0s; }
 .dm-st-canvas canvas { display: block; }
 
 .dm-st-ui { position: absolute; inset: 0; z-index: 4; pointer-events: none;
-  font-family: var(--font-space-grotesk), var(--font-manrope), system-ui, sans-serif; color: #0f172a; }
+  font-family: var(--font-space-grotesk), var(--font-manrope), system-ui, sans-serif; color: #0f172a;
+  opacity: 0; visibility: hidden;
+  transition: opacity 0.42s cubic-bezier(0.22,1,0.36,1), visibility 0s linear 0.42s; }
+.dm-st-ui.is-ready { opacity: 1; visibility: visible; transition-delay: 0s; }
+
+.dm-st-loader { position: absolute; inset: 0; z-index: 6; display: grid; place-items: center;
+  background: transparent; opacity: 1; pointer-events: none;
+  animation: dmStLoaderFadeIn 0.2s ease both;
+  transition: opacity 0.3s ease; }
+.dm-st-loader.is-hiding { opacity: 0; pointer-events: none; }
+.dm-st-loader__ring { width: 18px; height: 18px; border-radius: 50%;
+  border: 2px solid rgba(255,255,255,0.48); border-top-color: #ffffff;
+  box-shadow: 0 8px 22px rgba(15,23,42,0.14);
+  animation: dm-hiw-spin 0.8s linear infinite; }
+@keyframes dmStLoaderFadeIn { from { opacity: 0; } to { opacity: 1; } }
+@keyframes dm-hiw-spin { to { transform: rotate(360deg); } }
 
 /* ---- Persistent header: title + 5-stage rail ---- */
 .dm-st-top { position: absolute; top: clamp(96px, 13vh, 128px); left: 0; right: 0; z-index: 5;