refactor: improve spacing and typography in Pods CallToAction section

- Added leading-normal to description paragraphs for better readability
- Reduced top margin from mt-10 to mt-6 for benefits list and CTA cards
- Changed benefits grid gap from gap-y-3 to gap-y-1 lg:gap-y-3 for tighter mobile spacing
- Reduced horizontal gap between CTA cards from gap-x-10 to gap-x-8

src/pages/pods/CallToAction.tsx

@@ -52,15 +52,15 @@ export function CallToAction() {
 
             </h2>
 
-            <p className="mt-6 text-lg text-gray-300">
+            <p className="mt-6 text-lg leading-normal text-gray-300">
               The first Pods are launching soon.
               10,000 early Pods will be available for early adopters.
             </p>
 
-            <div className="mt-10 flex items-center justify-center">
+            <div className="mt-6 flex items-center justify-center">
               <ul
                 role="list"
-                className="grid grid-cols-1 gap-x-8 gap-y-3 text-left text-base/7 text-gray-200 sm:grid-cols-2"
+                className="grid grid-cols-1 gap-x-8 gap-y-1 lg:gap-y-3 text-left text-base/7 text-gray-200 sm:grid-cols-2"
               >
                 {benefits.map((benefit) => (
                   <li key={benefit} className="flex items-start gap-x-3">
@@ -74,14 +74,14 @@ export function CallToAction() {
               </ul>
             </div>
 
-            <p className="mt-6 text-lg text-gray-300">
+            <p className="mt-6 text-lg leading-normal text-gray-300">
               Next, Pods will support peer-to-peer AI Agents that live inside your environment.
               Your own AI, powered by your data without any data leaks. Be among the first to claim
               your private space on the Mycelium Network.
             </p>
 
             {/* ✅ Two cards, stacked center with spacing */}
-            <div className="mt-10 flex flex-wrap justify-center gap-x-10 gap-y-8">
+            <div className="mt-6 flex flex-wrap justify-center gap-x-8 gap-y-8">
               <div className="flex flex-col items-center text-center max-w-xs">
                 <Button to="#" variant="solid" color="cyan" className="mt-4">
                   Join the Waitlist

src/pages/pods/Homepod.tsx

@@ -9,8 +9,7 @@ export default function Homepod() {
     <div className="">
       {/* Boxed container */}
       <div
-        className="relative mx-auto max-w-7xl border border-t-0 border-b-0 border-gray-100 bg-white overflow-hidden bg-contain bg-right bg-no-repeat"
-        style={{ backgroundImage: "url('/images/computehero11.webp')", backgroundSize: "contain" }}
+        className="relative mx-auto max-w-7xl border border-t-0 border-b-0 border-gray-100 bg-white overflow-hidden md:bg-[url('/images/computehero11.webp')] md:bg-contain md:bg-right md:bg-no-repeat"
       >
         {/* Inner padding */}
         <div className="px-6 py-16 lg:py-24">

src/pages/pods/PodsBento.tsx

@@ -108,7 +108,7 @@ export function PodsBento() {
                     </div>
                   </div>
                 ) : (
-                  <div className="h-48 w-full flex items-center justify-center bg-transparent" />
+                  <div className="hidden md:flex md:h-48 w-full items-center justify-center bg-transparent" />
                 )}
 
                 {/* TEXT AREA */}

src/pages/pods/PodsCapabilities.tsx

@@ -20,7 +20,7 @@ export function PodsCapabilities() {
         
         {/* ✅ LEFT SIDE — Title + Intro */}
         <div className="max-w-xl ">
-          <Eyebrow>What You Can Do</Eyebrow>
+          <Eyebrow className="text-cyan-500 tracking-[0.16em]">What You Can Do</Eyebrow>
 
           <H3  className="mt-6 text-white">
             Pods Features