From ccaaffe04bdbc6168c44106fa27df54f1b9fc507 Mon Sep 17 00:00:00 2001
From: ZGaetano <zgaetano@wilddragon.net>
Date: Sat, 18 Apr 2026 16:27:46 -0400
Subject: [PATCH] Polish pass: remove testimonial, mailto CTA, refine spacing
 and typography: Contact.tsx

---
 src/components/Contact.tsx | 49 +++++++++++++++++---------------------
 1 file changed, 22 insertions(+), 27 deletions(-)

diff --git a/src/components/Contact.tsx b/src/components/Contact.tsx
index d77dbdb..a13bd57 100755
--- a/src/components/Contact.tsx
+++ b/src/components/Contact.tsx
@@ -24,18 +24,18 @@ function LinkedinIcon({ size = 20, className = "" }: { size?: number; className?
 
 export default function Contact() {
   return (
-    <section id="contact" className="py-28 md:py-36 bg-white">
+    <section id="contact" className="py-24 md:py-32 bg-white">
       <div className="max-w-6xl mx-auto px-6">
         <ScrollReveal>
-          <div className="max-w-3xl mx-auto text-center mb-16">
-            <div className="w-10 h-px bg-accent mx-auto mb-6" />
+          <div className="max-w-2xl mx-auto text-center mb-14">
+            <div className="w-8 h-px bg-accent mx-auto mb-6" />
             <p className="font-mono text-[10px] tracking-[0.3em] uppercase text-accent mb-4">
               Contact
             </p>
-            <h2 className="text-3xl md:text-4xl font-semibold text-primary leading-tight mb-6">
+            <h2 className="text-3xl md:text-4xl font-semibold text-primary leading-tight mb-5">
               Let&apos;s build something.
             </h2>
-            <p className="text-muted leading-relaxed">
+            <p className="text-muted leading-relaxed text-[15px]">
               Whether you&apos;re planning a new broadcast facility, upgrading
               existing infrastructure, or exploring cloud and IP-based production
               workflows, I&apos;d love to discuss your project.
@@ -43,15 +43,15 @@ export default function Contact() {
           </div>
         </ScrollReveal>
 
-        <div className="grid grid-cols-1 md:grid-cols-3 gap-5 max-w-3xl mx-auto mb-16">
+        <div className="grid grid-cols-1 md:grid-cols-3 gap-4 max-w-2xl mx-auto mb-14">
           <ScrollReveal delay={0}>
             <a
               href="mailto:zgaetano@wilddragon.net"
-              className="group flex flex-col items-center p-8 rounded-xl border border-neutral-200/80 hover:border-accent/20 hover:shadow-lg hover:shadow-neutral-200/50 transition-all duration-300 bg-white"
+              className="group flex flex-col items-center p-7 rounded-xl border border-neutral-200/80 hover:border-accent/20 hover:shadow-md hover:shadow-neutral-200/60 transition-all duration-300 bg-white"
             >
-              <div className="w-12 h-12 rounded-full bg-neutral-50 border border-neutral-100 flex items-center justify-center mb-4 group-hover:bg-accent/5 group-hover:border-accent/20 transition-all duration-300">
+              <div className="w-11 h-11 rounded-full bg-neutral-50 border border-neutral-100 flex items-center justify-center mb-4 group-hover:bg-accent/5 group-hover:border-accent/20 transition-all duration-300">
                 <Mail
-                  size={18}
+                  size={16}
                   className="text-neutral-400 group-hover:text-accent transition-colors duration-300"
                   strokeWidth={1.5}
                 />
@@ -66,29 +66,25 @@ export default function Contact() {
               href="https://www.linkedin.com/in/zachary-gaetano-05962386/"
               target="_blank"
               rel="noopener noreferrer"
-              className="group flex flex-col items-center p-8 rounded-xl border border-neutral-200/80 hover:border-accent/20 hover:shadow-lg hover:shadow-neutral-200/50 transition-all duration-300 bg-white"
+              className="group flex flex-col items-center p-7 rounded-xl border border-neutral-200/80 hover:border-accent/20 hover:shadow-md hover:shadow-neutral-200/60 transition-all duration-300 bg-white"
             >
-              <div className="w-12 h-12 rounded-full bg-neutral-50 border border-neutral-100 flex items-center justify-center mb-4 group-hover:bg-accent/5 group-hover:border-accent/20 transition-all duration-300">
+              <div className="w-11 h-11 rounded-full bg-neutral-50 border border-neutral-100 flex items-center justify-center mb-4 group-hover:bg-accent/5 group-hover:border-accent/20 transition-all duration-300">
                 <LinkedinIcon
-                  size={18}
+                  size={16}
                   className="text-neutral-400 group-hover:text-accent transition-colors duration-300"
                 />
               </div>
-              <span className="text-sm font-medium text-primary mb-1">
-                LinkedIn
-              </span>
+              <span className="text-sm font-medium text-primary mb-1">LinkedIn</span>
               <span className="text-xs text-muted">Zachary Gaetano</span>
             </a>
           </ScrollReveal>
 
           <ScrollReveal delay={160}>
-            <div className="flex flex-col items-center p-8 rounded-xl border border-neutral-200/80 bg-white">
-              <div className="w-12 h-12 rounded-full bg-neutral-50 border border-neutral-100 flex items-center justify-center mb-4">
-                <MapPin size={18} className="text-neutral-400" strokeWidth={1.5} />
+            <div className="flex flex-col items-center p-7 rounded-xl border border-neutral-100 bg-white">
+              <div className="w-11 h-11 rounded-full bg-neutral-50 border border-neutral-100 flex items-center justify-center mb-4">
+                <MapPin size={16} className="text-neutral-300" strokeWidth={1.5} />
               </div>
-              <span className="text-sm font-medium text-primary mb-1">
-                Location
-              </span>
+              <span className="text-sm font-medium text-primary mb-1">Location</span>
               <span className="text-xs text-muted">Washington, DC Area</span>
             </div>
           </ScrollReveal>
@@ -97,8 +93,7 @@ export default function Contact() {
         {/* CTA Banner */}
         <ScrollReveal delay={200}>
           <div className="relative overflow-hidden rounded-2xl bg-primary p-10 md:p-14 text-center">
-            {/* Subtle pattern */}
-            <div className="absolute inset-0 opacity-[0.04]">
+            <div className="absolute inset-0 opacity-[0.03]">
               <div
                 className="absolute inset-0"
                 style={{
@@ -108,19 +103,19 @@ export default function Contact() {
               />
             </div>
             <div className="relative z-10">
-              <h3 className="text-2xl md:text-3xl font-semibold text-white mb-4">
+              <h3 className="text-2xl md:text-3xl font-semibold text-white mb-3">
                 Ready to start your next project?
               </h3>
-              <p className="text-neutral-400 mb-8 max-w-lg mx-auto">
+              <p className="text-neutral-500 mb-8 max-w-md mx-auto text-[15px] leading-relaxed">
                 From initial concept through commissioning and training, I bring
                 a complete lifecycle approach to every facility I design.
               </p>
               <a
                 href="mailto:zgaetano@wilddragon.net"
-                className="inline-flex items-center gap-2 px-8 py-3.5 bg-accent text-white text-sm font-medium rounded-md hover:bg-accent-light transition-all duration-200 hover:shadow-lg hover:shadow-accent/20 group"
+                className="inline-flex items-center gap-2 px-7 py-3 bg-accent text-white text-sm font-medium rounded-md hover:bg-accent-light transition-all duration-200 hover:shadow-lg hover:shadow-accent/20 group"
               >
                 Start a Conversation
-                <ArrowRight size={15} className="group-hover:translate-x-1 transition-transform duration-200" />
+                <ArrowRight size={14} className="group-hover:translate-x-1 transition-transform duration-200" />
               </a>
             </div>
           </div>