feat(about, contact, header, hero, skills): enhance component structure and navigation

- Added section IDs to About, Contact, and Hero components for improved navigation and accessibility.
- Refactored Header component to utilize a structured navigation array, enhancing maintainability and responsiveness.
- Updated Skills component to improve type handling and visual consistency, including a loading state and error handling.
- Adjusted styling and animations across components for a smoother user experience and better visual appeal.

app/components/Hero.tsx

@@ -21,7 +21,7 @@ export default function Hero() {
   };
 
   return (
-    <section className="relative min-h-screen flex items-center justify-center overflow-hidden bg-[#030712]">
+    <section id="home" className="relative min-h-screen flex items-center justify-center overflow-hidden bg-[#030712]">
       {/* 1. Background Engineering: Grid Pattern & Radial Shading */}
       <div className="absolute inset-0 z-0">
         <div className="absolute inset-0 bg-[linear-gradient(to_right,#1f2937_1px,transparent_1px),linear-gradient(to_bottom,#1f2937_1px,transparent_1px)] bg-[size:4rem_4rem] [mask-image:radial-gradient(ellipse_60%_50%_at_50%_0%,#000_70%,transparent_100%)] opacity-20" />