Refactor AppHeader and AreaTabs components for improved layout and functionality

- Adjusted AppHeader.vue for better spacing and alignment of elements, enhancing the overall visual appeal.
- Updated AreaTabs.vue to include a new 'Start' tab with a home icon, improving navigation options.
- Modified route handling in AreaTabs.vue to dynamically determine the current area based on the route.
- Changed default redirect destination in useAuth.ts to the root path for a more intuitive user experience.
- Enhanced index.vue to provide a more welcoming message and improved content presentation.

These changes aim to enhance user navigation and overall experience within the application.

app/components/navigation/AreaTabs.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { Wrench, FlaskConical, Ticket, Sparkles, GraduationCap } from 'lucide-vue-next'
+import { Wrench, FlaskConical, Ticket, Sparkles, GraduationCap, Home } from 'lucide-vue-next'
 import { Tabs, TabsList, TabsTrigger } from '@/components/ui/tabs'
 import { Badge } from '@/components/ui/badge'
 
@@ -14,6 +14,14 @@ interface ProductArea {
 }
 
 const areas: ProductArea[] = [
+  {
+    id: 'start',
+    label: 'Start',
+    icon: Home,
+    enabled: true,
+    visible: true,
+    route: '/',
+  },
   {
     id: 'makerspace',
     label: 'Makerspace Jahreskarte',
@@ -54,17 +62,20 @@ const areas: ProductArea[] = [
 const route = useRoute()
 
 const currentArea = computed(() => {
-  // Determine current area based on route
-  if (route.path.startsWith('/products') || route.path === '/') {
-    return 'makerspace'
-  } else if (route.path.startsWith('/educator')) {
-    return 'educator'
-  } else if (route.path.startsWith('/labs')) {
-    return 'labs'
-  } else if (route.path.startsWith('/experimenta')) {
-    return 'experimenta'
+  // Determine current area based on route - check areas array dynamically
+  const currentPath = route.path
+
+  // Exact match for root path
+  if (currentPath === '/') {
+    return areas.find(area => area.route === '/')?.id || ''
   }
-  return 'makerspace'
+
+  // Find area where route path starts with area.route
+  const matchedArea = areas.find(area =>
+    area.route !== '/' && currentPath.startsWith(area.route)
+  )
+
+  return matchedArea?.id || ''
 })
 
 function navigateToArea(area: ProductArea) {