diff --git a/src/app/page.tsx b/src/app/page.tsx
index 44e69e5..6a04658 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -10,7 +10,9 @@ import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaA
 import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
 import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
 import ContactSplit from '@/components/sections/contact/ContactSplit';
+import TimelineProcessFlow from '@/components/cardStack/layouts/timelines/TimelineProcessFlow';
 import FooterBase from '@/components/sections/footer/FooterBase';
+import { MapPin, Clock, Users } from 'lucide-react';
 
 export default function LandingPage() {
   return (
@@ -32,7 +34,7 @@ export default function LandingPage() {
             { name: "Menu", id: "fan-favorites" },
             { name: "Experience", id: "experience" },
             { name: "Catering", id: "catering" },
-            { name: "Locations", id: "contact" },
+            { name: "Locations", id: "locations" },
             { name: "Order Online", id: "https://order.sugarfiresmokehouse.com" }
           ]}
           brandName="Sugarfire"
@@ -160,7 +162,189 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="contact" data-section="contact">
+      <div id="locations" data-section="locations">
+        <TimelineProcessFlow
+          title="Visit Sugarfire"
+          description="Three legendary smokehouse locations serving St. Louis with authentic BBQ and unforgettable dining experiences."
+          tag="Locations & Hours"
+          textboxLayout="default"
+          animationType="slide-up"
+          items={[
+            {
+              id: "downtown",              reverse: false,
+              media: (
+                <div className="w-full h-full bg-gradient-to-br from-amber-900 via-yellow-800 to-orange-700 flex items-center justify-center rounded-theme-capped">
+                  <div className="text-white text-center">
+                    <MapPin className="w-16 h-16 mx-auto mb-4" />
+                    <p className="text-lg font-semibold">Downtown St. Louis</p>
+                  </div>
+                </div>
+              ),
+              content: (
+                <div className="space-y-4">
+                  <div>
+                    <h3 className="text-2xl font-semibold mb-2">Downtown Location</h3>
+                    <p className="text-base opacity-85 mb-2">123 BBQ Lane, St. Louis, MO 63101</p>
+                    <p className="text-sm opacity-75">(314) 555-0101</p>
+                  </div>
+                  <div className="flex items-start gap-3">
+                    <Clock className="w-5 h-5 flex-shrink-0 mt-1" />
+                    <div>
+                      <p className="font-medium">Hours</p>
+                      <p className="text-sm opacity-85">Mon-Thu: 10:30am - 10pm</p>
+                      <p className="text-sm opacity-85">Fri-Sat: 10:30am - 11pm</p>
+                      <p className="text-sm opacity-85">Sun: 11am - 9pm</p>
+                    </div>
+                  </div>
+                  <p className="text-sm opacity-75 italic">Features our full menu, dining area, and catering counter</p>
+                </div>
+              )
+            },
+            {
+              id: "south",              reverse: true,
+              media: (
+                <div className="w-full h-full bg-gradient-to-br from-amber-900 via-yellow-800 to-orange-700 flex items-center justify-center rounded-theme-capped">
+                  <div className="text-white text-center">
+                    <MapPin className="w-16 h-16 mx-auto mb-4" />
+                    <p className="text-lg font-semibold">South City</p>
+                  </div>
+                </div>
+              ),
+              content: (
+                <div className="space-y-4">
+                  <div>
+                    <h3 className="text-2xl font-semibold mb-2">South City Location</h3>
+                    <p className="text-base opacity-85 mb-2">456 Smokehouse Ave, St. Louis, MO 63118</p>
+                    <p className="text-sm opacity-75">(314) 555-0202</p>
+                  </div>
+                  <div className="flex items-start gap-3">
+                    <Clock className="w-5 h-5 flex-shrink-0 mt-1" />
+                    <div>
+                      <p className="font-medium">Hours</p>
+                      <p className="text-sm opacity-85">Mon-Fri: 11am - 10pm</p>
+                      <p className="text-sm opacity-85">Sat: 10am - 11pm</p>
+                      <p className="text-sm opacity-85">Sun: 11am - 8:30pm</p>
+                    </div>
+                  </div>
+                  <p className="text-sm opacity-75 italic">Casual dine-in, takeout, and delivery available</p>
+                </div>
+              )
+            },
+            {
+              id: "westport",              reverse: false,
+              media: (
+                <div className="w-full h-full bg-gradient-to-br from-amber-900 via-yellow-800 to-orange-700 flex items-center justify-center rounded-theme-capped">
+                  <div className="text-white text-center">
+                    <MapPin className="w-16 h-16 mx-auto mb-4" />
+                    <p className="text-lg font-semibold">Westport Road</p>
+                  </div>
+                </div>
+              ),
+              content: (
+                <div className="space-y-4">
+                  <div>
+                    <h3 className="text-2xl font-semibold mb-2">Westport Road Location</h3>
+                    <p className="text-base opacity-85 mb-2">789 Ribs & Rolls Pkwy, St. Louis, MO 63132</p>
+                    <p className="text-sm opacity-75">(314) 555-0303</p>
+                  </div>
+                  <div className="flex items-start gap-3">
+                    <Clock className="w-5 h-5 flex-shrink-0 mt-1" />
+                    <div>
+                      <p className="font-medium">Hours</p>
+                      <p className="text-sm opacity-85">Mon-Sun: 11am - 9:30pm</p>
+                      <p className="text-sm opacity-75">Extended hours during football season</p>
+                    </div>
+                  </div>
+                  <p className="text-sm opacity-75 italic">Large patio, perfect for groups and game day</p>
+                </div>
+              )
+            }
+          ]}
+        />
+      </div>
+
+      <div id="community" data-section="community">
+        <TimelineProcessFlow
+          title="Join the Sugarfire Community"
+          description="Connect with fellow BBQ lovers, stay updated on special events, and be part of our smokehouse family."
+          tag="Community Connection"
+          textboxLayout="default"
+          animationType="slide-up"
+          items={[
+            {
+              id: "smokeclub",              reverse: false,
+              media: (
+                <div className="w-full h-full bg-gradient-to-br from-red-900 via-orange-800 to-yellow-700 flex items-center justify-center rounded-theme-capped">
+                  <div className="text-white text-center">
+                    <Users className="w-16 h-16 mx-auto mb-4" />
+                    <p className="text-lg font-semibold">Smokehouse Club</p>
+                  </div>
+                </div>
+              ),
+              content: (
+                <div className="space-y-3">
+                  <h3 className="text-2xl font-semibold">Join the Smokehouse Club</h3>
+                  <p className="opacity-85">Exclusive member benefits including special discounts, early access to new menu items, and birthday desserts.</p>
+                  <ul className="space-y-2 text-sm opacity-85">
+                    <li className="flex gap-2"><span>✓</span> <span>Birthday surprise dessert</span></li>
+                    <li className="flex gap-2"><span>✓</span> <span>15% member discount</span></li>
+                    <li className="flex gap-2"><span>✓</span> <span>Weekly specials via email</span></li>
+                    <li className="flex gap-2"><span>✓</span> <span>Early catering booking priority</span></li>
+                  </ul>
+                </div>
+              )
+            },
+            {
+              id: "events",              reverse: true,
+              media: (
+                <div className="w-full h-full bg-gradient-to-br from-purple-900 via-red-800 to-orange-700 flex items-center justify-center rounded-theme-capped">
+                  <div className="text-white text-center">
+                    <Clock className="w-16 h-16 mx-auto mb-4" />
+                    <p className="text-lg font-semibold">Monthly Events</p>
+                  </div>
+                </div>
+              ),
+              content: (
+                <div className="space-y-3">
+                  <h3 className="text-2xl font-semibold">Monthly BBQ Events</h3>
+                  <p className="opacity-85">Join us for special themed nights, live music, and BBQ competitions celebrating the art of smokehouse cooking.</p>
+                  <ul className="space-y-2 text-sm opacity-85">
+                    <li className="flex gap-2"><span>🎵</span> <span>Live local music every Friday night</span></li>
+                    <li className="flex gap-2"><span>🏆</span> <span>Quarterly rib-eating contests</span></li>
+                    <li className="flex gap-2"><span>👨‍🍳</span> <span>Master pitmaster Q&A sessions</span></li>
+                    <li className="flex gap-2"><span>🎉</span> <span>Seasonal celebration specials</span></li>
+                  </ul>
+                </div>
+              )
+            },
+            {
+              id: "social",              reverse: false,
+              media: (
+                <div className="w-full h-full bg-gradient-to-br from-blue-900 via-red-800 to-orange-700 flex items-center justify-center rounded-theme-capped">
+                  <div className="text-white text-center">
+                    <Users className="w-16 h-16 mx-auto mb-4" />
+                    <p className="text-lg font-semibold">Follow & Share</p>
+                  </div>
+                </div>
+              ),
+              content: (
+                <div className="space-y-3">
+                  <h3 className="text-2xl font-semibold">Connect on Social Media</h3>
+                  <p className="opacity-85">Follow @SugerfireSmokeHouse for daily BBQ inspiration, behind-the-scenes smokehouse action, and community stories.</p>
+                  <ul className="space-y-2 text-sm opacity-85">
+                    <li className="flex gap-2"><span>📸</span> <span>Instagram: Daily smoke shots and customer features</span></li>
+                    <li className="flex gap-2"><span>👍</span> <span>Facebook: Events, deals, and community updates</span></li>
+                    <li className="flex gap-2"><span>🐦</span> <span>Twitter: Quick tips, specials, and BBQ talk</span></li>
+                    <li className="flex gap-2"><span>💬</span> <span>Tag us and get featured!</span></li>
+                  </ul>
+                </div>
+              )
+            }
+          ]}
+        />
+      </div>
+
+      <div id="newsletter" data-section="newsletter">
         <ContactSplit
           tag="Newsletter"
           title="Join the Smokehouse Club"
@@ -194,16 +378,16 @@ export default function LandingPage() {
               title: "Company",              items: [
                 { label: "About Us", href: "#experience" },
                 { label: "Catering", href: "#catering" },
-                { label: "Locations", href: "#" },
-                { label: "Careers", href: "#" }
+                { label: "Locations", href: "#locations" },
+                { label: "Events", href: "#community" }
               ]
             },
             {
               title: "Connect",              items: [
                 { label: "Instagram", href: "https://instagram.com" },
                 { label: "Facebook", href: "https://facebook.com" },
-                { label: "Contact", href: "#contact" },
-                { label: "Newsletter", href: "#contact" }
+                { label: "Newsletter", href: "#newsletter" },
+                { label: "Smokehouse Club", href: "#community" }
               ]
             }
           ]}