feat(moritzgrafde): rewrite personal website with Vue 3, Vite, and Tailwind CSS

- Replace legacy Hugo static site generator and hugo-goa theme with a modern Vue 3 + Vite + TypeScript application
- Implement Clean Enterprise design system using Tailwind CSS with light/dark mode support
- Position website around Cloud Platform & Infrastructure Leadership (GCP & AWS central platforms, Kubernetes at scale, enterprise spin-off governance, and systems depth) without chronological resumes
- Add 6 comprehensive capability dossiers and verified credential badges (CKA, PSM II, M.Sc.)
- Implement interactive skill matrix with real-time text search and category filtering
- Add engineering philosophy section, contact channels with one-click email copying, and Impressum modal
- Configure multi-stage Dockerfile (Node builder to Nginx runtime) with custom gzip, caching, and security headers
- Update build scripts (Makefile, build.sh), .gitignore, and AGENTS.md documentation across the monorepo

projects/moritzgrafde/AGENTS.md

@@ -1,31 +1,37 @@
 # AGENTS.md — Moritz Graf Personal Website (`moritzgrafde`)
 
 > [!NOTE]
-> **Domain**: Personal portfolio and homepage for Moritz Graf.  
+> **Domain**: Personal executive portfolio and capabilities showcase for Moritz Graf.  
 > **Live Production URL**: `https://moritzgraf.de`  
 > **Kubernetes Manifest**: `k8s/web/moritzgrafde.yaml` (Namespace: `web`)  
 > **Container Image**: `registry.haumdaucher.de/moritzgrafde:latest`  
-> **Source Location**: `projects/moritzgrafde/` (Migrated from standalone `moritzgraf` repo)
+> **Source Location**: `projects/moritzgrafde/`
 
 ---
 
-## 🏛️ Architecture & Build Pipeline
+## 🏛️ Architecture & Tech Stack
 
 1. **Stack**:
-   - Static site generated with [Hugo](https://gohugo.io/) using the `hugo-goa` theme.
-   - Served via lightweight `nginx` container (`Dockerfile`).
-   - The compiled static site is maintained in `public/`.
+   - **Frontend Framework**: Vue 3 (Composition API, `<script setup lang="ts">`).
+   - **Build Tooling**: Vite 6 + TypeScript (`vue-tsc`).
+   - **Styling**: Tailwind CSS v4 with Clean Enterprise / Executive design system (light/dark dual mode).
+   - **Icons**: Lucide Vue Next.
+   - **Serving Runtime**: Nginx (`nginx:alpine`) configured with gzip compression, SPA history routing fallback, security headers, and asset caching.
 
 2. **Container Build & Architecture**:
-   - The target Kubernetes node `haumdaucher` runs on **`linux/amd64`**.
-   - Build command:
+   - Multi-stage Dockerfile (`node:22-alpine` builder &rarr; `nginx:alpine` runtime).
+   - Target architecture: **`linux/amd64`**.
+   - Build commands:
      ```bash
-     docker build --platform linux/amd64 -t registry.haumdaucher.de/moritzgrafde:latest .
-     docker push registry.haumdaucher.de/moritzgrafde:latest
+     cd projects/moritzgrafde
+     make compile          # Local static bundle build to dist/
+     make build            # Docker multi-stage build (linux/amd64)
+     make push             # Push to registry.haumdaucher.de
+     make deploy           # Rollout restart on Kubernetes
      ```
 
-3. **Deployment**:
-   - Deployed to the Kubernetes cluster in namespace `web`.
+3. **Kubernetes Deployment**:
+   - Deployed to the Kubernetes cluster in namespace `web` (`k8s/web/moritzgrafde.yaml`).
    - Ingress controller: Traefik, Let's Encrypt SSL via `cert-manager`.
    - Rollout restart:
      ```bash
@@ -37,9 +43,38 @@
 
 ## 📁 Repository Structure
 
-- `content/`: Hugo content markdown files.
-- `themes/hugo-goa/`: Hugo Goa theme layouts and partials.
-- `public/`: Pre-rendered production assets and HTML ready for the Nginx container.
-- `Dockerfile`: Minimal Nginx container copying `./public/` to `/usr/share/nginx/html/`.
-- `build.sh`: Convenience build, push, and redeploy script.
-- `config.toml`: Hugo site configuration.
+```
+projects/moritzgrafde/
+├── Dockerfile                  # Multi-stage container build (Node builder -> Nginx runtime)
+├── Makefile                    # Standard make targets (compile, dev, build, push, deploy)
+├── build.sh                    # Automated build, push, and Kubernetes redeploy script
+├── nginx.conf                  # Nginx configuration (gzip, caching, security headers)
+├── package.json                # Dependencies and build scripts
+├── vite.config.ts              # Vite configuration with Vue and Tailwind v4 plugins
+├── tsconfig.json               # TypeScript configuration with @/* path aliases
+├── index.html                  # HTML entrypoint with metadata and Google Fonts
+├── public/
+│   └── headshot.jpg            # Portrait image (drop-in replaceable)
+└── src/
+    ├── main.ts                 # Vue app initialization
+    ├── App.vue                 # Top-level application layout
+    ├── style.css               # Tailwind CSS v4 entrypoint & base styles
+    ├── types.ts                # TypeScript interfaces for portfolio data models
+    ├── data/
+    │   └── portfolioData.ts    # Single source of truth for capabilities, skills, and links
+    └── components/
+        ├── Navbar.vue          # Sticky header with navigation & dark mode switcher
+        ├── Hero.vue            # Executive hero with portrait, credentials & CTAs
+        ├── ImpactStats.vue     # Scale & impact metrics (Multi-Cloud, Spin-Off, K8s, 12+ Years)
+        ├── CapabilityDossiers.vue # 6 deep capability pillars
+        ├── SkillMatrix.vue     # Interactive skill search & category filter
+        ├── EngineeringPhilosophy.vue # Declarative Everything, Self-Service, Systems Thinking
+        ├── ContactSection.vue  # Direct email copy button & verified professional links
+        └── ImpressumModal.vue  # Legal notice & privacy modal
+```
+
+---
+
+## 🖼️ Updating the Portrait Image
+
+To update the portrait image, simply replace `projects/moritzgrafde/public/headshot.jpg` with the new photo (JPEG/PNG) and run `make compile && make build && make push && make deploy`.