From bb5dc65b7fef503a5e459689eb1eb0523854c13c Mon Sep 17 00:00:00 2001 From: Martin Rattensberger Date: Sat, 4 Jan 2025 12:53:56 +0100 Subject: [PATCH] Initiale Version --- .vscode/settings.json | 3 + css/styles.css | 252 ++++++++++++++++++++++++++++++++++++++++++ index.html | 107 ++++++++++++++++++ 3 files changed, 362 insertions(+) create mode 100644 .vscode/settings.json create mode 100644 css/styles.css create mode 100644 index.html diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000..99f2322 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,3 @@ +{ + "window.autoDetectColorScheme": true +} \ No newline at end of file diff --git a/css/styles.css b/css/styles.css new file mode 100644 index 0000000..7125bec --- /dev/null +++ b/css/styles.css @@ -0,0 +1,252 @@ +:root { + /* Farben */ + --primary-color: #0066cc; + --secondary-color: #00a86b; + --text-color: #333333; + --background-color: #ffffff; + --accent-color: #ff6b6b; + + /* Schriftarten */ + --font-primary: 'Roboto', sans-serif; + --font-secondary: 'Open Sans', sans-serif; + + /* Abstände und Größen */ + --spacing-small: 0.5rem; + --spacing-medium: 1rem; + --spacing-large: 2rem; + + /* Schatten und Übergänge */ + --box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); + --transition: all 0.3s ease; +} + +/* Globale Stile */ +body { + font-family: var(--font-primary); + color: var(--text-color); + line-height: 1.6; + margin: 0; + padding: 0; +} + +.container { + max-width: 1200px; + margin: 0 auto; + padding: 0 var(--spacing-medium); +} + +h1, h2, h3 { + font-family: var(--font-secondary); +} + +h1 { + font-size: clamp(2rem, 5vw, 3.5rem); +} + +h2 { + font-size: clamp(1.5rem, 4vw, 2.5rem); +} + +h3 { + font-size: clamp(1.2rem, 3vw, 1.8rem); +} + +/* Header und Navigation */ +header { + background-color: var(--background-color); + box-shadow: var(--box-shadow); + position: fixed; + width: 100%; + z-index: 1000; +} + +nav ul { + display: flex; + justify-content: space-around; + list-style-type: none; + padding: 0; +} + +nav a { + color: var(--text-color); + text-decoration: none; + padding: var(--spacing-small) var(--spacing-medium); + transition: var(--transition); +} + +nav a:hover { + color: var(--primary-color); +} + +/* Hero Section */ +.hero { + background: linear-gradient(135deg, var(--primary-color), var(--secondary-color)); + color: var(--background-color); + text-align: center; + padding: calc(var(--spacing-large) * 3) var(--spacing-medium); +} + +.cta-button { + display: inline-block; + background-color: var(--accent-color); + color: var(--background-color); + padding: var(--spacing-medium) var(--spacing-large); + border-radius: 30px; + text-decoration: none; + transition: var(--transition); +} + +.cta-button:hover { + background-color: darken(var(--accent-color), 10%); + transform: translateY(-2px); +} + +/* Services Section */ +.service-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); + gap: var(--spacing-large); +} + +.service-card { + background-color: rgba(255, 255, 255, 0.8); + backdrop-filter: blur(10px); + border-radius: 10px; + padding: var(--spacing-large); + box-shadow: var(--box-shadow); + transition: var(--transition); +} + +.service-card:hover { + transform: translateY(-5px); +} + +.service-card img { + max-width: 60px; + margin-bottom: var(--spacing-medium); +} + +/* About Section */ +.about { + background-color: #f8f8f8; + padding: var(--spacing-large) 0; +} + +.usp-list { + list-style-type: none; + padding-left: 0; +} + +.usp-list li::before { + content: "✓"; + color: var(--secondary-color); + margin-right: var(--spacing-small); +} + +/* Case Studies Section */ +.case-study-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: var(--spacing-large); +} + +.case-study-card { + background-color: var(--background-color); + border-radius: 10px; + padding: var(--spacing-large); + box-shadow: var(--box-shadow); +} + +/* Contact Form */ +.contact form { + display: grid; + gap: var(--spacing-medium); +} + +.contact input, +.contact textarea { + width: 100%; + padding: var(--spacing-small); + border: 1px solid #ddd; + border-radius: 5px; +} + +.contact button { + background-color: var(--primary-color); + color: var(--background-color); + border: none; + padding: var(--spacing-medium); + border-radius: 5px; + cursor: pointer; + transition: var(--transition); +} + +.contact button:hover { + background-color: darken(var(--primary-color), 10%); +} + +/* Footer */ +footer { + background-color: var(--text-color); + color: var(--background-color); + text-align: center; + padding: var(--spacing-medium); +} + +/* Responsive Design */ +@media (max-width: 768px) { + nav ul { + flex-direction: column; + align-items: center; + } + + nav li { + margin-bottom: var(--spacing-small); + } +} + +/* Dark Mode */ +@media (prefers-color-scheme: dark) { + :root { + --text-color: #ffffff; + --background-color: #1a1a1a; + } + + .service-card, + .case-study-card { + background-color: rgba(255, 255, 255, 0.1); + } +} + +/* Accessibility */ +.visually-hidden { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0, 0, 0, 0); + white-space: nowrap; + border: 0; +} + +/* Animations */ +@keyframes fadeIn { + from { opacity: 0; } + to { opacity: 1; } +} + +.fade-in { + animation: fadeIn 1s ease-out; +} + +/* Lazy Loading */ +img.lazy { + opacity: 0; + transition: opacity 0.3s; +} + +img.lazy.loaded { + opacity: 1; +} diff --git a/index.html b/index.html new file mode 100644 index 0000000..2f50e30 --- /dev/null +++ b/index.html @@ -0,0 +1,107 @@ + + + + + + KI-Lösungen & Beratung | Ihre Experten für künstliche Intelligenz + + + + + + +
+ +
+ +
+
+

KI-Lösungen für die Zukunft Ihres Unternehmens

+

Steigern Sie Ihre Effizienz und Wettbewerbsfähigkeit mit maßgeschneiderten KI-Strategien

+ Jetzt Beratungsgespräch vereinbaren +
+ +
+

Unsere Services

+
+
+ KI-Strategie Icon +

KI-Strategie

+

Entwicklung individueller KI-Strategien für Ihr Unternehmen

+
+
+ KI-Implementierung Icon +

KI-Implementierung

+

Nahtlose Integration von KI-Lösungen in Ihre bestehenden Systeme

+
+
+ KI-Training Icon +

KI-Training

+

Schulungen und Workshops zur Nutzung von KI-Technologien

+
+
+ KI-Analytics Icon +

KI-Analytics

+

Datenanalyse und Prognosen mithilfe fortschrittlicher KI-Algorithmen

+
+
+
+ +
+

Über uns

+

Wir sind Ihr vertrauenswürdiger Partner für innovative KI-Lösungen. Unsere Expertise liegt in der Entwicklung und Implementierung maßgeschneiderter KI-Strategien, die Ihr Unternehmen auf die nächste Stufe heben.

+
    +
  • Jahrelange Erfahrung in KI-Technologien
    • +
  • Interdisziplinäres Team aus KI-Experten und Branchenspezialisten
    • +
  • Fokus auf praxisnahe, skalierbare Lösungen
    • +
  • Kontinuierliche Forschung und Innovation im KI-Bereich
    • +
+
+ +
+

Case Studies

+
+
+

Effizienzsteigerung in der Logistik

+

Durch den Einsatz unserer KI-gestützten Routenoptimierung konnte ein Logistikunternehmen seine Lieferzeiten um 30% verkürzen und Kraftstoffkosten um 25% senken.

+
+
+

Präzise Nachfrageprognose im Einzelhandel

+

Unsere KI-basierte Prognoselösung ermöglichte einem Einzelhändler eine Reduzierung von Überbeständen um 40% bei gleichzeitiger Steigerung der Produktverfügbarkeit um 15%.

+
+
+
+ +
+

Kontaktieren Sie uns

+
+ + + + + + + + + + + + + +
+
+
+ + + +