Create a professional portfolio website for Joachim Hummel

Implement a React-Vite portfolio website for Joachim Hummel, featuring sections for bio, competencies, projects, and contact information.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 6f3329ae-2dcc-46cc-bf2e-f58b7a5fa805
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Event-Id: 93e1822d-6468-4db0-9e37-4f1f19334ba5
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/e678fe28-87ab-4437-945b-7a15e872a292/6f3329ae-2dcc-46cc-bf2e-f58b7a5fa805/MG2yXVH
Replit-Helium-Checkpoint-Created: true

artifacts/joachim-portfolio/src/components/contact.tsx

@@ -0,0 +1,42 @@
+import { motion } from "framer-motion";
+import { Mail, Github, Linkedin, Terminal } from "lucide-react";
+
+export function Contact() {
+  return (
+    <div className="py-32 border-t border-border/50">
+      <motion.div
+        initial={{ opacity: 0, scale: 0.95 }}
+        whileInView={{ opacity: 1, scale: 1 }}
+        viewport={{ once: true, margin: "-100px" }}
+        transition={{ duration: 0.6 }}
+        className="max-w-2xl mx-auto text-center p-12 rounded-2xl bg-card border border-border glow-box relative overflow-hidden"
+      >
+        <div className="absolute top-0 left-0 right-0 h-1 bg-gradient-to-r from-transparent via-primary to-transparent" />
+        
+        <Terminal className="w-12 h-12 text-primary mx-auto mb-6" />
+        
+        <h2 className="text-3xl md:text-4xl font-bold mb-4">Bereit für das nächste Projekt?</h2>
+        <p className="text-muted-foreground mb-8 text-lg">
+          Lassen Sie uns darüber sprechen, wie wir Ihre Infrastruktur modernisieren oder Ihre nächste Anwendung bauen können.
+        </p>
+        
+        <a 
+          href="mailto:hello@example.com" 
+          className="inline-flex items-center gap-2 px-8 py-4 bg-primary text-primary-foreground font-bold rounded hover:bg-primary/90 transition-all hover:scale-105"
+        >
+          <Mail className="w-5 h-5" />
+          Kontakt aufnehmen
+        </a>
+
+        <div className="mt-12 flex justify-center gap-6">
+          <a href="#" className="text-muted-foreground hover:text-primary transition-colors">
+            <Github className="w-6 h-6" />
+          </a>
+          <a href="#" className="text-muted-foreground hover:text-primary transition-colors">
+            <Linkedin className="w-6 h-6" />
+          </a>
+        </div>
+      </motion.div>
+    </div>
+  );
+}