From 802dd7089a46f0b077589e7652dc18687968c88b Mon Sep 17 00:00:00 2001
From: CalebLewallen <caleb@lewallen.io>
Date: Thu, 14 May 2026 14:53:00 -0400
Subject: [PATCH] add contact page. Not wired up.

---
 public/llm.txt              |   5 ++
 src/components/Footer.astro |   2 +-
 src/components/Header.astro |   2 +-
 src/components/Hero.astro   |   2 +-
 src/layouts/Layout.astro    |   8 +++
 src/pages/contact.astro     | 122 ++++++++++++++++++++++++++++++++++++
 src/pages/services.astro    |   2 +-
 7 files changed, 139 insertions(+), 4 deletions(-)
 create mode 100644 src/pages/contact.astro

diff --git a/public/llm.txt b/public/llm.txt
index 8749d131..d5152b48 100644
--- a/public/llm.txt
+++ b/public/llm.txt
@@ -24,5 +24,10 @@ Professional Home Services for Chester County Homes. Locally owned. Professional
 - **Clean Work Policy.** We respect your home; cleanup is part of the job.
 - **Reliability.** Done right the first time by licensed professionals.
 
+## Contact
+- **Page:** [/contact](https://www.chescohome.com/contact)
+- **Form:** Request service by providing cell phone, email, service type, and details.
+- **Immediate Assistance:** Call (484) 301-5834.
+
 ## Emergency Service
 Real people answering the phone for your urgent home service needs.
diff --git a/src/components/Footer.astro b/src/components/Footer.astro
index 1bbbb5b0..922fcf46 100644
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@@ -29,7 +29,7 @@
           <a href="#services" class="text-sm font-bold text-text-secondary hover:text-brand-orange transition-colors uppercase tracking-widest">Services</a>
           <a href="#about" class="text-sm font-bold text-text-secondary hover:text-brand-orange transition-colors uppercase tracking-widest">About Us</a>
           <a href="#area" class="text-sm font-bold text-text-secondary hover:text-brand-orange transition-colors uppercase tracking-widest">Area</a>
-          <a href="#contact" class="text-sm font-bold text-text-secondary hover:text-brand-orange transition-colors uppercase tracking-widest">Contact</a>
+          <a href="/contact" class="text-sm font-bold text-text-secondary hover:text-brand-orange transition-colors uppercase tracking-widest">Contact</a>
         </div>
         <div class="flex flex-col gap-4">
           <span class="font-industrial font-bold uppercase text-brand-orange text-xs tracking-widest">Capabilities</span>
diff --git a/src/components/Header.astro b/src/components/Header.astro
index 3fbaeace..db2beeb0 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -13,7 +13,7 @@
     </div>
 
     <div>
-      <a href="#contact" class="bg-brand-navy text-white px-6 py-2.5 rounded-brand font-industrial font-bold uppercase tracking-wider hover:bg-brand-orange hover:text-brand-navy transition-all text-xs md:text-sm shadow-md">
+      <a href="/contact" class="bg-brand-navy text-white px-6 py-2.5 rounded-brand font-industrial font-bold uppercase tracking-wider hover:bg-brand-orange hover:text-brand-navy transition-all text-xs md:text-sm shadow-md">
         Request Service
       </a>
     </div>
diff --git a/src/components/Hero.astro b/src/components/Hero.astro
index cc7f26ee..a061f1f0 100644
--- a/src/components/Hero.astro
+++ b/src/components/Hero.astro
@@ -24,7 +24,7 @@
       </p>
 
       <div class="flex flex-wrap gap-4 mb-16">
-        <a href="#contact" class="group flex items-center gap-4 bg-brand-navy text-white px-8 py-5 rounded-brand font-industrial font-bold uppercase text-xl tracking-wider hover:bg-brand-orange hover:text-brand-navy transition-all shadow-xl">
+        <a href="/contact" class="group flex items-center gap-4 bg-brand-navy text-white px-8 py-5 rounded-brand font-industrial font-bold uppercase text-xl tracking-wider hover:bg-brand-orange hover:text-brand-navy transition-all shadow-xl">
           Schedule A Free Estimate
           <svg class="w-6 h-6 group-hover:translate-x-1 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24">
             <path d="M17 8l4 4m0 0l-4 4m4-4H3" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5"></path>
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 8b7df1d5..c3bb9639 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -22,6 +22,14 @@ const businessData = {
   "url": "https://www.chescohome.com",
   "telephone": "+14843015834",
   "email": "info@chescohome.com",
+  "contactPoint": {
+    "@type": "ContactPoint",
+    "telephone": "+1-484-301-5834",
+    "contactType": "customer service",
+    "areaServed": "Chester County, PA",
+    "availableLanguage": "English",
+    "url": "https://www.chescohome.com/contact"
+  },
   "openingHoursSpecification": [
     {
       "@type": "OpeningHoursSpecification",
diff --git a/src/pages/contact.astro b/src/pages/contact.astro
new file mode 100644
index 00000000..d0c309cd
--- /dev/null
+++ b/src/pages/contact.astro
@@ -0,0 +1,122 @@
+---
+import Layout from '../layouts/Layout.astro';
+import Header from '../components/Header.astro';
+import Footer from '../components/Footer.astro';
+---
+
+<Layout title="Contact Us | Chester Valley Home Services">
+  <Header />
+  <main class="py-20">
+    <div class="max-w-3xl mx-auto px-4">
+      <div class="mb-12">
+        <span class="font-industrial font-bold uppercase text-brand-orange text-sm tracking-widest mb-4 block">Get in Touch</span>
+        <h1 class="font-industrial text-5xl md:text-6xl font-black uppercase text-brand-navy leading-none mb-6">Request <br />Service</h1>
+        <p class="text-text-secondary text-lg leading-relaxed">Fill out the form below and one of our experts will get back to you shortly. For immediate assistance, call us at <a href="tel:4843015834" class="text-brand-navy font-bold hover:text-brand-orange transition-colors">(484) 301-5834</a>.</p>
+      </div>
+
+      <div id="contact-form-container" class="bg-white p-8 md:p-12 rounded-brand shadow-xl border border-border-subtle">
+        <form id="contact-form" class="space-y-6">
+          <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
+            <div class="space-y-2">
+              <label for="phone" class="block text-xs font-black uppercase tracking-widest text-brand-navy">Cell Phone</label>
+              <input 
+                type="tel" 
+                id="phone" 
+                name="phone" 
+                required 
+                placeholder="(555) 555-5555"
+                class="w-full px-4 py-3 border border-border-subtle rounded-brand focus:ring-2 focus:ring-brand-orange focus:border-transparent outline-none transition-all"
+              />
+            </div>
+            <div class="space-y-2">
+              <label for="email" class="block text-xs font-black uppercase tracking-widest text-brand-navy">Email Address</label>
+              <input 
+                type="email" 
+                id="email" 
+                name="email" 
+                required 
+                placeholder="you@example.com"
+                class="w-full px-4 py-3 border border-border-subtle rounded-brand focus:ring-2 focus:ring-brand-orange focus:border-transparent outline-none transition-all"
+              />
+            </div>
+          </div>
+
+          <div class="space-y-2">
+            <label for="service" class="block text-xs font-black uppercase tracking-widest text-brand-navy">Type of Service</label>
+            <select 
+              id="service" 
+              name="service" 
+              required
+              class="w-full px-4 py-3 border border-border-subtle rounded-brand focus:ring-2 focus:ring-brand-orange focus:border-transparent outline-none transition-all bg-white"
+            >
+              <option value="" disabled selected>Select a service...</option>
+              <option value="electrical">Electrical</option>
+              <option value="plumbing">Plumbing</option>
+              <option value="hvac">HVAC</option>
+              <option value="appliance">Appliance Repair</option>
+              <option value="renovation">Home Improvement</option>
+              <option value="other">Other</option>
+            </select>
+          </div>
+
+          <div class="space-y-2">
+            <label for="message" class="block text-xs font-black uppercase tracking-widest text-brand-navy">How can we help?</label>
+            <textarea 
+              id="message" 
+              name="message" 
+              rows="4" 
+              required 
+              placeholder="Describe your request..."
+              class="w-full px-4 py-3 border border-border-subtle rounded-brand focus:ring-2 focus:ring-brand-orange focus:border-transparent outline-none transition-all resize-none"
+            ></textarea>
+          </div>
+
+          <button 
+            type="submit" 
+            class="w-full bg-brand-navy text-white font-industrial font-bold uppercase tracking-widest py-4 rounded-brand hover:bg-brand-orange hover:text-brand-navy transition-all shadow-md group"
+          >
+            Submit Request 
+            <span class="inline-block group-hover:translate-x-1 transition-transform ml-2">→</span>
+          </button>
+        </form>
+
+        <div id="success-message" class="hidden text-center py-12">
+          <div class="w-20 h-20 bg-green-100 text-green-600 rounded-full flex items-center justify-center mx-auto mb-6">
+            <svg class="w-10 h-10" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="3" d="M5 13l4 4L19 7"></path>
+            </svg>
+          </div>
+          <h2 class="font-industrial text-3xl font-black uppercase text-brand-navy mb-4">Request Received</h2>
+          <p class="text-text-secondary leading-relaxed">Thank you for reaching out. We've received your request and a member of our team will contact you shortly.</p>
+          <button 
+            onclick="window.location.href='/'"
+            class="mt-8 text-xs font-black uppercase tracking-widest text-brand-orange hover:text-brand-navy transition-colors"
+          >
+            ← Return Home
+          </button>
+        </div>
+      </div>
+    </div>
+  </main>
+  <Footer />
+</Layout>
+
+<script>
+  const form = document.getElementById('contact-form');
+  const successMessage = document.getElementById('success-message');
+
+  form?.addEventListener('submit', (e) => {
+    e.preventDefault();
+    
+    // In a real app, you'd send the data to a server here
+    const formData = new FormData(form as HTMLFormElement);
+    console.log('Form submitted:', Object.fromEntries(formData));
+
+    // Stubbed success state
+    form.classList.add('hidden');
+    successMessage?.classList.remove('hidden');
+    
+    // Scroll to top of the message
+    window.scrollTo({ top: 0, behavior: 'smooth' });
+  });
+</script>
diff --git a/src/pages/services.astro b/src/pages/services.astro
index f75edee5..4586bbf5 100644
--- a/src/pages/services.astro
+++ b/src/pages/services.astro
@@ -140,7 +140,7 @@ const serviceCategories = [
                   We provide code-compliant, professional work throughout Chester County. One call covers all your electrical, plumbing, HVAC, and repair needs.
                 </p>
                 <div class="flex flex-col gap-4">
-                  <a href="#contact" class="inline-block bg-brand-orange text-brand-navy px-8 py-4 rounded-brand font-industrial font-bold uppercase tracking-widest hover:bg-white transition-all w-full text-center text-lg">
+                  <a href="/contact" class="inline-block bg-brand-orange text-brand-navy px-8 py-4 rounded-brand font-industrial font-bold uppercase tracking-widest hover:bg-white transition-all w-full text-center text-lg">
                     Request A Quote
                   </a>
                   <a href="tel:4843015834" class="inline-block border-2 border-white/20 text-white px-8 py-4 rounded-brand font-industrial font-bold uppercase tracking-widest hover:bg-white hover:text-brand-navy transition-all w-full text-center">