Upload components/Contact.js with huggingface_hub

components/Contact.js

@@ -0,0 +1,71 @@
+'use client';
+
+import { motion } from 'framer-motion';
+import { Mail, MapPin, Linkedin, Twitter } from 'lucide-react';
+
+export default function Contact() {
+  return (
+    <section id="contact" className="py-32 px-6 relative">
+      <div className="max-w-4xl mx-auto text-center">
+        <motion.h2 
+          initial={{ opacity: 0, y: 20 }}
+          whileInView={{ opacity: 1, y: 0 }}
+          className="font-serif text-5xl md:text-7xl mb-8"
+        >
+          Initiate Protocol
+        </motion.h2>
+        
+        <motion.p 
+          initial={{ opacity: 0 }}
+          whileInView={{ opacity: 1 }}
+          transition={{ delay: 0.2 }}
+          className="font-mono text-faint mb-12 max-w-lg mx-auto"
+        >
+          Open for research collaborations, speaking engagements, and high-impact engineering consulting.
+        </motion.p>
+
+        <motion.a
+          href="mailto:contact@airesearcher.ai"
+          initial={{ scale: 0.9, opacity: 0 }}
+          whileInView={{ scale: 1, opacity: 1 }}
+          whileHover={{ scale: 1.05 }}
+          whileTap={{ scale: 0.95 }}
+          className="liquid-btn inline-block px-12 py-5 text-lg font-serif tracking-wide"
+        >
+          Establish Connection
+        </motion.a>
+
+        <motion.div 
+          initial={{ opacity: 0 }}
+          whileInView={{ opacity: 1 }}
+          transition={{ delay: 0.4 }}
+          className="mt-24 grid grid-cols-1 md:grid-cols-3 gap-8 border-t border-white/10 pt-12"
+        >
+          <div className="flex flex-col items-center gap-2 group">
+            <Mail className="w-5 h-5 text-faint group-hover:text-white transition-colors" />
+            <span className="font-mono text-xs uppercase tracking-widest text-faint group-hover:text-white transition-colors">contact@airesearcher.ai</span>
+          </div>
+          <div className="flex flex-col items-center gap-2 group">
+            <MapPin className="w-5 h-5 text-faint group-hover:text-white transition-colors" />
+            <span className="font-mono text-xs uppercase tracking-widest text-faint group-hover:text-white transition-colors">San Francisco, CA</span>
+          </div>
+          <div className="flex justify-center gap-6">
+            <a href="#" className="text-faint hover:text-white transition-colors"><Linkedin size={20} /></a>
+            <a href="#" className="text-faint hover:text-white transition-colors"><Twitter size={20} /></a>
+          </div>
+        </motion.div>
+
+        <div className="mt-20">
+          <a 
+            href="https://huggingface.co/spaces/akhaliq/anycoder" 
+            target="_blank" 
+            rel="noopener noreferrer"
+            className="font-mono text-[10px] uppercase tracking-widest text-white/30 hover:text-white/60 transition-colors"
+          >
+            Built with anycoder
+          </a>
+        </div>
+      </div>
+    </section>
+  );
+}