refactor: convert button elements to semantic anchor tags and ignore downloads directory

.gitignore

@@ -42,3 +42,6 @@ next-env.d.ts
 
 # Apache server configuration files
 htaccess
+
+# Ignore all files in downloads directory
+public/assets/downloads/*

src/components/Hero.tsx

@@ -1,11 +1,13 @@
-import Link from "next/link";
 import SocialLinks from "./Social";
 
+/**
+ * Hero section showcasing intro title, call-to-action links, and personal portrait
+ */
 export default function Hero() {
   return (
     <section className="relative pt-18 py-6 px-4 md:px-6 md:pt-24 max-w-5xl mx-auto">
       <div className="grid grid-cols-1 md:grid-cols-12 gap-3 items-center z-10 w-full">
-        {/* Left column */}
+        {/* Main Content & Call to Actions */}
         <div className=" self-start md:col-span-8 lg:space-y-5 md:space-y-4 space-y-3 text-left">
           <span className="text-blue-500 font-mono text-sm tracking-wider uppercase">
             // Hi, my name is
@@ -32,24 +34,26 @@ export default function Hero() {
              */}
           </p>
 
-          {/* Buttons */}
+          {/* Action Buttons */}
           <div className="flex flex-wrap justify-center sm:justify-start gap-4 pb-0 md:pb-4">
-            <Link
+            <a
               href="#contactme"
-              className="px-6 py-3 bg-slate-900 text-blue-500 font-semibold rounded-lg border border-blue-500/40 hover:border-blue-400 hover:bg-blue-600 hover:text-white shadow-md shadow-blue-950/50 transition-all duration-200 hover:-translate-y-0.5 hover:shadow-lg hover:shadow-blue-500/20"
+              className="px-6 py-3 bg-slate-900 text-blue-500 font-semibold rounded-lg border border-blue-500/40 hover:border-blue-400 hover:bg-blue-600 hover:text-white shadow-md shadow-blue-950/50 transition-all duration-200 hover:-translate-y-0.5 hover:shadow-lg hover:shadow-blue-500/20 inline-block text-center"
             >
               Contact me
-            </Link>
+            </a>
-            <Link
+            <a
-              href="https://andre-kempf.com/assets/downloads/Andre_Kempf_Lebenslauf_2025.pdf"
+              href="/assets/downloads/Andre_Kempf_Lebenslauf.pdf"
-              className="px-6 py-3 bg-slate-900 border border-slate-800 hover:border-slate-700 hover:bg-slate-850 font-semibold rounded-lg transition-all hover:-translate-y-0.5 duration-200"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="px-6 py-3 bg-slate-900 border border-slate-800 hover:border-slate-700 hover:bg-slate-850 font-semibold rounded-lg transition-all hover:-translate-y-0.5 duration-200 inline-block text-center"
             >
               Download CV
-            </Link>
+            </a>
           </div>
         </div>
 
-        {/* Right column */}
+        {/* Profile Image Frame */}
         <div className="self-start md:col-span-4 flex justify-center p-3 md:p-0">
           <div className="relative group h-auto w-70 lg:w-66 md:w-59 aspect-5/6">
             <div className="relative w-full h-full rounded-2xl border-5 border-slate-800 bg-slate-900 overflow-hidden flex items-center justify-center group-hover:border-blue-500/50 transition-colors duration-300">
@@ -62,6 +66,8 @@ export default function Hero() {
           </div>
         </div>
       </div>
+
+      {/* Social Media Links Bar */}
       <SocialLinks />
     </section>
   );