|
|
@@ -1 +1,386 @@
|
|
|
-<!DOCTYPE html><html><head><title>Test</title></head><body><h1>Hello</h1></body></html>
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="de">
|
|
|
+<head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
+ <title>AI LLM Solutions - GDPR-konforme lokale LLM-Betreuung</title>
|
|
|
+ <meta name="description" content="Wir helfen Unternehmen bei der Nutzung, dem Betrieb und Training von LLMs sowie agentenbasierter Programmierung. Schwerpunkt auf DSGVO-Konformität und lokaler LLM-Deployment.">
|
|
|
+ <!-- Tailwind CSS via CDN -->
|
|
|
+ <script src="https://cdn.tailwindcss.com"></script>
|
|
|
+ <!-- AOS for animations -->
|
|
|
+ <link href="https://cdnjs.cloudflare.com/ajax/libs/aos/2.3.4/aos.css" rel="stylesheet">
|
|
|
+ <style>
|
|
|
+ /* Custom styles */
|
|
|
+ .gradient-bg {
|
|
|
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
|
+ }
|
|
|
+ .gradient-text {
|
|
|
+ background: linear-gradient(to right, #667eea, #764ba2);
|
|
|
+ -webkit-background-clip: text;
|
|
|
+ -webkit-text-fill-color: transparent;
|
|
|
+ }
|
|
|
+ .hover-lift {
|
|
|
+ transition: transform 0.3s ease, box-shadow 0.3s ease;
|
|
|
+ }
|
|
|
+ .hover-lift:hover {
|
|
|
+ transform: translateY(-10px);
|
|
|
+ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
|
|
|
+ }
|
|
|
+ </style>
|
|
|
+</head>
|
|
|
+<body class="bg-gray-50 text-gray-900">
|
|
|
+ <div class="min-h-screen">
|
|
|
+ <!-- Header -->
|
|
|
+ <header class="bg-white shadow-sm">
|
|
|
+ <div class="max-w-7xl mx-auto px-6 lg:px-8">
|
|
|
+ <div class="flex flex-wrap items-center justify-between py-4">
|
|
|
+ <a href="#" class="flex items-center space-x-3">
|
|
|
+ <svg class="h-8 w-8 text-indigo-600" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path></svg>
|
|
|
+ <span class="text-xl font-bold gradient-text">AI LLM Solutions</span>
|
|
|
+ </a>
|
|
|
+ <nav class="hidden md:flex space-x-6">
|
|
|
+ <a href="#services" class="text-gray-600 hover:text-gray-900 transition-colors">Leistungen</a>
|
|
|
+ <a href="#about" class="text-gray-600 hover:text-gray-900 transition-colors">Über uns</a>
|
|
|
+ <a href="#gdpr" class="text-gray-600 hover:text-gray-900 transition-colors">DSGVO & Lokal</a>
|
|
|
+ <a href="#contact" class="text-gray-600 hover:text-gray-900 transition-colors">Kontakt</a>
|
|
|
+ </nav>
|
|
|
+ <button id="mobile-menu-button" class="md:hidden flex items-center p-2 rounded-md hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-indigo-500">
|
|
|
+ <svg class="h-6 w-6" stroke="currentColor" fill="none" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path></svg>
|
|
|
+ </button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </header>
|
|
|
+
|
|
|
+ <!-- Mobile Menu (hidden by default) -->
|
|
|
+ <div id="mobile-menu" class="md:hidden hidden bg-white border-t border-gray-200">
|
|
|
+ <div class="px-2 pt-2 pb-3 space-y-1">
|
|
|
+ <a href="#services" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:bg-gray-50">Leistungen</a>
|
|
|
+ <a href="#about" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:bg-gray-50">Über uns</a>
|
|
|
+ <a href="#gdpr" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:bg-gray-50">DSGVO & Lokal</a>
|
|
|
+ <a href="#contact" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:bg-gray-50">Kontakt</a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- Hero Section -->
|
|
|
+ <section class="relative bg-gradient-to-b from-gray-50 to-white py-20">
|
|
|
+ <div class="max-w-7xl mx-auto px-6 lg:px-8">
|
|
|
+ <div class="text-center">
|
|
|
+ <h1 class="gradient-text text-4xl md:text-5xl font-bold mb-6" aos aos-animation="fade-up">
|
|
|
+ KI-Lösungen für Ihr Unternehmen
|
|
|
+ </h1>
|
|
|
+ <p class="text-xl text-gray-600 mb-8 max-w-xl mx-aos" aos aos-animation="fade-up" aos-delay="100">
|
|
|
+ Wir unterstützen Sie bei der Nutzung, dem Betrieb und Training von Large Language Models sowie agentenbasierter Programmierung – alles DSGVO-konform und lokal betrieben.
|
|
|
+ </p>
|
|
|
+ <div class="flex flex-col sm:flex-row justify-center space-y-4 sm:space-y-0 sm:space-x-4">
|
|
|
+ <a href="#services" class="px-6 py-3 bg-indigo-600 text-white rounded-md hover:bg-indigo-700 transition-colors transform hover-lift" aos aos-animation="fade-up" aos-delay="200">
|
|
|
+ Unsere Leistungen
|
|
|
+ </a>
|
|
|
+ <a href="#contact" class="px-6 py-3 border border-indigo-600 text-indigo-600 rounded-md hover:bg-indigo-50 hover:text-indigo-800 transition-colors transform hover-lift" aos aos-animation="fade-up" aos-delay="300">
|
|
|
+ Jetzt kontaktieren
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- Decorative wave -->
|
|
|
+ <div class="absolute inset-0 pointer-events-none">
|
|
|
+ <svg class="w-full h-12 text-gray-200" viewBox="0 0 1440 120" preserveAspectRatio="none">
|
|
|
+ <path d="M0 60Q180 0 360 60T1080 60L1440 120H0Z"></path>
|
|
|
+ </svg>
|
|
|
+ </div>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <!-- Services Section -->
|
|
|
+ <section id="services" class="py-20 bg-white">
|
|
|
+ <div class="max-w-7xl mx-auto px-6 lg:px-8">
|
|
|
+ <div class="text-center mb-12">
|
|
|
+ <h2 class="gradient-text text-3xl font-bold mb-4" aos aos-animation="fade-up">Unsere Leistungen</h2>
|
|
|
+ <p class="text-gray-600 max-w-2xl mx-auto" aos aos-animation="fade-up" aos-delay="100">
|
|
|
+ Wir bieten umfassende Unterstützung entlang der gesamten LLM-Wertschöpfungskette.
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ <div class="grid gap-8 sm:grid-cols-2 lg:grid-cols-3">
|
|
|
+ <!-- Service Card 1 -->
|
|
|
+ <div class="bg-white rounded-xl shadow-sm hover-lift transform transition-all duration-300 aos aos-animation="fade-up" aos-delay="200">
|
|
|
+ <div class="p-6">
|
|
|
+ <div class="flex items-center mb-4">
|
|
|
+ <div class="bg-indigo-100 p-3 rounded-full">
|
|
|
+ <svg class="h-5 w-5 text-indigo-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m2 0a2 2 0 100-4 2 2 0 000 4zm-9 3a2 2 0 110-4 2 2 0 010 4zm8 0a2 2 0 100-4 2 2 0 000 4zm4 0a2 2 0 110-4 2 2 0 010 4zm-5 5a2 2 0 100-4 2 2 0 000 4zm4 0a2 2 0 100-4 2 2 0 000 4z"></path></svg>
|
|
|
+ </div>
|
|
|
+ <h3 class="text-xl font-bold ml-3">LLM-Nutzung & Beratung</h3>
|
|
|
+ </div>
|
|
|
+ <p class="text-gray-600 mb-4">
|
|
|
+ Wir analysieren Ihre Use Cases und empfehlen die optimalen LLMs für Ihre Anforderungen – von offenen Modellen bis zu kommerziellen Lösungen.
|
|
|
+ </p>
|
|
|
+ <a href="#" class="text-indigo-600 font-medium hover:text-indigo-800 transition-colors">
|
|
|
+ Mehr erfahren
|
|
|
+ <svg class="ml-2 h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 11h6m0 0l2-2m-2 2 2 2"></path></svg>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- Service Card 2 -->
|
|
|
+ <div class="bg-white rounded-xl shadow-sm hover-lift transform transition-all duration-300 aos aos-animation="fade-up" aos-delay="300">
|
|
|
+ <div class="p-6">
|
|
|
+ <div class="flex items-center mb-4">
|
|
|
+ <div class="bg-indigo-100 p-3 rounded-full">
|
|
|
+ <svg class="h-5 w-5 text-indigo-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4M7 20h10a2 2 0 002-2V6a2 2 0 00-2-2H7a2 2 0 00-2 2v12a2 2 0 002 2z"></path></svg>
|
|
|
+ </div>
|
|
|
+ <h3 class="text-xl font-bold ml-3">LLM-Betrieb & Optimierung</h3>
|
|
|
+ </div>
|
|
|
+ <p class="text-gray-600 mb-4">
|
|
|
+ Von der Infrastruktur über das Monitoring bis zum Performance-Tuning – wir sorgen dafür, dass Ihre LLMs stabil, sicher und kosteneffizient laufen.
|
|
|
+ </p>
|
|
|
+ <a href="#" class="text-indigo-600 font-medium hover:text-indigo-800 transition-colors">
|
|
|
+ Mehr erfahren
|
|
|
+ <svg class="ml-2 h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 11h6m0 0l2-2m-2 2 2 2"></path></svg>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- Service Card 3 -->
|
|
|
+ <div class="bg-white rounded-xl shadow-sm hover-lift transform transition-all duration-300 aos aos-animation="fade-up" aos-delay="400">
|
|
|
+ <div class="p-6">
|
|
|
+ <div class="flex items-center mb-4">
|
|
|
+ <div class="bg-indigo-100 p-3 rounded-full">
|
|
|
+ <svg class="h-5 w-5 text-indigo-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"></path></svg>
|
|
|
+ </div>
|
|
|
+ <h3 class="text-xl font-bold ml-3">LLM-Training & Feinabstimmung</h3>
|
|
|
+ </div>
|
|
|
+ <p class="text-gray-600 mb-4">
|
|
|
+ Wir helfen Ihnen dabei, eigene Modelle mit Ihren Daten zu trainieren oder bestehende LLMs für Ihre spezifischen Tasks zu feinabzustimmen – vollständig on-premise.
|
|
|
+ </p>
|
|
|
+ <a href="#" class="text-indigo-600 font-medium hover:text-indigo-800 transition-colors">
|
|
|
+ Mehr erfahren
|
|
|
+ <svg class="ml-2 h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 11h6m0 0l2-2m-2 2 2 2"></path></svg>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- Service Card 4 -->
|
|
|
+ <div class="bg-white rounded-xl shadow-sm hover-lift transform transition-all duration-300 aos aos-animation="fade-up" aos-delay="500">
|
|
|
+ <div class="p-6">
|
|
|
+ <div class="flex items-center mb-4">
|
|
|
+ <div class="bg-indigo-100 p-3 rounded-full">
|
|
|
+ <svg class="h-5 w-5 text-indigo-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2H5a2 2 0 00-2-2v2a2 2 0 00-2 2h2l2 2h6a2 2 0 012 2v6a2 2 0 01-2 2z"></path></svg>
|
|
|
+ </div>
|
|
|
+ <h3 class="text-xl font-bold ml-3">Agentenbasierte Programmierung</h3>
|
|
|
+ </div>
|
|
|
+ <p class="text-gray-600 mb-4">
|
|
|
+ Entwicklung intelligenter Agenten, die komplexe Aufgaben autonom erledigen – von Datenanalyse über Prozessautomatisierung bis hin zu kundenspezifischen Lösungen.
|
|
|
+ </p>
|
|
|
+ <a href="#" class="text-indigo-600 font-medium hover:text-indigo-800 transition-colors">
|
|
|
+ Mehr erfahren
|
|
|
+ <svg class="ml-2 h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 11h6m0 0l2-2m-2 2 2 2"></path></svg>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <!-- About Section -->
|
|
|
+ <section id="about" class="py-20 bg-gray-50">
|
|
|
+ <div class="max-w-7xl mx-auto px-6 lg:px-8">
|
|
|
+ <div class="grid gap-12 items-start sm:flex sm:items-center sm:gap-16">
|
|
|
+ <div class="flex flex-col items-center sm:text-left aos aos-animation="fade-left" aos-delay="200">
|
|
|
+ <svg class="h-16 w-16 text-indigo-600 mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path></svg>
|
|
|
+ <h2 class="gradient-text text-2xl font-bold mb-4">Über uns</h2>
|
|
|
+ <p class="text-gray-600 max-w-xl">
|
|
|
+ Wir sind ein Team von KI-Experten, das Unternehmen dabei unterstützt, das Potenzial von Large Language Models voll auszuschöpfen – wobei wir stets höchste Standards hinsichtlich Datenschutz, Sicherheit und Leistung einhalten.
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ <div class="aos aos-animation="fade-right" aos-delay="300">
|
|
|
+ <div class="relative h-64 w-full sm:h-80 lg:h-96">
|
|
|
+ <div class="absolute inset-0 bg-gradient-to-r from-indigo-100 to-gray-50 rounded-xl shadow-lg overflow-hidden">
|
|
|
+ <div class="absolute inset-0 bg-[url('https://images.unsplash.com/photo-1485827404703-89b55fcc595e?auto=format&fit=crop&w=800&q=80')] bg-center bg-cover opacity-20"></div>
|
|
|
+ <div class="relative h-full w-full">
|
|
|
+ <div class="absolute inset-0 bg-gradient-to-tr from-indigo-600 via-purple-600 to-pink-600 opacity-10 mix-blend-screen"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <!-- GDPR & Local LLM Section -->
|
|
|
+ <section id="gdpr" class="py-20 bg-white">
|
|
|
+ <div class="max-w-7xl mx-auto px-6 lg:px-8">
|
|
|
+ <div class="text-center mb-12">
|
|
|
+ <h2 class="gradient-text text-3xl font-bold mb-4" aos aos-animation="fade-up">DSGVO-konform & Lokal betrieben</h2>
|
|
|
+ <p class="text-gray-600 max-w-2xl mx-auto" aos aos-animation="fade-up" aos-delay="100">
|
|
|
+ Wir wissen, dass Datenschutz und Datenhoheit entscheidend sind. Deshalb setzen wir auf lokale LLM-Deployments und stellen sicher, dass alle Prozesse DSGVO-konform sind.
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ <div class="grid gap-8 md:grid-cols-2">
|
|
|
+ <div class="space-y-6 aos aos-animation="fade-left" aos-delay="200">
|
|
|
+ <h3 class="text-2xl font-bold text-indigo-600 flex items-center">
|
|
|
+ <svg class="h-5 w-5 mr-3" fill="currentColor" viewBox="0 0 20 20"><path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zm-1 4a1 1 0 100-2 1 1 0 000 2z" clip-rule="evenodd"></path></svg>
|
|
|
+ DSGVO-Konformität
|
|
|
+ </h3>
|
|
|
+ <p class="text-gray-600">
|
|
|
+ Alle Daten verbleiben innerhalb Ihrer Infrastruktur oder in europäischen Rechenzentren. Wir implementieren strenge Zugriffskontrollen, Verschlüsselung und Audit-Trails, um die DSGVO-Anforderungen zu erfüllen.
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ <div class="space-y-6 aos aos-animation="fade-right" aos-delay="300">
|
|
|
+ <h3 class="text-2xl font-bold text-indigo-600 flex items-center">
|
|
|
+ <svg class="h-5 w-5 mr-3" fill="currentColor" viewBox="0 0 20 20"><path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-6 0a2 2 0 10-4 0v5h2a2 2 0 100 4h-2v5a2 2 0 104 0v-5h2a2 2 0 100-4v-5z" clip-rule="evenodd"></path></svg>
|
|
|
+ Lokaler Betrieb
|
|
|
+ </h3>
|
|
|
+ <p class="text-gray-600">
|
|
|
+ Wir deployen LLMs vollständig on-premise oder in Ihrer privaten Cloud. Keine Daten verlassen Ihre Umgebung – maximale Kontrolle über Modelle, Gewichte und Eingaben.
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="mt-16 flex justify-center aos aos-animation="fade-up" aos-delay="400">
|
|
|
+ <a href="#contact" class="px-8 py-4 bg-indigo-600 text-white rounded-md hover:bg-indigo-700 transition-colors transform hover-lift">
|
|
|
+ Jetzt kostenlos beraten lassen
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <!-- Contact Section -->
|
|
|
+ <section id="contact" class="py-20 bg-gray-50">
|
|
|
+ <div class="max-w-7xl mx-auto px-6 lg:px-8">
|
|
|
+ <div class="text-center mb-12">
|
|
|
+ <h2 class="gradient-text text-3xl font-bold mb-4" aos aos-animation="fade-up">Kontakt aufnehmen</h2>
|
|
|
+ <p class="text-gray-600 max-w-2xl mx-auto" aos aos-animation="fade-up" aos-delay="100">
|
|
|
+ Haben Sie Fragen oder möchten Sie ein Projekt besprechen? Wir freuen uns auf Ihre Nachricht.
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ <div class="grid gap-8 md:grid-cols-2">
|
|
|
+ <!-- Contact Form -->
|
|
|
+ <div class="aos aos-animation="fade-left" aos-delay="200">
|
|
|
+ <form id="contactForm" class="space-y-6 bg-white p-6 rounded-xl shadow-sm">
|
|
|
+ <div>
|
|
|
+ <label for="name" class="block text-sm font-medium text-gray-700 mb-1">Name</label>
|
|
|
+ <input type="text" id="name" name="name" required class="w-full px-4 py-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 sm:text-lg">
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <label for="email" class="block text-sm font-medium text-gray-700 mb-1">E-Mail</label>
|
|
|
+ <input type="email" id="email" name="email" required class="w-full px-4 py-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 sm:text-lg">
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <label for="company" class="block text-sm font-medium text-gray-700 mb-1">Unternehmen</label>
|
|
|
+ <input type="text" id="company" name="company" class="w-full px-4 py-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 sm:text-lg">
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <label for="message" class="block text-sm font-medium text-gray-700 mb-1">Nachricht</label>
|
|
|
+ <textarea id="message" name="message" rows="5" required class="w-full px-4 py-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 sm:text-lg"></textarea>
|
|
|
+ </div>
|
|
|
+ <button type="submit" class="w-full px-6 py-3 bg-indigo-600 text-white rounded-md hover:bg-indigo-700 transition-colors transform hover-lift sm:py-4">
|
|
|
+ Nachricht senden
|
|
|
+ </button>
|
|
|
+ <div id="formStatus" class="mt-4 text-center text-sm hidden"></div>
|
|
|
+ </form>
|
|
|
+ </div>
|
|
|
+ <!-- Contact Info -->
|
|
|
+ <div class="aos aos-animation="fade-right" aos-delay="300">
|
|
|
+ <div class="space-y-6 bg-white p-6 rounded-xl shadow-sm">
|
|
|
+ <div class="flex items-start space-x-4">
|
|
|
+ <div class="flex-shrink-0">
|
|
|
+ <svg class="h-5 w-5 text-indigo-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h10a2 2 0 012 2v16l-7-3-2 1V5z"></path></svg>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <h3 class="text-lg font-medium text-gray-900">Adresse</h3>
|
|
|
+ <p class="text-gray-600">Musterstraße 123<br>12345 Musterstadt<br>Deutschland</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="flex items-start space-x-4">
|
|
|
+ <div class="flex-shrink-0">
|
|
|
+ <svg class="h-5 w-5 text-indigo-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10z"></path></svg>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <h3 class="text-lg font-medium text-gray-900">Telefon</h3>
|
|
|
+ <p class="text-gray-600">+49 123 456789</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="flex items-start space-x-4">
|
|
|
+ <div class="flex-shrink-0">
|
|
|
+ <svg class="h-5 w-5 text-indigo-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10z"></path></svg>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <h3 class="text-lg font-medium text-gray-900">E-Mail</h3>
|
|
|
+ <p class="text-gray-600"><a href="mailto:info@ai-llm-solutions.de" class="text-indigo-600 hover:underline">info@ai-llm-solutions.de</a></p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <!-- Footer -->
|
|
|
+ <footer class="bg-gray-900 text-gray-200 py-12">
|
|
|
+ <div class="max-w-7xl mx-auto px-6 lg:px-8">
|
|
|
+ <div class="grid gap-8 md:grid-cols-4 text-sm">
|
|
|
+ <div>
|
|
|
+ <h3 class="font-bold mb-4 text-white">AI LLM Solutions</h3>
|
|
|
+ <p class="space-y-1">
|
|
|
+ Musterstraße 123<br>12345 Musterstadt<br>Deutschland
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <h3 class="font-bold mb-4 text-white">Leistungen</h3>
|
|
|
+ <ul class="space-y-2">
|
|
|
+ <li><a href="#services" class="hover:text-white transition-colors">LLM-Nutzung & Beratung</a></li>
|
|
|
+ <li><a href="#services" class="hover:text-white transition-colors">LLM-Betrieb & Optimierung</a></li>
|
|
|
+ <li><a href="#services" class="hover:text-white transition-colors">LLM-Training & Feinabstimmung</a></li>
|
|
|
+ <li><a href="#services" class="hover:text-white transition-colors">Agentenbasierte Programmierung</a></li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <h3 class="font-bold mb-4 text-white">Rechtliches</h3>
|
|
|
+ <ul class="space-y-2">
|
|
|
+ <li><a href="#" class="hover:text-white transition-colors">Impressum</a></li>
|
|
|
+ <li><a href="#" class="hover:text-white transition-colors">Datenschutz</a></li>
|
|
|
+ <li><a href="#" class="hover:text-white transition-colors">AGB</a></li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <h3 class="font-bold mb-4 text-white">Follow us</h3>
|
|
|
+ <div class="flex space-x-4">
|
|
|
+ <a href="#" class="hover:text-white transition-colors"><svg class="h-5 w-5" fill="currentColor" viewBox="0 0 24 24"><path d="M22.675 0h-9.35A2.687 2.687 0 0010.646 2.263l-2.364 6.68L3.732 7.645a2.676 2.676 0 00-.853 4.08l2.628.327a2.676 2.676 0 00-.853 4.08l6.68 2.364a2.687 2.687 0 003.802 0l6.68-2.364a2.676 2.676 0 00-.853-4.08l2.628-.327a2.676 2.676 0 00-.853-4.08l-2.364-6.68L13.354 2.263A2.687 2.687 0 0022.675 0z"></path></svg></a>
|
|
|
+ <a href="#" class="hover:text-white transition-colors"><svg class="h-5 w-5" fill="currentColor" viewBox="0 0 24 24"><path d="M24 4.557c-.883.392-1.832.656-2.828.775 1.014-.607 1.794-1.35 2.163-2.265-.951.564-2.005.974-3.127 1.195-.897-.957-2.178-1.555-3.594-1.555-3.179 0-5.515 2.966-5.515 6.613 0 .518.045 1.023.127 1.516-4.593-.23-8.654-2.432-9.592-5.73-.475.815-.75 1.742-.75 2.667 0 .932.336 1.76.847 2.247-.784-.029-1.52-.26-2.047-.694-.076.953.31 1.825.78 2.472-.31-.07-.635-.13-.944-.193C7.589 15.2 10.103 17.5 13.024 17.5c15.615 0 24.133-12.932 24.133-24.133 0-.368-.01-.737-.026-1.104.875-.63 1.64-1.409 2.098-2.238z"/></svg></a>
|
|
|
+ <a href="#" class="hover:text-white transition-colors"><svg class="h-5 w-5" fill="currentColor" viewBox="0 0 24 24"><path d="M23.954 4.569c-.885.389-1.83.654-2.825.775 1.014-.607 1.79-1.356 2.16-2.265-.95.564-2.009.974-3.127 1.195-.896-.956-2.173-1.555-3.59-1.555-3.179 0-5.515 2.966-5.515 6.613 0 .518.045 1.018.127 1.51-4.59-.23-8.639-2.424-9.574-5.703L1 24.574l1.095.097 13.052-3.838c1.028.35 2.022.655 3.03.852 1.276-.273 2.474-.874 3.23-1.675C22.086 8.084 23.954 4.569 23.954 4.569z"></path></svg></a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="mt-12 pt-8 border-t border-gray-800 text-center text-xs">
|
|
|
+ © <span id="year"></span> AI LLM Solutions. Alle Rechte vorbehalten.
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </footer>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- AOS Init -->
|
|
|
+ <script>
|
|
|
+ AOS.init({
|
|
|
+ duration: 800,
|
|
|
+ easing: 'slide',
|
|
|
+ once: true
|
|
|
+ });
|
|
|
+ </script>
|
|
|
+ <!-- Mobile Menu Toggle -->
|
|
|
+ <script>
|
|
|
+ const button = document.getElementById('mobile-menu-button');
|
|
|
+ const menu = document.getElementById('mobile-menu');
|
|
|
+ button.addEventListener('click', () => {
|
|
|
+ menu.classList.toggle('hidden');
|
|
|
+ });
|
|
|
+ </script>
|
|
|
+ <!-- Contact Form Submission (dummy) -->
|
|
|
+ <script>
|
|
|
+ document.getElementById('contactForm').addEventListener('submit', function(e) {
|
|
|
+ e.preventDefault();
|
|
|
+ const status = document.getElementById('formStatus');
|
|
|
+ status.textContent = 'Nachricht gesendet! Wir werden uns bald bei Ihnen melden.';
|
|
|
+ status.classList.remove('hidden');
|
|
|
+ status.classList.add('text-green-600');
|
|
|
+ this.reset();
|
|
|
+ });
|
|
|
+ </script>
|
|
|
+ <!-- Set current year -->
|
|
|
+ <script>
|
|
|
+ document.getElementById('year').textContent = new Date().getFullYear();
|
|
|
+ </script>
|
|
|
+</body>
|
|
|
+</html>
|
hermes