multi lang mit hugo

multithame
some style changes
2026-02-28 21:44:43 +00:00 · 2026-02-28 19:10:44 +00:00 · 2026-02-28 17:20:21 +00:00 · 2026-02-28 16:46:38 +00:00
14 changed files with 1050 additions and 609 deletions
--- a/13
+++ b/13
@@ -0,0 +1,13 @@
+# Stage 1: Hugo bauen
+FROM klakegg/hugo:alpine AS builder
+# WICHTIG: Kopiere das gesamte Verzeichnis, nicht nur den Inhalt
+COPY . /src
+# Bauen der Seite
+RUN hugo
+
+# Stage 2: Nginx ausliefern
+FROM nginx:alpine
+# Kopieren der generierten Seite
+COPY --from=builder /src/public /usr/share/nginx/html
+# Nginx läuft auf Port 80
+EXPOSE 80
--- a/compose.yml
+++ b/compose.yml
@@ -1,15 +1,21 @@
 services:
  webpage:
-    image: nginx:alpine
+    #image: nginx:alpine
+    build:
+      context: .
+      args:
+        HUGO_BASEURL: https://${DOMAIN_MAIN}/ # Nimmt den Wert aus deiner .env
    container_name: webpage
    restart: unless-stopped
-    environment:
-      - TITLE=${TITLE}
-      - DOMAIN_MAIN=${DOMAIN_MAIN}
+    #environment:
+    #  - TITLE=${TITLE}
+    #  - DOMAIN_MAIN=${DOMAIN_MAIN}
      #- NGINX_ENVSUBST_OUTPUT_DIR=/usr/share/nginx/html
-    volumes:
-      - ./html/index.html:/usr/share/nginx/html/index.html:ro
-      - ./html/style.css:/usr/share/nginx/html/style.css:ro
+    #volumes:
+    #  - ./html/index.html:/usr/share/nginx/html/index.html:ro
+    #  - ./html/style.css:/usr/share/nginx/html/style.css:ro
+    #  - ./html/script.js:/usr/share/nginx/html/script.js:ro
+      
      # Wir mounten das Template - Nginx macht daraus beim Start die echte index.html
      #- ./html/index.html.template:/etc/nginx/templates/index.html.template:ro
      
--- a/config.toml
+++ b/config.toml
@@ -0,0 +1,21 @@
+baseURL = "/" # Setze dies auf "/" für relative Pfade oder fest auf die Domain
+languageCode = "de"
+defaultContentLanguage = "de"
+defaultContentLanguageInSubdir = true 
+
+[languages]
+  [languages.de]
+    languageName = "Deutsch"
+    weight = 1
+  [languages.en]
+    languageName = "English"
+    weight = 2
+  [languages.fr]
+    languageName = "Français"
+    weight = 3
+  [languages.es]
+    languageName = "Español"
+    weight = 4
+  [languages.ru]
+    languageName = "Русский"
+    weight = 5
--- a/content/_index.de.md
+++ b/content/_index.de.md
@@ -0,0 +1,62 @@
+---
+title: "Ground Zero Lab - KI für kritische Wahrheit"
+description: "Entdecken Sie die Wissenschaft hinter den Mythen - 9/11, Klima, Gesundheit und mehr"
+lang: de
+
+# Menü
+menu_about: "Über Uns"
+menu_projects: "Projekte"
+menu_tech: "Methoden"
+menu_demo: "Demo"
+menu_community: "Community"
+
+# Hero
+hero_subtitle: "KI für kritische Wahrheit"
+hero_title: "🚧 Ground Zero Lab"
+hero_text: "Entdecken die Wissenschaft hinter den Mythen...<br>9/11, CO2-Klimawahn, Gesundheit und mehr"
+cta_button: "Jetzt entdecken"
+
+# About
+about_title: "Über Uns"
+
+# Projekte
+projects_title: "Unsere Hauptprojekte"
+projects_list:
+  - title: "9/11 Ground Zero Model"
+    description: "Das erste KI-Modell, das die 9/11-Ereignisse wissenschaftlich analysiert. Zugriff auf Originaldokumente, wissenschaftliche Analysen und alternative Theorien. Entdecken Sie, was die offiziellen Narrative verschweigen."
+  - title: "Klimawandel Analyse"
+    description: "KI-gestützte Analyse von Klimadaten und Propaganda. CO2-Debatte, alternative Erklärungen, wissenschaftliche Studien. Verstehen Sie die Komplexität des Klimawandels jenseits der Mainstream-Narrative."
+  - title: "Gesundheits-Dogmen"
+    description: "Kritische Analyse von Gesundheitspolitik und Pharmaindustrie. Impfpolitik, Medikamentenstudien, alternative Medizin. Hinterfragen Sie etablierte Gesundheitsnarrative mit wissenschaftlicher Strenge."
+
+# Methoden
+tech_title: "Unsere Methoden"
+tech_list:
+  - title: "Open-Weight-Modelle"
+    description: "Wir nutzen nur Modelle mit offenen Gewichten. Dies ermöglicht volle Kontrolle über Systempropts und Parameter, sodass wir die Modelle genau an unsere Bedürfnisse anpassen können."
+  - title: "RAG-Technologie"
+    description: "Wissensdatenbanken für präzise Antworten. Durch die Kombination von Retrieval und Generation erhalte stets aktuelle Informationen aus wissenschaftlichen Quellen."
+  - title: "Fine-Tuning"
+    description: "Maßgeschneiderte Modelle für spezifische Themen. Training auf verifizierten Daten und gezielte Eliminierung von Propaganda führt zu konsistenten, wissenschaftlich koherenten Antworten. Kein: 'Es ist 'wissenschaftlicher' Konsens, dass sie Ausnahme die Regel bestätigt'. Unangenehme Wiedersprüche werden klar benannt und aufgelöst."
+
+# Demo
+demo_title: "Live-Demo"
+demo_text: "Probiere unsere Workarounds und Standart-Modelle oder selbst finegetunte Modelle aus. Erleben den Unterschiede selbst. Unsere interaktiven Demos zeigen dir, wie unsere KI arbeitet und welche Erkenntnisse sie liefern kann."
+demo_btn1: "9/11-Chat"
+demo_btn2: "Klimawandel-Tool"
+demo_btn3: "Gesundheits-Analyse"
+
+# Community
+community_title: "Community"
+community_text: "Werde Teil unserer wachsenden Community von Querdenkern und Wahrheitssuchenden. Austausch, Zusammenarbeit und gemeinsame Entdeckungen erwarten dich."
+comm_btn1: "Forum / Nextcloud"
+comm_btn2: "Archiv / Gitea"
+
+# Footer
+footer_text: "Ground Zero Lab - KI für kritische Wahrheit"
+---
+Wir entwickeln KI-Workarounds und Modelle, die Propaganda durchschauen und wissenschaftliche Wahrheit liefern. 
+In einer Welt, in der Desinformation die KI-Landschaft dominiert, bieten wir eine Alternative: 
+Modelle, die auf verifizierten Fakten und wissenschaftlichen Erkenntnissen trainiert sind. 
+Unser Team besteht aus Forschern für Datenwissenschaft, Geschichte und kritisches Denken, 
+die gemeinsam an der Aufgabe arbeiten, verborgene Wahrheiten ans Licht zu bringen.
--- a/content/_index.en.md
+++ b/content/_index.en.md
@@ -0,0 +1,62 @@
+---
+title: "Ground Zero Lab - AI for Critical Truth"
+description: "Discover the science behind the myths - 9/11, Climate, Health, and more"
+lang: en
+
+# Menu
+menu_about: "About Us"
+menu_projects: "Projects"
+menu_tech: "Methods"
+menu_demo: "Demo"
+menu_community: "Community"
+
+# Hero
+hero_subtitle: "AI for Critical Truth"
+hero_title: "🚧 Ground Zero Lab"
+hero_text: "Discover the science behind the myths...<br>9/11, CO2 Climate Hysteria, Health, and more"
+cta_button: "Explore Now"
+
+# About
+about_title: "About Us"
+
+# Projects
+projects_title: "Our Main Projects"
+projects_list:
+  - title: "9/11 Ground Zero Model"
+    description: "The first AI model to scientifically analyze the 9/11 events. Access to original documents, scientific analyses, and alternative theories. Discover what official narratives hide."
+  - title: "Climate Change Analysis"
+    description: "AI-powered analysis of climate data and propaganda. CO2 debate, alternative explanations, scientific studies. Understand the complexity of climate change beyond mainstream narratives."
+  - title: "Health Dogmas"
+    description: "Critical analysis of health policy and the pharmaceutical industry. Vaccination policy, drug studies, alternative medicine. Question established health narratives with scientific rigor."
+
+# Methods
+tech_title: "Our Methods"
+tech_list:
+  - title: "Open-Weight Models"
+    description: "We only use open-weight models. This allows full control over system prompts and parameters, so we can customize the models precisely to our needs."
+  - title: "RAG Technology"
+    description: "Knowledge databases for precise answers. By combining retrieval and generation, you always get current information from scientific sources."
+  - title: "Fine-Tuning"
+    description: "Custom-made models for specific topics. Training on verified data and targeted elimination of propaganda leads to consistent, scientifically coherent answers. No: 'It is 'scientific' consensus that the exception proves the rule'. Uncomfortable contradictions are clearly named and resolved."
+
+# Demo
+demo_title: "Live Demo"
+demo_text: "Try out our workarounds and standard models or even fine-tuned models. Experience the difference yourself. Our interactive demos show you how our AI works and what insights it can provide."
+demo_btn1: "9/11 Chat"
+demo_btn2: "Climate Tool"
+demo_btn3: "Health Analysis"
+
+# Community
+community_title: "Community"
+community_text: "Become part of our growing community of freethinkers and truth-seekers. Exchange, collaboration, and shared discoveries await you."
+comm_btn1: "Forum / Nextcloud"
+comm_btn2: "Archive / Gitea"
+
+# Footer
+footer_text: "Ground Zero Lab - AI for Critical Truth"
+---
+We develop AI workarounds and models that bypass propaganda and deliver scientific truth.
+In a world dominated by disinformation in the AI landscape, we offer an alternative:
+models trained on verified facts and scientific knowledge.
+Our team consists of researchers in data science, history, and critical thinking,
+working together to bring hidden truths to light.
--- a/content/_index.es.md
+++ b/content/_index.es.md
@@ -0,0 +1,58 @@
+---
+title: "Ground Zero Lab - IA para la Verdad Crítica"
+description: "Descubra la ciencia detrás de los mitos - 9/11, Clima, Salud y más"
+lang: es
+
+# Menu
+menu_about: "Nosotros"
+menu_projects: "Proyectos"
+menu_tech: "Métodos"
+menu_demo: "Demo"
+menu_community: "Comunidad"
+
+# Hero
+hero_subtitle: "IA para la Verdad Crítica"
+hero_title: "🚧 Ground Zero Lab"
+hero_text: "Descubra la ciencia detrás de los mitos...<br>9/11, Histeria climática del CO2, Salud, y más"
+cta_button: "Explorar"
+
+# About
+about_title: "Nosotros"
+
+# Projects
+projects_title: "Nuestros Proyectos Principales"
+projects_list:
+  - title: "Modelo 9/11 Ground Zero"
+    description: "El primer modelo de IA que analiza científicamente los eventos del 11 de septiembre. Acceso a documentos originales, análisis científicos y teorías alternativas. Descubra lo que ocultan los relatos oficiales."
+  - title: "Análisis del Cambio Climático"
+    description: "Análisis de datos climáticos y propaganda impulsado por IA. Debate sobre el CO2, explicaciones alternativas, estudios científicos. Entienda la complejidad del cambio climático más allá de los relatos dominantes."
+  - title: "Dogmas de Salud"
+    description: "Análisis crítico de la política de salud y la industria farmacéutica. Política de vacunación, estudios de medicamentos, medicina alternativa. Cuestione los relatos de salud establecidos con rigor científico."
+
+# Methods
+tech_title: "Nuestros Métodos"
+tech_list:
+  - title: "Modelos Open-Weight"
+    description: "Solo utilizamos modelos de peso abierto. Esto permite un control total sobre los prompts del sistema y los parámetros, para que podamos personalizar los modelos con precisión según nuestras necesidades."
+  - title: "Tecnología RAG"
+    description: "Bases de conocimiento para respuestas precisas. Al combinar recuperación y generación, siempre obtienes información actualizada de fuentes científicas."
+  - title: "Fine-Tuning"
+    description: "Modelos a medida para temas específicos. El entrenamiento con datos verificados y la eliminación dirigida de la propaganda conducen a respuestas consistentes y científicamente coherentes."
+
+# Demo
+demo_title: "Demo en vivo"
+demo_text: "Pruebe nuestras soluciones y modelos estándar o incluso modelos ajustados. Experimente la diferencia usted mismo. Nuestras demos interactivas le muestran cómo funciona nuestra IA."
+demo_btn1: "Chat 9/11"
+demo_btn2: "Herramienta Clima"
+demo_btn3: "Análisis Salud"
+
+# Community
+community_title: "Comunidad"
+community_text: "Forme parte de nuestra creciente comunidad de librepensadores y buscadores de la verdad. Le esperan intercambio, colaboración y descubrimientos compartidos."
+comm_btn1: "Foro / Nextcloud"
+comm_btn2: "Archivo / Gitea"
+
+# Footer
+footer_text: "Ground Zero Lab - IA para la Verdad Crítica"
+---
+Desarrollamos soluciones de IA y modelos que evitan la propaganda y entregan la verdad científica. En un mundo dominado por la desinformación en el panorama de la IA, ofrecemos una alternativa: modelos entrenados con hechos verificados y conocimiento científico. Nuestro equipo está compuesto por investigadores en ciencia de datos, historia y pensamiento crítico, trabajando juntos para sacar a la luz verdades ocultas.
--- a/content/_index.fr.md
+++ b/content/_index.fr.md
@@ -0,0 +1,58 @@
+---
+title: "Ground Zero Lab - IA pour la Vérité Critique"
+description: "Découvrez la science derrière les mythes - 9/11, Climat, Santé et plus"
+lang: fr
+
+# Menu
+menu_about: "À propos"
+menu_projects: "Projets"
+menu_tech: "Méthodes"
+menu_demo: "Démo"
+menu_community: "Communauté"
+
+# Hero
+hero_subtitle: "IA pour la Vérité Critique"
+hero_title: "🚧 Ground Zero Lab"
+hero_text: "Découvrez la science derrière les mythes...<br>9/11, Hystérie climatique CO2, Santé, et plus"
+cta_button: "Découvrir"
+
+# About
+about_title: "À propos"
+
+# Projects
+projects_title: "Nos Projets Principaux"
+projects_list:
+  - title: "Modèle 9/11 Ground Zero"
+    description: "Le premier modèle d'IA qui analyse scientifiquement les événements du 11 septembre. Accès aux documents originaux, analyses scientifiques et théories alternatives. Découvrez ce que les récits officiels cachent."
+  - title: "Analyse du Changement Climatique"
+    description: "Analyse des données climatiques et de la propagande assistée par IA. Débat sur le CO2, explications alternatives, études scientifiques. Comprenez la complexité du changement climatique au-delà des récits dominants."
+  - title: "Dogmes de la Santé"
+    description: "Analyse critique de la politique de santé et de l'industrie pharmaceutique. Politique de vaccination, études de médicaments, médecines alternatives. Remettez en question les récits de santé établis avec rigueur scientifique."
+
+# Methods
+tech_title: "Nos Méthodes"
+tech_list:
+  - title: "Modèles Open-Weight"
+    description: "Nous n'utilisons que des modèles à poids ouverts. Cela permet un contrôle total sur les prompts système et les paramètres, afin que nous puissions adapter les modèles précisément à nos besoins."
+  - title: "Technologie RAG"
+    description: "Bases de connaissances pour des réponses précises. En combinant récupération et génération, vous obtenez toujours des informations actuelles issues de sources scientifiques."
+  - title: "Fine-Tuning"
+    description: "Modèles sur mesure pour des sujets spécifiques. L'entraînement sur des données vérifiées et l'élimination ciblée de la propagande conduisent à des réponses cohérentes et scientifiquement fondées."
+
+# Demo
+demo_title: "Démo en direct"
+demo_text: "Essayez nos contournements et modèles standards ou même des modèles affinés. Découvrez la différence par vous-même. Nos démos interactives vous montrent comment notre IA fonctionne."
+demo_btn1: "Chat 9/11"
+demo_btn2: "Outil Climat"
+demo_btn3: "Analyse Santé"
+
+# Community
+community_title: "Communauté"
+community_text: "Faites partie de notre communauté grandissante de libres penseurs et de chercheurs de vérité. Échange, collaboration et découvertes partagées vous attendent."
+comm_btn1: "Forum / Nextcloud"
+comm_btn2: "Archives / Gitea"
+
+# Footer
+footer_text: "Ground Zero Lab - IA pour la Vérité Critique"
+---
+Nous développons des contournements IA et des modèles qui percent la propagande et délivrent la vérité scientifique. Dans un monde dominé par la désinformation dans le paysage de l'IA, nous offrons une alternative : des modèles entraînés sur des faits vérifiés et des connaissances scientifiques. Notre équipe est composée de chercheurs en science des données, en histoire et en pensée critique, travaillant ensemble pour mettre en lumière des vérités cachées.
--- a/content/_index.ru.md
+++ b/content/_index.ru.md
@@ -0,0 +1,58 @@
+---
+title: "Ground Zero Lab - ИИ для критической правды"
+description: "Откройте для себя науку, стоящую за мифами - 9/11, климат, здоровье и многое другое"
+lang: ru
+
+# Menu
+menu_about: "О нас"
+menu_projects: "Проекты"
+menu_tech: "Методы"
+menu_demo: "Демо"
+menu_community: "Сообщество"
+
+# Hero
+hero_subtitle: "ИИ для критической правды"
+hero_title: "🚧 Ground Zero Lab"
+hero_text: "Откройте для себя науку, стоящую за мифами...<br>9/11, CO2-климатическая истерия, здоровье и многое другое"
+cta_button: "Узнать больше"
+
+# About
+about_title: "О нас"
+
+# Projects
+projects_title: "Наши главные проекты"
+projects_list:
+  - title: "Модель 9/11 Ground Zero"
+    description: "Первая ИИ-модель, научно анализирующая события 11 сентября. Доступ к оригинальным документам, научным анализам и альтернативным теориям. Узнайте, что скрывают официальные нарративы."
+  - title: "Анализ изменения климата"
+    description: "Анализ климатических данных и пропаганды с помощью ИИ. Дебаты о CO2, альтернативные объяснения, научные исследования. Поймите сложность изменения климата за пределами мейнстримных нарративов."
+  - title: "Медицинские догмы"
+    description: "Критический анализ политики здравоохранения и фармацевтической промышленности. Политика вакцинации, исследования лекарств, альтернативная медицина. Подвергайте сомнению установленные нарративы в области здравоохранения с научной строгостью."
+
+# Methods
+tech_title: "Наши методы"
+tech_list:
+  - title: "Модели с открытыми весами"
+    description: "Мы используем только модели с открытыми весами. Это обеспечивает полный контроль над системными промптами и параметрами, что позволяет нам точно настраивать модели под наши нужды."
+  - title: "Технология RAG"
+    description: "Базы знаний для точных ответов. Благодаря сочетанию поиска и генерации вы всегда получаете актуальную информацию из научных источников."
+  - title: "Fine-Tuning"
+    description: "Индивидуальные модели для конкретных тем. Обучение на проверенных данных и целенаправленное устранение пропаганды приводит к последовательным, научно обоснованным ответам."
+
+# Demo
+demo_title: "Демонстрация"
+demo_text: "Попробуйте наши обходные пути и стандартные модели или даже специально настроенные модели. Почувствуйте разницу сами. Наши интерактивные демо покажут вам, как работает наш ИИ."
+demo_btn1: "Чат 9/11"
+demo_btn2: "Инструмент по климату"
+demo_btn3: "Анализ здоровья"
+
+# Community
+community_title: "Сообщество"
+community_text: "Станьте частью нашего растущего сообщества вольнодумцев и искателей истины. Вас ждут обмен опытом, сотрудничество и совместные открытия."
+comm_btn1: "Форум / Nextcloud"
+comm_btn2: "Архив / Gitea"
+
+# Footer
+footer_text: "Ground Zero Lab - ИИ для критической правды"
+---
+Мы разрабатываем обходные пути ИИ и модели, которые преодолевают пропаганду и доставляют научную истину. В мире, где в ландшафте ИИ доминирует дезинформация, мы предлагаем альтернативу: модели, обученные на проверенных фактах и научных знаниях. Наша команда состоит из исследователей в области науки о данных, истории и критического мышления, работающих вместе, чтобы вывести скрытые истины на свет.
--- a/html/index.html
+++ b/html/index.html
@@ -1,182 +0,0 @@
-<!DOCTYPE html>
-<html lang="de">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Ground Zero Lab - KI für kritische Wahrheit</title>
-    <meta name="description" content="Entdecken Sie die Wissenschaft hinter den Mythen - 9/11, Klima, Gesundheit und mehr">
-    <meta name="keywords" content="KI, Propaganda, Wissenschaft, 9/11, Klimawandel, Gesundheit, Ground Zero Lab">
-    <link rel="stylesheet" href="style.css">
-</head>
-<body>
-    <header>
-        <nav class="container">
-            <a href="#" class="logo">Ground Zero Lab</a>
-            <div class="hamburger" onclick="toggleHamburger()">
-                <span></span>
-                <span></span>
-                <span></span>
-            </div>
-            <ul class="nav-links" id="navLinks">
-                <li><a href="#about">Über Uns</a></li>
-                <li><a href="#projects">Projekte</a></li>
-                <li><a href="#tech">Technologie</a></li>
-                <li><a href="#demo">Demo</a></li>
-                <li><a href="#community">Community</a></li>
-            </ul>
-        </nav>
-    </header>
-
-    <section class="hero">
-        <div class="hero-content">
-            <h1>Ground Zero Lab</h1>
-            <h1>KI für kritische Wahrheit</h1>
-            <p>Entdecken Sie die Wissenschaft hinter den Mythen - 9/11, Klima, Gesundheit und mehr</p>
-            <a href="#demo" class="cta-button">Jetzt entdecken</a>
-        </div>
-    </section>
-
-    <section id="about" class="container">
-        <h2>Über Uns</h2>
-        <p class="about-text">
-            Wir entwickeln KI-Modelle, die Propaganda durchschauen und wissenschaftliche Wahrheit liefern. 
-            In einer Welt, in der Desinformation die KI-Landschaft dominiert, bieten wir eine Alternative: 
-            Modelle, die auf verifizierten Fakten und wissenschaftlichen Erkenntnissen trainiert sind. 
-            Unser Team besteht aus Experten für Datenwissenschaft, Geschichte und kritisches Denken, 
-            die gemeinsam an der Aufgabe arbeiten, verborgene Wahrheiten ans Licht zu bringen.
-        </p>
-    </section>
-
-    <section id="projects" class="section-dark container">
-        <h2>Unsere Hauptprojekte</h2>
-        <div class="projects">
-            <div class="project-card">
-                <h3>9/11 Ground Zero Model</h3>
-                <p>
-                    Das erste KI-Modell, das die 9/11-Ereignisse wissenschaftlich analysiert. 
-                    Zugriff auf Originaldokumente, wissenschaftliche Analysen und alternative Theorien. 
-                    Entdecken Sie, was die offiziellen Narrative verschweigen.
-                </p>
-            </div>
-            <div class="project-card">
-                <h3>Klimawandel Analyse</h3>
-                <p>
-                    KI-gestützte Analyse von Klimadaten und Propaganda. 
-                    CO2-Debatte, alternative Erklärungen, wissenschaftliche Studien. 
-                    Verstehen Sie die Komplexität des Klimawandels jenseits der Mainstream-Narrative.
-                </p>
-            </div>
-            <div class="project-card">
-                <h3>Gesundheits-Dogmen</h3>
-                <p>
-                    Kritische Analyse von Gesundheitspolitik und Pharmaindustrie. 
-                    Impfpolitik, Medikamentenstudien, alternative Medizin. 
-                    Hinterfragen Sie etablierte Gesundheitsnarrative mit wissenschaftlicher Strenge.
-                </p>
-            </div>
-        </div>
-    </section>
-
-    <section id="tech" class="container">
-        <h2>Unsere Technologie</h2>
-        <div class="tech-features">
-            <div class="tech-card">
-                <h3>Open-Weight-Modelle</h3>
-                <p>
-                    Wir nutzen nur Modelle mit offenen Gewichten. 
-                    Dies ermöglicht volle Kontrolle über Training und Parameter, 
-                    sodass wir die Modelle genau an unsere Bedürfnisse anpassen können.
-                </p>
-            </div>
-            <div class="tech-card">
-                <h3>RAG-Technologie</h3>
-                <p>
-                    Wissensdatenbanken für präzise Antworten. 
-                    Durch die Kombination von Retrieval und Generation 
-                    erhalten Sie stets aktuelle Informationen aus wissenschaftlichen Quellen.
-                </p>
-            </div>
-            <div class="tech-card">
-                <h3>Fine-Tuning</h3>
-                <p>
-                    Maßgeschneiderte Modelle für spezifische Themen. 
-                    Training auf verifizierten Daten und gezielte Eliminierung von Propaganda 
-                    führt zu konsistenten, wissenschaftlich fundierten Antworten.
-                </p>
-            </div>
-        </div>
-    </section>
-
-    <section id="demo" class="section-dark container">
-        <h2>Live-Demo</h2>
-        <div class="demo-section">
-            <p>
-                Testen Sie unsere Modelle sofort und erleben Sie die Unterschiede selbst. 
-                Unsere interaktiven Demos zeigen Ihnen, wie unsere KI arbeitet und 
-                welche Erkenntnisse sie liefern kann.
-            </p>
-            <div class="demo-buttons">
-                <a href="#" class="demo-button">9/11-Chat</a>
-                <a href="#" class="demo-button">Klimawandel-Tool</a>
-                <a href="#" class="demo-button">Gesundheits-Analyse</a>
-            </div>
-        </div>
-    </section>
-
-    <section id="community" class="container">
-        <h2>Community</h2>
-        <div class="community">
-            <p>
-                Werden Sie Teil unserer wachsenden Community von Forschern, 
-                Wissenschaftlern und Wahrheitssuchenden. 
-                Austausch, Zusammenarbeit und gemeinsame Entdeckungen erwarten Sie.
-            </p>
-            <div class="demo-buttons">
-                <a href="#" class="demo-button">Zum Forum</a>
-                <a href="#" class="demo-button">Research Zugang</a>
-                <a href="#" class="demo-button">Events</a>
-            </div>
-        </div>
-    </section>
-
-    <!-- Separator Line zwischen Content und Footer -->
-    <div class="separator-line"></div>
-
-    <footer>
-        <div class="container">
-            <p>Ground Zero Lab - KI für kritische Wahrheit</p>
-            <div class="footer-links">
-                <a href="#about">Über Uns</a>
-                <a href="#projects">Projekte</a>
-                <a href="#tech">Technologie</a>
-                <a href="#demo">Demo</a>
-                <a href="#community">Community</a>
-            </div>
-            <p>&copy; 2026 Ground Zero Lab</p>
-        </div>
-    </footer>
-
-    <script>
-        function toggleHamburger() {
-            const navLinks = document.getElementById('navLinks');
-            navLinks.classList.toggle('mobile-open');
-            
-            const hamburger = document.querySelector('.hamburger');
-            hamburger.classList.toggle('active');
-        }
-
-        // Close mobile menu when clicking on a link
-        document.addEventListener('DOMContentLoaded', function() {
-            const navLinks = document.getElementById('navLinks');
-            const links = navLinks.querySelectorAll('a');
-            
-            links.forEach(link => {
-                link.addEventListener('click', function() {
-                    navLinks.classList.remove('mobile-open');
-                    document.querySelector('.hamburger').classList.remove('active');
-                });
-            });
-        });
-    </script>
-</body>
-</html>
--- a/html/index.html.template
+++ b/html/index.html.template
@@ -1,60 +0,0 @@
-<!DOCTYPE html>
-<html lang="de">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>${TITLE} Dashboard</title>
-    <style>
-        body { 
-            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; 
-            background: #0f172a; 
-            color: #f1f5f9; 
-            display: flex; 
-            justify-content: center; 
-            align-items: center; 
-            height: 100vh; 
-            margin: 0; 
-        }
-        .container { 
-            background: #1e293b; 
-            padding: 2rem; 
-            border-radius: 1rem; 
-            box-shadow: 0 10px 25px rgba(0,0,0,0.3); 
-            width: 100%; 
-            max-width: 400px; 
-            border: 1px solid #334155;
-        }
-        h1 { color: #38bdf8; margin-bottom: 1.5rem; font-size: 1.5rem; }
-        .links { display: flex; flex-direction: column; gap: 1rem; }
-        a { 
-            background: #334155; 
-            color: white; 
-            padding: 1rem; 
-            text-decoration: none; 
-            border-radius: 0.5rem; 
-            font-weight: 500;
-            transition: all 0.2s ease-in-out;
-            border: 1px solid transparent;
-        }
-        a:hover { 
-            background: #38bdf8; 
-            color: #0f172a; 
-            transform: translateY(-2px);
-        }
-        .footer { margin-top: 2rem; font-size: 0.8rem; color: #64748b; }
-    </style>
-</head>
-<body>
-    <div class="container">
-        <h1>${TITLE}</h1>
-        <div class="links">
-            <a href="https://cloud.${DOMAIN_MAIN}">📂 Nextcloud Cloud</a>
-            <a href="https://git.${DOMAIN_MAIN}">💻 Gitea Repository</a>
-            <a href="https://ai.${DOMAIN_MAIN}">🤖 OpenWebUI AI</a>
-        </div>
-        <div class="footer">
-            Verbundene Domain: ${DOMAIN_MAIN}
-        </div>
-    </div>
-</body>
-</html>
--- a/html/style.css
+++ b/html/style.css
@@ -1,360 +0,0 @@
-/* ==========================================
-   1. RESET & BASIS STILE
-   ========================================== */
-* {
-    margin: 0;
-    padding: 0;
-    box-sizing: border-box;
-}
-
-html {
-    scroll-behavior: smooth;
-}
-
-body {
-    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
-    line-height: 1.6;
-    color: #333;
-    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-    overflow-x: hidden;
-}
-
-.container {
-    max-width: 1200px;
-    margin: 0 auto;
-    padding: 0 20px;
-}
-
-/* ==========================================
-   2. HEADER & NAVIGATION
-   ========================================== */
-header {
-    background: rgba(255, 255, 255, 0.95);
-    backdrop-filter: blur(10px);
-    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
-    position: fixed;
-    width: 100%;
-    top: 0;
-    z-index: 1000;
-}
-
-nav {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding: 1rem 0;
-}
-
-.logo {
-    font-size: 1.5rem;
-    font-weight: bold;
-    color: #667eea;
-    text-decoration: none;
-}
-
-.nav-links {
-    display: flex;
-    gap: 2rem;
-    list-style: none;
-}
-
-.nav-links a {
-    color: #333;
-    text-decoration: none;
-    font-weight: 500;
-    transition: color 0.3s;
-}
-
-.nav-links a:hover {
-    color: #667eea;
-}
-
-/* Hamburger Icon (Standard versteckt) */
-.hamburger {
-    display: none;
-    flex-direction: column;
-    cursor: pointer;
-    gap: 5px;
-    z-index: 1100;
-}
-
-.hamburger span {
-    display: block;
-    width: 25px;
-    height: 3px;
-    background-color: #667eea;
-    border-radius: 3px;
-    transition: all 0.3s ease;
-}
-
-/* ==========================================
-   3. HERO SECTION
-   ========================================== */
-.hero {
-    min-height: 100vh;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    text-align: center;
-    color: white;
-    padding-top: 80px;
-}
-
-.hero-content {
-    max-width: 800px;
-}
-
-.hero h1 {
-    font-size: 3.5rem;
-    margin-bottom: 1rem;
-    background: linear-gradient(45deg, #091e7a, #667eea);
-    -webkit-background-clip: text;
-    -webkit-text-fill-color: transparent;
-    background-clip: text;
-    line-height: 1.2;
-}
-
-.hero p {
-    font-size: 1.5rem;
-    margin-bottom: 2rem;
-    opacity: 0.9;
-}
-
-/* ==========================================
-   4. BUTTONS & CTAs
-   ========================================== */
-.cta-button {
-    display: inline-block;
-    background: #667eea;
-    color: white;
-    padding: 1rem 2rem;
-    text-decoration: none;
-    border-radius: 50px;
-    font-weight: bold;
-    transition: transform 0.3s, box-shadow 0.3s;
-    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);
-}
-
-.cta-button:hover {
-    transform: translateY(-2px);
-    box-shadow: 0 6px 20px rgba(102, 126, 234, 0.6);
-}
-
-.demo-buttons {
-    display: flex;
-    gap: 1rem;
-    justify-content: center;
-    margin-top: 2rem;
-    flex-wrap: wrap;
-}
-
-.demo-button {
-    background: #667eea;
-    color: white;
-    padding: 0.8rem 1.5rem;
-    text-decoration: none;
-    border-radius: 25px;
-    font-weight: 500;
-    transition: background 0.3s, transform 0.3s;
-}
-
-.demo-button:hover {
-    background: #5a6fd8;
-    transform: translateY(-2px);
-}
-
-/* ==========================================
-   5. SECTIONS & CONTENT CARDS
-   ========================================== */
-section {
-    padding: 5rem 0;
-    background: white;
-}
-
-.section-dark {
-    background: #f8f9fa;
-}
-
-h2 {
-    text-align: center;
-    font-size: 2.5rem;
-    margin-bottom: 3rem;
-    color: #333;
-}
-
-.about-text {
-    max-width: 800px;
-    margin: 0 auto;
-    text-align: center;
-    font-size: 1.1rem;
-    line-height: 1.8;
-}
-
-.projects, .tech-features {
-    display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
-    gap: 2rem;
-    margin-top: 3rem;
-}
-
-.project-card, .tech-card {
-    background: white;
-    border-radius: 15px;
-    padding: 2rem;
-    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
-    transition: transform 0.3s, box-shadow 0.3s;
-    text-align: center;
-}
-
-.project-card:hover {
-    transform: translateY(-5px);
-    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
-}
-
-.project-card h3, .tech-card h3 {
-    color: #667eea;
-    margin-bottom: 1rem;
-    font-size: 1.5rem;
-}
-
-.project-card p, .tech-card p {
-    color: #666;
-    line-height: 1.6;
-}
-
-/* ==========================================
-   6. FOOTER
-   ========================================== */
-footer {
-    background: #333;
-    color: white;
-    text-align: center;
-    padding: 3rem 0;
-    position: relative;
-}
-
-.footer-links {
-    display: flex;
-    justify-content: center;
-    gap: 2rem;
-    margin-bottom: 1.5rem;
-    flex-wrap: wrap;
-}
-
-.footer-links a {
-    color: white;
-    text-decoration: none;
-    transition: opacity 0.3s;
-}
-
-.footer-links a:hover {
-    opacity: 0.7;
-}
-
-/* Separator Line zwischen Content und Footer */
-footer::before {
-    content: '';
-    position: absolute;
-    top: -2px;
-    left: 50%;
-    transform: translateX(-50%);
-    width: 100px;
-    height: 2px;
-    background: linear-gradient(90deg, transparent, #667eea, transparent);
-    border-radius: 1px;
-}
-
-/* ==========================================
-   7. MOBILE RESPONSIVENESS (BREAKPOINTS)
-   ========================================== */
-
-@media (max-width: 768px) {
-    /* Zeige Hamburger-Icon */
-    .hamburger {
-        display: flex;
-    }
-
-    /* Verwandle Nav-Links in Dropdown */
-    .nav-links {
-        position: absolute;
-        top: 100%;
-        left: 0;
-        width: 100%;
-        background: rgba(255, 255, 255, 0.98);
-        flex-direction: column;
-        gap: 0;
-        max-height: 0;
-        overflow: hidden;
-        transition: max-height 0.4s ease-in-out;
-        box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
-        backdrop-filter: blur(10px);
-    }
-
-    /* Wenn Menü offen ist */
-    .nav-links.mobile-open {
-        max-height: 500px;
-    }
-
-    .nav-links li {
-        width: 100%;
-        text-align: center;
-        border-bottom: 1px solid #eee;
-    }
-
-    .nav-links a {
-        padding: 1.2rem;
-        display: block;
-    }
-
-    /* Hamburger Animation zum X */
-    .hamburger.active span:nth-child(1) {
-        transform: translateY(8px) rotate(45deg);
-    }
-    .hamburger.active span:nth-child(2) {
-        opacity: 0;
-    }
-    .hamburger.active span:nth-child(3) {
-        transform: translateY(-8px) rotate(-45deg);
-    }
-
-    /* Hero Text für Mobile */
-    .hero h1 {
-        font-size: 2.2rem;
-    }
-    .hero p {
-        font-size: 1.1rem;
-    }
-}
-
-/* Tablet Portrait */
-@media (min-width: 769px) and (max-width: 1024px) {
-    section {
-        padding: 4rem 0;
-    }
-    
-    footer {
-        padding: 2.5rem 0;
-    }
-    
-    .demo-buttons {
-        gap: 0.8rem;
-    }
-}
-
-/* Desktop */
-@media (min-width: 1025px) {
-    section {
-        padding: 5rem 0;
-    }
-    
-    footer {
-        padding: 3rem 0;
-    }
-}
-
-/* Extra Large Desktop */
-@media (min-width: 1400px) {
-    .container {
-        max-width: 1400px;
-    }
-}
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -0,0 +1,144 @@
+<!DOCTYPE html>
+<html lang="{{ .Lang }}">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>{{ .Title }}</title>
+    <meta name="description" content="{{ .Params.description }}">
+    <link rel="stylesheet" href="/style.css">
+</head>
+<body>
+    <header>
+        <nav class="container">
+            <a href="#" class="logo">🏗 Ground Zero Lab</a>
+            
+            <div class="nav-right">
+                <ul class="nav-links" id="navLinks">
+                    <li><a href="#about">{{ .Params.menu_about }}</a></li>
+                    <li><a href="#projects">{{ .Params.menu_projects }}</a></li>
+                    <li><a href="#tech">{{ .Params.menu_tech }}</a></li>
+                    <li><a href="#demo">{{ .Params.menu_demo }}</a></li>
+                    <li><a href="#community">{{ .Params.menu_community }}</a></li>
+                </ul>
+
+               <div class="lang-switch">
+                    <button class="lang-btn" id="langBtn">
+                        {{ if eq .Lang "de" }}🇩🇪{{ end }}
+                        {{ if eq .Lang "en" }}🇬🇧{{ end }}
+                        {{ if eq .Lang "fr" }}🇫🇷{{ end }}
+                        {{ if eq .Lang "es" }}🇪🇸{{ end }}
+                        {{ if eq .Lang "ru" }}🇷🇺{{ end }}
+                    </button>
+                    <div class="lang-dropdown" id="langDropdown">
+                        {{ range .Site.Languages }}
+                        <a href="#" data-lang="{{ .Lang }}">
+                            {{ if eq .Lang "de" }}🇩🇪 Deutsch{{ end }}
+                            {{ if eq .Lang "en" }}🇬🇧 English{{ end }}
+                            {{ if eq .Lang "fr" }}🇫🇷 Français{{ end }}
+                            {{ if eq .Lang "es" }}🇪🇸 Español{{ end }}
+                            {{ if eq .Lang "ru" }}🇷🇺 Русский{{ end }}
+                        </a>
+                        {{ end }}
+                    </div>
+                </div>
+
+                <div class="theme-switch">
+                    <button class="theme-btn" id="themeBtn" title="Design wählen">
+                        <span class="theme-icon-active">🌓</span>
+                    </button>
+                    <div class="theme-dropdown" id="themeDropdown">
+                        <button data-theme="light">☀️ Hell</button>
+                        <button data-theme="dark">🌙 Dunkel</button>
+                        <button data-theme="auto">🌓 Auto</button>
+                    </div>
+                </div>
+
+                <div class="hamburger" onclick="toggleHamburger()">
+                    <span></span><span></span><span></span>
+                </div>
+            </div>
+        </nav>
+    </header>
+
+    <section class="hero">
+        <div class="hero-content">
+            <p>{{ .Params.hero_subtitle }}</p>
+            <h1>{{ .Params.hero_title }}</h1>
+            <p>{{ .Params.hero_text | safeHTML }}</p>
+            <a href="#demo" class="cta-button">{{ .Params.cta_button }}</a>
+        </div>
+    </section>
+
+    <section id="about" class="container">
+        <h2>{{ .Params.about_title }}</h2>
+        <div class="text">{{ .Content }}</div>
+    </section>
+
+    <section id="projects" class="section-dark">
+        <div class="container">
+            <h2>{{ .Params.projects_title }}</h2>
+            <div class="projects">
+                {{ range .Params.projects_list }}
+                <div class="project-card">
+                    <h3>{{ .title }}</h3>
+                    <p>{{ .description }}</p>
+                </div>
+                {{ end }}
+            </div>
+        </div>
+    </section>
+
+    <section id="tech" class="container">
+        <h2>{{ .Params.tech_title }}</h2>
+        <div class="tech-features">
+            {{ range .Params.tech_list }}
+            <div class="tech-card">
+                <h3>{{ .title }}</h3>
+                <p>{{ .description }}</p>
+            </div>
+            {{ end }}
+        </div>
+    </section>
+
+    <section id="demo" class="section-dark">
+        <div class="container">
+            <h2>{{ .Params.demo_title }}</h2>
+            <div class="demo-section">
+                <p class="text">{{ .Params.demo_text }}</p>
+                <div class="demo-buttons">
+                    <a href="#" class="demo-button">🚧 {{ .Params.demo_btn1 }}</a>
+                    <a href="#" class="demo-button">🚧 {{ .Params.demo_btn2 }}</a>
+                    <a href="#" class="demo-button">🚧 {{ .Params.demo_btn3 }}</a>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <section id="community" class="container">
+        <h2>{{ .Params.community_title }}</h2>
+        <div class="community">
+            <p  class="text">{{ .Params.community_text }}</p>
+            <div class="demo-buttons">
+               <a href="https://cloud.gzl.lan64.de" class="demo-button">{{ .Params.comm_btn1 }}</a>
+               <a href="https://git.gzl.lan64.de" class="demo-button">{{ .Params.comm_btn2 }}</a>
+            </div>
+        </div>
+    </section>
+
+    <footer>
+        <div class="container">
+            <p>{{ .Params.footer_text }}</p>
+            <div class="footer-links">
+                <a href="#about">{{ .Params.menu_about }}</a>
+                <a href="#projects">{{ .Params.menu_projects }}</a>
+                <a href="#tech">{{ .Params.menu_tech }}</a>
+                <a href="#demo">{{ .Params.menu_demo }}</a>
+                <a href="#community">{{ .Params.menu_community }}</a>
+            </div>
+            <p>&copy; {{ now.Format "2006" }} Ground Zero Lab</p>
+        </div>
+    </footer>
+
+    <script src="/script.js"></script>
+</body>
+</html>
--- a/static/script.js
+++ b/static/script.js
@@ -0,0 +1,113 @@
+/* ==========================================
+   NAVIGATION & MOBILE MENU
+   ========================================== */
+function toggleHamburger() {
+    const navLinks = document.getElementById('navLinks');
+    const hamburger = document.querySelector('.hamburger');
+    navLinks.classList.toggle('mobile-open');
+    hamburger.classList.toggle('active');
+}
+
+/* ==========================================
+   THEME SWITCHER LOGIC
+   ========================================== */
+const themeBtn = document.getElementById('themeBtn');
+const themeDropdown = document.getElementById('themeDropdown');
+const themeButtons = document.querySelectorAll('.theme-dropdown button');
+const htmlEl = document.documentElement;
+
+// Dropdown öffnen/schließen
+if (themeBtn) {
+    themeBtn.addEventListener('click', (e) => {
+        e.stopPropagation();
+        themeDropdown.classList.toggle('show');
+        // Schließe andere Dropdowns
+        if (langDropdown) langDropdown.classList.remove('show');
+    });
+}
+
+// Theme auswählen
+themeButtons.forEach(btn => {
+    btn.addEventListener('click', () => {
+        const theme = btn.getAttribute('data-theme');
+        applyTheme(theme);
+        themeDropdown.classList.remove('show');
+    });
+});
+
+// Theme anwenden
+function applyTheme(theme) {
+    if (theme === 'auto') {
+        localStorage.removeItem('theme');
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        htmlEl.setAttribute('data-theme', prefersDark ? 'dark' : 'light');
+        themeBtn.innerHTML = '🌓';
+    } else {
+        htmlEl.setAttribute('data-theme', theme);
+        localStorage.setItem('theme', theme);
+        themeBtn.innerHTML = theme === 'dark' ? '🌙' : '☀️';
+    }
+}
+
+// Initialisierung beim Laden
+document.addEventListener('DOMContentLoaded', () => {
+    const savedTheme = localStorage.getItem('theme') || 'auto';
+    applyTheme(savedTheme);
+});
+
+// Klick außerhalb schließt alle Dropdowns
+window.addEventListener('click', () => {
+    if (themeDropdown) themeDropdown.classList.remove('show');
+    if (langDropdown) langDropdown.classList.remove('show');
+});
+
+// Mobile Menü schließen bei Klick auf Link
+document.querySelectorAll('.nav-links a').forEach(link => {
+    link.addEventListener('click', () => {
+        document.getElementById('navLinks').classList.remove('mobile-open');
+        const hamburger = document.querySelector('.hamburger');
+        if (hamburger) hamburger.classList.remove('active');
+    });
+});
+
+
+/* ==========================================
+   LANGUAGE SWITCHER LOGIC
+   ========================================== */
+const langBtn = document.getElementById('langBtn');
+const langDropdown = document.getElementById('langDropdown');
+
+if (langBtn) {
+    langBtn.addEventListener('click', (e) => {
+        e.stopPropagation();
+        langDropdown.classList.toggle('show');
+        // Schließe andere Dropdowns
+        if (themeDropdown) themeDropdown.classList.remove('show');
+    });
+}
+
+// Sprachwechsel Logik (Repariert für alle Sprachen)
+if (langDropdown) {
+    langDropdown.querySelectorAll('a').forEach(link => {
+        link.addEventListener('click', (e) => {
+            e.preventDefault(); // Verhindert das sofortige Neuladen
+
+            const selectedLang = link.getAttribute('data-lang');
+            const currentPath = window.location.pathname; // z.B. /de/projects/
+
+            // RegEx um den aktuellen Sprachcode (/de/, /en/, /fr/, etc.) am Anfang zu finden
+            // und durch die neue Sprache zu ersetzen.
+            let newPath = currentPath.replace(/^\/(de|en|fr|es|ru)(\/|$)/, '/' + selectedLang + '/');
+
+            // Falls man auf der Hauptseite ist (/), oder RegEx nicht matcht
+            if (currentPath === '/' || !newPath.startsWith('/' + selectedLang)) {
+                newPath = '/' + selectedLang + '/';
+            }
+
+            // Sicherstellen, dass keine Doppel-Slashes entstehen
+            newPath = newPath.replace(/\/+/g, '/');
+
+            window.location.href = newPath;
+        });
+    });
+}
--- a/static/style.css
+++ b/static/style.css
@@ -0,0 +1,448 @@
+/* ==========================================
+   0. THEME VARIABLEN (Vollständig Dynamisch)
+   ========================================== */
+:root {
+    /* --- Hell-Modus --- */
+    --bg-body: #ffffff;
+    --bg-section-alt: #f8f9fa;
+    --text-main: #333333;
+    --text-muted: #666666;
+    --header-bg: rgba(255, 255, 255, 0.95);
+    
+    /* Cards */
+    --card-bg: #ffffff;
+    --card-shadow: rgba(0, 0, 0, 0.08);
+    --border-color: #eeeeee;
+
+    /* Hero & Akzente */
+    --accent: #667eea;
+    --accent-dark: #764ba2;
+    --hero-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    --hero-text: #ffffff;
+    --hero-h1-gradient: linear-gradient(45deg, #ffffff, #d1d8ff);
+
+    /* Footer */
+    --footer-bg: #1a1a1a;
+    --footer-text: #bbbbbb;
+    --footer-link-hover: #ffffff;
+}
+
+[data-theme="dark"] {
+    /* --- Dunkel-Modus --- */
+    --bg-body: #0f111a;
+    --bg-section-alt: #161925;
+    --text-main: #e0e6ed;
+    --text-muted: #94a3b8;
+    --header-bg: rgba(15, 17, 26, 0.96);
+    
+    /* Cards */
+    --card-bg: #1c2132;
+    --card-shadow: rgba(0, 0, 0, 0.3);
+    --border-color: #2d334a;
+
+    /* Hero & Akzente (Im Darkmode etwas entspannter) */
+    --accent: #39348c;
+    --accent-dark: #3d4593;
+    --hero-gradient: linear-gradient(135deg, #1e1b4b 0%, #312e81 100%);
+    --hero-text: #e2e8f0;
+    --hero-h1-gradient: linear-gradient(45deg, #818cf8, #c084fc);
+
+    /* Footer */
+    --footer-bg: #070910;
+    --footer-text: #64748b;
+    --footer-link-hover: #818cf8;
+}
+
+/* ==========================================
+   1. RESET & BASIS STILE
+   ========================================== */
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+html {
+    scroll-behavior: smooth;
+}
+
+body {
+    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+    line-height: 1.6;
+    color: var(--text-main);
+    background-color: var(--bg-body);
+    overflow-x: hidden;
+    transition: all 0.3s ease;
+}
+
+.container {
+    max-width: 1200px;
+    margin: 0 auto;
+    padding: 0 20px;
+}
+
+/* ==========================================
+   2. HEADER & NAVIGATION
+   ========================================== */
+header {
+    background-color: var(--header-bg);
+    backdrop-filter: blur(10px);
+    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
+    position: fixed;
+    width: 100%;
+    top: 0;
+    z-index: 1000;
+}
+
+nav {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 1rem 0;
+}
+
+.nav-right {
+    display: flex;
+    align-items: center;
+    gap: 1.5rem;
+}
+
+
+
+.logo {
+    font-size: 1.5rem;
+    font-weight: bold;
+    color: var(--accent);
+    text-decoration: none;
+}
+
+.nav-links {
+    display: flex;
+    gap: 2rem;
+    list-style: none;
+}
+
+.nav-links a {
+    color: var(--text-main);
+    text-decoration: none;
+    font-weight: 500;
+}
+
+.nav-links a:hover {
+    color: var(--accent);
+}
+
+/* Theme Switcher */
+.theme-switch { position: relative; }
+.theme-btn {
+    background: none;
+    border: 1px solid var(--border-color);
+    border-radius: 50%;
+    width: 40px;
+    height: 40px;
+    cursor: pointer;
+    font-size: 1.2rem;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: var(--text-main);
+}
+
+.theme-dropdown {
+    position: absolute;
+    top: 120%;
+    right: 0;
+    background-color: var(--card-bg);
+    border: 1px solid var(--border-color);
+    border-radius: 8px;
+    box-shadow: 0 5px 15px var(--card-shadow);
+    display: none;
+    flex-direction: column;
+    min-width: 130px;
+    z-index: 2000;
+    overflow: hidden;
+}
+
+.theme-dropdown.show { display: flex; }
+.theme-dropdown button {
+    background: none;
+    border: none;
+    padding: 12px 15px;
+    text-align: left;
+    cursor: pointer;
+    color: var(--text-main);
+}
+.theme-dropdown button:hover {
+    background-color: var(--accent);
+    color: white;
+}
+
+/* --- Language Switcher --- */
+.lang-switch { position: relative; }
+.lang-btn {
+    background: none;
+    border: 1px solid var(--border-color);
+    border-radius: 20px;
+    padding: 8px 15px;
+    cursor: pointer;
+    font-size: 0.9rem;
+    color: var(--text-main);
+    transition: all 0.2s;
+    display: flex;
+    align-items: center;
+    gap: 5px;
+}
+.lang-btn:hover {
+    border-color: var(--accent);
+    background: rgba(102, 126, 234, 0.1);
+}
+
+.lang-dropdown {
+    position: absolute;
+    top: 120%;
+    right: 0;
+    background-color: var(--card-bg);
+    border: 1px solid var(--border-color);
+    border-radius: 8px;
+    box-shadow: 0 5px 15px var(--card-shadow);
+    display: none;
+    flex-direction: column;
+    min-width: 150px;
+    z-index: 2000;
+}
+.lang-dropdown.show { display: flex; }
+.lang-dropdown a {
+    padding: 10px 15px;
+    text-decoration: none;
+    color: var(--text-main);
+    font-size: 0.9rem;
+    transition: background 0.2s;
+    /* ANPASSUNG 2: Flexbox für Links, damit Flagge/Text nebeneinander bleiben */
+    display: flex;
+    align-items: center;
+    gap: 10px; /* Abstand zwischen Flagge und Text */
+    
+    /* ANPASSUNG 3: Verhindern, dass der Text umbricht */
+    white-space: nowrap;
+}
+.lang-dropdown a:hover {
+    background-color: var(--accent);
+    color: white;
+}
+
+
+.hamburger {
+    display: none;
+    flex-direction: column;
+    gap: 5px;
+    cursor: pointer;
+}
+.hamburger span {
+    display: block;
+    width: 25px;
+    height: 3px;
+    background-color: var(--accent);
+    border-radius: 3px;
+}
+
+/* ==========================================
+   3. HERO SECTION
+   ========================================== */
+.hero {
+    min-height: 100vh;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    text-align: center;
+    background: var(--hero-gradient);
+    color: var(--hero-text);
+    padding: 80px 20px;
+    transition: background 0.5s ease;
+}
+
+.hero h1 {
+    font-size: 3.5rem;
+    margin-bottom: 1rem;
+    background: var(--hero-h1-gradient);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-clip: text;
+    line-height: 1.2;
+}
+
+.hero p {
+    font-size: 1.5rem;
+    margin-bottom: 1.5rem;
+    opacity: 0.9;
+}
+
+/* ==========================================
+   4. BUTTONS
+   ========================================== */
+.cta-button {
+    display: inline-block;
+    background-color: var(--accent);
+    color: white;
+    padding: 1rem 2rem;
+    text-decoration: none;
+    border-radius: 50px;
+    font-weight: bold;
+    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
+    transition: all 0.3s ease;
+}
+
+.cta-button:hover {
+    transform: translateY(-2px);
+    background-color: var(--accent-dark);
+}
+
+.demo-buttons {
+    display: flex;
+    gap: 1rem;
+    justify-content: center;
+    padding: 1rem;
+    flex-wrap: wrap;
+    margin-top: 2rem;
+}
+
+.demo-button {
+    background-color: var(--accent);
+    color: white;
+    padding: 0.6rem 1.4rem;
+    text-decoration: none;
+    border-radius: 25px;
+    transition: all 0.3s ease;
+}
+
+.demo-button:hover {
+    background-color: var(--accent-dark);
+    transform: translateY(-2px);
+}
+
+/* ==========================================
+   5. SECTIONS & CARDS
+   ========================================== */
+section {
+    /*padding: 80px 0;*/
+    background-color: var(--bg-body);
+}
+
+.section-dark {
+    background-color: var(--bg-section-alt);
+}
+
+h2 {
+    text-align: center;
+    font-size: 2.5rem;
+    padding: 2.5rem 0;
+    margin-bottom: -2rem;
+    color: var(--text-main);
+}
+
+.text {
+    max-width: 800px;
+    margin: 0 auto;
+    text-align: center;
+    font-size: 1.1rem;
+    line-height: 1.8;
+    color: var(--text-muted);
+}
+
+/* Hier ist die wichtige Änderung für das Nebeneinanderstehen */
+.projects, .tech-features {
+    display: grid;
+    /* Erzeugt so viele Spalten wie nebeneinander passen (mind. 300px breit) */
+    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+    gap: 2rem;
+    margin-top: 3rem;
+}
+
+.project-card, .tech-card {
+    background-color: var(--card-bg);
+    border-radius: 15px;
+    padding: 2.5rem;
+    box-shadow: 0 10px 30px var(--card-shadow);
+    border: 1px solid var(--border-color);
+    text-align: center;
+    transition: transform 0.3s ease, background-color 0.3s;
+    
+    /* Flexbox Korrektur */
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start; /* Schiebt alles nach oben */
+    height: 100%; /* Sorgt dafür, dass alle Karten in einer Reihe gleich hoch sind */
+}
+
+.project-card h3, .tech-card h3 {
+    color: var(--accent);
+    margin-bottom: 1.2rem; /* Abstand zwischen Überschrift und Text */
+    font-size: 1.5rem;
+}
+
+.project-card p, .tech-card p {
+    color: var(--text-muted);
+    line-height: 1.6;
+    margin-bottom: 0; /* Verhindert unnötigen Platz nach unten */
+}
+
+.project-card:hover, .tech-card:hover {
+    transform: translateY(-5px);
+}
+
+
+/* ==========================================
+   6. FOOTER
+   ========================================== */
+footer {
+    background-color: var(--footer-bg);
+    color: var(--footer-text);
+    text-align: center;
+    padding: 60px 0;
+    transition: background 0.3s ease;
+}
+
+.footer-links a {
+    color: var(--footer-text);
+    text-decoration: none;
+    margin: 0 1rem;
+}
+
+.footer-links a:hover {
+    color: var(--footer-link-hover);
+}
+
+/* ==========================================
+   7. RESPONSIVENESS
+   ========================================== */
+@media (max-width: 950px) {
+    .hamburger { display: flex; }
+    .nav-links {
+        position: absolute;
+        top: 100%; left: 0; width: 100%;
+        background-color: var(--header-bg);
+        flex-direction: column;
+        max-height: 0;
+        overflow: hidden;
+        transition: max-height 0.4s ease;
+    }
+    .nav-links.mobile-open { max-height: 500px; }
+    .nav-links li { border-bottom: 1px solid var(--border-color); }
+    .nav-links a { padding: 1.2rem; display: block; }
+    .hero h1 { font-size: 2.2rem; }
+    .nav-links {
+        position: absolute;
+        top: 100%;
+        left: 0;
+        width: 100%;
+        background-color: var(--header-bg);
+        display: flex;
+        flex-direction: column;
+        max-height: 0;
+        overflow: hidden;
+        transition: max-height 0.4s ease-in-out;
+        box-shadow: 0 10px 15px var(--card-shadow);
+        
+        /* Nav-Links müssen über dem Content, aber unter dem Dropdown sein */
+        z-index: 999; 
+    }
+}
Author	SHA1	Message	Date
Andreas Pieper	1ab276fdfd	multi lang mit hugo	2026-02-28 21:44:43 +00:00
Andreas Pieper	eb9b30bfb5	multithame	2026-02-28 19:10:44 +00:00
Andreas Pieper	295605829c	some style changes	2026-02-28 17:20:21 +00:00
Andreas Pieper	c2f8d537dc	style	2026-02-28 16:46:38 +00:00