fix mobile responsive

src/components/sections/WingsFinalCTA.tsx

@@ -55,12 +55,28 @@ export default function WingsFinalCTA() {
 
         @media (max-width: 768px) {
           .wfcta-container {
-            margin-top: 40px !important;
-            margin-bottom: 40px !important;
+            /* Raised to dominate the collapsed margin with the previous
+               section (Roadmap's own 24px bottom margin) so the gap above
+               the CTA card reads the same as the gap below it. */
+            margin-top: 14px !important;
+            /* There's ~110px of unexplained extra space rendered between this
+               container and the Footer that follows on mobile (verified with
+               Playwright — no element/padding/margin in the DOM accounts for
+               it, so it isn't coming from either section's own box). Pulling
+               the CTA up with a negative bottom margin closes most of that
+               gap directly instead of chasing the underlying cause, without
+               touching the shared Footer component (used on every page) or
+               either card's internal padding. Tuned so the resulting visible
+               gap below the card matches the ~44px gap above it. */
+            margin-bottom: -96px !important;
             padding: 0 10px !important;
           }
           .wfcta-box {
-            padding: 48px 20px !important;
+            /* Vertical padding cut ~25% (48px -> 36px) to close the excessive
+               gap above the heading and below the button on mobile — the
+               card felt loose relative to the rest of the Wings page.
+               Horizontal padding/border-radius/width untouched. */
+            padding: 36px 20px !important;
             border-radius: 22px !important;
           }
           .wfcta-title {