diff --git a/docs-v3/.data/content/contents.sqlite b/docs-v3/.data/content/contents.sqlite
index 85a9567d..785d778c 100644
Binary files a/docs-v3/.data/content/contents.sqlite and b/docs-v3/.data/content/contents.sqlite differ
diff --git a/docs-v3/components/website/WebsiteNavbar.vue b/docs-v3/components/website/WebsiteNavbar.vue
index 5f60ab35..dc106b46 100644
--- a/docs-v3/components/website/WebsiteNavbar.vue
+++ b/docs-v3/components/website/WebsiteNavbar.vue
@@ -14,12 +14,12 @@
           </button>
           
           <!-- Logo -->
-          <NuxtLink to="/" class="flex items-center ml-2 lg:ml-0">
-            <div class="w-8 h-8 bg-gradient-to-br from-red-500 to-red-600 rounded-lg flex items-center justify-center">
-              <span class="text-white font-bold text-lg">R</span>
-            </div>
-            <span class="ml-3 text-xl font-semibold text-gray-900 dark:text-white">
-              Laravel Restify
+          <NuxtLink to="/" class="flex items-center ml-2 lg:ml-0 group">
+            <span class="text-2xl font-bold tracking-tight">
+              <span class="bg-gradient-to-r from-gray-900 via-gray-700 to-gray-900 dark:from-white dark:via-gray-200 dark:to-white bg-clip-text text-transparent drop-shadow-sm">
+                Laravel Restify
+              </span>
+              <span class="inline-block w-2 h-2 ml-0.5 mb-1 rounded-full bg-gradient-to-br from-red-500 to-red-600 shadow-lg shadow-red-500/50 group-hover:shadow-red-500/70 group-hover:scale-110 transition-all duration-300"></span>
             </span>
           </NuxtLink>
         </div>
@@ -156,6 +156,8 @@
 </template>
 
 <script setup lang="ts">
+import { Bars3Icon } from '@heroicons/vue/24/outline'
+
 // Mobile menu state
 const isMobileMenuOpen = ref(false)