fix: Improve homepage heading spacing, title case, footer layout

app/about-us/page.tsx

@@ -280,8 +280,9 @@ export default function AboutPage() {
                 whileInView={{ opacity: 1, y: 0 }}
                 viewport={{ once: true }}
                 transition={{ duration: 0.5, delay: idx * 0.1 }}
+                className="h-full"
               >
-                <div className="p-8 rounded-2xl bg-surface-elevated border border-border hover:border-accent/30 transition-colors">
+                <div className="h-full p-8 rounded-2xl bg-surface-elevated border border-border hover:border-accent/30 transition-colors">
                   <div className="w-12 h-12 rounded-xl bg-accent/10 border border-accent/20 flex items-center justify-center text-accent-light mb-5">
                     {value.icon}
                   </div>
@@ -313,7 +314,7 @@ export default function AboutPage() {
             <p className="text-xs sm:text-sm font-semibold tracking-widest text-accent-light uppercase mb-4">
               Leadership
             </p>
-            <h2 className="text-2xl sm:text-3xl md:text-4xl font-bold text-text-primary mb-4">
+            <h2 className="text-2xl sm:text-3xl md:text-4xl font-bold text-text-primary mb-6">
               Choosing a mentor is more important than choosing a company
             </h2>
             <p className="text-text-secondary max-w-2xl mx-auto">
@@ -464,7 +465,7 @@ export default function AboutPage() {
             <p className="text-xs sm:text-sm font-semibold tracking-widest text-accent-light uppercase mb-4">
               Why Procedure
             </p>
-            <h2 className="text-2xl sm:text-3xl md:text-4xl font-bold text-text-primary mb-4">
+            <h2 className="text-2xl sm:text-3xl md:text-4xl font-bold text-text-primary mb-6">
               The numbers speak for themselves
             </h2>
             <p className="text-text-secondary max-w-2xl mx-auto">
@@ -521,7 +522,7 @@ export default function AboutPage() {
             <p className="text-xs sm:text-sm font-semibold tracking-widest text-accent-light uppercase mb-4">
               Trust & Compliance
             </p>
-            <h2 className="text-2xl sm:text-3xl md:text-4xl font-bold text-text-primary mb-8">
+            <h2 className="text-2xl sm:text-3xl md:text-4xl font-bold text-text-primary mb-16">
               Enterprise-grade security you can trust
             </h2>
 

app/ai-safety/page.tsx

@@ -764,7 +764,7 @@ export default function AISafetyPage() {
             <p className="text-xs sm:text-sm font-semibold tracking-widest text-accent-light uppercase mb-4">
               Our Principles
             </p>
-            <h2 className="text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold text-text-primary mb-4 tracking-tight">
+            <h2 className="text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold text-text-primary mb-6 tracking-tight">
               Six Pillars of{" "}
               <span className="text-highlight">Responsible AI.</span>
             </h2>
@@ -812,7 +812,7 @@ export default function AISafetyPage() {
             <p className="text-xs sm:text-sm font-semibold tracking-widest text-accent-light uppercase mb-4">
               How We Operationalize Safety
             </p>
-            <h2 className="text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold text-text-primary mb-4 tracking-tight">
+            <h2 className="text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold text-text-primary mb-6 tracking-tight">
               Safety Integrated at{" "}
               <span className="text-highlight">Every Stage.</span>
             </h2>
@@ -851,7 +851,7 @@ export default function AISafetyPage() {
             <p className="text-xs sm:text-sm font-semibold tracking-widest text-accent-light uppercase mb-4">
               Frameworks & Standards
             </p>
-            <h2 className="text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold text-text-primary mb-4 tracking-tight">
+            <h2 className="text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold text-text-primary mb-6 tracking-tight">
               Built on{" "}
               <span className="text-highlight">Industry Standards.</span>
             </h2>
@@ -988,7 +988,7 @@ export default function AISafetyPage() {
             <p className="text-xs sm:text-sm font-semibold tracking-widest text-accent-light uppercase mb-4">
               Industry-Specific Safety
             </p>
-            <h2 className="text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold text-text-primary mb-4 tracking-tight">
+            <h2 className="text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold text-text-primary mb-6 tracking-tight">
               Tailored for <span className="text-highlight">Your Domain.</span>
             </h2>
             <p className="text-text-secondary max-w-2xl mx-auto text-base sm:text-lg">

app/ai-upskill/page.tsx

@@ -70,7 +70,7 @@ const faqs = [
   {
     question: "When does the next cohort start?",
     answer:
-      "Watch for announcements in Slack. Our target launch is Q2 2025 (July). We'll share exact dates and registration details as they're finalized.",
+      "Watch for announcements in Slack. Our target launch is Q2 2026 (July). We'll share exact dates and registration details as they're finalized.",
   },
   {
     question: "Do I need to know how to code?",
@@ -860,7 +860,7 @@ export default function AIUpskillPage() {
               href="/contact-us"
               className="inline-flex items-center justify-center gap-2 px-8 py-4 bg-cta text-cta-text font-semibold rounded-xl hover:brightness-110 transition-all"
             >
-              Contact Us
+              Bring AI Upskill to Your Team
               <svg
                 className="w-5 h-5"
                 fill="none"
@@ -950,112 +950,6 @@ export default function AIUpskillPage() {
         </div>
       </section>
 
-      {/* Final CTA Section */}
-      <section className="relative py-20 sm:py-24 bg-base overflow-hidden">
-        <div className="absolute inset-0">
-          <div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-accent/5 rounded-full blur-[150px]" />
-        </div>
-
-        <div className="relative z-10 max-w-4xl mx-auto px-4 sm:px-6 text-center">
-          <motion.div
-            initial={{ opacity: 0, y: 30 }}
-            whileInView={{ opacity: 1, y: 0 }}
-            viewport={{ once: true }}
-          >
-            <h2 className="text-3xl sm:text-4xl lg:text-5xl font-bold text-text-primary mb-6">
-              The future is AI-driven.
-              <br />
-              <span className="text-highlight">
-                Build the skills to lead it.
-              </span>
-            </h2>
-            <p className="text-lg text-text-secondary mb-10 max-w-2xl mx-auto">
-              Join Procedure&apos;s AI Upskill bootcamp and transform from a
-              developer into an AI engineer. Real projects. Real skills. Real
-              impact.
-            </p>
-            <div className="flex flex-col sm:flex-row gap-4 justify-center">
-              <a
-                href="#application"
-                className="inline-flex items-center justify-center gap-2 px-8 py-4 bg-cta text-cta-text font-semibold rounded-xl hover:brightness-110 transition-all"
-              >
-                Apply to Join
-                <svg
-                  className="w-5 h-5"
-                  fill="none"
-                  viewBox="0 0 24 24"
-                  stroke="currentColor"
-                  strokeWidth={2}
-                >
-                  <path
-                    strokeLinecap="round"
-                    strokeLinejoin="round"
-                    d="M13 7l5 5m0 0l-5 5m5-5H6"
-                  />
-                </svg>
-              </a>
-              <Link
-                href="/contact-us"
-                className="inline-flex items-center justify-center gap-2 px-8 py-4 bg-surface-elevated border border-border text-text-primary font-semibold rounded-xl hover:border-accent/30 transition-all"
-              >
-                Have Questions?
-              </Link>
-            </div>
-
-            {/* Social links */}
-            <div className="mt-12 flex items-center justify-center gap-4">
-              <span className="text-text-muted text-sm">Find us online:</span>
-              <div className="flex gap-3">
-                <a
-                  href="https://in.linkedin.com/company/procedurehq"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="w-10 h-10 rounded-full bg-surface-elevated border border-border flex items-center justify-center text-text-muted hover:text-accent-light hover:border-accent/30 transition-colors"
-                  aria-label="LinkedIn"
-                >
-                  <svg
-                    className="w-5 h-5"
-                    fill="currentColor"
-                    viewBox="0 0 24 24"
-                  >
-                    <path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z" />
-                  </svg>
-                </a>
-                <a
-                  href="https://twitter.com/procedure_tech"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="w-10 h-10 rounded-full bg-surface-elevated border border-border flex items-center justify-center text-text-muted hover:text-accent-light hover:border-accent/30 transition-colors"
-                  aria-label="Twitter"
-                >
-                  <svg
-                    className="w-5 h-5"
-                    fill="currentColor"
-                    viewBox="0 0 24 24"
-                  >
-                    <path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                  </svg>
-                </a>
-                <a
-                  href="https://www.instagram.com/procedure.tech"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="w-10 h-10 rounded-full bg-surface-elevated border border-border flex items-center justify-center text-text-muted hover:text-accent-light hover:border-accent/30 transition-colors"
-                  aria-label="Instagram"
-                >
-                  <svg
-                    className="w-5 h-5"
-                    fill="currentColor"
-                    viewBox="0 0 24 24"
-                  >
-                    <path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zM12 0C8.741 0 8.333.014 7.053.072 2.695.272.273 2.69.073 7.052.014 8.333 0 8.741 0 12c0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98C8.333 23.986 8.741 24 12 24c3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98C15.668.014 15.259 0 12 0zm0 5.838a6.162 6.162 0 100 12.324 6.162 6.162 0 000-12.324zM12 16a4 4 0 110-8 4 4 0 010 8zm6.406-11.845a1.44 1.44 0 100 2.881 1.44 1.44 0 000-2.881z" />
-                  </svg>
-                </a>
-              </div>
-            </div>
-          </motion.div>
-        </div>
-      </section>
     </main>
   );
 }

app/approach/page.tsx

@@ -683,30 +683,6 @@ export default function ApproachPage() {
               </Link>
             </motion.div>
 
-            {/* Stats row */}
-            <motion.div
-              initial={{ opacity: 0, y: 20 }}
-              animate={{ opacity: 1, y: 0 }}
-              transition={{ duration: 0.6, delay: 0.4 }}
-              className="grid grid-cols-2 md:grid-cols-4 gap-4 sm:gap-6 max-w-3xl mx-auto"
-            >
-              {outcomes.map((outcome, idx) => (
-                <div
-                  key={idx}
-                  className="p-4 rounded-xl bg-surface-elevated/60 border border-border"
-                >
-                  <div className="flex items-baseline gap-1 justify-center mb-1">
-                    <span className="text-2xl sm:text-3xl font-bold text-highlight">
-                      {outcome.stat}
-                    </span>
-                    <span className="text-sm font-bold text-accent-light">
-                      {outcome.unit}
-                    </span>
-                  </div>
-                  <p className="text-xs text-text-muted">{outcome.label}</p>
-                </div>
-              ))}
-            </motion.div>
           </div>
         </motion.div>
 
@@ -798,7 +774,7 @@ export default function ApproachPage() {
             <p className="text-xs sm:text-sm font-semibold tracking-widest text-accent-light uppercase mb-4">
               How We Work
             </p>
-            <h2 className="text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold text-text-primary mb-4 tracking-tight">
+            <h2 className="text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold text-text-primary mb-6 tracking-tight">
               From First Conversation{" "}
               <span className="text-highlight">to Production.</span>
             </h2>
@@ -863,15 +839,16 @@ export default function ApproachPage() {
           </div>
 
           {/* Phase Cards Grid */}
-          <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
+          <div className="flex flex-wrap justify-center gap-6">
             {processPhases.map((phase, idx) => (
-              <ProcessPhaseCard
-                key={phase.id}
-                phase={phase}
-                index={idx}
-                isActive={activePhase === idx}
-                onClick={() => setActivePhase(idx)}
-              />
+              <div key={phase.id} className="w-full md:w-[calc(50%-0.75rem)] lg:w-[calc(33.333%-1rem)]">
+                <ProcessPhaseCard
+                  phase={phase}
+                  index={idx}
+                  isActive={activePhase === idx}
+                  onClick={() => setActivePhase(idx)}
+                />
+              </div>
             ))}
           </div>
         </div>
@@ -905,7 +882,7 @@ export default function ApproachPage() {
             <p className="text-xs sm:text-sm font-semibold tracking-widest text-accent-light uppercase mb-4">
               What Makes Us Different
             </p>
-            <h2 className="text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold text-text-primary mb-4 tracking-tight">
+            <h2 className="text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold text-text-primary mb-6 tracking-tight">
               Not Your Typical <span className="text-highlight">Dev Shop.</span>
             </h2>
             <p className="text-text-secondary max-w-2xl mx-auto text-base sm:text-lg">
@@ -947,7 +924,7 @@ export default function ApproachPage() {
             <p className="text-xs sm:text-sm font-semibold tracking-widest text-accent-light uppercase mb-4">
               Our Principles
             </p>
-            <h2 className="text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold text-text-primary mb-4 tracking-tight">
+            <h2 className="text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold text-text-primary mb-6 tracking-tight">
               The beliefs that{" "}
               <span className="text-highlight">guide our work.</span>
             </h2>
@@ -994,7 +971,7 @@ export default function ApproachPage() {
             <p className="text-xs sm:text-sm font-semibold tracking-widest text-accent-light uppercase mb-4">
               What You Can Expect
             </p>
-            <h2 className="text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold text-text-primary mb-4 tracking-tight">
+            <h2 className="text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold text-text-primary mb-6 tracking-tight">
               Outcomes, <span className="text-highlight">Not Outputs.</span>
             </h2>
             <p className="text-text-secondary max-w-2xl mx-auto text-base sm:text-lg">

app/blogs/[slug]/page.tsx

@@ -775,7 +775,7 @@ export default async function BlogPostPage({ params }: BlogPostPageProps) {
       )}
 
       {/* CTA Section */}
-      <BlogCTA />
+      <BlogCTA categorySlug={post.category.slug} />
     </main>
   );
 }

app/careers/page.tsx

@@ -211,7 +211,7 @@ export default function CareersPage() {
             <p className="text-xs sm:text-sm font-semibold tracking-widest text-accent-light uppercase mb-4">
               Why Join Procedure
             </p>
-            <h2 className="text-2xl sm:text-3xl md:text-4xl font-bold text-text-primary mb-4">
+            <h2 className="text-2xl sm:text-3xl md:text-4xl font-bold text-text-primary mb-6">
               Benefits Designed for Senior AI Engineers
             </h2>
             <p className="text-text-secondary max-w-2xl mx-auto">
@@ -275,7 +275,7 @@ export default function CareersPage() {
             <p className="text-xs sm:text-sm font-semibold tracking-widest text-accent-light uppercase mb-4">
               Our Engineering Culture
             </p>
-            <h2 className="text-2xl sm:text-3xl md:text-4xl font-bold text-text-primary mb-4">
+            <h2 className="text-2xl sm:text-3xl md:text-4xl font-bold text-text-primary mb-6">
               The Values That Drive Our Work
             </h2>
             <p className="text-text-secondary max-w-2xl mx-auto">
@@ -346,7 +346,7 @@ export default function CareersPage() {
             <p className="text-xs sm:text-sm font-semibold tracking-widest text-accent-light uppercase mb-4">
               Current Openings
             </p>
-            <h2 className="text-2xl sm:text-3xl md:text-4xl font-bold text-text-primary mb-4">
+            <h2 className="text-2xl sm:text-3xl md:text-4xl font-bold text-text-primary mb-6">
               Remote AI and Engineering Positions
             </h2>
             <p className="text-text-secondary max-w-2xl mx-auto">

app/contact-us/page.tsx

@@ -565,7 +565,7 @@ export default function ContactPage() {
             transition={{ duration: 0.6 }}
             className="text-center mb-12"
           >
-            <h2 className="text-2xl sm:text-3xl font-bold text-text-primary mb-4">
+            <h2 className="text-2xl sm:text-3xl font-bold text-text-primary mb-6">
               Global presence, local expertise
             </h2>
             <p className="text-text-secondary max-w-2xl mx-auto">
@@ -646,7 +646,7 @@ export default function ContactPage() {
             transition={{ duration: 0.6 }}
             className="text-center mb-12"
           >
-            <h2 className="text-2xl sm:text-3xl font-bold text-text-primary mb-4">
+            <h2 className="text-2xl sm:text-3xl font-bold text-text-primary mb-6">
               Frequently asked questions
             </h2>
             <p className="text-text-secondary">