feat: add it.mana.how landing page for European tech sovereignty

New Astro landing page at services/it-landing/ targeting European organizations that need independent, GDPR-compliant IT infrastructure. 10 sections: - Hero: "Technologische Souveränität für Europa" with 75% self-hosted stat - Problem: US Cloud Act, vendor lock-in, GDPR conflicts, Schrems II - Solution: IndependenceBar (animated 75% progress) + 3 principles - Infrastructure Grid: 21 components color-coded (green/amber/red) - GDPR: 6 compliance cards (all rights, breach notification, AI safety) - Open Source Stack: 8 comparisons (PostgreSQL vs DynamoDB, etc.) - Target Audiences: Government, healthcare, education, SMBs - Roadmap: Timeline from current state to 90%+ independence (2027) - FAQ: 8 questions about sovereignty, Cloud Act, local AI, costs - CTA: Contact for consultation Features: - Light EU Sovereign theme (#003399 EU blue, professional B2B design) - German (default) + English (/en/) with Astro i18n - Custom components: InfrastructureGrid, IndependenceBar (scroll animation) - Data from docs/TECH_STACK_INDEPENDENCE.md (real infrastructure stats) - Legal pages: Impressum, Datenschutz - Deploy: pnpm deploy:landing:it → Cloudflare Pages Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-05-14 22:21:10 +02:00 · 2026-03-24 10:04:59 +01:00 · 2026-03-24 10:04:59 +01:00 · fea6a8e64b
commit fea6a8e64b
parent c27f6f88f0
20 changed files with 1209 additions and 0 deletions
--- a/package.json
+++ b/package.json
@ -248,6 +248,7 @@
 		"deploy:landing:clock": "pnpm --filter @clock/landing build && npx wrangler pages deploy apps/clock/apps/landing/dist --project-name=clocks-landing",
 		"deploy:landing:mail": "pnpm --filter @mail/landing build && npx wrangler pages deploy apps/mail/apps/landing/dist --project-name=mail-landing",
 		"deploy:landing:moodlit": "pnpm --filter @moodlit/landing build && npx wrangler pages deploy apps/moodlit/apps/landing/dist --project-name=moodlit-landing",
+		"deploy:landing:it": "pnpm --filter @mana/it-landing build && npx wrangler pages deploy services/it-landing/dist --project-name=it-landing",
 		"deploy:landing:all": "pnpm deploy:landing:calendar && pnpm deploy:landing:chat && pnpm deploy:landing:picture && pnpm deploy:landing:manacore && pnpm deploy:landing:manadeck && pnpm deploy:landing:zitare && pnpm deploy:landing:presi && pnpm deploy:landing:clock && pnpm deploy:landing:mail && pnpm deploy:landing:nutriphi",
 		"dev:docs": "pnpm --filter @manacore/docs dev",
 		"build:docs": "pnpm --filter @manacore/docs build",
--- a/services/it-landing/astro.config.mjs
+++ b/services/it-landing/astro.config.mjs
@ -0,0 +1,15 @@
+import { defineConfig } from 'astro/config';
+import tailwind from '@astrojs/tailwind';
+import sitemap from '@astrojs/sitemap';
+
+export default defineConfig({
+	site: 'https://it.mana.how',
+	integrations: [tailwind(), sitemap()],
+	i18n: {
+		defaultLocale: 'de',
+		locales: ['de', 'en'],
+		routing: {
+			prefixDefaultLocale: false,
+		},
+	},
+});
--- a/services/it-landing/package.json
+++ b/services/it-landing/package.json
@ -0,0 +1,26 @@
+{
+	"name": "@mana/it-landing",
+	"version": "0.1.0",
+	"private": true,
+	"type": "module",
+	"scripts": {
+		"dev": "astro dev --port 4330",
+		"start": "astro dev",
+		"build": "astro check && astro build",
+		"preview": "astro preview",
+		"astro": "astro",
+		"type-check": "astro check"
+	},
+	"dependencies": {
+		"@astrojs/check": "^0.9.0",
+		"@astrojs/sitemap": "^3.2.1",
+		"@manacore/shared-landing-ui": "workspace:*",
+		"astro": "^5.16.0",
+		"typescript": "^5.0.0"
+	},
+	"devDependencies": {
+		"@astrojs/tailwind": "^6.0.0",
+		"@tailwindcss/typography": "^0.5.16",
+		"tailwindcss": "^3.4.17"
+	}
+}
--- a/services/it-landing/public/favicon.svg
+++ b/services/it-landing/public/favicon.svg
@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
+  <rect width="32" height="32" rx="4" fill="#003399"/>
+  <text x="16" y="22" text-anchor="middle" font-family="Inter, sans-serif" font-weight="700" font-size="16" fill="#FFCC00">IT</text>
+</svg>
--- a/services/it-landing/src/components/IndependenceBar.astro
+++ b/services/it-landing/src/components/IndependenceBar.astro
@ -0,0 +1,74 @@
+---
+interface Props {
+	percent: number;
+	target: number;
+	labelCurrent?: string;
+	labelTarget?: string;
+}
+
+const { percent, target, labelCurrent = 'Self-Hosted', labelTarget = 'Ziel' } = Astro.props;
+---
+
+<div class="mx-auto max-w-3xl py-12" id="independence-bar">
+	<div class="mb-4 flex items-end justify-between">
+		<div>
+			<span class="text-5xl font-bold text-primary">{percent}%</span>
+			<span class="ml-2 text-lg text-text-secondary">{labelCurrent}</span>
+		</div>
+		<div class="text-right">
+			<span class="text-lg text-text-muted">{labelTarget}: {target}%+</span>
+		</div>
+	</div>
+
+	<div class="relative h-6 overflow-hidden rounded-full bg-border">
+		<!-- Current progress -->
+		<div
+			class="independence-fill absolute inset-y-0 left-0 rounded-full bg-primary transition-all duration-1000 ease-out"
+			style={`width: 0%`}
+			data-target-width={`${percent}%`}
+		>
+		</div>
+
+		<!-- Target marker -->
+		<div
+			class="absolute inset-y-0 border-l-2 border-dashed border-text-muted"
+			style={`left: ${target}%`}
+		>
+		</div>
+	</div>
+
+	<div class="mt-4 flex gap-6 text-sm text-text-muted">
+		<div class="flex items-center gap-2">
+			<span class="inline-block h-3 w-3 rounded-full bg-green-500"></span>
+			Self-Hosted (14)
+		</div>
+		<div class="flex items-center gap-2">
+			<span class="inline-block h-3 w-3 rounded-full bg-amber-500"></span>
+			Cloud, ersetzbar (5)
+		</div>
+		<div class="flex items-center gap-2">
+			<span class="inline-block h-3 w-3 rounded-full bg-red-500"></span>
+			Cloud, unvermeidbar (2)
+		</div>
+	</div>
+</div>
+
+<script>
+	const observer = new IntersectionObserver(
+		(entries) => {
+			entries.forEach((entry) => {
+				if (entry.isIntersecting) {
+					const fill = entry.target.querySelector('.independence-fill') as HTMLElement;
+					if (fill) {
+						fill.style.width = fill.dataset.targetWidth || '75%';
+					}
+					observer.unobserve(entry.target);
+				}
+			});
+		},
+		{ threshold: 0.3 }
+	);
+
+	const bar = document.getElementById('independence-bar');
+	if (bar) observer.observe(bar);
+</script>
--- a/services/it-landing/src/components/InfrastructureGrid.astro
+++ b/services/it-landing/src/components/InfrastructureGrid.astro
@ -0,0 +1,52 @@
+---
+import type { InfraComponent } from '../data/infrastructure';
+
+interface Props {
+	items: InfraComponent[];
+}
+
+const { items } = Astro.props;
+
+const statusColors = {
+	'self-hosted': {
+		bg: 'bg-green-50',
+		border: 'border-green-200',
+		badge: 'bg-green-100 text-green-800',
+		label: 'Self-Hosted',
+	},
+	replaceable: {
+		bg: 'bg-amber-50',
+		border: 'border-amber-200',
+		badge: 'bg-amber-100 text-amber-800',
+		label: 'Migration geplant',
+	},
+	unavoidable: {
+		bg: 'bg-red-50',
+		border: 'border-red-200',
+		badge: 'bg-red-100 text-red-800',
+		label: 'Cloud (unvermeidbar)',
+	},
+};
+---
+
+<div class="grid grid-cols-2 gap-3 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5">
+	{
+		items.map((item) => {
+			const colors = statusColors[item.status];
+			return (
+				<div
+					class={`rounded-lg border p-4 transition-shadow hover:shadow-md ${colors.bg} ${colors.border}`}
+				>
+					<div class="mb-2 text-2xl">{item.icon}</div>
+					<h4 class="text-sm font-semibold text-text-primary">{item.name}</h4>
+					<p class="mt-1 text-xs text-text-muted">{item.technology}</p>
+					<span
+						class={`mt-2 inline-block rounded-full px-2 py-0.5 text-xs font-medium ${colors.badge}`}
+					>
+						{colors.label}
+					</span>
+				</div>
+			);
+		})
+	}
+</div>
--- a/services/it-landing/src/data/audiences.ts
+++ b/services/it-landing/src/data/audiences.ts
@ -0,0 +1,26 @@
+export const audiences = [
+	{
+		icon: '🏛️',
+		title: 'Öffentliche Verwaltung',
+		description:
+			'Behörden und öffentliche Einrichtungen, die digitale Souveränität umsetzen müssen. DSGVO-konform, keine US-Cloud-Abhängigkeit, transparenter Open-Source-Stack.',
+	},
+	{
+		icon: '🏥',
+		title: 'Gesundheitswesen',
+		description:
+			'Krankenhäuser, Praxen und Gesundheitsorganisationen mit höchsten Datenschutzanforderungen. Patientendaten bleiben garantiert in Deutschland.',
+	},
+	{
+		icon: '🎓',
+		title: 'Bildung & Forschung',
+		description:
+			'Universitäten, Schulen und Forschungseinrichtungen, die unabhängige KI-Tools und sichere Kommunikation benötigen. Sonderkonditionen verfügbar.',
+	},
+	{
+		icon: '🏢',
+		title: 'Mittelstand (KMU)',
+		description:
+			'Europäische Unternehmen, die sich von Big-Tech-Abhängigkeit lösen und gleichzeitig modernste KI-Tools nutzen wollen. Flexibles Credit-System statt Abo-Falle.',
+	},
+];
--- a/services/it-landing/src/data/faq.ts
+++ b/services/it-landing/src/data/faq.ts
@ -0,0 +1,42 @@
+export const faqs = [
+	{
+		question: 'Was bedeutet technologische Souveränität?',
+		answer:
+			'Die Fähigkeit, Ihre IT-Infrastruktur unabhängig von ausländischen Anbietern zu betreiben und zu kontrollieren. Bei Mana heißt das: 75% unserer Infrastruktur läuft auf eigenen Servern in Deutschland — mit dem Ziel, 90%+ zu erreichen.',
+	},
+	{
+		question: 'Warum ist der US Cloud Act ein Problem?',
+		answer:
+			'Der US Cloud Act verpflichtet amerikanische Unternehmen, US-Behörden Zugang zu Daten zu gewähren — auch wenn diese auf Servern in Europa gespeichert sind. Das steht im direkten Widerspruch zur DSGVO und gefährdet die Datenhoheit europäischer Organisationen.',
+	},
+	{
+		question: 'Welche Cloud-Abhängigkeiten bleiben bestehen?',
+		answer:
+			'Nur zwei: Stripe für Zahlungsabwicklung (es gibt keinen vollständig europäischen Payment-Gateway-Ersatz) und Google OAuth für den optionalen Google-Kontakte-Import. Alle anderen Komponenten sind self-hosted oder werden aktiv migriert.',
+	},
+	{
+		question: 'Wie funktioniert die lokale KI?',
+		answer:
+			'Wir betreiben Ollama mit Modellen wie Gemma 3 auf unserem Server in Deutschland. FLUX.2 generiert Bilder lokal, Whisper transkribiert Sprache, Piper und Kokoro synthetisieren Sprache — alles ohne Cloud-API-Aufrufe. Bei Überlastung gibt es einen optionalen Fallback auf Google Gemini.',
+	},
+	{
+		question: 'Ist der Open-Source-Stack enterprise-tauglich?',
+		answer:
+			'Absolut. PostgreSQL, Redis und MinIO betreiben die Infrastruktur von Unternehmen wie Apple, Instagram und Netflix. Diese Technologien sind bewährter als viele proprietäre Alternativen.',
+	},
+	{
+		question: 'Kann ich die Mana-Infrastruktur für meine Organisation nutzen?',
+		answer:
+			'Ja. Wir bieten Beratung und Implementierung für Organisationen, die eine ähnliche unabhängige Infrastruktur aufbauen möchten. Kontaktieren Sie uns für ein individuelles Angebot.',
+	},
+	{
+		question: 'Was kostet der Wechsel weg von US-Cloud-Anbietern?',
+		answer:
+			'Langfristig sparen Sie. Open-Source-Software hat keine Lizenzkosten. Die Initialinvestition in eigene Server amortisiert sich typischerweise innerhalb von 12-18 Monaten gegenüber Cloud-Abonnements.',
+	},
+	{
+		question: 'Wo stehen die Server?',
+		answer:
+			'In Deutschland. Die Produktionsinfrastruktur läuft auf eigener Hardware mit 74 Docker-Containern, erreichbar über einen Cloudflare Tunnel (der mittelfristig durch WireGuard ersetzt wird).',
+	},
+];
--- a/services/it-landing/src/data/features.ts
+++ b/services/it-landing/src/data/features.ts
@ -0,0 +1,97 @@
+export const problemFeatures = [
+	{
+		icon: '🛡️',
+		title: 'US Cloud Act',
+		description:
+			'US-Behörden können jederzeit auf Daten zugreifen, die bei amerikanischen Cloud-Anbietern gespeichert sind — selbst wenn die Server in Europa stehen.',
+	},
+	{
+		icon: '🔒',
+		title: 'Vendor Lock-in',
+		description:
+			'Proprietäre Systeme von AWS, Google und Microsoft schaffen Abhängigkeiten, die Millionen kosten und Innovationsfreiheit einschränken.',
+	},
+	{
+		icon: '⚠️',
+		title: 'Fehlende Kontrolle',
+		description:
+			'Bei Cloud-Ausfällen oder Preisänderungen gibt es keinen Plan B. Europäische Organisationen sind den Entscheidungen US-amerikanischer Konzerne ausgeliefert.',
+	},
+	{
+		icon: '⚖️',
+		title: 'DSGVO-Konflikte',
+		description:
+			'Schrems II hat gezeigt: Der Datentransfer in die USA ist rechtlich problematisch. Jedes Unternehmen, das US-Cloud nutzt, trägt ein Compliance-Risiko.',
+	},
+];
+
+export const gdprFeatures = [
+	{
+		icon: '✅',
+		title: 'Rechtmäßigkeit & Transparenz',
+		description:
+			'Nur technisch notwendige Cookies. Explizite Einwilligung für alle Datenverarbeitungen. Keine versteckten Datensammlungen.',
+	},
+	{
+		icon: '📉',
+		title: 'Datenminimierung',
+		description:
+			'Nur E-Mail bei Registrierung. Automatische Löschung nach Zweckerfüllung. Anonymisierte Analytics mit self-hosted Umami.',
+	},
+	{
+		icon: '👤',
+		title: 'Betroffenenrechte',
+		description:
+			'Alle 6 Rechte umgesetzt: Auskunft, Berichtigung, Löschung, Übertragbarkeit, Widerspruch, Einschränkung — per Self-Service im Dashboard.',
+	},
+	{
+		icon: '🔐',
+		title: 'Technische Sicherheit',
+		description:
+			'TLS 1.3, AES-256 Verschlüsselung, EdDSA JWT-Authentifizierung, regelmäßige Sicherheitsaudits.',
+	},
+	{
+		icon: '🚨',
+		title: '72h Breach Notification',
+		description:
+			'Automatisierte Erkennung von Datenschutzverletzungen. Sofortige interne Eskalation. Meldung an Aufsichtsbehörde innerhalb von 72 Stunden.',
+	},
+	{
+		icon: '🤖',
+		title: 'KI ohne Trainingsrisiko',
+		description:
+			'Keine Nutzerdaten für KI-Training. Lokale Modelle verarbeiten Daten direkt auf dem Server — nichts verlässt die Infrastruktur.',
+	},
+];
+
+export const stackFeatures = [
+	{ icon: '🗄️', title: 'PostgreSQL 16', description: 'Statt DynamoDB / Firestore' },
+	{ icon: '⚡', title: 'Redis 7', description: 'Statt ElastiCache' },
+	{ icon: '📦', title: 'MinIO', description: 'Statt AWS S3' },
+	{ icon: '🔐', title: 'Better Auth', description: 'Statt Auth0 / Okta' },
+	{ icon: '🔍', title: 'SearXNG', description: 'Statt Google / Algolia' },
+	{ icon: '💬', title: 'Matrix/Synapse', description: 'Statt Slack / Teams' },
+	{ icon: '🤖', title: 'Ollama + Gemma', description: 'Statt OpenAI API' },
+	{ icon: '📊', title: 'VictoriaMetrics', description: 'Statt Datadog' },
+];
+
+export const principles = [
+	{
+		icon: 'shield' as const,
+		title: 'Daten in Deutschland',
+		description:
+			'Alle Nutzerdaten verbleiben auf eigenen Servern in Deutschland. Kein Datentransfer in Drittländer. Keine US-Cloud-Abhängigkeit.',
+	},
+	{
+		icon: 'code' as const,
+		title: 'Open-Source-Stack',
+		description:
+			'PostgreSQL, Redis, MinIO, Matrix — unsere Infrastruktur basiert auf bewährten Open-Source-Technologien. Kein proprietäres Lock-in.',
+	},
+	{
+		icon: 'rocket' as const,
+		title: 'Lokale KI',
+		description:
+			'LLM, Bilderzeugung, Spracherkennung und Sprachsynthese laufen lokal auf eigener Hardware. Keine Daten verlassen den Server.',
+	},
+];
--- a/services/it-landing/src/data/infrastructure.ts
+++ b/services/it-landing/src/data/infrastructure.ts
@ -0,0 +1,116 @@
+export type InfraStatus = 'self-hosted' | 'replaceable' | 'unavoidable';
+
+export interface InfraComponent {
+	name: string;
+	technology: string;
+	status: InfraStatus;
+	icon: string;
+}
+
+export const infrastructure: InfraComponent[] = [
+	// Self-hosted (green)
+	{
+		name: 'Datenbank',
+		technology: 'PostgreSQL 16 + Drizzle ORM',
+		status: 'self-hosted',
+		icon: '🗄️',
+	},
+	{ name: 'Cache', technology: 'Redis 7', status: 'self-hosted', icon: '⚡' },
+	{
+		name: 'Object Storage',
+		technology: 'MinIO (S3-kompatibel)',
+		status: 'self-hosted',
+		icon: '📦',
+	},
+	{
+		name: 'Authentifizierung',
+		technology: 'Better Auth (EdDSA JWT)',
+		status: 'self-hosted',
+		icon: '🔐',
+	},
+	{ name: 'Suche', technology: 'SearXNG + mana-search', status: 'self-hosted', icon: '🔍' },
+	{ name: 'Messaging', technology: 'Matrix/Synapse + 13 Bots', status: 'self-hosted', icon: '💬' },
+	{
+		name: 'Monitoring',
+		technology: 'VictoriaMetrics + Grafana',
+		status: 'self-hosted',
+		icon: '📊',
+	},
+	{ name: 'Analytics', technology: 'Umami', status: 'self-hosted', icon: '📈' },
+	{
+		name: 'Error Tracking',
+		technology: 'GlitchTip (Sentry-kompatibel)',
+		status: 'self-hosted',
+		icon: '🐛',
+	},
+	{ name: 'Automation', technology: 'n8n', status: 'self-hosted', icon: '⚙️' },
+	{ name: 'LLM / KI-Chat', technology: 'Ollama + Gemma 3', status: 'self-hosted', icon: '🤖' },
+	{
+		name: 'Spracherkennung',
+		technology: 'Whisper Large V3 (mana-stt)',
+		status: 'self-hosted',
+		icon: '🎤',
+	},
+	{
+		name: 'Sprachsynthese',
+		technology: 'Piper + Kokoro (mana-tts)',
+		status: 'self-hosted',
+		icon: '🔊',
+	},
+	{
+		name: 'Bildgenerierung',
+		technology: 'FLUX.2 klein (mana-image-gen)',
+		status: 'self-hosted',
+		icon: '🎨',
+	},
+
+	// Cloud but replaceable (amber)
+	{ name: 'E-Mail', technology: 'Brevo SMTP → Postal geplant', status: 'replaceable', icon: '📧' },
+	{
+		name: 'Landing Pages',
+		technology: 'Cloudflare Pages → Self-hosted geplant',
+		status: 'replaceable',
+		icon: '🌐',
+	},
+	{
+		name: 'Tunnel/DNS',
+		technology: 'Cloudflare Tunnel → WireGuard geplant',
+		status: 'replaceable',
+		icon: '🔗',
+	},
+	{
+		name: 'Bild-API',
+		technology: 'Replicate → mana-image-gen Migration',
+		status: 'replaceable',
+		icon: '🖼️',
+	},
+	{
+		name: 'Vision-KI',
+		technology: 'Google Gemini → lokale Modelle testen',
+		status: 'replaceable',
+		icon: '👁️',
+	},
+
+	// Unavoidable cloud (red)
+	{
+		name: 'Zahlungen',
+		technology: 'Stripe (kein EU-Alternative)',
+		status: 'unavoidable',
+		icon: '💳',
+	},
+	{
+		name: 'Google OAuth',
+		technology: 'Für Kontakte-Import nötig',
+		status: 'unavoidable',
+		icon: '🔑',
+	},
+];
+
+export const stats = {
+	selfHosted: 14,
+	replaceable: 5,
+	unavoidable: 2,
+	total: 21,
+	percentSelfHosted: 75,
+	targetPercent: 90,
+};
--- a/services/it-landing/src/data/roadmap.ts
+++ b/services/it-landing/src/data/roadmap.ts
@ -0,0 +1,55 @@
+export const roadmapItems = [
+	{
+		badge: '✅ Abgeschlossen',
+		title: 'Lokale KI-Infrastruktur',
+		text: 'LLM (Ollama + Gemma 3), Bilderzeugung (FLUX.2 klein), Spracherkennung (Whisper Large V3) und Sprachsynthese (Piper + Kokoro) laufen vollständig lokal.',
+	},
+	{
+		badge: 'Q2 2026',
+		title: 'Cloud-KI eliminieren',
+		text: 'Picture App auf lokales mana-image-gen migrieren. Alle LLM-Calls über zentrales mana-llm Gateway routen mit automatischem Google-Fallback.',
+	},
+	{
+		badge: 'Q3 2026',
+		title: 'E-Mail-Unabhängigkeit',
+		text: 'Brevo SMTP durch self-hosted Postal oder Stalwart ersetzen. DNS bei eigenem europäischen Provider.',
+	},
+	{
+		badge: 'Q4 2026',
+		title: 'Landing Pages self-hosted',
+		text: 'Statische Seiten direkt vom eigenen Server ausliefern statt über Cloudflare Pages. Nginx/Caddy Container.',
+	},
+	{
+		badge: '2027',
+		title: 'Server-Redundanz & 90%+ Unabhängigkeit',
+		text: 'Zweiter Server für Hochverfügbarkeit. PostgreSQL Streaming Replication. Kein Single Point of Failure. Ziel: über 90% Self-Hosted.',
+	},
+];
+
+export const roadmapItemsEn = [
+	{
+		badge: '✅ Completed',
+		title: 'Local AI Infrastructure',
+		text: 'LLM (Ollama + Gemma 3), image generation (FLUX.2), speech recognition (Whisper), and text-to-speech (Piper + Kokoro) run fully locally.',
+	},
+	{
+		badge: 'Q2 2026',
+		title: 'Eliminate Cloud AI',
+		text: 'Migrate Picture App to local mana-image-gen. Route all LLM calls through central mana-llm gateway with automatic Google fallback.',
+	},
+	{
+		badge: 'Q3 2026',
+		title: 'Email Independence',
+		text: 'Replace Brevo SMTP with self-hosted Postal or Stalwart. DNS with own European provider.',
+	},
+	{
+		badge: 'Q4 2026',
+		title: 'Self-Hosted Landing Pages',
+		text: 'Serve static sites directly from own server instead of Cloudflare Pages.',
+	},
+	{
+		badge: '2027',
+		title: 'Server Redundancy & 90%+ Independence',
+		text: 'Second server for high availability. PostgreSQL streaming replication. No single point of failure.',
+	},
+];
--- a/services/it-landing/src/layouts/Layout.astro
+++ b/services/it-landing/src/layouts/Layout.astro
@ -0,0 +1,58 @@
+---
+import '../styles/global.css';
+
+interface Props {
+	title: string;
+	description?: string;
+	lang?: string;
+}
+
+const {
+	title,
+	description = 'Europäische Technologie-Souveränität — 75% self-hosted Infrastruktur, DSGVO-konform, Open Source',
+	lang = 'de',
+} = Astro.props;
+---
+
+<!doctype html>
+<html lang={lang}>
+	<head>
+		<meta charset="UTF-8" />
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<meta name="description" content={description} />
+		<meta name="generator" content={Astro.generator} />
+
+		<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+
+		<meta property="og:title" content={title} />
+		<meta property="og:description" content={description} />
+		<meta property="og:type" content="website" />
+		<meta property="og:locale" content={lang === 'de' ? 'de_DE' : 'en_US'} />
+
+		<meta name="twitter:card" content="summary_large_image" />
+		<meta name="twitter:title" content={title} />
+		<meta name="twitter:description" content={description} />
+
+		<link rel="preconnect" href="https://fonts.googleapis.com" />
+		<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+		<link
+			href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap"
+			rel="stylesheet"
+		/>
+
+		{
+			import.meta.env.PUBLIC_UMAMI_WEBSITE_ID && (
+				<script
+					defer
+					src="https://stats.mana.how/script.js"
+					data-website-id={import.meta.env.PUBLIC_UMAMI_WEBSITE_ID}
+				/>
+			)
+		}
+
+		<title>{title}</title>
+	</head>
+	<body class="min-h-screen bg-background-page text-text-primary antialiased">
+		<slot />
+	</body>
+</html>
--- a/services/it-landing/src/pages/datenschutz.astro
+++ b/services/it-landing/src/pages/datenschutz.astro
@ -0,0 +1,54 @@
+---
+import Layout from '../layouts/Layout.astro';
+import Container from '@manacore/shared-landing-ui/atoms/Container.astro';
+---
+
+<Layout title="Datenschutzerklärung — Mana IT">
+	<main class="py-20">
+		<Container>
+			<article class="prose prose-lg mx-auto max-w-3xl">
+				<h1>Datenschutzerklärung</h1>
+
+				<h2>1. Verantwortlicher</h2>
+				<p>
+					Mana<br />
+					E-Mail: info@mana.how
+				</p>
+
+				<h2>2. Hosting</h2>
+				<p>
+					Diese Website wird über Cloudflare Pages ausgeliefert. Cloudflare verarbeitet dabei
+					technisch notwendige Verbindungsdaten (IP-Adresse, Browser-Typ). Langfristig ist geplant,
+					die Seite selbst zu hosten.
+				</p>
+
+				<h2>3. Cookies</h2>
+				<p>
+					Diese Website verwendet <strong>keine Cookies</strong>. Es werden keine Tracking-Cookies,
+					Marketing-Cookies oder ähnliche Technologien eingesetzt.
+				</p>
+
+				<h2>4. Analytics</h2>
+				<p>
+					Wir nutzen <strong>Umami</strong>, eine selbst gehostete, DSGVO-konforme Analytics-Lösung.
+					Umami sammelt keine personenbezogenen Daten, setzt keine Cookies und anonymisiert alle
+					Zugriffsdaten. Die Daten verbleiben auf unseren eigenen Servern in Deutschland.
+				</p>
+
+				<h2>5. Kontaktaufnahme</h2>
+				<p>
+					Wenn Sie uns per E-Mail kontaktieren, werden Ihre Angaben zur Bearbeitung der Anfrage
+					gespeichert. Eine Weitergabe an Dritte findet nicht statt.
+				</p>
+
+				<h2>6. Ihre Rechte</h2>
+				<p>
+					Sie haben das Recht auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung,
+					Datenübertragbarkeit und Widerspruch. Wenden Sie sich dazu an info@mana.how.
+				</p>
+
+				<p><a href="/">&larr; Zurück zur Startseite</a></p>
+			</article>
+		</Container>
+	</main>
+</Layout>
--- a/services/it-landing/src/pages/en/index.astro
+++ b/services/it-landing/src/pages/en/index.astro
@ -0,0 +1,314 @@
+---
+import Layout from '../../layouts/Layout.astro';
+
+import HeroSection from '@manacore/shared-landing-ui/sections/HeroSection.astro';
+import FeatureSection from '@manacore/shared-landing-ui/sections/FeatureSection.astro';
+import PrinciplesSection from '@manacore/shared-landing-ui/sections/PrinciplesSection.astro';
+import TimelineSection from '@manacore/shared-landing-ui/sections/TimelineSection.astro';
+import FAQSection from '@manacore/shared-landing-ui/sections/FAQSection.astro';
+import CTASection from '@manacore/shared-landing-ui/sections/CTASection.astro';
+import Container from '@manacore/shared-landing-ui/atoms/Container.astro';
+import SectionHeader from '@manacore/shared-landing-ui/atoms/SectionHeader.astro';
+
+import IndependenceBar from '../../components/IndependenceBar.astro';
+import InfrastructureGrid from '../../components/InfrastructureGrid.astro';
+
+import { infrastructure, stats } from '../../data/infrastructure';
+import { roadmapItemsEn } from '../../data/roadmap';
+---
+
+<Layout
+	title="Mana IT — Technological Sovereignty for Europe"
+	description="75% self-hosted infrastructure in Germany. No US Cloud Act. GDPR compliant. Open Source stack."
+	lang="en"
+>
+	<nav
+		class="fixed top-0 z-50 w-full border-b border-border bg-background-page/95 backdrop-blur-sm"
+	>
+		<Container>
+			<div class="flex h-16 items-center justify-between">
+				<a href="/en/" class="text-xl font-bold text-primary">Mana IT</a>
+				<div class="hidden items-center gap-6 md:flex">
+					<a href="#problem" class="text-sm text-text-secondary hover:text-primary">Why?</a>
+					<a href="#infrastructure" class="text-sm text-text-secondary hover:text-primary"
+						>Infrastructure</a
+					>
+					<a href="#gdpr" class="text-sm text-text-secondary hover:text-primary">GDPR</a>
+					<a href="#audiences" class="text-sm text-text-secondary hover:text-primary">For whom?</a>
+					<a href="#roadmap" class="text-sm text-text-secondary hover:text-primary">Roadmap</a>
+					<a href="#faq" class="text-sm text-text-secondary hover:text-primary">FAQ</a>
+					<a href="/" class="text-sm text-text-muted hover:text-primary">DE</a>
+					<a
+						href="#contact"
+						class="rounded-lg bg-primary px-4 py-2 text-sm font-medium text-white hover:bg-primary-hover"
+						>Contact</a
+					>
+				</div>
+			</div>
+		</Container>
+	</nav>
+
+	<main class="pt-16">
+		<HeroSection
+			title="Technological Sovereignty for Europe"
+			subtitle="75% of our infrastructure runs on self-hosted servers in Germany. No US Cloud Act. No third-party dependencies. Full GDPR compliance."
+			variant="centered"
+			primaryCta={{ text: 'Explore Infrastructure', href: '#infrastructure' }}
+			secondaryCta={{ text: 'Get in Touch', href: '#contact' }}
+			trustBadges={[
+				{ icon: '🛡️', text: 'GDPR Compliant' },
+				{ icon: '🇩🇪', text: 'Servers in Germany' },
+				{ icon: '🔓', text: 'Open Source Stack' },
+			]}
+		/>
+
+		<FeatureSection
+			id="problem"
+			title="Why Europe Needs Independent Technology"
+			subtitle="Dependence on US cloud providers is a strategic risk for European organizations."
+			features={[
+				{
+					icon: '🛡️',
+					title: 'US Cloud Act',
+					description:
+						'US authorities can access data stored with American cloud providers at any time — even when servers are located in Europe.',
+				},
+				{
+					icon: '🔒',
+					title: 'Vendor Lock-in',
+					description:
+						'Proprietary systems from AWS, Google, and Microsoft create dependencies that cost millions and limit innovation.',
+				},
+				{
+					icon: '⚠️',
+					title: 'Lack of Control',
+					description:
+						'When cloud services go down or prices change, there is no plan B. European organizations are at the mercy of US corporations.',
+				},
+				{
+					icon: '⚖️',
+					title: 'GDPR Conflicts',
+					description:
+						'Schrems II showed: data transfers to the US are legally problematic. Every company using US cloud carries a compliance risk.',
+				},
+			]}
+			columns={2}
+		/>
+
+		<section id="solution" class="py-16">
+			<Container>
+				<SectionHeader
+					title="Our Answer: Self-Hosted Infrastructure"
+					subtitle="The Mana platform proves that a full SaaS ecosystem works without US cloud dependencies."
+				/>
+				<IndependenceBar
+					percent={stats.percentSelfHosted}
+					target={stats.targetPercent}
+					labelCurrent="Self-Hosted"
+					labelTarget="Target"
+				/>
+			</Container>
+		</section>
+
+		<PrinciplesSection
+			principles={[
+				{
+					icon: 'shield',
+					title: 'Data in Germany',
+					description:
+						'All user data stays on our own servers in Germany. No data transfer to third countries. No US cloud dependency.',
+				},
+				{
+					icon: 'code',
+					title: 'Open Source Stack',
+					description:
+						'PostgreSQL, Redis, MinIO, Matrix — our infrastructure is built on proven open-source technologies. No proprietary lock-in.',
+				},
+				{
+					icon: 'rocket',
+					title: 'Local AI',
+					description:
+						'LLM, image generation, speech recognition, and text-to-speech run locally on our own hardware. No data leaves the server.',
+				},
+			]}
+		/>
+
+		<section id="infrastructure" class="py-16">
+			<Container>
+				<SectionHeader
+					title="Our Infrastructure in Detail"
+					subtitle="14 of 21 core components run entirely on our own hardware in Germany."
+				/>
+				<InfrastructureGrid items={infrastructure} />
+			</Container>
+		</section>
+
+		<FeatureSection
+			id="gdpr"
+			title="GDPR Compliance at Every Level"
+			subtitle="Not just on paper — technically and organizationally implemented."
+			features={[
+				{
+					icon: '✅',
+					title: 'Lawfulness & Transparency',
+					description:
+						'Only technically necessary cookies. Explicit consent for all data processing. No hidden data collection.',
+				},
+				{
+					icon: '📉',
+					title: 'Data Minimization',
+					description:
+						'Only email required for registration. Automatic deletion after purpose fulfillment. Anonymized analytics with self-hosted Umami.',
+				},
+				{
+					icon: '👤',
+					title: 'Data Subject Rights',
+					description:
+						'All 6 rights implemented: Access, Rectification, Erasure, Portability, Objection, Restriction — via self-service dashboard.',
+				},
+				{
+					icon: '🔐',
+					title: 'Technical Security',
+					description:
+						'TLS 1.3, AES-256 encryption, EdDSA JWT authentication, regular security audits.',
+				},
+				{
+					icon: '🚨',
+					title: '72h Breach Notification',
+					description:
+						'Automated detection of data breaches. Immediate internal escalation. Notification to authorities within 72 hours.',
+				},
+				{
+					icon: '🤖',
+					title: 'AI Without Training Risk',
+					description:
+						'No user data for AI training. Local models process data directly on the server — nothing leaves the infrastructure.',
+				},
+			]}
+			columns={3}
+		/>
+
+		<FeatureSection
+			id="stack"
+			title="Open Technologies Instead of Proprietary Silos"
+			subtitle="Proven open-source software replaces expensive cloud services — without quality loss."
+			features={[
+				{ icon: '🗄️', title: 'PostgreSQL 16', description: 'Instead of DynamoDB / Firestore' },
+				{ icon: '⚡', title: 'Redis 7', description: 'Instead of ElastiCache' },
+				{ icon: '📦', title: 'MinIO', description: 'Instead of AWS S3' },
+				{ icon: '🔐', title: 'Better Auth', description: 'Instead of Auth0 / Okta' },
+				{ icon: '🔍', title: 'SearXNG', description: 'Instead of Google / Algolia' },
+				{ icon: '💬', title: 'Matrix/Synapse', description: 'Instead of Slack / Teams' },
+				{ icon: '🤖', title: 'Ollama + Gemma', description: 'Instead of OpenAI API' },
+				{ icon: '📊', title: 'VictoriaMetrics', description: 'Instead of Datadog' },
+			]}
+			columns={4}
+		/>
+
+		<FeatureSection
+			id="audiences"
+			title="Who Is This For?"
+			subtitle="European organizations with high requirements for data protection and independence."
+			features={[
+				{
+					icon: '🏛️',
+					title: 'Public Administration',
+					description:
+						'Government agencies implementing digital sovereignty. GDPR compliant, no US cloud dependency, transparent open-source stack.',
+				},
+				{
+					icon: '🏥',
+					title: 'Healthcare',
+					description:
+						'Hospitals, practices, and health organizations with the highest data protection requirements. Patient data guaranteed to stay in Germany.',
+				},
+				{
+					icon: '🎓',
+					title: 'Education & Research',
+					description:
+						'Universities, schools, and research institutions needing independent AI tools and secure communication. Special conditions available.',
+				},
+				{
+					icon: '🏢',
+					title: 'SMBs (Mittelstand)',
+					description:
+						'European companies breaking free from Big Tech dependency while using state-of-the-art AI tools. Flexible credit system instead of subscription trap.',
+				},
+			]}
+			columns={2}
+		/>
+
+		<section id="roadmap">
+			<TimelineSection
+				title="Our Path to 90%+ Independence"
+				subtitle="Transparent roadmap — from today to full sovereignty."
+				items={roadmapItemsEn}
+			/>
+		</section>
+
+		<FAQSection
+			id="faq"
+			title="Frequently Asked Questions"
+			faqs={[
+				{
+					question: 'What does technological sovereignty mean?',
+					answer:
+						'The ability to operate and control your IT infrastructure independently of foreign providers. At Mana, this means: 75% of our infrastructure runs on our own servers in Germany — with the goal of reaching 90%+.',
+				},
+				{
+					question: 'Why is the US Cloud Act a problem?',
+					answer:
+						'The US Cloud Act obliges American companies to grant US authorities access to data — even when stored on servers in Europe. This directly contradicts GDPR and threatens European data sovereignty.',
+				},
+				{
+					question: 'Which cloud dependencies remain?',
+					answer:
+						'Only two: Stripe for payment processing (there is no fully European payment gateway alternative) and Google OAuth for optional Google contacts import.',
+				},
+				{
+					question: 'How does local AI work?',
+					answer:
+						'We run Ollama with models like Gemma 3 on our server in Germany. FLUX.2 generates images locally, Whisper transcribes speech, Piper and Kokoro synthesize speech — all without cloud API calls.',
+				},
+				{
+					question: 'Is the open-source stack enterprise-ready?',
+					answer:
+						'Absolutely. PostgreSQL, Redis, and MinIO power the infrastructure of companies like Apple, Instagram, and Netflix. These technologies are more proven than many proprietary alternatives.',
+				},
+				{
+					question: 'Can I use the Mana infrastructure for my organization?',
+					answer:
+						'Yes. We offer consulting and implementation for organizations looking to build similar independent infrastructure. Contact us for a custom offer.',
+				},
+				{
+					question: 'Where are the servers located?',
+					answer:
+						'In Germany. The production infrastructure runs on own hardware with 74 Docker containers, connected via a Cloudflare Tunnel (which will be replaced by WireGuard in the medium term).',
+				},
+			]}
+		/>
+
+		<CTASection
+			id="contact"
+			title="Ready for Digital Sovereignty?"
+			subtitle="Let us make your IT infrastructure independent together. We are happy to advise you — free of charge and transparent."
+			primaryCta={{ text: 'Schedule a Consultation', href: 'mailto:info@mana.how' }}
+			secondaryCta={{ text: 'Technical Documentation', href: 'https://mana.how' }}
+		/>
+	</main>
+
+	<footer class="border-t border-border py-8">
+		<Container>
+			<div
+				class="flex flex-col items-center justify-between gap-4 text-sm text-text-muted md:flex-row"
+			>
+				<p>&copy; 2026 Mana. All rights reserved.</p>
+				<div class="flex gap-6">
+					<a href="/impressum" class="hover:text-primary">Imprint</a>
+					<a href="/datenschutz" class="hover:text-primary">Privacy</a>
+					<a href="https://mana.how" class="hover:text-primary">mana.how</a>
+				</div>
+			</div>
+		</Container>
+	</footer>
+</Layout>
--- a/services/it-landing/src/pages/impressum.astro
+++ b/services/it-landing/src/pages/impressum.astro
@ -0,0 +1,34 @@
+---
+import Layout from '../layouts/Layout.astro';
+import Container from '@manacore/shared-landing-ui/atoms/Container.astro';
+---
+
+<Layout title="Impressum — Mana IT">
+	<main class="py-20">
+		<Container>
+			<article class="prose prose-lg mx-auto max-w-3xl">
+				<h1>Impressum</h1>
+
+				<h2>Angaben gemäß § 5 TMG</h2>
+				<p>
+					Mana<br />
+					Kontakt: info@mana.how
+				</p>
+
+				<h2>Kontakt</h2>
+				<p>
+					E-Mail: info@mana.how<br />
+					Website: <a href="https://mana.how">mana.how</a>
+				</p>
+
+				<h2>Haftungsausschluss</h2>
+				<p>
+					Die Inhalte unserer Seiten wurden mit größter Sorgfalt erstellt. Für die Richtigkeit,
+					Vollständigkeit und Aktualität der Inhalte können wir jedoch keine Gewähr übernehmen.
+				</p>
+
+				<p><a href="/">&larr; Zurück zur Startseite</a></p>
+			</article>
+		</Container>
+	</main>
+</Layout>
--- a/services/it-landing/src/pages/index.astro
+++ b/services/it-landing/src/pages/index.astro
@ -0,0 +1,170 @@
+---
+import Layout from '../layouts/Layout.astro';
+
+// Shared sections
+import HeroSection from '@manacore/shared-landing-ui/sections/HeroSection.astro';
+import FeatureSection from '@manacore/shared-landing-ui/sections/FeatureSection.astro';
+import PrinciplesSection from '@manacore/shared-landing-ui/sections/PrinciplesSection.astro';
+import TimelineSection from '@manacore/shared-landing-ui/sections/TimelineSection.astro';
+import FAQSection from '@manacore/shared-landing-ui/sections/FAQSection.astro';
+import CTASection from '@manacore/shared-landing-ui/sections/CTASection.astro';
+import Container from '@manacore/shared-landing-ui/atoms/Container.astro';
+import SectionHeader from '@manacore/shared-landing-ui/atoms/SectionHeader.astro';
+
+// Custom components
+import IndependenceBar from '../components/IndependenceBar.astro';
+import InfrastructureGrid from '../components/InfrastructureGrid.astro';
+
+// Data
+import { problemFeatures, gdprFeatures, stackFeatures, principles } from '../data/features';
+import { infrastructure, stats } from '../data/infrastructure';
+import { faqs } from '../data/faq';
+import { roadmapItems } from '../data/roadmap';
+import { audiences } from '../data/audiences';
+---
+
+<Layout
+	title="Mana IT — Europäische Technologie-Souveränität"
+	description="75% self-hosted Infrastruktur in Deutschland. Kein US Cloud Act. DSGVO-konform. Open Source Stack."
+>
+	<!-- Navigation -->
+	<nav
+		class="fixed top-0 z-50 w-full border-b border-border bg-background-page/95 backdrop-blur-sm"
+	>
+		<Container>
+			<div class="flex h-16 items-center justify-between">
+				<a href="/" class="text-xl font-bold text-primary">Mana IT</a>
+				<div class="hidden items-center gap-6 md:flex">
+					<a href="#problem" class="text-sm text-text-secondary hover:text-primary">Warum?</a>
+					<a href="#infrastructure" class="text-sm text-text-secondary hover:text-primary"
+						>Infrastruktur</a
+					>
+					<a href="#gdpr" class="text-sm text-text-secondary hover:text-primary">DSGVO</a>
+					<a href="#audiences" class="text-sm text-text-secondary hover:text-primary">Für wen?</a>
+					<a href="#roadmap" class="text-sm text-text-secondary hover:text-primary">Roadmap</a>
+					<a href="#faq" class="text-sm text-text-secondary hover:text-primary">FAQ</a>
+					<a href="/en/" class="text-sm text-text-muted hover:text-primary">EN</a>
+					<a
+						href="#contact"
+						class="rounded-lg bg-primary px-4 py-2 text-sm font-medium text-white hover:bg-primary-hover"
+					>
+						Kontakt
+					</a>
+				</div>
+			</div>
+		</Container>
+	</nav>
+
+	<main class="pt-16">
+		<!-- 1. Hero -->
+		<HeroSection
+			title="Technologische Souveränität für Europa"
+			subtitle="75% unserer Infrastruktur läuft auf eigenen Servern in Deutschland. Kein US Cloud Act. Keine Drittanbieter-Abhängigkeit. Volle DSGVO-Konformität."
+			variant="centered"
+			primaryCta={{ text: 'Infrastruktur entdecken', href: '#infrastructure' }}
+			secondaryCta={{ text: 'Kontakt aufnehmen', href: '#contact' }}
+			trustBadges={[
+				{ icon: '🛡️', text: 'DSGVO-konform' },
+				{ icon: '🇩🇪', text: 'Server in Deutschland' },
+				{ icon: '🔓', text: 'Open Source Stack' },
+			]}
+		/>
+
+		<!-- 2. Problem -->
+		<FeatureSection
+			id="problem"
+			title="Warum Europa unabhängige Technologie braucht"
+			subtitle="Die Abhängigkeit von US-amerikanischen Cloud-Anbietern ist ein strategisches Risiko für europäische Organisationen."
+			features={problemFeatures}
+			columns={2}
+		/>
+
+		<!-- 3. Lösung: Independence Bar + Prinzipien -->
+		<section id="solution" class="py-16">
+			<Container>
+				<SectionHeader
+					title="Unsere Antwort: Self-Hosted Infrastruktur"
+					subtitle="Die Mana-Plattform beweist, dass ein vollwertiges SaaS-Ökosystem ohne US-Cloud-Abhängigkeit funktioniert."
+				/>
+				<IndependenceBar percent={stats.percentSelfHosted} target={stats.targetPercent} />
+			</Container>
+		</section>
+
+		<PrinciplesSection principles={principles} />
+
+		<!-- 4. Infrastructure Grid -->
+		<section id="infrastructure" class="py-16">
+			<Container>
+				<SectionHeader
+					title="Unsere Infrastruktur im Detail"
+					subtitle="14 von 21 Kernkomponenten laufen vollständig auf eigener Hardware in Deutschland."
+				/>
+				<InfrastructureGrid items={infrastructure} />
+			</Container>
+		</section>
+
+		<!-- 5. DSGVO -->
+		<FeatureSection
+			id="gdpr"
+			title="DSGVO-Konformität auf allen Ebenen"
+			subtitle="Nicht nur auf dem Papier — technisch und organisatorisch umgesetzt."
+			features={gdprFeatures}
+			columns={3}
+		/>
+
+		<!-- 6. Open Source Stack -->
+		<FeatureSection
+			id="stack"
+			title="Offene Technologien statt proprietärer Silos"
+			subtitle="Bewährte Open-Source-Software ersetzt teure Cloud-Dienste — ohne Qualitätsverlust."
+			features={stackFeatures}
+			columns={4}
+		/>
+
+		<!-- 7. Zielgruppen -->
+		<FeatureSection
+			id="audiences"
+			title="Für wen ist das relevant?"
+			subtitle="Europäische Organisationen mit hohen Anforderungen an Datenschutz und Unabhängigkeit."
+			features={audiences}
+			columns={2}
+		/>
+
+		<!-- 8. Roadmap -->
+		<section id="roadmap">
+			<TimelineSection
+				title="Unser Weg zu 90%+ Unabhängigkeit"
+				subtitle="Transparente Roadmap — von heute bis zur vollständigen Souveränität."
+				items={roadmapItems}
+			/>
+		</section>
+
+		<!-- 9. FAQ -->
+		<FAQSection id="faq" title="Häufig gestellte Fragen" faqs={faqs} />
+
+		<!-- 10. CTA -->
+		<CTASection
+			id="contact"
+			title="Bereit für digitale Souveränität?"
+			subtitle="Lassen Sie uns gemeinsam Ihre IT-Infrastruktur unabhängig machen. Wir beraten Sie gerne — unverbindlich und transparent."
+			primaryCta={{ text: 'Beratungsgespräch vereinbaren', href: 'mailto:info@mana.how' }}
+			secondaryCta={{ text: 'Technische Dokumentation', href: 'https://mana.how' }}
+		/>
+	</main>
+
+	<!-- Footer -->
+	<footer class="border-t border-border py-8">
+		<Container>
+			<div
+				class="flex flex-col items-center justify-between gap-4 text-sm text-text-muted md:flex-row"
+			>
+				<p>&copy; 2026 Mana. Alle Rechte vorbehalten.</p>
+				<div class="flex gap-6">
+					<a href="/impressum" class="hover:text-primary">Impressum</a>
+					<a href="/datenschutz" class="hover:text-primary">Datenschutz</a>
+					<a href="https://mana.how" class="hover:text-primary">mana.how</a>
+				</div>
+			</div>
+		</Container>
+	</footer>
+</Layout>
--- a/services/it-landing/src/styles/global.css
+++ b/services/it-landing/src/styles/global.css
@ -0,0 +1,25 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+:root {
+	/* EU Sovereign Theme — Light Mode */
+	--color-primary: #003399;
+	--color-primary-hover: #002266;
+	--color-primary-glow: rgba(0, 51, 153, 0.15);
+
+	--color-text-primary: #1a1a2e;
+	--color-text-secondary: #4a4a6a;
+	--color-text-muted: #8888a0;
+
+	--color-background-page: #f8f9fc;
+	--color-background-card: #ffffff;
+	--color-background-card-hover: #f0f2f8;
+
+	--color-border: #e2e4ec;
+	--color-border-hover: #c8ccd8;
+}
+
+html {
+	scroll-behavior: smooth;
+}
--- a/services/it-landing/tailwind.config.mjs
+++ b/services/it-landing/tailwind.config.mjs
@ -0,0 +1,40 @@
+/** @type {import('tailwindcss').Config} */
+export default {
+	content: [
+		'./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}',
+		'../../packages/shared-landing-ui/src/**/*.{astro,html,js,jsx,ts,tsx}',
+	],
+	theme: {
+		extend: {
+			colors: {
+				primary: {
+					DEFAULT: '#003399',
+					hover: '#002266',
+					glow: 'rgba(0, 51, 153, 0.15)',
+				},
+				accent: {
+					DEFAULT: '#FFCC00',
+					hover: '#E6B800',
+				},
+				background: {
+					page: '#f8f9fc',
+					card: '#ffffff',
+					'card-hover': '#f0f2f8',
+				},
+				text: {
+					primary: '#1a1a2e',
+					secondary: '#4a4a6a',
+					muted: '#8888a0',
+				},
+				border: {
+					DEFAULT: '#e2e4ec',
+					hover: '#c8ccd8',
+				},
+			},
+			fontFamily: {
+				sans: ['Inter', 'system-ui', 'sans-serif'],
+			},
+		},
+	},
+	plugins: [require('@tailwindcss/typography')],
+};
--- a/services/it-landing/tsconfig.json
+++ b/services/it-landing/tsconfig.json
@ -0,0 +1,3 @@
+{
+	"extends": "astro/tsconfigs/strict"
+}
--- a/services/it-landing/wrangler.toml
+++ b/services/it-landing/wrangler.toml
@ -0,0 +1,3 @@
+name = "it-landing"
+compatibility_date = "2024-12-01"
+pages_build_output_dir = "dist"