Added profile photo to header

Author: devohme-id

assets/img/profile.png

@@ -68,10 +68,24 @@
       </div>
 
       <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
-        <div
-          class="inline-block mb-4 px-4 py-1 rounded-full bg-blue-100 dark:bg-blue-500/10 border border-blue-200 dark:border-blue-500/20 text-blue-600 dark:text-blue-400 text-sm font-medium"
-        >
-          Senior IT Specialist
+        <!-- Profile Photo -->
+        <div class="mb-8 relative inline-block">
+          <div
+            class="w-32 h-32 md:w-40 md:h-40 rounded-full overflow-hidden border-4 border-white dark:border-slate-800 shadow-xl relative z-10 mx-auto"
+          >
+            <img src="assets/img/profile.png" alt="Profile" class="w-full h-full object-cover" />
+          </div>
+          <div
+            class="absolute inset-0 bg-blue-500 rounded-full blur-xl opacity-20 dark:opacity-40 animate-pulse"
+          ></div>
+        </div>
+
+        <div class="block mb-4">
+          <div
+            class="inline-block px-4 py-1 rounded-full bg-blue-100 dark:bg-blue-500/10 border border-blue-200 dark:border-blue-500/20 text-blue-600 dark:text-blue-400 text-sm font-medium"
+          >
+            Senior IT Specialist
+          </div>
         </div>
         <h2 class="text-2xl md:text-3xl font-semibold text-slate-700 dark:text-slate-300 mb-2">
           Hi, I am <span class="text-slate-900 dark:text-white" id="profile-name"></span>