Transform webapp into Resume Branches - Git for CVs

Features:
- Complete CV version control system with branching and submission tracking
- Interactive tree visualization showing master resume, branches, and submissions
- Diff viewer for tracking changes between CV versions
- Professional landing page with Git for CVs messaging
- Modern dashboard with three-panel layout (tree, details, preview)
- ATS-safe design philosophy throughout
- Tailwind 4 configuration with professional design system

Components:
- CVTree: Interactive expandable tree for CV versions
- DiffViewer: Visual diff display with add/remove/change highlighting
- Comprehensive data models for documents, versions, patches, submissions
- Upload modal and action buttons for CV management
- Status tracking and public sharing indicators

Architecture:
- TypeScript types for complete CV management workflow
- Responsive design with proper hover states and animations
- Mock data demonstrating realistic ML Engineer and Backend Engineer branches
- Ready for FastAPI backend integration and DOCX processing

This implements the complete 'Resume Branches' vision as a modern webapp
that treats CV management like version control for documents.

apps/webapp/src/components/Header.tsx

@@ -1,24 +1,50 @@
 import Link from "next/link";
-import { getLocale } from "@/libs/locales";
 
 export default function Header() {
-  const { common } = getLocale('en');
-
   return (
-    <header>
-      {/* TODO: Style this header when implementing in your project */}
-      <div>
-        <div>
-          <div>
-            <Link href="/">{common.header.brand}</Link>
+    <header className="bg-white border-b border-gray-200 sticky top-0 z-40">
+      <div className="max-w-7xl mx-auto px-6 py-4">
+        <div className="flex items-center justify-between">
+          <div className="flex items-center">
+            <Link href="/" className="text-xl font-bold text-gray-900 hover:text-blue-600 transition-colors">
+              Resume Branches
+            </Link>
           </div>
-          <nav>
-            <Link href="/">{common.header.nav.home}</Link>
-            <Link href="/dashboard">{common.header.nav.dashboard}</Link>
-            <Link href="/blog">{common.header.nav.blog}</Link>
+          
+          <nav className="hidden md:flex items-center space-x-8">
+            <Link 
+              href="/" 
+              className="text-gray-600 hover:text-gray-900 font-medium transition-colors"
+            >
+              Home
+            </Link>
+            <Link 
+              href="/dashboard" 
+              className="text-gray-600 hover:text-gray-900 font-medium transition-colors"
+            >
+              Dashboard
+            </Link>
+            <Link 
+              href="/docs" 
+              className="text-gray-600 hover:text-gray-900 font-medium transition-colors"
+            >
+              Docs
+            </Link>
           </nav>
-          <div>
-            <Link href="/login">{common.header.actions.signIn}</Link>
+          
+          <div className="flex items-center gap-3">
+            <Link 
+              href="/login" 
+              className="text-gray-600 hover:text-gray-900 font-medium transition-colors"
+            >
+              Sign In
+            </Link>
+            <Link 
+              href="/dashboard" 
+              className="btn-primary"
+            >
+              Get Started
+            </Link>
           </div>
         </div>
       </div>