diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 7f977d9..7130757 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -18,7 +18,7 @@ import "../styles/global.css";
         <meta name="viewport" content="width=device-width" />
         <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
         <link
-            href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap"
+            href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap"
             rel="stylesheet"
         />
         <meta name="generator" content={Astro.generator} />
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 16da874..b9504b5 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -9,412 +9,204 @@ import {
     Star,
     MapPin,
     Trees,
-    Menu,
-    X,
     Ruler,
-    Mail,
-    Zap,
     Headset,
     Coins,
     ArrowDown,
-    Search,
-    SlidersHorizontal,
-    MoreHorizontal,
-    Wind,
     LayoutGrid,
     Box,
 } from "lucide-react";
 
-// Color Palette Replacements:
-// #ccf32f (Neon Lime) -> #8FBC8F (Dark Sea Green / Sage) or #A8C69F
-// black -> #1c1917 (Stone 900)
-// neutral-50 -> stone-50
+// Branding Colors (Refined for Eden Style):
+// Primary Dark: #1c1917 (Stone 950)
+// Accent Green: #3A4D39 (Deep Forest)
+// Soft Sage: #739072 (Muted Green)
+// Cream/Beige: #ECE3CE
+// Background: #FAF9F6 (Stone 50)
 ---
 
 <Layout title="Summit Painting & Handyman Services | Colorado Springs">
     <!-- Navigation -->
     <nav
-        class="sticky top-0 z-50 w-full bg-white/80 backdrop-blur-md border-b border-stone-100"
+        class="sticky top-0 z-50 w-full bg-[#FAF9F6]/80 backdrop-blur-md border-b border-stone-100"
     >
         <div
             class="max-w-7xl mx-auto px-6 py-4 flex items-center justify-between"
         >
-            <div class="flex items-center gap-2">
-                <div class="w-4 h-4 rounded-full bg-[#739072]"></div>
-                <span class="text-lg font-medium tracking-tight"
+            <div class="flex items-center gap-3">
+                <div
+                    class="w-8 h-8 rounded-full bg-[#3A4D39] flex items-center justify-center text-white"
+                >
+                    <span class="font-serif font-bold text-lg">S</span>
+                </div>
+                <span
+                    class="text-xl font-serif font-medium tracking-tight text-[#1c1917]"
                     >Summit Painting</span
                 >
             </div>
 
             <div
-                class="hidden md:flex items-center gap-8 text-base font-medium text-stone-500"
+                class="hidden md:flex items-center gap-8 text-sm font-medium text-stone-600"
             >
-                <a href="#services" class="hover:text-black transition-colors"
-                    >Services</a
+                <a
+                    href="#services"
+                    class="hover:text-[#3A4D39] transition-colors">Services</a
                 >
-                <a href="#process" class="hover:text-black transition-colors"
+                <a href="#why-us" class="hover:text-[#3A4D39] transition-colors"
                     >Why Us</a
                 >
-                <a href="#areas" class="hover:text-black transition-colors"
+                <a href="#areas" class="hover:text-[#3A4D39] transition-colors"
                     >Areas</a
                 >
-                <a href="#contact" class="hover:text-black transition-colors"
-                    >Contact</a
+                <a
+                    href="#contact"
+                    class="hover:text-[#3A4D39] transition-colors">Contact</a
                 >
             </div>
 
             <div class="flex items-center gap-4">
                 <a
                     href="tel:7195550123"
-                    class="hidden sm:block text-base font-medium hover:text-stone-600 transition-colors"
+                    class="hidden sm:block text-sm font-medium text-stone-600 hover:text-[#3A4D39] transition-colors"
                     >(719) 555-0123</a
                 >
                 <a
                     href="#contact"
-                    class="bg-[#1c1917] text-white text-sm font-medium px-5 py-2.5 rounded-full hover:bg-stone-800 transition-colors flex items-center gap-2"
+                    class="bg-[#1c1917] text-white text-sm font-medium px-6 py-2.5 rounded-full hover:bg-stone-800 transition-colors flex items-center gap-2"
                 >
-                    <Paintbrush size={16} />
                     <span>Free Estimate</span>
+                    <ArrowRight size={16} />
                 </a>
             </div>
         </div>
     </nav>
 
-    <main class="w-full overflow-hidden">
+    <main class="w-full overflow-hidden bg-[#FAF9F6]">
         <!-- Hero Section -->
-        <div class="max-w-7xl mx-auto px-4 sm:px-6 mt-4">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 mt-6">
             <div
-                class="relative bg-[#739072] rounded-[2.5rem] p-8 md:p-16 overflow-hidden min-h-[600px] md:min-h-[700px] flex flex-col md:block"
+                class="relative bg-[#3A4D39] rounded-[3rem] p-8 md:p-16 overflow-hidden min-h-[600px] flex flex-col items-center justify-center text-center"
             >
-                <!-- Hero Content -->
-                <div class="relative z-10 max-w-xl mt-8 md:mt-16">
-                    <h1
-                        class="text-5xl md:text-7xl font-medium tracking-tight leading-[1.1] mb-6 text-white"
-                    >
-                        Quality <br />
-                        for Your Home
-                        <span class="inline-block relative top-[-20px]">
-                            <!-- Star/Sparkle Icon replacement -->
-                            <svg
-                                width="40"
-                                height="40"
-                                viewBox="0 0 24 24"
-                                fill="none"
-                                stroke="currentColor"
-                                stroke-width="2"
-                                stroke-linecap="round"
-                                stroke-linejoin="round"
-                                class="text-white/80"
-                                ><path
-                                    d="M12 2L15.09 8.26L22 9.27L17 14.14L18.18 21.02L12 17.77L5.82 21.02L7 14.14L2 9.27L8.91 8.26L12 2Z"
-                                ></path></svg
-                            >
-                        </span>
-                    </h1>
-                    <p
-                        class="text-xl md:text-2xl font-normal text-white/90 mb-10 max-w-md leading-relaxed"
-                    >
-                        Exterior painting, wood repair, and handyman services.
-                        Honest craftsmanship for Colorado Springs.
-                    </p>
+                <!-- Background Decoration (Simplified Geometric) -->
+                <div
+                    class="absolute top-0 left-0 w-full h-full overflow-hidden pointer-events-none"
+                >
+                    <!-- Circle Top Left -->
                     <div
-                        class="flex flex-col sm:flex-row items-start sm:items-center gap-6"
+                        class="absolute -top-20 -left-20 w-80 h-80 rounded-full border-[20px] border-[#739072] opacity-20"
+                    >
+                    </div>
+                    <!-- Pill Bottom Right -->
+                    <div
+                        class="absolute bottom-20 right-0 w-64 h-32 bg-[#ECE3CE] rounded-l-full opacity-10"
+                    >
+                    </div>
+                    <!-- Small Dot -->
+                    <div
+                        class="absolute top-40 right-40 w-8 h-8 bg-[#ECE3CE] rounded-full opacity-40"
+                    >
+                    </div>
+                </div>
+
+                <div class="relative z-10 max-w-3xl mx-auto mt-8">
+                    <div
+                        class="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-white/10 backdrop-blur-sm border border-white/20 text-white/90 text-sm font-medium mb-6"
+                    >
+                        <Star size={14} class="text-[#ECE3CE]" fill="#ECE3CE" />
+                        <span>Colorado Springs' Trusted Painter</span>
+                    </div>
+
+                    <h1
+                        class="text-5xl md:text-7xl lg:text-8xl font-serif font-normal tracking-tight leading-[1.1] mb-8 text-white"
+                    >
+                        Craftsmanship <br /> For Your Home
+                    </h1>
+
+                    <p
+                        class="text-xl text-stone-200 mb-10 max-w-lg mx-auto leading-relaxed font-light"
+                    >
+                        Elevate your living space with professional painting,
+                        wood restoration, and handyman services.
+                    </p>
+
+                    <div
+                        class="flex flex-col sm:flex-row items-center justify-center gap-4"
                     >
                         <a
                             href="#contact"
-                            class="bg-[#1c1917] text-white text-base font-medium px-7 py-3.5 rounded-full hover:bg-stone-800 transition-transform hover:scale-105 flex items-center gap-2"
+                            class="min-w-[160px] bg-[#ECE3CE] text-[#3A4D39] text-base font-medium px-8 py-4 rounded-full hover:bg-white transition-colors"
                         >
-                            <Paintbrush size={20} />
                             Get a Quote
                         </a>
                         <a
                             href="#services"
-                            class="text-base font-medium flex items-center gap-2 group text-white"
+                            class="min-w-[160px] text-white border border-white/30 hover:bg-white/10 text-base font-medium px-8 py-4 rounded-full transition-colors backdrop-blur-sm"
                         >
                             View Services
-                            <ArrowDown
-                                size={16}
-                                class="group-hover:translate-y-1 transition-transform"
-                            />
                         </a>
                     </div>
-
-                    <!-- Decorative Arrow -->
-                    <div class="absolute right-0 top-1/4 hidden md:block">
-                        <svg
-                            width="120"
-                            height="120"
-                            viewBox="0 0 100 100"
-                            fill="none"
-                            class="text-white"
-                            stroke="currentColor"
-                            stroke-width="1.5"
-                        >
-                            <path
-                                d="M10,10 Q50,10 50,50 T90,90"
-                                stroke-linecap="round"></path>
-                            <path
-                                d="M80,90 L90,90 L90,80"
-                                stroke-linecap="round"
-                                stroke-linejoin="round"></path>
-                        </svg>
-                    </div>
                 </div>
 
-                <!-- Hero Phones Mockup (CSS Only) - Adapted to "Project Card" look -->
+                <!-- Floating Cards (Decorative) -->
                 <div
-                    class="relative md:absolute md:top-12 md:-right-20 mt-12 md:mt-0 flex justify-center md:block transform scale-90 md:scale-100"
+                    class="hidden lg:block absolute left-12 bottom-12 rotate-[-6deg] hover:rotate-0 transition-transform duration-500"
                 >
-                    <!-- Back Card (Job List) -->
-                    <div
-                        class="absolute top-0 -left-20 md:-left-32 w-[280px] h-[580px] bg-stone-100 rounded-[3rem] border-[8px] border-white shadow-2xl rotate-[-6deg] overflow-hidden hidden lg:block opacity-90 z-0"
-                    >
-                        <!-- Header -->
-                        <div
-                            class="px-6 py-6 bg-stone-50 border-b border-stone-200"
-                        >
-                            <div class="flex justify-between items-center mb-4">
-                                <span class="text-xl font-medium tracking-tight"
-                                    >Recent Jobs</span
-                                >
-                                <SlidersHorizontal
-                                    size={20}
-                                    class="text-stone-400"
-                                />
-                            </div>
+                    <div class="bg-[#FAF9F6] p-4 rounded-2xl shadow-xl w-48">
+                        <div class="flex items-center gap-3 mb-3">
                             <div
-                                class="w-full bg-white h-10 rounded-xl border border-stone-200 flex items-center px-3 gap-2"
+                                class="w-10 h-10 rounded-full bg-[#E5E5E5] flex items-center justify-center"
                             >
-                                <Search size={16} class="text-stone-400" />
-                                <span class="text-sm text-stone-400"
-                                    >Search projects...</span
-                                >
+                                <Paintbrush size={20} class="text-stone-600" />
+                            </div>
+                            <div>
+                                <p class="text-xs font-bold text-stone-900">
+                                    Ext. Paint
+                                </p>
+                                <p class="text-[10px] text-stone-500">
+                                    In Progress
+                                </p>
                             </div>
                         </div>
-                        <!-- Content -->
-                        <div class="p-4 space-y-4">
-                            <div
-                                class="bg-[#1c1917] text-white p-4 rounded-2xl"
-                            >
-                                <span class="text-xs text-stone-400 uppercase"
-                                    >Painting</span
-                                >
-                                <div
-                                    class="flex justify-between items-end mt-2"
-                                >
-                                    <span
-                                        class="text-lg font-medium tracking-tight"
-                                        >Exterior Trim</span
-                                    >
-                                    <div class="flex -space-x-2">
-                                        <div
-                                            class="w-6 h-6 rounded-full bg-[#739072]"
-                                        >
-                                        </div>
-                                        <div
-                                            class="w-6 h-6 rounded-full bg-stone-400"
-                                        >
-                                        </div>
-                                        <div
-                                            class="w-6 h-6 rounded-full bg-white text-[8px] flex items-center justify-center text-black font-bold"
-                                        >
-                                            +2
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-                            <!-- List Items -->
-                            <div
-                                class="flex items-center justify-between p-3 bg-white rounded-xl shadow-sm"
-                            >
-                                <div class="flex items-center gap-3">
-                                    <div
-                                        class="w-10 h-10 rounded-full bg-stone-50 flex items-center justify-center border border-stone-100"
-                                    >
-                                        <Hammer
-                                            size={20}
-                                            class="text-stone-600"
-                                        />
-                                    </div>
-                                    <div>
-                                        <p class="text-sm font-medium">
-                                            Deck Repair
-                                        </p>
-                                        <p class="text-xs text-stone-500">
-                                            Monument, CO
-                                        </p>
-                                    </div>
-                                </div>
-                                <span class="text-sm font-medium text-[#739072]"
-                                    >Done</span
-                                >
-                            </div>
-                            <div
-                                class="flex items-center justify-between p-3 bg-white rounded-xl shadow-sm"
-                            >
-                                <div class="flex items-center gap-3">
-                                    <div
-                                        class="w-10 h-10 rounded-full bg-[#739072] flex items-center justify-center text-white"
-                                    >
-                                        <Paintbrush size={20} />
-                                    </div>
-                                    <div>
-                                        <p class="text-sm font-medium">
-                                            Staining
-                                        </p>
-                                        <p class="text-xs text-stone-500">
-                                            Black Forest
-                                        </p>
-                                    </div>
-                                </div>
-                                <span class="text-sm font-medium text-[#739072]"
-                                    >Done</span
-                                >
-                            </div>
+                        <div
+                            class="h-1.5 w-full bg-stone-200 rounded-full overflow-hidden"
+                        >
+                            <div class="h-full w-[80%] bg-[#739072]"></div>
                         </div>
                     </div>
+                </div>
 
-                    <!-- Front Card (Estimate/Service) -->
-                    <div
-                        class="relative w-[300px] h-[600px] bg-[#1c1917] rounded-[3.5rem] border-[10px] border-[#1c1917] shadow-2xl z-10 overflow-hidden"
-                    >
-                        <!-- Notch area -->
-                        <div
-                            class="absolute top-0 left-1/2 -translate-x-1/2 w-32 h-6 bg-[#1c1917] rounded-b-2xl z-20"
-                        >
-                        </div>
-
-                        <!-- Screen Content -->
-                        <div
-                            class="w-full h-full bg-[#1c1917] text-white pt-10 px-6 flex flex-col"
-                        >
-                            <!-- Header -->
-                            <div class="flex justify-between items-start mb-6">
-                                <div class="flex items-center gap-3">
-                                    <div
-                                        class="w-10 h-10 rounded-full bg-white flex items-center justify-center text-black"
-                                    >
-                                        <Paintbrush
-                                            size={20}
-                                            fill="currentColor"
-                                        />
-                                    </div>
-                                    <div>
-                                        <h3
-                                            class="text-lg font-medium leading-none"
-                                        >
-                                            Summit
-                                        </h3>
-                                        <span class="text-xs text-stone-500"
-                                            >Services</span
-                                        >
-                                    </div>
-                                </div>
-                                <div
-                                    class="w-8 h-8 rounded-full border border-stone-800 flex items-center justify-center"
-                                >
-                                    <Star size={16} class="text-stone-400" />
-                                </div>
-                            </div>
-
-                            <!-- Big Stat -->
-                            <div class="mb-6">
-                                <h2 class="text-3xl font-medium tracking-tight">
-                                    Get Your
-                                </h2>
-                                <h2
-                                    class="text-3xl font-medium tracking-tight text-[#739072]"
-                                >
-                                    Estimate
-                                </h2>
-                            </div>
-
-                            <!-- Visualization / Color Palette -->
+                <div
+                    class="hidden lg:block absolute right-12 top-24 rotate-[6deg] hover:rotate-0 transition-transform duration-500"
+                >
+                    <div class="bg-[#FAF9F6] p-4 rounded-2xl shadow-xl w-52">
+                        <div class="flex justify-between items-start mb-2">
                             <div
-                                class="relative h-48 w-full mb-6 bg-stone-900 rounded-2xl p-4 overflow-hidden"
+                                class="w-8 h-8 rounded-full bg-[#3A4D39] flex items-center justify-center"
                             >
-                                <div class="absolute inset-0 opacity-20">
-                                    <svg
-                                        class="w-full h-full"
-                                        viewBox="0 0 100 100"
-                                        preserveAspectRatio="none"
-                                    >
-                                        <path
-                                            d="M0,100 C20,50 50,80 100,20 V100 H0 Z"
-                                            fill="#739072"></path>
-                                    </svg>
-                                </div>
-                                <div class="relative z-10">
-                                    <p class="text-xs text-stone-400 mb-2">
-                                        Color Consultation
-                                    </p>
-                                    <div class="flex gap-2">
-                                        <div
-                                            class="w-8 h-8 rounded-full bg-[#3A4D39]"
-                                        >
-                                        </div>
-                                        <div
-                                            class="w-8 h-8 rounded-full bg-[#739072]"
-                                        >
-                                        </div>
-                                        <div
-                                            class="w-8 h-8 rounded-full bg-[#ECE3CE]"
-                                        >
-                                        </div>
-                                    </div>
-                                </div>
+                                <Check size={16} class="text-white" />
                             </div>
-
-                            <!-- Service Selection tags -->
-                            <div class="flex flex-wrap gap-2 mb-6">
-                                <span
-                                    class="bg-stone-800 text-xs font-medium text-white py-1.5 px-3 rounded-lg"
-                                    >Painting</span
-                                >
-                                <span
-                                    class="bg-stone-800 text-xs font-medium text-white py-1.5 px-3 rounded-lg"
-                                    >Repairs</span
-                                >
-                                <span
-                                    class="bg-white text-xs font-medium text-black rounded-lg py-1.5 px-3 shadow-sm"
-                                    >Exteriors</span
-                                >
+                            <span
+                                class="text-[10px] font-bold bg-[#739072]/20 text-[#3A4D39] px-2 py-0.5 rounded"
+                                >Verified</span
+                            >
+                        </div>
+                        <p
+                            class="text-sm font-serif font-medium text-stone-900"
+                        >
+                            Deck Restoration
+                        </p>
+                        <div class="flex -space-x-2 mt-3">
+                            <div
+                                class="w-6 h-6 rounded-full bg-stone-300 border-2 border-white"
+                            >
                             </div>
-
-                            <!-- List -->
-                            <div class="space-y-4 mb-6">
-                                <div>
-                                    <p
-                                        class="text-[10px] text-stone-500 uppercase tracking-wider"
-                                    >
-                                        Service Area
-                                    </p>
-                                    <p class="text-sm font-medium">
-                                        Colorado Springs
-                                    </p>
-                                </div>
-                                <div>
-                                    <p
-                                        class="text-[10px] text-stone-500 uppercase tracking-wider"
-                                    >
-                                        Warranty
-                                    </p>
-                                    <p class="text-sm font-medium">
-                                        Satisfaction Guaranteed
-                                    </p>
-                                </div>
+                            <div
+                                class="w-6 h-6 rounded-full bg-stone-400 border-2 border-white"
+                            >
                             </div>
-
-                            <!-- Action Buttons -->
-                            <div class="mt-auto pb-8 flex gap-3">
-                                <button
-                                    class="flex-1 bg-stone-800 hover:bg-stone-700 text-white font-medium py-3 rounded-xl transition-colors"
-                                    >Call</button
-                                >
-                                <button
-                                    class="flex-1 bg-[#739072] hover:bg-[#5f7a5e] text-black font-medium py-3 rounded-xl transition-colors"
-                                    >Email</button
-                                >
+                            <div
+                                class="w-6 h-6 rounded-full bg-stone-500 border-2 border-white"
+                            >
                             </div>
                         </div>
                     </div>
@@ -422,596 +214,571 @@ import {
             </div>
         </div>
 
-        <!-- Features Split Section -->
-        <section class="max-w-7xl mx-auto px-6 py-24">
-            <h2
-                class="text-3xl md:text-5xl font-medium tracking-tight mb-16 max-w-lg"
+        <!-- Core Services Section -->
+        <section id="services" class="max-w-7xl mx-auto px-6 py-24">
+            <div
+                class="flex flex-col md:flex-row md:items-end justify-between mb-16 gap-6"
             >
-                Services That <br /> Transform Your Home
-            </h2>
-
-            <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
-                <!-- Card 1 -->
-                <div
-                    class="bg-stone-50 rounded-[2rem] p-10 relative overflow-hidden group hover:shadow-lg transition-shadow duration-300"
+                <div class="max-w-xl">
+                    <h2
+                        class="text-4xl md:text-5xl font-serif font-medium text-[#1c1917] mb-6"
+                    >
+                        Services That <br /> Transform Your Home
+                    </h2>
+                    <p class="text-lg text-stone-500 leading-relaxed">
+                        We don't just paint; we care for your home. From
+                        restoration to detailed repairs.
+                    </p>
+                </div>
+                <a
+                    href="#all-services"
+                    class="hidden md:flex items-center gap-2 text-[#3A4D39] font-medium border-b border-[#3A4D39] pb-0.5 hover:opacity-80 transition-opacity"
                 >
-                    <div class="relative z-10 max-w-sm">
-                        <h3 class="text-xl font-medium mb-3">
+                    See full service list <ArrowRight size={16} />
+                </a>
+            </div>
+
+            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
+                <!-- Service 1 -->
+                <div
+                    class="bg-white rounded-[2.5rem] p-10 relative overflow-hidden group border border-stone-100/50 hover:shadow-xl transition-all duration-500 hover:-translate-y-1"
+                >
+                    <div class="relative z-10">
+                        <div
+                            class="w-14 h-14 rounded-2xl bg-[#ECE3CE]/50 flex items-center justify-center mb-8 group-hover:scale-110 transition-transform"
+                        >
+                            <Paintbrush size={28} class="text-[#3A4D39]" />
+                        </div>
+                        <h3
+                            class="text-2xl font-serif font-medium mb-4 text-[#1c1917]"
+                        >
                             Residential Painting
                         </h3>
-                        <p class="text-lg text-stone-500 mb-8 leading-relaxed">
-                            Interior and exterior painting with premium
-                            materials and thorough prep work.
+                        <p class="text-stone-500 mb-8 leading-relaxed max-w-sm">
+                            Interior and exterior transformation. We use premium
+                            paints and focus heavily on prep work to ensure
+                            longevity.
                         </p>
-                        <a
-                            href="#contact"
-                            class="inline-flex items-center gap-2 text-sm font-medium hover:gap-3 transition-all text-[#3A4D39]"
-                        >
-                            Get Estimate <ArrowRight size={16} />
-                        </a>
+                        <ul class="space-y-3 mb-8">
+                            <li
+                                class="flex items-center gap-3 text-sm font-medium text-stone-700"
+                            >
+                                <Check size={16} class="text-[#739072]" /> Exterior
+                                Body & Trim
+                            </li>
+                            <li
+                                class="flex items-center gap-3 text-sm font-medium text-stone-700"
+                            >
+                                <Check size={16} class="text-[#739072]" /> Cabinet
+                                Refinishing
+                            </li>
+                            <li
+                                class="flex items-center gap-3 text-sm font-medium text-stone-700"
+                            >
+                                <Check size={16} class="text-[#739072]" /> Color Consultations
+                            </li>
+                        </ul>
                     </div>
-                    <!-- Abstract Doodle -->
-                    <div class="absolute -bottom-10 -right-10 w-48 h-48">
-                        <div
-                            class="absolute bottom-0 right-0 w-32 h-32 bg-[#739072] rounded-full mix-blend-multiply opacity-30"
-                        >
-                        </div>
-                        <div
-                            class="absolute bottom-4 right-16 w-24 h-40 bg-[#3A4D39] rounded-full mix-blend-multiply opacity-20 rotate-12"
-                        >
-                        </div>
-                        <svg
-                            class="absolute bottom-10 right-4 w-20 h-20 text-stone-400 z-20"
-                            viewBox="0 0 100 100"
-                            fill="none"
-                            stroke="currentColor"
-                            stroke-width="2"
-                        >
-                            <path d="M10,50 C30,20 70,80 90,50"></path>
-                            <circle cx="85" cy="45" r="5" fill="none"></circle>
-                        </svg>
+                    <div
+                        class="absolute -right-20 -bottom-20 w-64 h-64 bg-[#739072]/10 rounded-full blur-3xl group-hover:bg-[#739072]/20 transition-colors"
+                    >
                     </div>
                 </div>
 
+                <!-- Service 2 -->
+                <div
+                    class="bg-white rounded-[2.5rem] p-10 relative overflow-hidden group border border-stone-100/50 hover:shadow-xl transition-all duration-500 hover:-translate-y-1"
+                >
+                    <div class="relative z-10">
+                        <div
+                            class="w-14 h-14 rounded-2xl bg-[#739072]/20 flex items-center justify-center mb-8 group-hover:scale-110 transition-transform"
+                        >
+                            <Trees size={28} class="text-[#3A4D39]" />
+                        </div>
+                        <h3
+                            class="text-2xl font-serif font-medium mb-4 text-[#1c1917]"
+                        >
+                            Wood & Deck Restoration
+                        </h3>
+                        <p class="text-stone-500 mb-8 leading-relaxed max-w-sm">
+                            Don't replace it if you don't have to. We restore
+                            decks, fences, and siding repairs to like-new
+                            condition.
+                        </p>
+                        <ul class="space-y-3 mb-8">
+                            <li
+                                class="flex items-center gap-3 text-sm font-medium text-stone-700"
+                            >
+                                <Check size={16} class="text-[#739072]" /> Power Washing
+                            </li>
+                            <li
+                                class="flex items-center gap-3 text-sm font-medium text-stone-700"
+                            >
+                                <Check size={16} class="text-[#739072]" /> Staining
+                                & Sealing
+                            </li>
+                            <li
+                                class="flex items-center gap-3 text-sm font-medium text-stone-700"
+                            >
+                                <Check size={16} class="text-[#739072]" /> Rot Repair
+                            </li>
+                        </ul>
+                    </div>
+                    <div
+                        class="absolute -right-20 -bottom-20 w-64 h-64 bg-[#ECE3CE]/30 rounded-full blur-3xl group-hover:bg-[#ECE3CE]/50 transition-colors"
+                    >
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- Feature: Complete Service List (Eden Style) -->
+        <section id="all-services" class="max-w-7xl mx-auto px-6 mb-32">
+            <div
+                class="bg-white rounded-[3rem] p-8 md:p-16 flex flex-col-reverse md:flex-row items-center gap-16 shadow-sm border border-stone-100"
+            >
+                <div class="w-full md:w-1/2">
+                    <h2
+                        class="text-3xl md:text-5xl font-serif font-medium tracking-tight mb-6 text-[#1c1917]"
+                    >
+                        More Than Just <br /> Painting
+                    </h2>
+                    <p class="text-lg text-stone-500 leading-relaxed mb-10">
+                        We handle the small jobs too. From drywall repair to
+                        fixture installation, we are your holistic home care
+                        partners.
+                    </p>
+                    <div class="grid grid-cols-2 gap-y-5 gap-x-8">
+                        <!-- Column 1 -->
+                        <div class="space-y-4">
+                            <div class="flex items-center gap-3 group">
+                                <div
+                                    class="w-6 h-6 rounded-full bg-stone-100 flex items-center justify-center group-hover:bg-[#739072] transition-colors"
+                                >
+                                    <Check
+                                        size={14}
+                                        class="text-stone-400 group-hover:text-white"
+                                    />
+                                </div>
+                                <span class="text-stone-700 font-medium"
+                                    >Drywall Repair</span
+                                >
+                            </div>
+                            <div class="flex items-center gap-3 group">
+                                <div
+                                    class="w-6 h-6 rounded-full bg-stone-100 flex items-center justify-center group-hover:bg-[#739072] transition-colors"
+                                >
+                                    <Check
+                                        size={14}
+                                        class="text-stone-400 group-hover:text-white"
+                                    />
+                                </div>
+                                <span class="text-stone-700 font-medium"
+                                    >Wallpaper Removal</span
+                                >
+                            </div>
+                            <div class="flex items-center gap-3 group">
+                                <div
+                                    class="w-6 h-6 rounded-full bg-stone-100 flex items-center justify-center group-hover:bg-[#739072] transition-colors"
+                                >
+                                    <Check
+                                        size={14}
+                                        class="text-stone-400 group-hover:text-white"
+                                    />
+                                </div>
+                                <span class="text-stone-700 font-medium"
+                                    >Trim Installation</span
+                                >
+                            </div>
+                            <div class="flex items-center gap-3 group">
+                                <div
+                                    class="w-6 h-6 rounded-full bg-stone-100 flex items-center justify-center group-hover:bg-[#739072] transition-colors"
+                                >
+                                    <Check
+                                        size={14}
+                                        class="text-stone-400 group-hover:text-white"
+                                    />
+                                </div>
+                                <span class="text-stone-700 font-medium"
+                                    >Gutter Cleaning</span
+                                >
+                            </div>
+                        </div>
+                        <!-- Column 2 -->
+                        <div class="space-y-4">
+                            <div class="flex items-center gap-3 group">
+                                <div
+                                    class="w-6 h-6 rounded-full bg-stone-100 flex items-center justify-center group-hover:bg-[#739072] transition-colors"
+                                >
+                                    <Check
+                                        size={14}
+                                        class="text-stone-400 group-hover:text-white"
+                                    />
+                                </div>
+                                <span class="text-stone-700 font-medium"
+                                    >Plumbing Fixtures</span
+                                >
+                            </div>
+                            <div class="flex items-center gap-3 group">
+                                <div
+                                    class="w-6 h-6 rounded-full bg-stone-100 flex items-center justify-center group-hover:bg-[#739072] transition-colors"
+                                >
+                                    <Check
+                                        size={14}
+                                        class="text-stone-400 group-hover:text-white"
+                                    />
+                                </div>
+                                <span class="text-stone-700 font-medium"
+                                    >TV Mounting</span
+                                >
+                            </div>
+                            <div class="flex items-center gap-3 group">
+                                <div
+                                    class="w-6 h-6 rounded-full bg-stone-100 flex items-center justify-center group-hover:bg-[#739072] transition-colors"
+                                >
+                                    <Check
+                                        size={14}
+                                        class="text-stone-400 group-hover:text-white"
+                                    />
+                                </div>
+                                <span class="text-stone-700 font-medium"
+                                    >Junk Removal</span
+                                >
+                            </div>
+                            <div class="flex items-center gap-3 group">
+                                <div
+                                    class="w-6 h-6 rounded-full bg-stone-100 flex items-center justify-center group-hover:bg-[#739072] transition-colors"
+                                >
+                                    <Check
+                                        size={14}
+                                        class="text-stone-400 group-hover:text-white"
+                                    />
+                                </div>
+                                <span class="text-stone-700 font-medium"
+                                    >General Repairs</span
+                                >
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <div
+                    class="w-full md:w-1/2 relative h-[450px] flex items-center justify-center"
+                >
+                    <!-- Large Sage Circle -->
+                    <div
+                        class="w-[400px] h-[400px] bg-[#739072]/20 rounded-full absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2"
+                    >
+                    </div>
+
+                    <!-- Floating Card 1 (Top Left) -->
+                    <div
+                        class="absolute top-12 left-8 bg-white p-4 rounded-2xl shadow-lg border border-stone-100 flex items-center gap-4 w-60 z-20 hover:scale-105 transition-transform duration-500"
+                    >
+                        <div
+                            class="w-10 h-10 rounded-full bg-[#1c1917] flex items-center justify-center"
+                        >
+                            <Paintbrush size={18} class="text-white" />
+                        </div>
+                        <div>
+                            <p class="text-sm font-bold text-[#1c1917]">
+                                Interior
+                            </p>
+                            <p class="text-xs text-stone-500">Painting</p>
+                        </div>
+                        <div class="ml-auto text-[#739072]">
+                            <Check size={16} />
+                        </div>
+                    </div>
+
+                    <!-- Floating Card 2 (Center Right) -->
+                    <div
+                        class="absolute top-1/2 right-6 -translate-y-1/2 bg-white p-5 rounded-2xl shadow-xl border border-stone-100 flex items-center gap-4 w-72 z-30 hover:scale-105 transition-transform duration-500"
+                    >
+                        <div
+                            class="w-12 h-12 rounded-full bg-[#3A4D39] flex items-center justify-center"
+                        >
+                            <LayoutGrid size={20} class="text-white" />
+                        </div>
+                        <div>
+                            <p class="text-base font-bold text-[#1c1917]">
+                                Deck Restoration
+                            </p>
+                            <p class="text-xs text-stone-500">Stain & Seal</p>
+                        </div>
+                        <div class="ml-auto text-[#739072]">
+                            <Check size={20} />
+                        </div>
+                    </div>
+
+                    <!-- Floating Card 3 (Bottom Left) -->
+                    <div
+                        class="absolute bottom-16 left-12 bg-white p-4 rounded-2xl shadow-lg border border-stone-100 flex items-center gap-4 w-64 z-20 hover:scale-105 transition-transform duration-500"
+                    >
+                        <div
+                            class="w-10 h-10 rounded-full bg-[#ECE3CE] flex items-center justify-center"
+                        >
+                            <Box size={18} class="text-[#3A4D39]" />
+                        </div>
+                        <div>
+                            <p class="text-sm font-bold text-[#1c1917]">
+                                Handyman
+                            </p>
+                            <p class="text-xs text-stone-500">
+                                Fixes & Install
+                            </p>
+                        </div>
+                        <div class="ml-auto text-[#739072]">
+                            <Check size={16} />
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- Why Us Section -->
+        <section id="why-us" class="max-w-7xl mx-auto px-6 mb-24">
+            <h2
+                class="text-3xl md:text-5xl font-serif font-medium tracking-tight mb-16 text-[#1c1917] text-center"
+            >
+                Why Neighbors Trust Summit
+            </h2>
+
+            <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
+                <!-- Card 1 -->
+                <div
+                    class="bg-stone-100 rounded-[2rem] p-8 hover:bg-white hover:shadow-lg transition-all border border-transparent hover:border-stone-100"
+                >
+                    <div
+                        class="w-12 h-12 rounded-full bg-[#3A4D39] flex items-center justify-center mb-6"
+                    >
+                        <Ruler size={20} class="text-white" />
+                    </div>
+                    <h3
+                        class="text-xl font-serif font-medium mb-3 text-[#1c1917]"
+                    >
+                        Attention to Detail
+                    </h3>
+                    <p class="text-stone-600 leading-relaxed text-sm">
+                        The difference is in the prep. We scrape, sand, and
+                        prime diligently so your finish lasts for years, not
+                        months.
+                    </p>
+                </div>
+
                 <!-- Card 2 -->
                 <div
-                    class="bg-stone-50 rounded-[2rem] p-10 relative overflow-hidden group hover:shadow-lg transition-shadow duration-300"
+                    class="bg-stone-100 rounded-[2rem] p-8 hover:bg-white hover:shadow-lg transition-all border border-transparent hover:border-stone-100"
                 >
-                    <div class="relative z-10 max-w-sm">
-                        <h3 class="text-xl font-medium mb-3">
-                            Wood & Deck Restoration
-                        </h3>
-                        <p class="text-lg text-stone-500 mb-8 leading-relaxed">
-                            We repair dry rot, loose boards, and stain decks to
-                            look like new.
-                        </p>
-                        <a
-                            href="#contact"
-                            class="inline-flex items-center gap-2 text-sm font-medium hover:gap-3 transition-all text-[#3A4D39]"
-                        >
-                            Get Estimate <ArrowRight size={16} />
-                        </a>
+                    <div
+                        class="w-12 h-12 rounded-full bg-[#3A4D39] flex items-center justify-center mb-6"
+                    >
+                        <Coins size={20} class="text-white" />
                     </div>
-                    <!-- Abstract Chart -->
-                    <div class="absolute bottom-8 right-8 w-40 h-40">
-                        <div
-                            class="absolute inset-0 border-[12px] border-[#739072]/20 rounded-full border-t-[#739072] border-r-transparent rotate-45"
-                        >
-                        </div>
-                        <div
-                            class="absolute inset-0 border-[12px] border-[#ECE3CE]/60 rounded-full border-l-[#ECE3CE] border-b-transparent -rotate-12 scale-75"
-                        >
-                        </div>
+                    <h3
+                        class="text-xl font-serif font-medium mb-3 text-[#1c1917]"
+                    >
+                        Fair & Transparent
+                    </h3>
+                    <p class="text-stone-600 leading-relaxed text-sm">
+                        No hidden fees. We provide detailed, written estimates
+                        explaining exactly what you are paying for and why.
+                    </p>
+                </div>
+
+                <!-- Card 3 -->
+                <div
+                    class="bg-stone-100 rounded-[2rem] p-8 hover:bg-white hover:shadow-lg transition-all border border-transparent hover:border-stone-100"
+                >
+                    <div
+                        class="w-12 h-12 rounded-full bg-[#3A4D39] flex items-center justify-center mb-6"
+                    >
+                        <Headset size={20} class="text-white" />
                     </div>
+                    <h3
+                        class="text-xl font-serif font-medium mb-3 text-[#1c1917]"
+                    >
+                        Local & Reliable
+                    </h3>
+                    <p class="text-stone-600 leading-relaxed text-sm">
+                        We are proud Colorado Springs residents. We show up when
+                        we say we will and communicate clearly.
+                    </p>
                 </div>
             </div>
         </section>
 
-        <!-- Advantages Section -->
-        <section class="max-w-7xl mx-auto px-6 mb-24">
-            <h2 class="text-3xl md:text-5xl font-medium tracking-tight mb-6">
-                Why Choose Summit?
-            </h2>
-            <p class="text-lg text-stone-500 max-w-md mb-16 leading-relaxed">
-                We believe in honest work, fair pricing, and communicating
-                clearly every step of the way.
-            </p>
-
-            <div class="grid grid-cols-1 md:grid-cols-2 gap-x-12 gap-y-16">
-                <!-- Item 1 -->
-                <div class="flex gap-6 items-start">
-                    <div
-                        class="flex-shrink-0 w-12 h-12 rounded-full bg-[#739072] flex items-center justify-center"
-                    >
-                        <Ruler size={24} class="text-white" />
-                    </div>
-                    <div>
-                        <h3 class="text-xl font-medium mb-2">
-                            Attention to Detail
-                        </h3>
-                        <p class="text-lg text-stone-500 leading-relaxed mb-4">
-                            Prep work is everything. We scrape, sand, and prime
-                            to ensure lasting results.
-                        </p>
-                    </div>
-                </div>
-
-                <!-- Item 2 -->
-                <div class="flex gap-6 items-start">
-                    <div
-                        class="flex-shrink-0 w-12 h-12 rounded-full bg-[#739072]/20 flex items-center justify-center"
-                    >
-                        <Headset size={24} class="text-[#3A4D39]" />
-                    </div>
-                    <div>
-                        <h3 class="text-xl font-medium mb-2">
-                            Local & Reliable
-                        </h3>
-                        <p class="text-lg text-stone-500 leading-relaxed mb-4">
-                            We are right here in Colorado Springs. We answer our
-                            phones and show up on time.
-                        </p>
-                    </div>
-                </div>
-
-                <!-- Item 3 -->
-                <div class="flex gap-6 items-start">
-                    <div
-                        class="flex-shrink-0 w-12 h-12 rounded-full bg-[#739072]/20 flex items-center justify-center"
-                    >
-                        <Coins size={24} class="text-[#3A4D39]" />
-                    </div>
-                    <div>
-                        <h3 class="text-xl font-medium mb-2">Fair Pricing</h3>
-                        <p class="text-lg text-stone-500 leading-relaxed mb-4">
-                            No hidden fees. We provide detailed estimates so you
-                            know exactly what you're paying for.
-                        </p>
-                    </div>
-                </div>
-
-                <!-- Item 4 -->
-                <div class="flex gap-6 items-start">
-                    <div
-                        class="flex-shrink-0 w-12 h-12 rounded-full bg-[#739072]/20 flex items-center justify-center"
-                    >
-                        <Check size={24} class="text-[#3A4D39]" />
-                    </div>
-                    <div>
-                        <h3 class="text-xl font-medium mb-2">
-                            Comprehensive Care
-                        </h3>
-                        <p class="text-lg text-stone-500 leading-relaxed mb-4">
-                            From painting to faucet replacement, we handle the
-                            tasks you don't have time for.
-                        </p>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- Dark Pulse Section -> Ready to Transform -->
-        <section class="max-w-7xl mx-auto px-4 sm:px-6 mb-24">
+        <!-- Service Area -->
+        <section id="areas" class="max-w-7xl mx-auto px-6 mb-24">
             <div
-                class="bg-[#1c1917] rounded-[2.5rem] p-8 md:p-20 relative overflow-hidden flex flex-col md:flex-row items-center justify-between min-h-[400px]"
+                class="bg-[#1c1917] rounded-[3rem] p-8 md:p-16 text-white relative overflow-hidden"
             >
-                <div class="relative z-10 w-full md:w-1/2">
-                    <svg
-                        class="absolute -top-16 left-0 w-32 h-10 text-white/10"
-                        viewBox="0 0 100 20"
-                        fill="none"
-                        stroke="currentColor"
-                        ><path d="M0,20 Q20,0 50,10 T100,20"></path></svg
-                    >
-                    <h2
-                        class="text-3xl md:text-5xl font-medium text-white tracking-tight mb-8 leading-tight"
-                    >
-                        Ready to Transform <br />
-                        Your Home?
-                    </h2>
-                    <a
-                        href="tel:7195550123"
-                        class="inline-flex bg-white text-black text-sm font-medium px-6 py-3 rounded-full hover:bg-stone-200 transition-colors items-center gap-2"
-                    >
-                        <Phone size={16} fill="currentColor" />
-                        Call (719) 555-0123
-                    </a>
-                </div>
-
-                <!-- Floating UI Card - "Estimate" -->
                 <div
-                    class="relative z-10 mt-12 md:mt-0 w-full max-w-xs transform md:translate-x-10"
+                    class="relative z-10 flex flex-col md:flex-row items-center justify-between gap-12"
                 >
-                    <div class="bg-white rounded-3xl p-5 shadow-2xl relative">
-                        <div class="text-center mb-4">
-                            <span
-                                class="text-xs text-stone-400 uppercase tracking-widest"
-                                >Estimated Value</span
-                            >
-                            <h3 class="text-3xl font-medium tracking-tight">
-                                Priceless
-                            </h3>
-                            <span
-                                class="inline-block bg-[#739072]/20 text-[#3A4D39] px-2 py-0.5 rounded text-xs font-semibold mt-1"
-                                >Curb Appeal Increased</span
-                            >
-                        </div>
-                        <div class="bg-[#1c1917] rounded-xl p-4 mb-4">
-                            <div
-                                class="flex justify-between items-center text-white mb-2"
-                            >
-                                <span class="text-xs font-medium"
-                                    >Included Services</span
-                                >
-                                <MoreHorizontal
-                                    size={16}
-                                    class="text-stone-500"
-                                />
-                            </div>
-                            <div class="text-white text-lg font-medium">
-                                Full Prep Work
-                            </div>
-                            <div class="flex gap-2 mt-3">
-                                <button
-                                    class="flex-1 bg-stone-800 text-white text-[10px] py-1.5 rounded-lg border border-stone-700"
-                                    >Washing</button
-                                >
-                                <button
-                                    class="flex-1 bg-stone-800 text-white text-[10px] py-1.5 rounded-lg border border-stone-700"
-                                    >Priming</button
-                                >
-                            </div>
-                        </div>
-                        <div class="space-y-3">
-                            <div class="flex items-center justify-between">
-                                <div class="flex items-center gap-2">
-                                    <div
-                                        class="w-6 h-6 rounded-full bg-stone-100 flex items-center justify-center"
-                                    >
-                                        <Paintbrush
-                                            size={12}
-                                            fill="currentColor"
-                                        />
-                                    </div>
-                                    <span class="text-xs font-medium"
-                                        >House Painting</span
-                                    >
-                                </div>
-                                <span class="text-xs font-medium text-[#739072]"
-                                    >Included</span
-                                >
-                            </div>
-                            <div class="flex items-center justify-between">
-                                <div class="flex items-center gap-2">
-                                    <div
-                                        class="w-6 h-6 rounded-full bg-stone-100 flex items-center justify-center text-stone-600"
-                                    >
-                                        <Hammer size={12} />
-                                    </div>
-                                    <span class="text-xs font-medium"
-                                        >Repairs</span
-                                    >
-                                </div>
-                                <span class="text-xs font-medium text-[#739072]"
-                                    >Included</span
-                                >
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                <!-- Background Abstract -->
-                <div
-                    class="absolute inset-0 bg-gradient-to-r from-[#1c1917] via-[#1c1917] to-stone-900"
-                >
-                    <div
-                        class="absolute right-0 top-1/2 -translate-y-1/2 w-[500px] h-[500px] bg-[#3A4D39]/30 rounded-full blur-3xl"
-                    >
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- Feature: Service Areas (Replaces Real Time) -->
-        <section
-            id="areas"
-            class="max-w-7xl mx-auto px-6 mb-32 flex flex-col md:flex-row items-center gap-16"
-        >
-            <div class="w-full md:w-1/2 relative">
-                <!-- Highlight Background Box -->
-                <div
-                    class="absolute -top-4 -left-4 w-full h-full bg-[#739072] rounded-[2rem] transform -rotate-2"
-                >
-                </div>
-                <!-- Dark Card -->
-                <div
-                    class="relative bg-[#1c1917] rounded-[2rem] p-6 text-white shadow-xl h-64 overflow-hidden flex flex-col justify-center items-center"
-                >
-                    <MapPin size={48} class="text-[#739072] mb-4" />
-                    <h3 class="text-2xl font-bold">Pikes Peak Region</h3>
-                </div>
-            </div>
-            <div class="w-full md:w-1/2">
-                <h2
-                    class="text-3xl md:text-5xl font-medium tracking-tight mb-6"
-                >
-                    Proudly Serving Our Neighbors
-                </h2>
-                <p class="text-lg text-stone-500 leading-relaxed mb-4">
-                    Colorado Springs, Monument, Black Forest, Woodland Park,
-                    Guffey, and Lake George.
-                </p>
-                <p class="text-lg text-stone-500 leading-relaxed">
-                    We live here, we work here, and we treat your home like our
-                    own.
-                </p>
-            </div>
-        </section>
-
-        <!-- Feature: Complete Service List (Replaces Stonks) -->
-        <section
-            class="max-w-7xl mx-auto px-6 mb-32 flex flex-col-reverse md:flex-row items-center gap-16"
-        >
-            <div class="w-full md:w-1/2">
-                <h2
-                    class="text-3xl md:text-5xl font-medium tracking-tight mb-6"
-                >
-                    More Than Just <br /> Painting
-                </h2>
-                <p class="text-lg text-stone-500 leading-relaxed mb-6">
-                    From drywall repair and popcorn ceiling removal to faucet
-                    replacement, landscaping and tree trimming.
-                </p>
-                <div
-                    class="grid grid-cols-2 gap-2 text-stone-600 font-medium text-sm"
-                >
-                    <span
-                        ><Check size={14} class="inline mr-1 text-[#739072]" /> Painting</span
-                    >
-                    <span
-                        ><Check size={14} class="inline mr-1 text-[#739072]" /> Drywall</span
-                    >
-                    <span
-                        ><Check size={14} class="inline mr-1 text-[#739072]" /> Wallpaper
-                        Removal</span
-                    >
-                    <span
-                        ><Check size={14} class="inline mr-1 text-[#739072]" /> Wood
-                        Refinishing</span
-                    >
-                    <span
-                        ><Check size={14} class="inline mr-1 text-[#739072]" /> Trim
-                        Installation</span
-                    >
-                    <span
-                        ><Check size={14} class="inline mr-1 text-[#739072]" /> Deck
-                        Repair</span
-                    >
-                    <span
-                        ><Check size={14} class="inline mr-1 text-[#739072]" /> Plumbing
-                        Fixtures</span
-                    >
-                    <span
-                        ><Check size={14} class="inline mr-1 text-[#739072]" /> TV
-                        Mounting</span
-                    >
-                    <span
-                        ><Check size={14} class="inline mr-1 text-[#739072]" /> Gutter
-                        Cleaning</span
-                    >
-                    <span
-                        ><Check size={14} class="inline mr-1 text-[#739072]" /> Junk
-                        Removal</span
-                    >
-                </div>
-                <!-- Curly Line SVG connecting to next section -->
-                <div class="mt-8 hidden md:block">
-                    <svg
-                        width="200"
-                        height="100"
-                        viewBox="0 0 200 100"
-                        fill="none"
-                        stroke="currentColor"
-                        class="text-stone-300"
-                        stroke-width="1"
-                    >
-                        <path d="M10,10 Q100,100 190,50"></path>
-                    </svg>
-                </div>
-            </div>
-
-            <div class="w-full md:w-1/2 relative h-[400px]">
-                <!-- Yellow Circle Background -> Sage Green -->
-                <div
-                    class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[350px] h-[350px] bg-[#739072] rounded-full opacity-50"
-                >
-                </div>
-
-                <!-- Floating Cards -->
-                <div
-                    class="absolute top-10 left-10 bg-white p-3 rounded-xl shadow-lg flex items-center gap-3 w-48 animate-[bounce_3s_infinite]"
-                >
-                    <div
-                        class="w-8 h-8 rounded-full bg-black flex items-center justify-center"
-                    >
-                        <Paintbrush size={16} class="text-white" />
-                    </div>
-                    <div>
-                        <p class="text-xs font-semibold">Interior</p>
-                        <p class="text-[10px] text-stone-500">Painting</p>
-                    </div>
-                    <div class="ml-auto text-xs font-semibold text-[#739072]">
-                        <Check size={14} />
-                    </div>
-                </div>
-
-                <div
-                    class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 bg-white p-3 rounded-xl shadow-lg flex items-center gap-3 w-56 z-10"
-                >
-                    <div
-                        class="w-8 h-8 rounded-full bg-[#3A4D39] flex items-center justify-center"
-                    >
-                        <LayoutGrid size={16} class="text-white" />
-                    </div>
-                    <div>
-                        <p class="text-xs font-semibold">Deck Restoration</p>
-                        <p class="text-[10px] text-stone-500">Stain & Seal</p>
-                    </div>
-                    <div class="ml-auto text-right">
+                    <div class="max-w-md">
                         <div
-                            class="ml-auto text-xs font-semibold text-[#739072]"
+                            class="flex items-center gap-2 mb-4 text-[#739072]"
                         >
-                            <Check size={14} />
+                            <MapPin size={20} />
+                            <span
+                                class="text-sm font-bold uppercase tracking-wider"
+                                >Service Area</span
+                            >
+                        </div>
+                        <h2
+                            class="text-3xl md:text-5xl font-serif font-medium mb-6"
+                        >
+                            Proudly Serving Pikes Peak
+                        </h2>
+                        <p class="text-stone-400 leading-relaxed mb-8">
+                            We cover Colorado Springs and the surrounding
+                            mountain communities.
+                        </p>
+                        <div class="flex flex-wrap gap-2">
+                            <span
+                                class="px-4 py-2 rounded-full bg-white/10 text-sm border border-white/10"
+                                >Colorado Springs</span
+                            >
+                            <span
+                                class="px-4 py-2 rounded-full bg-white/10 text-sm border border-white/10"
+                                >Monument</span
+                            >
+                            <span
+                                class="px-4 py-2 rounded-full bg-white/10 text-sm border border-white/10"
+                                >Black Forest</span
+                            >
+                            <span
+                                class="px-4 py-2 rounded-full bg-white/10 text-sm border border-white/10"
+                                >Woodland Park</span
+                            >
                         </div>
                     </div>
-                </div>
 
-                <div
-                    class="absolute bottom-20 right-10 bg-white p-3 rounded-xl shadow-lg flex items-center gap-3 w-48 animate-[bounce_4s_infinite]"
-                >
                     <div
-                        class="w-8 h-8 rounded-full bg-stone-200 flex items-center justify-center"
+                        class="relative w-full md:w-[400px] h-64 bg-stone-800 rounded-2xl overflow-hidden border border-stone-700 flex items-center justify-center"
                     >
-                        <Box size={16} class="text-stone-600" />
-                    </div>
-                    <div>
-                        <p class="text-xs font-semibold">Handyman</p>
-                        <p class="text-[10px] text-stone-500">Fixes</p>
-                    </div>
-                    <div class="ml-auto text-right">
+                        <p class="text-stone-500 text-sm">[Map Placeholder]</p>
                         <div
-                            class="ml-auto text-xs font-semibold text-[#739072]"
+                            class="absolute w-4 h-4 rounded-full bg-[#739072] shadow-[0_0_0_8px_rgba(115,144,114,0.2)] animate-pulse"
                         >
-                            <Check size={14} />
                         </div>
                     </div>
                 </div>
             </div>
         </section>
-
-        <!-- Bottom CTA -->
-        <section class="max-w-7xl mx-auto px-6 mb-24 text-center">
-            <h2 class="text-3xl md:text-5xl font-medium tracking-tight mb-8">
-                Get a Free Estimate <br /> and Start Today
-            </h2>
-            <a
-                href="tel:7195550123"
-                class="bg-[#1c1917] text-white text-base font-medium px-8 py-4 rounded-full hover:bg-stone-800 transition-colors inline-flex items-center gap-2"
-            >
-                <Phone size={20} fill="currentColor" />
-                Contact Us
-            </a>
-        </section>
     </main>
 
-    <!-- Footer -->
-    <footer class="bg-[#1c1917] text-white pt-20 pb-10 rounded-t-[3rem] mt-10">
-        <div class="max-w-7xl mx-auto px-8">
-            <div
-                class="grid grid-cols-1 md:grid-cols-4 gap-12 border-b border-stone-800 pb-16"
-            >
-                <!-- Brand -->
-                <div class="col-span-1">
-                    <div class="flex items-center gap-2 mb-8">
-                        <div class="w-4 h-4 rounded-full bg-[#739072]"></div>
-                        <span class="text-lg font-medium">Summit Painting</span>
-                    </div>
+    <!-- Hybrid Footer / Rounded CTA -->
+    <footer class="bg-[#1c1917] text-white pt-24 pb-12 rounded-t-[3rem] mt-24">
+        <div class="max-w-7xl mx-auto px-6">
+            <!-- Large CTA Section -->
+            <div class="text-center mb-24 border-b border-stone-800 pb-20">
+                <h2
+                    class="text-4xl md:text-6xl font-serif font-medium tracking-tight mb-8 text-white max-w-2xl mx-auto leading-tight"
+                >
+                    Ready to Transform <br /> Your Home?
+                </h2>
+                <p class="text-xl text-stone-400 mb-10 max-w-lg mx-auto">
+                    Get a free, detailed estimate for your painting or handyman
+                    project today.
+                </p>
+                <div
+                    class="flex flex-col sm:flex-row items-center justify-center gap-4"
+                >
+                    <a
+                        href="tel:7195550123"
+                        class="min-w-[200px] bg-white text-[#1c1917] text-lg font-medium px-8 py-4 rounded-full hover:bg-stone-200 transition-colors shadow-lg flex items-center justify-center gap-2"
+                    >
+                        <Phone size={20} />
+                        Call Now
+                    </a>
+                    <a
+                        href="mailto:contact@summitpainting.com"
+                        class="min-w-[200px] bg-transparent text-white border border-stone-600 text-lg font-medium px-8 py-4 rounded-full hover:border-white hover:bg-white/5 transition-colors flex items-center justify-center gap-2"
+                    >
+                        Send Email
+                    </a>
                 </div>
+            </div>
 
-                <!-- Links 1 -->
+            <!-- Footer Links -->
+            <div class="flex flex-col md:flex-row justify-between gap-12 mb-16">
                 <div>
-                    <h4 class="text-sm font-semibold text-white mb-6">
-                        Services
-                    </h4>
-                    <ul class="space-y-4 text-sm text-stone-400">
-                        <li>
-                            <a
-                                href="#"
-                                class="hover:text-white transition-colors"
-                                >Exterior Painting</a>
-                        </li>
-                        <li>
-                            <a
-                                href="#"
-                                class="hover:text-white transition-colors"
-                                >Interior Painting</a>
-                        </li>
-                        <li>
-                            <a
-                                href="#"
-                                class="hover:text-white transition-colors"
-                                >Wood Repair</a>
-                        </li>
-                        <li>
-                            <a
-                                href="#"
-                                class="hover:text-white transition-colors"
-                                >Deck Restoration</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <!-- Links 2 -->
-                <div>
-                    <h4 class="text-sm font-semibold text-white mb-6">
-                        Company
-                    </h4>
-                    <ul class="space-y-4 text-sm text-stone-400">
-                        <li>
-                            <a
-                                href="#"
-                                class="hover:text-white transition-colors"
-                                >About Us</a>
-                        </li>
-                        <li>
-                            <a
-                                href="#"
-                                class="hover:text-white transition-colors"
-                                >Service Areas</a>
-                        </li>
-                        <li>
-                            <a
-                                href="#"
-                                class="hover:text-white transition-colors"
-                                >Privacy</a>
-                        </li>
-                        <li>
-                            <a
-                                href="#"
-                                class="hover:text-white transition-colors"
-                                >Contact</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <!-- Contact -->
-                <div>
-                    <h4 class="text-sm font-semibold text-white mb-6">
-                        Contact Us
-                    </h4>
-                    <div class="relative">
-                        <p class="text-stone-400 text-sm mb-4">
-                            (719) 555-0123 <br />
-                            Colorado Springs, CO
-                        </p>
-                        <a
-                            href="tel:7195550123"
-                            class="inline-flex bg-[#739072] text-black px-4 py-2 rounded-full text-sm font-medium hover:scale-105 transition-transform"
+                    <div class="flex items-center gap-2 mb-6">
+                        <div
+                            class="w-8 h-8 rounded-full bg-[#739072] flex items-center justify-center text-white text-sm font-serif font-bold"
+                        >
+                            S
+                        </div>
+                        <span
+                            class="text-xl font-serif font-medium tracking-tight"
+                            >Summit Painting</span
+                        >
+                    </div>
+                    <p class="text-stone-400 max-w-xs leading-relaxed">
+                        Quality craftsmanship and honest service for Colorado
+                        Springs and beyond.
+                    </p>
+                </div>
+                <div class="flex flex-wrap gap-12 md:gap-24 text-sm">
+                    <div class="flex flex-col gap-4">
+                        <span class="font-bold text-white tracking-wide"
+                            >Services</span
+                        >
+                        <a
+                            href="#"
+                            class="text-stone-400 hover:text-white transition-colors"
+                            >Painting</a
+                        >
+                        <a
+                            href="#"
+                            class="text-stone-400 hover:text-white transition-colors"
+                            >Deck Restoration</a
+                        >
+                        <a
+                            href="#"
+                            class="text-stone-400 hover:text-white transition-colors"
+                            >Handyman</a
+                        >
+                    </div>
+                    <div class="flex flex-col gap-4">
+                        <span class="font-bold text-white tracking-wide"
+                            >Company</span
+                        >
+                        <a
+                            href="#why-us"
+                            class="text-stone-400 hover:text-white transition-colors"
+                            >About Us</a
+                        >
+                        <a
+                            href="#areas"
+                            class="text-stone-400 hover:text-white transition-colors"
+                            >Service Areas</a
+                        >
+                        <a
+                            href="#contact"
+                            class="text-stone-400 hover:text-white transition-colors"
+                            >Contact</a
                         >
-                            Call Now
-                        </a>
                     </div>
                 </div>
             </div>
 
+            <!-- Bottom Bar -->
             <div
-                class="flex justify-between items-center pt-8 text-stone-500 text-sm"
+                class="pt-8 border-t border-stone-800 flex flex-col md:flex-row justify-between items-center gap-4 text-xs text-stone-500"
             >
                 <p>
                     &copy; {new Date().getFullYear()} Summit Painting & Handyman Services.
                 </p>
-                <div class="flex gap-4">
-                    <!-- Socials placeholder -->
+                <div class="flex gap-6">
+                    <a href="#" class="hover:text-white transition-colors"
+                        >Privacy</a
+                    >
+                    <a href="#" class="hover:text-white transition-colors"
+                        >Terms</a
+                    >
                 </div>
             </div>
         </div>
diff --git a/src/styles/global.css b/src/styles/global.css
index c457819..f11e6c3 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -5,4 +5,7 @@
     --color-brand-sage: #739072;
     --color-brand-beige: #ECE3CE;
     --color-brand-dark: #1A1C19;
+
+    --font-serif: "Playfair Display", serif;
+    --font-sans: "Plus Jakarta Sans", sans-serif;
 }