commit 3df2a0efea1faf2ecc34833864d30092a0aa5693 Author: Samuel Müller Date: Thu Jul 31 15:19:31 2025 +0200 initial commit diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..ba0d4e7 --- /dev/null +++ b/.gitignore @@ -0,0 +1,63 @@ +# Dependencies +node_modules/ +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +# Build outputs +dist/ +build/ +*.min.js +*.min.css + +# Environment variables +.env +.cursorrules +.cursorrules.txt +.env.local +.env.development.local +.env.test.local +.env.production.local + +# IDE/Editor files +.vscode/ +.idea/ +*.swp +*.swo +*~ + +# OS generated files +.DS_Store +.DS_Store? +._* +.Spotlight-V100 +.Trashes +ehthumbs.db +Thumbs.db + +# Logs +logs +*.log + +# Runtime data +pids +*.pid +*.seed +*.pid.lock + +# Temporary files +tmp/ +temp/ + +# PHP specific (if you add PHP later) +vendor/ +composer.lock + +# Backup files +*.bak +*.backup +*.old + +# Cache files +.cache/ +.parcel-cache/ \ No newline at end of file diff --git a/README.md b/README.md new file mode 100644 index 0000000..1887f6d --- /dev/null +++ b/README.md @@ -0,0 +1,196 @@ +# HexaHost.de - Hosting Website + +Eine moderne und umfangreiche Website für das Hosting-Unternehmen HexaHost.de aus Niederbayern. + +## 🚀 Features + +- **Moderne Glasmorphism-Optik** mit lila/violetten Farbschema +- **Responsive Design** für alle Geräte +- **Vollständige Produktpräsentation** für alle Hosting-Lösungen +- **Interaktive Kontaktformulare** mit Validierung +- **SEO-optimiert** mit Meta-Tags, Sitemap und robots.txt +- **Accessibility-Features** für bessere Nutzbarkeit + +## 📦 Produkte + +### Virtual Private Container (VPC) +- Effiziente LXC-Container auf Proxmox-Basis +- 4 verschiedene Pakete (Starter bis Enterprise) +- Ab 4,99€/Monat + +### Virtual Private Server (VPS) +- Vollwertige KVM-Virtualisierung +- Alle Betriebssysteme unterstützt +- 4 verschiedene Pakete (Basic bis Enterprise) +- Ab 9,99€/Monat + +### Mail Gateway +- Professioneller E-Mail-Schutz +- Spam-, Viren- und Phishing-Filter +- 4 verschiedene Pakete (Starter bis Enterprise) +- Ab 2,99€/Monat + +### Webhosting +- Klassisches Hosting mit PHP, MySQL & SSL +- WordPress-ready mit cPanel +- 4 verschiedene Pakete (Starter bis Enterprise) +- Ab 1,99€/Monat + +## 🛠️ Technologie-Stack + +- **HTML5** - Semantisches Markup +- **CSS3** - Moderne Styles mit Custom Properties +- **Vanilla JavaScript** - Keine Framework-Dependencies +- **Glassmorphism Design** - Moderne Glaseffekte +- **CSS Grid & Flexbox** - Responsive Layouts +- **Inter Font** - Moderne Typografie + +## 📁 Projektstruktur + +``` +HexaHost/ +├── public/ +│ ├── index.html # Startseite +│ ├── vpc.html # Virtual Private Container +│ ├── vps.html # Virtual Private Server +│ ├── mail-gateway.html # Mail Gateway +│ ├── webhosting.html # Webhosting +│ ├── about.html # Über uns +│ ├── contact.html # Kontakt +│ ├── robots.txt # SEO Robots +│ ├── sitemap.xml # SEO Sitemap +│ ├── favicon.svg # Website Icon +│ └── assets/ +│ ├── css/ +│ │ └── style.css # Hauptstyles +│ └── js/ +│ ├── main.js # Haupt-JavaScript +│ └── contact.js # Kontaktformular-Logik +├── .cursorrules # Entwicklungsrichtlinien +├── .gitignore # Git Ignore Rules +└── README.md # Diese Datei +``` + +## 🎨 Design-System + +### Farben +- **Background**: `#0d0821` (Dunkelviolett/Navy) +- **Primary**: `#ff51f9` (Neonpink) +- **Accent 1**: `#a348ff` (Lila) +- **Accent 2**: `#3978ff` (Blau) + +### Typografie +- **Logo Font**: Russo One +- **Slogan Font**: Source Sans Pro +- **Body Font**: Inter +- **Weights**: 300, 400, 500, 600, 700 + +### Effekte +- **Glassmorphism**: `backdrop-filter: blur(10px)` +- **Transitions**: `0.3s ease-in-out` +- **Border Radius**: `0.75rem - 1.5rem` +- **Neon Effects**: Neonpink und Lila-Gradienten + +## 🚀 Installation & Verwendung + +1. **Repository klonen** + ```bash + git clone + cd HexaHost + ``` + +2. **Lokaler Development Server** + ```bash + # Mit Python + python -m http.server 8000 + + # Mit Node.js + npx serve public + + # Mit PHP + php -S localhost:8000 -t public + ``` + +3. **Website öffnen** + ``` + http://localhost:8000 + ``` + +## 📱 Responsive Breakpoints + +- **Desktop**: > 768px +- **Tablet**: 768px - 480px +- **Mobile**: < 480px + +## ✨ Features im Detail + +### Navigation +- Sticky Header mit Glaseffekt +- Dropdown-Menü für Produkte +- Mobile Navigation Toggle +- Smooth Scrolling + +### Produktseiten +- Detaillierte Paketvergleiche +- Technische Spezifikationen +- Anwendungsbereiche +- Call-to-Action Buttons + +### Kontaktformular +- Validierung in Echtzeit +- Auto-Fill basierend auf URL-Parametern +- FAQ-Sektion mit Accordion +- Multiple Kontaktoptionen + +### Interaktivität +- Hover-Effekte auf Karten +- Parallax Hero-Section +- Smooth Animations +- Loading States + +## 🔧 Anpassungen + +### Farben ändern +CSS Custom Properties in `:root` anpassen: +```css +:root { + --background-color: #0d0821; + --primary-color: #ff51f9; + --accent-color-1: #a348ff; + --accent-color-2: #3978ff; + /* ... weitere Farben */ +} +``` + +### Inhalte anpassen +Texte und Preise direkt in den HTML-Dateien ändern. + +### Neue Pakete hinzufügen +Paket-Cards in den entsprechenden Produktseiten duplizieren und anpassen. + +## 📈 SEO & Performance + +- **Meta Tags** für alle Seiten +- **Structured Data** ready +- **Optimierte Bilder** (SVG Icons) +- **Lazy Loading** für Bilder +- **Minifizierte Assets** (optional) + +## 🌐 Browser-Unterstützung + +- Chrome/Edge 88+ +- Firefox 78+ +- Safari 14+ +- Mobile Browser (iOS Safari, Chrome Mobile) + +## 📄 Lizenz + +Alle Rechte vorbehalten HexaHost.de + +## 🤝 Beitragen + +Für Verbesserungsvorschläge oder Bug-Reports bitte ein Issue erstellen. + +--- + +**HexaHost.de** - Zuverlässiges Hosting aus Niederbayern 🚀 \ No newline at end of file diff --git a/demo.html b/demo.html new file mode 100644 index 0000000..317ff1a --- /dev/null +++ b/demo.html @@ -0,0 +1,174 @@ + + + + + + HexaHost.de - Demo Übersicht + + + +
+

HexaHost.de Demo

+ +
+

🚀 Website erfolgreich erstellt!

+

Eine moderne, umfangreiche Website für das Hosting-Unternehmen HexaHost.de mit Glasmorphism-Design, lila/violettem Farbschema und vollständiger Produktpräsentation.

+ +
+ HTML5 + CSS3 + JavaScript + Glassmorphism + Responsive + SEO-optimiert +
+
+ +
+
+

🏠 Startseite

+

Hero-Section mit Produktübersicht und Features

+ Startseite öffnen +
+ +
+

📦 VPC

+

Virtual Private Container mit 4 Paketen

+ VPC ansehen +
+ +
+

🖥️ VPS

+

Virtual Private Server mit KVM

+ VPS ansehen +
+ +
+

📧 Mail Gateway

+

E-Mail-Schutz und Filterung

+ Mail Gateway ansehen +
+ +
+

🌐 Webhosting

+

Klassisches Hosting mit PHP & MySQL

+ Webhosting ansehen +
+ +
+

ℹ️ Über uns

+

Unternehmensinformationen aus Niederbayern

+ Über uns ansehen +
+ +
+

📞 Kontakt

+

Kontaktformular mit FAQ

+ Kontakt öffnen +
+
+ +
+

🛠️ Entwicklung

+

Zum Testen der Website einen lokalen Server starten:

+ + python -m http.server 8000
+ # oder
+ npx serve public + +
+
+ + \ No newline at end of file diff --git a/public/about.html b/public/about.html new file mode 100644 index 0000000..c6acbef --- /dev/null +++ b/public/about.html @@ -0,0 +1,409 @@ + + + + + + Über uns - HexaHost.de | Hosting aus Niederbayern + + + + + + + + +
+ +
+ +
+ +
+
+
+
+ Home + / + Über uns +
+

+ Über HexaHost.de +

+

+ Wir sind Ihr zuverlässiger Partner für Hosting-Lösungen aus Niederbayern. + Mit modernster Technologie und persönlichem Service sorgen wir dafür, + dass Ihre Online-Projekte erfolgreich sind. +

+
+
+
+ + +
+
+
+
+

Unsere Geschichte

+

+ HexaHost.de wurde mit der Vision gegründet, zuverlässiges und preiswertes + Hosting direkt aus Deutschland anzubieten. Als regionales Unternehmen aus + Niederbayern verstehen wir die Bedürfnisse unserer Kunden und bieten + persönlichen Support in deutscher Sprache. +

+

+ Unsere Expertise liegt in der Bereitstellung moderner Hosting-Lösungen + auf Basis von Proxmox-Technologie. Von Virtual Private Containern bis + hin zu klassischem Webhosting - wir haben für jeden Bedarf die passende + Lösung. +

+

+ Vertrauen, Zuverlässigkeit und faire Preise sind die Grundpfeiler unseres + Unternehmens. Wir setzen auf transparente Kommunikation und ehrliche + Beratung, damit Sie die beste Lösung für Ihre Anforderungen erhalten. +

+
+
+
+
+ + + + +
+

Standort Niederbayern

+

Hosting mit regionaler Verbundenheit

+
+
+
+ 99.9% + Uptime +
+
+ 24/7 + Support +
+
+ 100% + Deutschland +
+
+
+
+
+
+ + +
+
+
+

Unsere Mission

+

+ Wir möchten Hosting einfach, zuverlässig und bezahlbar machen +

+
+
+
+
+ + + +
+

Zuverlässigkeit

+

Maximale Verfügbarkeit durch redundante Systeme und proaktive Überwachung. Ihre Online-Präsenz ist bei uns in sicheren Händen.

+
+
+
+ + + +
+

Persönlicher Support

+

Direkter Kontakt zu echten Menschen, die Ihnen schnell und kompetent helfen. Support in deutscher Sprache aus Niederbayern.

+
+
+
+ + + +
+

Faire Preise

+

Transparente Preisgestaltung ohne versteckte Kosten. Qualität muss nicht teuer sein - das beweisen wir täglich.

+
+
+
+ + + +
+

Innovation

+

Modernste Technologien wie Proxmox LXC und KVM für optimale Performance und Flexibilität.

+
+
+
+
+ + +
+
+
+

Unsere Werte

+

+ Was uns antreibt und leitet +

+
+
+
+
+
01
+
+

Vertrauen

+

Wir bauen langfristige Beziehungen zu unseren Kunden auf, basierend auf Vertrauen und Transparenz.

+
+
+
+
02
+
+

Qualität

+

Höchste Standards bei Hardware, Software und Service - Kompromisse bei der Qualität gibt es nicht.

+
+
+
+
03
+
+

Nachhaltigkeit

+

Energieeffiziente Rechenzentren und verantwortungsvoller Umgang mit Ressourcen.

+
+
+
+
04
+
+

Kundenorientierung

+

Ihre Bedürfnisse stehen im Mittelpunkt. Wir hören zu und finden gemeinsam die beste Lösung.

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

Unsere Technologie

+

+ Modernste Infrastruktur für maximale Performance +

+
+
+
+
+ + + + + +
+

Proxmox VE

+

Enterprise-Virtualisierung mit KVM und LXC für maximale Flexibilität und Performance.

+
+
+
+ + +
+

NVMe SSD

+

Modernste NVMe SSD-Speicher für blitzschnelle Zugriffs- und Ladezeiten.

+
+
+
+ + + + +
+

Enterprise Hardware

+

Professionelle Server-Hardware von Intel und AMD mit ECC-RAM und Redundanz.

+
+
+
+ + + +
+

Monitoring & Backup

+

24/7 Überwachung und automatische Backups für maximale Datensicherheit.

+
+
+
+
+ + +
+
+
+

Warum HexaHost.de?

+

+ Die Vorteile einer Zusammenarbeit mit uns +

+
+
+
+
+ + + + +
+

Regionale Nähe

+

Als Unternehmen aus Niederbayern sind wir nah bei unseren Kunden und verstehen regionale Bedürfnisse.

+
+
+
+ + + + + +
+

DSGVO-konform

+

Alle Server stehen in Deutschland. Vollständige DSGVO-Konformität und deutsche Datenschutzstandards.

+
+
+
+ + + + +
+

Schnelle Reaktion

+

Kurze Wege bedeuten schnelle Hilfe. Unser Support reagiert prompt auf Ihre Anfragen.

+
+
+
+ + + + + + +
+

Persönliche Betreuung

+

Jeder Kunde erhält eine persönliche Betreuung - Sie sind nicht nur eine Nummer.

+
+
+
+ + + +
+

Transparent & Fair

+

Keine versteckten Kosten, keine Kleingedruckten Überraschungen. Faire Preise für alle.

+
+
+
+ + + +
+

Skalierbar

+

Wachsen Sie mit uns. Unsere Lösungen sind flexibel skalierbar und wachsen mit Ihren Anforderungen.

+
+
+
+
+ + +
+
+
+

Überzeugt? Lassen Sie uns sprechen!

+

Kontaktieren Sie uns für eine kostenlose und unverbindliche Beratung

+
+ Kontakt aufnehmen + Produkte ansehen +
+
+
+
+
+ + + + + + \ No newline at end of file diff --git a/public/assets/css/style.css b/public/assets/css/style.css new file mode 100644 index 0000000..9074cb7 --- /dev/null +++ b/public/assets/css/style.css @@ -0,0 +1,1474 @@ +/* Reset and Base Styles */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +:root { + /* HexaHost Brand Colors - Complete Set */ + --background-color: #0d0821; + --primary-color: #ff51f9; + --accent-color-1: #a348ff; + --accent-color-2: #3978ff; + --highlight-color: #f093ff; + --accent-deep: #6b2aff; + --accent-neon-blue: #00cfff; + --accent-pink-dark: #c31adf; + --success-color: #32fba2; + --warning-color: #ffcc00; + --error-color: #ff4d6d; + --neutral-light: #1a1230; + --neutral-medium: #3d3a4e; + --text-primary: #ffffff; + --text-secondary: #cfc9dd; + + /* Legacy Neutral Colors (for compatibility) */ + --white: #ffffff; + --gray-50: #f8fafc; + --gray-100: #f1f5f9; + --gray-200: #e2e8f0; + --gray-300: #cbd5e1; + --gray-400: #94a3b8; + --gray-500: #64748b; + --gray-600: #475569; + --gray-700: #334155; + --gray-800: #1e293b; + --gray-900: #0f172a; + + /* Background Gradients */ + --bg-primary: linear-gradient(135deg, var(--background-color) 0%, var(--neutral-light) 100%); + --bg-secondary: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color-1) 100%); + --bg-accent: linear-gradient(135deg, var(--accent-deep) 0%, var(--accent-color-1) 100%); + --bg-neon: linear-gradient(135deg, var(--accent-neon-blue) 0%, var(--primary-color) 100%); + + /* Glass Effect */ + --glass-bg: rgba(255, 255, 255, 0.05); + --glass-border: rgba(255, 255, 255, 0.1); + --glass-shadow: 0 8px 32px 0 rgba(255, 81, 249, 0.2); + --glass-shadow-accent: 0 8px 32px 0 rgba(163, 72, 255, 0.3); + --glass-shadow-neon: 0 8px 32px 0 rgba(0, 207, 255, 0.3); + + /* Typography */ + --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; + --font-logo: 'Russo One', sans-serif; + --font-slogan: 'Source Sans Pro', sans-serif; + --font-size-xs: 0.75rem; + --font-size-sm: 0.875rem; + --font-size-base: 1rem; + --font-size-lg: 1.125rem; + --font-size-xl: 1.25rem; + --font-size-2xl: 1.5rem; + --font-size-3xl: 1.875rem; + --font-size-4xl: 2.25rem; + --font-size-5xl: 3rem; + + /* Spacing */ + --spacing-xs: 0.25rem; + --spacing-sm: 0.5rem; + --spacing-md: 1rem; + --spacing-lg: 1.5rem; + --spacing-xl: 2rem; + --spacing-2xl: 3rem; + --spacing-3xl: 4rem; + + /* Border Radius */ + --radius-sm: 0.375rem; + --radius-md: 0.5rem; + --radius-lg: 0.75rem; + --radius-xl: 1rem; + --radius-2xl: 1.5rem; + + /* Transitions */ + --transition-fast: 0.15s ease-in-out; + --transition-base: 0.3s ease-in-out; + --transition-slow: 0.5s ease-in-out; +} + +body { + font-family: var(--font-family); + line-height: 1.6; + color: var(--text-primary); + background: var(--background-color); + min-height: 100vh; + overflow-x: hidden; +} + +/* Glass Card Effect */ +.glass-card { + background: var(--glass-bg); + backdrop-filter: blur(10px); + -webkit-backdrop-filter: blur(10px); + border: 1px solid var(--glass-border); + border-radius: var(--radius-xl); + box-shadow: var(--glass-shadow); + transition: all var(--transition-base); +} + +.glass-card:hover { + transform: translateY(-5px); + box-shadow: 0 20px 40px 0 rgba(31, 38, 135, 0.5); +} + +/* Container */ +.container { + max-width: 1200px; + margin: 0 auto; + padding: 0 var(--spacing-lg); +} + +/* Header */ +.header { + position: fixed; + top: 0; + left: 0; + right: 0; + z-index: 1000; + background: rgba(13, 8, 33, 0.5); + backdrop-filter: blur(20px); + -webkit-backdrop-filter: blur(20px); + border-bottom: 1px solid var(--glass-border); + box-shadow: 0 2px 20px rgba(255, 81, 249, 0.1); + transition: all var(--transition-base); +} + +.header.scrolled { + background: rgba(13, 8, 33, 0.523); + box-shadow: 0 4px 30px rgba(255, 81, 249, 0.2); +} + +.nav-container { + max-width: 1200px; + margin: 0 auto; + padding: 0 var(--spacing-lg); + display: flex; + align-items: center; + justify-content: space-between; + height: 70px; +} + +.nav-logo a { + text-decoration: none; + font-size: var(--font-size-xl); + font-weight: 700; + color: var(--white); + display: flex; + align-items: center; +} + +.logo-text { + font-family: var(--font-logo); + background: linear-gradient(135deg, var(--primary-color), var(--accent-color-1)); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; +} + +.logo-tld { + color: var(--accent-color-2); +} + +.nav-menu { + display: flex; + list-style: none; + gap: var(--spacing-xl); + align-items: center; +} + +.nav-link { + text-decoration: none; + color: var(--white); + font-weight: 500; + padding: var(--spacing-sm) var(--spacing-md); + border-radius: var(--radius-md); + transition: all var(--transition-base); + position: relative; +} + +.nav-link:hover, +.nav-link.active { + background: var(--glass-bg); + backdrop-filter: blur(10px); + -webkit-backdrop-filter: blur(10px); +} + +.nav-dropdown { + position: relative; +} + +.dropdown-menu { + position: absolute; + top: 100%; + left: 0; + background: var(--glass-bg); + backdrop-filter: blur(20px); + -webkit-backdrop-filter: blur(20px); + border: 1px solid var(--glass-border); + border-radius: var(--radius-lg); + padding: var(--spacing-sm); + min-width: 200px; + opacity: 0; + visibility: hidden; + transform: translateY(-10px); + transition: all var(--transition-base); + list-style: none; +} + +.nav-dropdown:hover .dropdown-menu { + opacity: 1; + visibility: visible; + transform: translateY(0); +} + +.dropdown-menu li { + margin: 0; +} + +.dropdown-menu a { + display: block; + padding: var(--spacing-sm) var(--spacing-md); + color: var(--white); + text-decoration: none; + border-radius: var(--radius-sm); + transition: background var(--transition-fast); +} + +.dropdown-menu a:hover { + background: rgba(255, 255, 255, 0.1); +} + +.nav-toggle { + display: none; + flex-direction: column; + cursor: pointer; +} + +.nav-toggle span { + width: 25px; + height: 3px; + background: var(--white); + margin: 3px 0; + transition: var(--transition-base); +} + +/* Hero Section */ +.hero { + padding: 120px 0 80px; + min-height: 100vh; + display: flex; + align-items: center; + position: relative; + overflow: hidden; +} + +.hero::before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: url('data:image/svg+xml,'); + z-index: -1; +} + +.hero-container { + max-width: 1200px; + margin: 0 auto; + padding: 0 var(--spacing-lg); + display: grid; + grid-template-columns: 1fr 1fr; + gap: var(--spacing-3xl); + align-items: center; +} + +.hero-title { + font-size: var(--font-size-5xl); + font-weight: 700; + line-height: 1.2; + margin-bottom: var(--spacing-lg); +} + +.highlight { + background: linear-gradient(135deg, var(--primary-color), var(--highlight-color)); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; +} + +.hero-description { + font-size: var(--font-size-lg); + color: var(--text-secondary); + margin-bottom: var(--spacing-2xl); + line-height: 1.6; +} + +.hero-actions { + display: flex; + gap: var(--spacing-lg); +} + +.hero-visual { + display: flex; + justify-content: center; + align-items: center; +} + +.hero-card { + padding: var(--spacing-2xl); + text-align: center; + max-width: 300px; +} + +.server-icon { + width: 80px; + height: 80px; + margin: 0 auto var(--spacing-lg); + color: var(--primary-color); +} + +.hero-card h3 { + font-size: var(--font-size-2xl); + font-weight: 600; + margin-bottom: var(--spacing-sm); +} + +.hero-card p { + color: var(--text-secondary); + font-size: var(--font-size-lg); +} + +/* Buttons */ +.btn { + display: inline-flex; + align-items: center; + padding: var(--spacing-md) var(--spacing-xl); + border: none; + border-radius: var(--radius-lg); + font-weight: 600; + text-decoration: none; + cursor: pointer; + transition: all var(--transition-base); + font-size: var(--font-size-base); +} + +.btn-primary { + background: linear-gradient(135deg, var(--primary-color), var(--accent-color-1)); + color: var(--text-primary); + box-shadow: 0 4px 15px 0 rgba(255, 81, 249, 0.3); +} + +.btn-primary:hover { + transform: translateY(-2px); + box-shadow: 0 8px 25px 0 rgba(255, 81, 249, 0.4); +} + +.btn-secondary { + background: var(--glass-bg); + color: var(--text-primary); + border: 1px solid var(--glass-border); + backdrop-filter: blur(10px); + -webkit-backdrop-filter: blur(10px); +} + +.btn-secondary:hover { + background: rgba(255, 255, 255, 0.2); + transform: translateY(-2px); +} + +/* Sections */ +.section-header { + text-align: center; + margin-bottom: var(--spacing-3xl); +} + +.section-title { + font-size: var(--font-size-4xl); + font-weight: 700; + margin-bottom: var(--spacing-lg); +} + +.section-description { + font-size: var(--font-size-lg); + color: rgba(255, 255, 255, 0.8); + max-width: 600px; + margin: 0 auto; +} + +/* Products Section */ +.products { + padding: var(--spacing-3xl) 0; +} + +.products-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); + gap: var(--spacing-xl); +} + +.product-card { + padding: var(--spacing-2xl); + text-align: center; + position: relative; + transition: all var(--transition-base); +} + +.product-card.featured { + transform: scale(1.05); + border: 2px solid var(--primary-light); +} + +.featured-badge { + position: absolute; + top: -10px; + right: var(--spacing-lg); + background: linear-gradient(135deg, var(--primary-color), var(--accent-color-2)); + color: var(--white); + padding: var(--spacing-xs) var(--spacing-md); + border-radius: var(--radius-lg); + font-size: var(--font-size-sm); + font-weight: 600; +} + +.product-icon { + width: 40px; + height: 40px; + margin: 0 auto var(--spacing-md); + color: var(--primary-color); +} + +.product-title { + font-size: var(--font-size-xl); + font-weight: 600; + margin-bottom: var(--spacing-md); +} + +.product-description { + color: rgba(255, 255, 255, 0.8); + margin-bottom: var(--spacing-lg); + line-height: 1.6; +} + +.product-features { + display: flex; + flex-direction: column; + gap: var(--spacing-sm); + margin-bottom: var(--spacing-lg); +} + +.feature { + font-size: var(--font-size-sm); + color: rgba(255, 255, 255, 0.9); +} + +.product-price { + font-size: var(--font-size-lg); + margin-bottom: var(--spacing-lg); + color: rgba(255, 255, 255, 0.9); +} + +.price { + font-size: var(--font-size-2xl); + font-weight: 700; + color: var(--primary-color); +} + +/* Features Section */ +.features { + padding: var(--spacing-3xl) 0; + background: rgba(255, 255, 255, 0.05); +} + +.features-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: var(--spacing-lg); +} + +.feature-item { + padding: var(--spacing-lg); + text-align: center; +} + +.feature-icon { + width: 32px; + height: 32px; + margin: 0 auto var(--spacing-md); + color: var(--primary-color); +} + +.feature-item h3 { + font-size: var(--font-size-lg); + font-weight: 600; + margin-bottom: var(--spacing-sm); +} + +.feature-item p { + color: var(--text-secondary); + line-height: 1.5; + font-size: var(--font-size-sm); +} + +/* CTA Section */ +.cta { + padding: var(--spacing-3xl) 0; +} + +.cta-content { + text-align: center; + padding: var(--spacing-3xl); +} + +.cta-content h2 { + font-size: var(--font-size-3xl); + font-weight: 700; + margin-bottom: var(--spacing-lg); +} + +.cta-content p { + font-size: var(--font-size-lg); + color: var(--text-secondary); + margin-bottom: var(--spacing-2xl); +} + +.cta-actions { + display: flex; + gap: var(--spacing-lg); + justify-content: center; +} + +/* Footer */ +.footer { + background: rgba(0, 0, 0, 0.3); + padding: var(--spacing-3xl) 0 var(--spacing-xl); + margin-top: var(--spacing-3xl); +} + +.footer-content { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); + gap: var(--spacing-2xl); + margin-bottom: var(--spacing-2xl); +} + +.footer-section h4 { + font-size: var(--font-size-lg); + font-weight: 600; + margin-bottom: var(--spacing-lg); + color: var(--primary-color); +} + +.footer-section p { + color: var(--text-secondary); + margin-bottom: var(--spacing-md); +} + +.footer-location { + display: flex; + align-items: center; + gap: var(--spacing-sm); + color: rgba(255, 255, 255, 0.7); +} + +.footer-location svg { + width: 16px; + height: 16px; +} + +.footer-section ul { + list-style: none; +} + +.footer-section ul li { + margin-bottom: var(--spacing-sm); +} + +.footer-section ul li a { + color: rgba(255, 255, 255, 0.8); + text-decoration: none; + transition: color var(--transition-base); +} + +.footer-section ul li a:hover { + color: var(--primary-color); +} + +.footer-bottom { + padding-top: var(--spacing-xl); + border-top: 1px solid rgba(255, 255, 255, 0.1); + text-align: center; + color: rgba(255, 255, 255, 0.6); +} + +/* Responsive Design */ +@media (max-width: 768px) { + .nav-menu { + display: none; + } + + .nav-toggle { + display: flex; + } + + .hero-container { + grid-template-columns: 1fr; + text-align: center; + gap: var(--spacing-2xl); + } + + .hero-title { + font-size: var(--font-size-3xl); + } + + .hero-actions { + flex-direction: column; + align-items: center; + } + + .products-grid { + grid-template-columns: 1fr; + } + + .features-grid { + grid-template-columns: 1fr; + } + + .cta-actions { + flex-direction: column; + align-items: center; + } + + .footer-content { + grid-template-columns: 1fr; + text-align: center; + } +} + +@media (max-width: 480px) { + .container { + padding: 0 var(--spacing-md); + } + + .nav-container { + padding: 0 var(--spacing-md); + } + + .hero { + padding: 100px 0 60px; + } + + .hero-title { + font-size: var(--font-size-2xl); + } + + .section-title { + font-size: var(--font-size-3xl); + } + + .product-card, + .feature-item, + .cta-content { + padding: var(--spacing-xl); + } +} + +/* Product Pages Styles */ +.product-hero { + padding: 120px 0 80px; + min-height: 60vh; + display: flex; + align-items: center; +} + +.product-hero-content { + max-width: 800px; + margin: 0 auto; + text-align: center; + padding: 0 var(--spacing-lg); +} + +.breadcrumb { + margin-bottom: var(--spacing-lg); + color: var(--text-secondary); + font-size: var(--font-size-sm); +} + +.breadcrumb a { + color: var(--primary-color); + text-decoration: none; +} + +.breadcrumb span { + margin: 0 var(--spacing-sm); +} + +.product-hero-title { + font-size: var(--font-size-4xl); + font-weight: 700; + line-height: 1.2; + margin-bottom: var(--spacing-lg); +} + +.product-hero-description { + font-size: var(--font-size-lg); + color: var(--text-secondary); + margin-bottom: var(--spacing-2xl); + line-height: 1.6; +} + +.product-hero-features { + display: flex; + justify-content: center; + gap: var(--spacing-2xl); + flex-wrap: wrap; +} + +.hero-feature { + display: flex; + align-items: center; + gap: var(--spacing-sm); + color: var(--primary-color); + font-weight: 500; +} + +.hero-feature svg { + width: 16px; + height: 16px; +} + +/* Package Cards */ +.packages { + padding: var(--spacing-3xl) 0; +} + +.packages-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: var(--spacing-2xl); +} + +.package-card { + padding: var(--spacing-2xl); + position: relative; + text-align: center; +} + +.package-header { + margin-bottom: var(--spacing-xl); +} + +.package-name { + font-size: var(--font-size-xl); + font-weight: 600; + margin-bottom: var(--spacing-md); +} + +.package-price { + margin-bottom: var(--spacing-xl); +} + +.package-price .price { + font-size: var(--font-size-3xl); + font-weight: 700; + color: var(--primary-color); +} + +.package-price .period { + color: var(--text-secondary); + font-size: var(--font-size-base); +} + +.package-specs { + margin-bottom: var(--spacing-xl); + text-align: left; +} + +.spec-item { + display: flex; + justify-content: space-between; + align-items: center; + padding: var(--spacing-sm) 0; + border-bottom: 1px solid rgba(255, 255, 255, 0.1); +} + +.spec-label { + color: rgba(255, 255, 255, 0.8); +} + +.spec-value { + font-weight: 600; + color: var(--white); +} + +.package-features { + margin-bottom: var(--spacing-xl); + text-align: left; +} + +.package-features .feature { + padding: var(--spacing-xs) 0; + color: rgba(255, 255, 255, 0.9); + font-size: var(--font-size-sm); +} + +/* Technical Details */ +.technical-details, +.mail-features, +.web-features, +.vps-features { + padding: var(--spacing-3xl) 0; + background: rgba(255, 255, 255, 0.05); +} + +.details-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: var(--spacing-lg); +} + +.detail-card { + padding: var(--spacing-lg); + text-align: center; +} + +.detail-icon { + width: 32px; + height: 32px; + margin: 0 auto var(--spacing-md); + color: var(--primary-color); +} + +.detail-card h3 { + font-size: var(--font-size-base); + font-weight: 600; + margin-bottom: var(--spacing-sm); +} + +.detail-card p { + color: var(--text-secondary); + line-height: 1.5; + font-size: var(--font-size-sm); +} + +/* Use Cases */ +.use-cases { + padding: var(--spacing-3xl) 0; +} + +.use-cases-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); + gap: var(--spacing-lg); +} + +.use-case-item { + padding: var(--spacing-lg); +} + +.use-case-item h3 { + font-size: var(--font-size-base); + font-weight: 600; + margin-bottom: var(--spacing-sm); + color: var(--primary-color); +} + +.use-case-item p { + color: var(--text-secondary); + line-height: 1.5; + font-size: var(--font-size-sm); +} + +/* Operating Systems Grid */ +.operating-systems, +.technologies, +.cms-support { + padding: var(--spacing-3xl) 0; +} + +.os-grid, +.tech-grid, +.cms-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); + gap: var(--spacing-md); +} + +.os-item, +.tech-item, +.cms-item { + padding: var(--spacing-md); + text-align: center; +} + +.os-icon, +.tech-icon { + width: 28px; + height: 28px; + margin: 0 auto var(--spacing-sm); + color: var(--primary-color); +} + +.cms-logo { + width: 40px; + height: 40px; + margin: 0 auto var(--spacing-sm); + background: linear-gradient(135deg, var(--primary-color), var(--accent-color-1)); + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + font-weight: 700; + font-size: var(--font-size-base); + color: var(--text-primary); +} + +.os-item h3, +.tech-item h3, +.cms-item h3 { + font-size: var(--font-size-sm); + font-weight: 600; + margin-bottom: var(--spacing-xs); +} + +.os-item p, +.tech-item p, +.cms-item p { + color: rgba(255, 255, 255, 0.7); + font-size: var(--font-size-xs); +} + +/* Performance & Security */ +.performance-security { + padding: var(--spacing-3xl) 0; + background: rgba(255, 255, 255, 0.05); +} + +.perf-sec-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: var(--spacing-lg); +} + +.perf-sec-item { + padding: var(--spacing-lg); + text-align: center; +} + +.perf-sec-icon { + width: 32px; + height: 32px; + margin: 0 auto var(--spacing-md); + color: var(--primary-color); +} + +/* About Page Styles */ +.about-hero, +.contact-hero { + padding: 120px 0 80px; + min-height: 60vh; + display: flex; + align-items: center; +} + +.about-hero-content, +.contact-hero-content { + max-width: 800px; + margin: 0 auto; + text-align: center; + padding: 0 var(--spacing-lg); +} + +.about-hero-title, +.contact-hero-title { + font-size: var(--font-size-4xl); + font-weight: 700; + line-height: 1.2; + margin-bottom: var(--spacing-lg); +} + +.about-hero-description, +.contact-hero-description { + font-size: var(--font-size-lg); + color: rgba(255, 255, 255, 0.8); + line-height: 1.6; +} + +/* Company Story */ +.company-story { + padding: var(--spacing-3xl) 0; +} + +.story-content { + display: grid; + grid-template-columns: 2fr 1fr; + gap: var(--spacing-3xl); + align-items: center; +} + +.story-text p { + margin-bottom: var(--spacing-lg); + color: var(--text-secondary); + line-height: 1.6; +} + +.story-visual { + padding: var(--spacing-2xl); + text-align: center; +} + +.location-info { + margin-bottom: var(--spacing-2xl); +} + +.location-icon { + width: 60px; + height: 60px; + margin: 0 auto var(--spacing-lg); + color: var(--primary-color); +} + +.location-info h3 { + font-size: var(--font-size-lg); + font-weight: 600; + margin-bottom: var(--spacing-sm); +} + +.stats { + display: flex; + justify-content: space-around; + gap: var(--spacing-lg); +} + +.stat-item { + text-align: center; +} + +.stat-number { + display: block; + font-size: var(--font-size-2xl); + font-weight: 700; + color: var(--primary-color); + margin-bottom: var(--spacing-xs); +} + +.stat-label { + font-size: var(--font-size-sm); + color: var(--text-secondary); +} + +/* Mission */ +.mission { + padding: var(--spacing-3xl) 0; + background: rgba(255, 255, 255, 0.05); +} + +.mission-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: var(--spacing-lg); +} + +.mission-item { + padding: var(--spacing-lg); + text-align: center; +} + +.mission-icon { + width: 32px; + height: 32px; + margin: 0 auto var(--spacing-md); + color: var(--primary-color); +} + +/* Values */ +.values { + padding: var(--spacing-3xl) 0; +} + +.values-list { + display: grid; + gap: var(--spacing-lg); +} + +.value-item { + display: flex; + align-items: flex-start; + gap: var(--spacing-lg); + padding: var(--spacing-xl); +} + +.value-number { + font-size: var(--font-size-2xl); + font-weight: 700; + color: var(--primary-color); + min-width: 60px; +} + +.value-content h3 { + font-size: var(--font-size-lg); + font-weight: 600; + margin-bottom: var(--spacing-sm); +} + +.value-content p { + color: rgba(255, 255, 255, 0.8); + line-height: 1.6; +} + +/* Technology Stack */ +.technology-stack { + padding: var(--spacing-3xl) 0; + background: rgba(255, 255, 255, 0.05); +} + +.tech-stack-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: var(--spacing-lg); +} + +.tech-stack-item { + padding: var(--spacing-lg); + text-align: center; +} + +.tech-icon { + width: 50px; + height: 50px; + margin: 0 auto var(--spacing-lg); + color: var(--primary-color); +} + +/* Why Choose Us */ +.why-choose-us { + padding: var(--spacing-3xl) 0; +} + +.advantages-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); + gap: var(--spacing-lg); +} + +.advantage-item { + padding: var(--spacing-lg); + text-align: center; +} + +.advantage-icon { + width: 32px; + height: 32px; + margin: 0 auto var(--spacing-md); + color: var(--primary-color); +} + +/* Contact Page Styles */ +.contact-options { + padding: var(--spacing-3xl) 0; +} + +.contact-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: var(--spacing-lg); +} + +.contact-item { + padding: var(--spacing-lg); + text-align: center; +} + +.contact-icon { + width: 32px; + height: 32px; + margin: 0 auto var(--spacing-md); + color: var(--primary-color); +} + +.contact-link { + display: inline-block; + margin-top: var(--spacing-md); + color: var(--primary-color); + text-decoration: none; + font-weight: 600; + padding: var(--spacing-sm) var(--spacing-md); + border: 2px solid var(--primary-color); + border-radius: var(--radius-md); + transition: all var(--transition-base); +} + +.contact-link:hover { + background: var(--primary-color); + color: var(--text-primary); +} + +.chat-btn { + background: none; + cursor: pointer; +} + +.contact-hours { + margin-top: var(--spacing-sm); + font-size: var(--font-size-sm); + color: var(--text-secondary); +} + +/* Contact Form */ +.contact-form-section { + padding: var(--spacing-3xl) 0; + background: rgba(255, 255, 255, 0.05); +} + +.form-container { + max-width: 800px; + margin: 0 auto; +} + +.form-header { + text-align: center; + margin-bottom: var(--spacing-2xl); +} + +.contact-form { + padding: var(--spacing-2xl); +} + +.form-row { + display: grid; + grid-template-columns: 1fr 1fr; + gap: var(--spacing-lg); +} + +.form-group { + margin-bottom: var(--spacing-lg); +} + +.form-group label { + display: block; + margin-bottom: var(--spacing-sm); + color: var(--text-primary); + font-weight: 500; +} + +.form-group input, +.form-group select, +.form-group textarea { + width: 100%; + padding: var(--spacing-md); + border: 1px solid rgba(255, 255, 255, 0.2); + border-radius: var(--radius-md); + background: rgba(255, 255, 255, 0.1); + color: var(--text-primary); + font-family: inherit; + transition: all var(--transition-base); +} + +.form-group input:focus, +.form-group select:focus, +.form-group textarea:focus { + outline: none; + border-color: var(--primary-color); + background: rgba(255, 255, 255, 0.15); +} + +.form-group input::placeholder, +.form-group textarea::placeholder { + color: var(--text-secondary); +} + +.checkbox-group { + display: flex; + align-items: flex-start; + gap: var(--spacing-sm); +} + +.checkbox-label { + display: flex; + align-items: flex-start; + gap: var(--spacing-sm); + cursor: pointer; + font-size: var(--font-size-sm); + line-height: 1.4; +} + +.checkbox-label input[type="checkbox"] { + width: auto; + margin: 0; +} + +.checkmark { + width: 20px; + height: 20px; + border: 2px solid rgba(255, 255, 255, 0.3); + border-radius: var(--radius-sm); + background: transparent; + position: relative; + flex-shrink: 0; + margin-top: 2px; +} + +.checkbox-label input[type="checkbox"]:checked + .checkmark { + background: var(--primary-color); + border-color: var(--primary-color); +} + +.checkbox-label input[type="checkbox"]:checked + .checkmark::after { + content: '✓'; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + color: var(--white); + font-size: 12px; + font-weight: bold; +} + +.checkbox-label a { + color: var(--primary-color); + text-decoration: none; +} + +.checkbox-label a:hover { + text-decoration: underline; +} + +.form-actions { + display: flex; + gap: var(--spacing-lg); + justify-content: center; + margin-top: var(--spacing-xl); +} + +/* FAQ Section */ +.faq-section { + padding: var(--spacing-3xl) 0; +} + +.faq-grid { + display: grid; + gap: var(--spacing-lg); + max-width: 800px; + margin: 0 auto; +} + +.faq-item { + padding: 0; + overflow: hidden; +} + +.faq-question { + display: flex; + justify-content: space-between; + align-items: center; + padding: var(--spacing-lg); + cursor: pointer; + transition: background var(--transition-base); +} + +.faq-question:hover { + background: rgba(255, 255, 255, 0.05); +} + +.faq-question h3 { + font-size: var(--font-size-lg); + font-weight: 600; + margin: 0; +} + +.faq-toggle { + font-size: var(--font-size-2xl); + font-weight: 300; + color: var(--primary-color); + transition: transform var(--transition-base); +} + +.faq-item.open .faq-toggle { + transform: rotate(45deg); +} + +.faq-answer { + max-height: 0; + overflow: hidden; + transition: max-height var(--transition-base); +} + +.faq-answer p { + padding: 0 var(--spacing-lg) var(--spacing-lg); + color: rgba(255, 255, 255, 0.8); + line-height: 1.6; + margin: 0; +} + +/* Response Time */ +.response-time { + padding: var(--spacing-3xl) 0; + background: rgba(255, 255, 255, 0.05); +} + +.response-content { + display: grid; + grid-template-columns: 2fr 1fr; + gap: var(--spacing-2xl); + align-items: center; + padding: var(--spacing-2xl); +} + +.response-stats { + display: flex; + justify-content: space-around; + gap: var(--spacing-lg); +} + +.response-text h3 { + font-size: var(--font-size-xl); + font-weight: 600; + margin-bottom: var(--spacing-md); +} + +.response-text p { + color: rgba(255, 255, 255, 0.8); + line-height: 1.6; +} + +/* Additional responsive styles */ +@media (max-width: 768px) { + .product-hero-features { + gap: var(--spacing-lg); + } + + .hero-feature { + font-size: var(--font-size-sm); + } + + .packages-grid { + grid-template-columns: 1fr; + } + + .story-content { + grid-template-columns: 1fr; + } + + .stats { + flex-direction: column; + gap: var(--spacing-md); + } + + .form-row { + grid-template-columns: 1fr; + } + + .response-content { + grid-template-columns: 1fr; + text-align: center; + } + + .response-stats { + flex-direction: column; + gap: var(--spacing-md); + } + + .form-actions { + flex-direction: column; + align-items: center; + } +} \ No newline at end of file diff --git a/public/assets/js/contact.js b/public/assets/js/contact.js new file mode 100644 index 0000000..addf78b --- /dev/null +++ b/public/assets/js/contact.js @@ -0,0 +1,290 @@ +// Contact page specific JavaScript +(function() { + 'use strict'; + + // FAQ Accordion functionality + function initFAQ() { + const faqItems = document.querySelectorAll('.faq-item'); + + faqItems.forEach(item => { + const question = item.querySelector('.faq-question'); + const answer = item.querySelector('.faq-answer'); + const toggle = item.querySelector('.faq-toggle'); + + question.addEventListener('click', function() { + const isOpen = item.classList.contains('open'); + + // Close all other FAQ items + faqItems.forEach(otherItem => { + if (otherItem !== item) { + otherItem.classList.remove('open'); + const otherAnswer = otherItem.querySelector('.faq-answer'); + const otherToggle = otherItem.querySelector('.faq-toggle'); + otherAnswer.style.maxHeight = null; + otherToggle.textContent = '+'; + } + }); + + // Toggle current item + if (isOpen) { + item.classList.remove('open'); + answer.style.maxHeight = null; + toggle.textContent = '+'; + } else { + item.classList.add('open'); + answer.style.maxHeight = answer.scrollHeight + 'px'; + toggle.textContent = '−'; + } + }); + }); + } + + // Contact form handling + function initContactForm() { + const form = document.getElementById('contactForm'); + + if (!form) return; + + form.addEventListener('submit', function(e) { + e.preventDefault(); + + // Get form data + const formData = new FormData(form); + const data = {}; + for (let [key, value] of formData.entries()) { + data[key] = value; + } + + // Basic validation + if (!validateForm(data)) { + return; + } + + // Show loading state + const submitBtn = form.querySelector('button[type="submit"]'); + const originalText = submitBtn.textContent; + submitBtn.textContent = 'Wird gesendet...'; + submitBtn.disabled = true; + + // Simulate form submission (replace with actual endpoint) + setTimeout(() => { + // Reset form + form.reset(); + + // Show success message + showNotification('Ihre Nachricht wurde erfolgreich gesendet! Wir melden uns in Kürze bei Ihnen.', 'success'); + + // Reset button + submitBtn.textContent = originalText; + submitBtn.disabled = false; + + // Scroll to top + window.scrollTo({ top: 0, behavior: 'smooth' }); + }, 2000); + }); + } + + // Form validation + function validateForm(data) { + const requiredFields = ['firstName', 'lastName', 'email', 'subject', 'message']; + const errors = []; + + // Check required fields + requiredFields.forEach(field => { + if (!data[field] || data[field].trim() === '') { + errors.push(`Das Feld "${getFieldLabel(field)}" ist erforderlich.`); + } + }); + + // Email validation + if (data.email && !isValidEmail(data.email)) { + errors.push('Bitte geben Sie eine gültige E-Mail-Adresse ein.'); + } + + // Privacy checkbox + if (!data.privacy) { + errors.push('Sie müssen der Datenschutzerklärung zustimmen.'); + } + + if (errors.length > 0) { + showNotification(errors.join('\n'), 'error'); + return false; + } + + return true; + } + + // Helper function to get field labels + function getFieldLabel(fieldName) { + const labels = { + firstName: 'Vorname', + lastName: 'Nachname', + email: 'E-Mail-Adresse', + subject: 'Betreff', + message: 'Nachricht' + }; + return labels[fieldName] || fieldName; + } + + // Email validation + function isValidEmail(email) { + const re = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; + return re.test(email); + } + + // Notification system (using the global one from main.js) + function showNotification(message, type = 'info') { + if (window.HexaHost && window.HexaHost.showNotification) { + window.HexaHost.showNotification(message, type); + } else { + // Fallback + alert(message); + } + } + + // Live chat placeholder function + window.openLiveChat = function() { + showNotification('Live Chat wird geöffnet... (Demo-Funktion)', 'info'); + // Here you would integrate with your actual live chat service + // For example: Tawk.to, Intercom, Zendesk Chat, etc. + }; + + // Auto-fill form based on URL parameters + function autofillForm() { + const urlParams = new URLSearchParams(window.location.search); + const packageParam = urlParams.get('package'); + const productParam = urlParams.get('product'); + + if (packageParam || productParam) { + const subjectSelect = document.getElementById('subject'); + const messageTextarea = document.getElementById('message'); + + if (packageParam) { + // Set subject based on package + const packageNames = { + 'vpc-starter': 'Virtual Private Container - Starter Paket', + 'vpc-business': 'Virtual Private Container - Business Paket', + 'vpc-professional': 'Virtual Private Container - Professional Paket', + 'vpc-enterprise': 'Virtual Private Container - Enterprise Paket', + 'vps-basic': 'Virtual Private Server - Basic Paket', + 'vps-standard': 'Virtual Private Server - Standard Paket', + 'vps-premium': 'Virtual Private Server - Premium Paket', + 'vps-enterprise': 'Virtual Private Server - Enterprise Paket', + 'mail-starter': 'Mail Gateway - Starter Paket', + 'mail-business': 'Mail Gateway - Business Paket', + 'mail-professional': 'Mail Gateway - Professional Paket', + 'mail-enterprise': 'Mail Gateway - Enterprise Paket', + 'web-starter': 'Webhosting - Starter Paket', + 'web-business': 'Webhosting - Business Paket', + 'web-professional': 'Webhosting - Professional Paket', + 'web-enterprise': 'Webhosting - Enterprise Paket' + }; + + if (packageNames[packageParam]) { + messageTextarea.value = `Hallo,\n\nich interessiere mich für das ${packageNames[packageParam]}.\n\nBitte senden Sie mir weitere Informationen und ein individuelles Angebot.\n\nVielen Dank!`; + + // Set appropriate subject + if (packageParam.startsWith('vpc-')) { + subjectSelect.value = 'vpc-anfrage'; + } else if (packageParam.startsWith('vps-')) { + subjectSelect.value = 'vps-anfrage'; + } else if (packageParam.startsWith('mail-')) { + subjectSelect.value = 'mail-gateway-anfrage'; + } else if (packageParam.startsWith('web-')) { + subjectSelect.value = 'webhosting-anfrage'; + } + } + } else if (productParam) { + // Set subject based on product + const productSubjects = { + 'vpc': 'vpc-anfrage', + 'vps': 'vps-anfrage', + 'mail-gateway': 'mail-gateway-anfrage', + 'webhosting': 'webhosting-anfrage' + }; + + if (productSubjects[productParam]) { + subjectSelect.value = productSubjects[productParam]; + messageTextarea.value = `Hallo,\n\nich interessiere mich für Ihre ${productParam.replace('-', ' ')} Lösungen.\n\nBitte kontaktieren Sie mich für eine persönliche Beratung.\n\nVielen Dank!`; + } + } + } + } + + // Form field enhancements + function enhanceFormFields() { + const inputs = document.querySelectorAll('input, select, textarea'); + + inputs.forEach(input => { + // Add focus/blur effects + input.addEventListener('focus', function() { + this.parentElement.classList.add('focused'); + }); + + input.addEventListener('blur', function() { + if (!this.value) { + this.parentElement.classList.remove('focused'); + } + }); + + // Check if field already has value (for autofilled forms) + if (input.value) { + input.parentElement.classList.add('focused'); + } + }); + + // Phone number formatting + const phoneInput = document.getElementById('phone'); + if (phoneInput) { + phoneInput.addEventListener('input', function() { + // Simple German phone number formatting + let value = this.value.replace(/\D/g, ''); + if (value.startsWith('49')) { + value = '+' + value; + } else if (value.startsWith('0')) { + value = '+49' + value.substring(1); + } + this.value = value; + }); + } + } + + // Accessibility improvements + function improveAccessibility() { + // Add ARIA labels to form elements + const requiredFields = document.querySelectorAll('input[required], select[required], textarea[required]'); + requiredFields.forEach(field => { + field.setAttribute('aria-required', 'true'); + }); + + // Add keyboard navigation for FAQ + const faqQuestions = document.querySelectorAll('.faq-question'); + faqQuestions.forEach(question => { + question.setAttribute('tabindex', '0'); + question.setAttribute('role', 'button'); + question.setAttribute('aria-expanded', 'false'); + + question.addEventListener('keydown', function(e) { + if (e.key === 'Enter' || e.key === ' ') { + e.preventDefault(); + this.click(); + } + }); + }); + } + + // Initialize everything when DOM is loaded + document.addEventListener('DOMContentLoaded', function() { + initFAQ(); + initContactForm(); + autofillForm(); + enhanceFormFields(); + improveAccessibility(); + + // Show a welcome message for contact page + setTimeout(() => { + showNotification('💬 Haben Sie Fragen? Wir helfen gerne!', 'info'); + }, 2000); + }); + +})(); \ No newline at end of file diff --git a/public/assets/js/main.js b/public/assets/js/main.js new file mode 100644 index 0000000..8dacfdd --- /dev/null +++ b/public/assets/js/main.js @@ -0,0 +1,265 @@ +// Main JavaScript for HexaHost.de +(function() { + 'use strict'; + + // DOM Elements + const navToggle = document.querySelector('.nav-toggle'); + const navMenu = document.querySelector('.nav-menu'); + const navLinks = document.querySelectorAll('.nav-link'); + const glassCards = document.querySelectorAll('.glass-card'); + const productCards = document.querySelectorAll('.product-card'); + + // Mobile Navigation Toggle + if (navToggle && navMenu) { + navToggle.addEventListener('click', function() { + navMenu.classList.toggle('active'); + navToggle.classList.toggle('active'); + }); + + // Close mobile menu when clicking on a link + navLinks.forEach(link => { + link.addEventListener('click', function() { + navMenu.classList.remove('active'); + navToggle.classList.remove('active'); + }); + }); + } + + // Smooth scrolling for anchor links + document.querySelectorAll('a[href^="#"]').forEach(anchor => { + anchor.addEventListener('click', function(e) { + e.preventDefault(); + const target = document.querySelector(this.getAttribute('href')); + if (target) { + target.scrollIntoView({ + behavior: 'smooth', + block: 'start' + }); + } + }); + }); + + // Enhanced glass card hover effects + glassCards.forEach(card => { + card.addEventListener('mouseenter', function() { + this.style.transform = 'translateY(-8px) scale(1.02)'; + }); + + card.addEventListener('mouseleave', function() { + this.style.transform = 'translateY(0) scale(1)'; + }); + }); + + // Product card interactive effects + productCards.forEach(card => { + card.addEventListener('mouseenter', function() { + if (!this.classList.contains('featured')) { + this.style.transform = 'translateY(-10px) scale(1.03)'; + } + }); + + card.addEventListener('mouseleave', function() { + if (!this.classList.contains('featured')) { + this.style.transform = 'translateY(0) scale(1)'; + } + }); + }); + + // Intersection Observer for animations + const observerOptions = { + threshold: 0.1, + rootMargin: '0px 0px -50px 0px' + }; + + const observer = new IntersectionObserver(function(entries) { + entries.forEach(entry => { + if (entry.isIntersecting) { + entry.target.classList.add('animate-in'); + } + }); + }, observerOptions); + + // Observe elements for animation + const animateElements = document.querySelectorAll('.glass-card, .feature-item, .product-card'); + animateElements.forEach(el => { + observer.observe(el); + }); + + // Header scroll effect - always visible with transparency change + const header = document.querySelector('.header'); + + window.addEventListener('scroll', function() { + const scrollTop = window.pageYOffset || document.documentElement.scrollTop; + + if (scrollTop > 50) { + // Scrolled down - make header more opaque + header.classList.add('scrolled'); + } else { + // At top - make header more transparent + header.classList.remove('scrolled'); + } + }); + + // Add parallax effect to hero section + const hero = document.querySelector('.hero'); + if (hero) { + window.addEventListener('scroll', function() { + const scrolled = window.pageYOffset; + const rate = scrolled * -0.5; + hero.style.transform = `translateY(${rate}px)`; + }); + } + + // Form validation (for contact forms) + const forms = document.querySelectorAll('form'); + forms.forEach(form => { + form.addEventListener('submit', function(e) { + const requiredFields = form.querySelectorAll('[required]'); + let isValid = true; + + requiredFields.forEach(field => { + if (!field.value.trim()) { + isValid = false; + field.classList.add('error'); + + // Remove error class on focus + field.addEventListener('focus', function() { + this.classList.remove('error'); + }, { once: true }); + } + }); + + if (!isValid) { + e.preventDefault(); + showNotification('Bitte füllen Sie alle Pflichtfelder aus.', 'error'); + } + }); + }); + + // Notification system + function showNotification(message, type = 'info') { + const notification = document.createElement('div'); + notification.className = `notification notification-${type}`; + notification.textContent = message; + + notification.style.position = 'fixed'; + notification.style.top = '20px'; + notification.style.right = '20px'; + notification.style.padding = '15px 20px'; + notification.style.borderRadius = '8px'; + notification.style.color = 'white'; + notification.style.fontWeight = '500'; + notification.style.zIndex = '9999'; + notification.style.transform = 'translateX(400px)'; + notification.style.transition = 'transform 0.3s ease-in-out'; + + if (type === 'error') { + notification.style.background = 'linear-gradient(135deg, #ef4444, #dc2626)'; + } else if (type === 'success') { + notification.style.background = 'linear-gradient(135deg, #10b981, #059669)'; + } else { + notification.style.background = 'linear-gradient(135deg, #3b82f6, #2563eb)'; + } + + document.body.appendChild(notification); + + // Animate in + setTimeout(() => { + notification.style.transform = 'translateX(0)'; + }, 100); + + // Remove after 5 seconds + setTimeout(() => { + notification.style.transform = 'translateX(400px)'; + setTimeout(() => { + if (notification.parentNode) { + notification.parentNode.removeChild(notification); + } + }, 300); + }, 5000); + } + + // Lazy loading for images + const images = document.querySelectorAll('img[data-src]'); + const imageObserver = new IntersectionObserver((entries, observer) => { + entries.forEach(entry => { + if (entry.isIntersecting) { + const img = entry.target; + img.src = img.dataset.src; + img.classList.remove('lazy'); + imageObserver.unobserve(img); + } + }); + }); + + images.forEach(img => imageObserver.observe(img)); + + // Performance optimization: Debounce scroll events + function debounce(func, wait) { + let timeout; + return function executedFunction(...args) { + const later = () => { + clearTimeout(timeout); + func(...args); + }; + clearTimeout(timeout); + timeout = setTimeout(later, wait); + }; + } + + // Apply debounce to scroll events + const debouncedScrollHandler = debounce(function() { + // Any scroll-based animations or calculations + updateScrollProgress(); + }, 16); // ~60fps + + window.addEventListener('scroll', debouncedScrollHandler); + + // Scroll progress indicator + function updateScrollProgress() { + const scrollTop = window.pageYOffset; + const docHeight = document.body.scrollHeight - window.innerHeight; + const scrollPercent = (scrollTop / docHeight) * 100; + + // You can use this to show a progress bar + document.documentElement.style.setProperty('--scroll-progress', scrollPercent + '%'); + } + + // Dark mode toggle (future feature) + function initDarkMode() { + const darkModeToggle = document.querySelector('.dark-mode-toggle'); + if (darkModeToggle) { + darkModeToggle.addEventListener('click', function() { + document.body.classList.toggle('dark-mode'); + localStorage.setItem('darkMode', document.body.classList.contains('dark-mode')); + }); + + // Check for saved dark mode preference + if (localStorage.getItem('darkMode') === 'true') { + document.body.classList.add('dark-mode'); + } + } + } + + // Initialize all features when DOM is loaded + document.addEventListener('DOMContentLoaded', function() { + initDarkMode(); + + // Add loading animation complete class + document.body.classList.add('loaded'); + + // Show welcome message on first visit + if (!localStorage.getItem('hasVisited')) { + setTimeout(() => { + showNotification('Willkommen bei HexaHost.de! 🚀', 'success'); + localStorage.setItem('hasVisited', 'true'); + }, 1000); + } + }); + + // Export functions for global access if needed + window.HexaHost = { + showNotification: showNotification + }; + +})(); \ No newline at end of file diff --git a/public/contact.html b/public/contact.html new file mode 100644 index 0000000..de16c26 --- /dev/null +++ b/public/contact.html @@ -0,0 +1,343 @@ + + + + + + Kontakt - HexaHost.de | Hosting aus Niederbayern + + + + + + + + +
+ +
+ +
+ +
+
+
+
+ Home + / + Kontakt +
+

+ Kontakt zu HexaHost.de +

+

+ Haben Sie Fragen zu unseren Hosting-Lösungen? Benötigen Sie Beratung oder + Support? Unser Team aus Niederbayern steht Ihnen gerne zur Verfügung. +

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

E-Mail

+

Schreiben Sie uns eine E-Mail - wir antworten schnell und kompetent.

+ info@hexahost.de +
+
+
+ + + +
+

Telefon

+

Für dringende Anliegen erreichen Sie uns auch telefonisch.

+ +49 851 1999 9999 +

Mo-Fr: 9:00-18:00 Uhr

+
+
+
+ + + +
+

Live Chat

+

Direkter Support über unseren Live Chat für schnelle Hilfe.

+ +

Mo-Fr: 9:00-18:00 Uhr

+
+
+
+ + + + +
+

Unser Standort

+

HexaHost.de
Niederbayern
Deutschland

+

Regional verwurzelt

+
+
+
+
+ + +
+
+
+
+

Kontaktformular

+

+ Senden Sie uns eine Nachricht - wir melden uns schnellstmöglich bei Ihnen +

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

Häufig gestellte Fragen

+

+ Schnelle Antworten auf die wichtigsten Fragen +

+
+
+
+
+

Wie schnell erhalte ich eine Antwort?

+ + +
+
+

Wir antworten in der Regel innerhalb von 2-4 Stunden auf E-Mail-Anfragen. Bei dringenden Anliegen nutzen Sie bitte unseren Live Chat oder rufen Sie uns an.

+
+
+
+
+

Bieten Sie kostenlose Beratung an?

+ + +
+
+

Ja, unsere Beratung ist völlig kostenfrei und unverbindlich. Wir helfen Ihnen gerne bei der Auswahl der richtigen Hosting-Lösung für Ihre Bedürfnisse.

+
+
+
+
+

Können Sie bei der Migration helfen?

+ + +
+
+

Selbstverständlich! Wir unterstützen Sie beim Umzug von Ihrem bisherigen Hosting-Anbieter zu uns. Unser Migrations-Service ist in vielen Fällen kostenlos.

+
+
+
+
+

Gibt es eine Geld-zurück-Garantie?

+ + +
+
+

Ja, wir bieten eine 30-Tage Geld-zurück-Garantie. Wenn Sie nicht zufrieden sind, erhalten Sie Ihr Geld ohne Wenn und Aber zurück.

+
+
+
+
+

Wo stehen Ihre Server?

+ + +
+
+

Alle unsere Server stehen in deutschen Rechenzentren. Das gewährleistet DSGVO-Konformität und niedrige Latenzzeiten für deutsche Nutzer.

+
+
+
+
+

Bieten Sie 24/7 Support?

+ + +
+
+

Unser direkter Support ist Mo-Fr von 9:00-18:00 Uhr verfügbar. Außerhalb dieser Zeiten überwachen automatische Systeme die Infrastruktur und bei kritischen Problemen sind wir auch außerhalb der Geschäftszeiten erreichbar.

+
+
+
+
+
+ + +
+
+
+
+
+ < 2h + Durchschnittliche Antwortzeit +
+
+ 98% + Kundenzufriedenheit +
+
+ 24/7 + Monitoring +
+
+
+

Schnelle Hilfe garantiert

+

Unser Support-Team ist darauf spezialisiert, Ihnen schnell und effektiv zu helfen. Die meisten Anfragen werden innerhalb von 2 Stunden beantwortet.

+
+
+
+
+
+ + + + + + + \ No newline at end of file diff --git a/public/favicon.svg b/public/favicon.svg new file mode 100644 index 0000000..cadaa6a --- /dev/null +++ b/public/favicon.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + H + \ No newline at end of file diff --git a/public/index.html b/public/index.html new file mode 100644 index 0000000..8f15546 --- /dev/null +++ b/public/index.html @@ -0,0 +1,311 @@ + + + + + + HexaHost.de - Zuverlässiges Hosting aus Niederbayern + + + + + + + + +
+ +
+ +
+ +
+
+
+

+ Zuverlässiges Hosting aus Niederbayern +

+

+ Entdecken Sie unsere preiswerten und zuverlässigen Hosting-Lösungen. + Von Virtual Private Servern bis hin zu Webhosting - wir haben die + perfekte Lösung für Ihre Bedürfnisse. +

+
+ Produkte entdecken + Kontakt aufnehmen +
+
+
+
+
+ + + + + +
+

99.9% Uptime

+

Zuverlässige Infrastruktur

+
+
+
+
+ + +
+
+
+

Unsere Hosting-Lösungen

+

+ Modernste Technologie auf Proxmox-Basis für maximale Performance und Zuverlässigkeit +

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

Virtual Private Container

+

+ Effiziente LXC-Container auf Proxmox-Basis für optimale Ressourcennutzung +

+
+ • Proxmox LXC + • Hohe Performance + • Skalierbar +
+
+ ab 4,99€ /Monat +
+ Mehr erfahren +
+ +
+
Beliebt
+
+ + + + + +
+

Virtual Private Server

+

+ Vollwertige KVM-Virtualisierung mit maximaler Flexibilität und Kontrolle +

+
+ • Proxmox KVM + • Vollzugriff + • Alle OS +
+
+ ab 9,99€ /Monat +
+ Mehr erfahren +
+ +
+
+ + + + +
+

Mail Gateway

+

+ Professioneller E-Mail-Schutz mit Spam- und Virenfilterung +

+
+ • Spam-Schutz + • Viren-Filter + • Einfache Verwaltung +
+
+ ab 2,99€ /Monat +
+ Mehr erfahren +
+ +
+
+ + + + + +
+

Webhosting

+

+ Klassisches Webhosting mit allem was Sie für Ihre Website benötigen +

+
+ • PHP & MySQL + • SSL-Zertifikate + • E-Mail inklusive +
+
+ ab 1,99€ /Monat +
+ Mehr erfahren +
+
+
+
+ + +
+
+
+

Warum HexaHost?

+

+ Überzeugen Sie sich von unseren Vorteilen +

+
+
+
+
+ + + +
+

Zuverlässigkeit

+

99.9% Uptime-Garantie und redundante Infrastruktur für maximale Verfügbarkeit

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

Performance

+

Modernste Hardware und optimierte Konfigurationen für beste Leistung

+
+
+
+ + + +
+

Faire Preise

+

Transparent kalkulierte Preise ohne versteckte Kosten

+
+
+
+ + + +
+

Support aus Bayern

+

Persönlicher Support direkt aus Niederbayern in deutscher Sprache

+
+
+
+
+ + +
+
+
+

Bereit für zuverlässiges Hosting?

+

Starten Sie noch heute mit HexaHost und erleben Sie den Unterschied

+
+ Jetzt starten + Mehr über uns +
+
+
+
+
+ + + + + + \ No newline at end of file diff --git a/public/mail-gateway.html b/public/mail-gateway.html new file mode 100644 index 0000000..c08e881 --- /dev/null +++ b/public/mail-gateway.html @@ -0,0 +1,517 @@ + + + + + + Mail Gateway - Professioneller E-Mail-Schutz | HexaHost.de + + + + + + + + +
+ +
+ +
+ +
+
+
+
+ Home + / + Mail Gateway +
+

+ Mail Gateway + Professioneller E-Mail-Schutz +

+

+ Schützen Sie Ihr Unternehmen vor Spam, Viren und Phishing-Attacken. + Unser Mail Gateway filtert unerwünschte E-Mails heraus, bevor sie + Ihren Server erreichen. +

+
+
+ + + + 99,9% Spam-Schutz +
+
+ + + + + + Viren-Filter +
+
+ + + + + E-Mail-Archivierung +
+
+
+
+
+ + +
+
+
+

Mail Gateway Pakete

+

+ Professioneller E-Mail-Schutz für jede Unternehmensgröße +

+
+
+ +
+
+

Mail Gateway Starter

+
+ 2,99€ + /Monat +
+
+
+
+ E-Mail-Adressen: + bis 10 +
+
+ Domains: + 1 +
+
+ Speicher/Archiv: + 5 GB +
+
+ E-Mails/Tag: + 1.000 +
+
+ Quarantäne: + 7 Tage +
+
+
+
✓ Spam-Filter
+
✓ Viren-Schutz
+
✓ Quarantäne-Management
+
✓ Web-Interface
+
✓ E-Mail-Support
+
+ Jetzt bestellen +
+ + +
+
Beliebt
+
+

Mail Gateway Business

+
+ 9,99€ + /Monat +
+
+
+
+ E-Mail-Adressen: + bis 50 +
+
+ Domains: + 3 +
+
+ Speicher/Archiv: + 25 GB +
+
+ E-Mails/Tag: + 5.000 +
+
+ Quarantäne: + 14 Tage +
+
+
+
✓ Spam-Filter
+
✓ Viren-Schutz
+
✓ Phishing-Schutz
+
✓ Quarantäne-Management
+
✓ Web-Interface
+
✓ E-Mail-Archivierung
+
✓ Reporting
+
+ Jetzt bestellen +
+ + +
+
+

Mail Gateway Professional

+
+ 19,99€ + /Monat +
+
+
+
+ E-Mail-Adressen: + bis 150 +
+
+ Domains: + 10 +
+
+ Speicher/Archiv: + 100 GB +
+
+ E-Mails/Tag: + 15.000 +
+
+ Quarantäne: + 30 Tage +
+
+
+
✓ Spam-Filter
+
✓ Viren-Schutz
+
✓ Phishing-Schutz
+
✓ Advanced Threat Protection
+
✓ Quarantäne-Management
+
✓ Web-Interface
+
✓ E-Mail-Archivierung
+
✓ Erweiterte Reports
+
✓ API-Zugang
+
+ Jetzt bestellen +
+ + +
+
+

Mail Gateway Enterprise

+
+ 49,99€ + /Monat +
+
+
+
+ E-Mail-Adressen: + unbegrenzt +
+
+ Domains: + unbegrenzt +
+
+ Speicher/Archiv: + 500 GB +
+
+ E-Mails/Tag: + unbegrenzt +
+
+ Quarantäne: + 90 Tage +
+
+
+
✓ Spam-Filter
+
✓ Viren-Schutz
+
✓ Phishing-Schutz
+
✓ Advanced Threat Protection
+
✓ Quarantäne-Management
+
✓ Web-Interface
+
✓ E-Mail-Archivierung
+
✓ Custom Reports
+
✓ API-Zugang
+
✓ Priority Support
+
✓ Dedizierte Instanz
+
+ Jetzt bestellen +
+
+
+
+ + +
+
+
+

Mail Gateway Features

+

+ Umfassender Schutz für Ihre E-Mail-Kommunikation +

+
+
+
+
+ + + +
+

Spam-Filter

+

Intelligente Spam-Erkennung mit Machine Learning blockiert 99,9% aller unerwünschten E-Mails.

+
+
+
+ + + + + +
+

Viren-Schutz

+

Mehrschichtiger Virenschutz mit aktuellsten Signaturen und Heuristik-Analyse.

+
+
+
+ + + + + +
+

Phishing-Schutz

+

Erkennung und Blockierung von Phishing-Versuchen und betrügerischen E-Mails.

+
+
+
+ + + + + + +
+

Quarantäne

+

Sichere Quarantäne für verdächtige E-Mails mit einfacher Verwaltung über Web-Interface.

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

E-Mail-Archivierung

+

Automatische Archivierung aller E-Mails für Compliance und rechtliche Anforderungen.

+
+
+
+ + + + + +
+

Reporting

+

Detaillierte Berichte über E-Mail-Traffic, blockierte Bedrohungen und System-Performance.

+
+
+
+
+ + +
+
+
+

So funktioniert's

+

+ Einfache Integration in Ihre bestehende E-Mail-Infrastruktur +

+
+
+
+
1
+

MX-Record anpassen

+

Ändern Sie den MX-Record Ihrer Domain, um E-Mails über unser Gateway zu leiten.

+
+
+
2
+

Filterung

+

Eingehende E-Mails werden automatisch auf Spam, Viren und Phishing geprüft.

+
+
+
3
+

Weiterleitung

+

Saubere E-Mails werden an Ihren Mail-Server weitergeleitet, schädliche blockiert.

+
+
+
4
+

Verwaltung

+

Überwachen und verwalten Sie alles über unser benutzerfreundliches Web-Interface.

+
+
+
+
+ + +
+
+
+

Vorteile für Ihr Unternehmen

+

+ Warum ein Mail Gateway unverzichtbar ist +

+
+
+
+
+ + + + +
+

Produktivität steigern

+

Mitarbeiter verbringen weniger Zeit mit dem Löschen von Spam-E-Mails.

+
+
+
+ + + + + +
+

Server entlasten

+

Weniger Last auf Ihrem E-Mail-Server durch Vorfilterung schädlicher E-Mails.

+
+
+
+ + + +
+

Sicherheit erhöhen

+

Schutz vor Ransomware, Trojanern und anderen E-Mail-basierten Bedrohungen.

+
+
+
+ + + + +
+

Compliance erfüllen

+

E-Mail-Archivierung für gesetzliche Aufbewahrungspflichten und Compliance.

+
+
+
+
+ + +
+
+
+

Schützen Sie Ihre E-Mails jetzt!

+

Starten Sie noch heute mit professionellem E-Mail-Schutz

+
+ Jetzt bestellen + Kostenlose Beratung +
+
+
+
+
+ + + + + + \ No newline at end of file diff --git a/public/robots.txt b/public/robots.txt new file mode 100644 index 0000000..ea70ee9 --- /dev/null +++ b/public/robots.txt @@ -0,0 +1,17 @@ +User-agent: * +Allow: / + +# Block access to private files +Disallow: /assets/js/ +Disallow: /assets/css/ + +# Allow CSS and JS files for better SEO +Allow: /assets/css/style.css +Allow: /assets/js/main.js +Allow: /assets/js/contact.js + +# Sitemap location +Sitemap: https://hexahost.de/sitemap.xml + +# Crawl delay (optional, adjust as needed) +Crawl-delay: 1 \ No newline at end of file diff --git a/public/sitemap.xml b/public/sitemap.xml new file mode 100644 index 0000000..0db9a95 --- /dev/null +++ b/public/sitemap.xml @@ -0,0 +1,45 @@ + + + + https://hexahost.de/ + 2024-01-01 + weekly + 1.0 + + + https://hexahost.de/vpc.html + 2024-01-01 + monthly + 0.9 + + + https://hexahost.de/vps.html + 2024-01-01 + monthly + 0.9 + + + https://hexahost.de/mail-gateway.html + 2024-01-01 + monthly + 0.9 + + + https://hexahost.de/webhosting.html + 2024-01-01 + monthly + 0.9 + + + https://hexahost.de/about.html + 2024-01-01 + monthly + 0.7 + + + https://hexahost.de/contact.html + 2024-01-01 + monthly + 0.8 + + \ No newline at end of file diff --git a/public/vpc.html b/public/vpc.html new file mode 100644 index 0000000..ac3d420 --- /dev/null +++ b/public/vpc.html @@ -0,0 +1,426 @@ + + + + + + Virtual Private Container - Effiziente LXC Container | HexaHost.de + + + + + + + + +
+ +
+ +
+ +
+
+
+
+ Home + / + Virtual Private Container +
+

+ Virtual Private Container + auf Proxmox LXC +

+

+ Erleben Sie die Effizienz von Linux-Containern mit der Zuverlässigkeit + von Proxmox. Unsere VPC-Lösungen bieten optimale Performance bei + minimalem Ressourcenverbrauch. +

+
+
+ + + + + Sofortige Bereitstellung +
+
+ + + + 99.9% Uptime +
+
+ + + + Maximale Performance +
+
+
+
+
+ + +
+
+
+

VPC Pakete

+

+ Wählen Sie das perfekte Container-Paket für Ihre Anforderungen +

+
+
+ +
+
+

VPC Starter

+
+ 4,99€ + /Monat +
+
+
+
+ CPU Kerne: + 1 vCore +
+
+ RAM: + 1 GB +
+
+ SSD Speicher: + 20 GB +
+
+ Traffic: + 1 TB +
+
+ IPv4 Adressen: + 1 +
+
+
+
✓ Proxmox LXC Container
+
✓ Root-Zugriff
+
✓ SSH-Zugang
+
✓ Backup inklusive
+
✓ 24/7 Monitoring
+
+ Jetzt bestellen +
+ + +
+
Beliebt
+
+

VPC Business

+
+ 9,99€ + /Monat +
+
+
+
+ CPU Kerne: + 2 vCores +
+
+ RAM: + 4 GB +
+
+ SSD Speicher: + 80 GB +
+
+ Traffic: + 3 TB +
+
+ IPv4 Adressen: + 1 +
+
+
+
✓ Proxmox LXC Container
+
✓ Root-Zugriff
+
✓ SSH-Zugang
+
✓ Tägliches Backup
+
✓ 24/7 Monitoring
+
✓ Snapshot-Funktion
+
+ Jetzt bestellen +
+ + +
+
+

VPC Professional

+
+ 19,99€ + /Monat +
+
+
+
+ CPU Kerne: + 4 vCores +
+
+ RAM: + 8 GB +
+
+ SSD Speicher: + 160 GB +
+
+ Traffic: + 5 TB +
+
+ IPv4 Adressen: + 2 +
+
+
+
✓ Proxmox LXC Container
+
✓ Root-Zugriff
+
✓ SSH-Zugang
+
✓ Stündliches Backup
+
✓ 24/7 Monitoring
+
✓ Snapshot-Funktion
+
✓ Priority Support
+
+ Jetzt bestellen +
+ + +
+
+

VPC Enterprise

+
+ 39,99€ + /Monat +
+
+
+
+ CPU Kerne: + 8 vCores +
+
+ RAM: + 16 GB +
+
+ SSD Speicher: + 320 GB +
+
+ Traffic: + 10 TB +
+
+ IPv4 Adressen: + 3 +
+
+
+
✓ Proxmox LXC Container
+
✓ Root-Zugriff
+
✓ SSH-Zugang
+
✓ Stündliches Backup
+
✓ 24/7 Monitoring
+
✓ Snapshot-Funktion
+
✓ Priority Support
+
✓ Individuelle Konfiguration
+
+ Jetzt bestellen +
+
+
+
+ + +
+
+
+

Technische Details

+

+ Erfahren Sie mehr über unsere Container-Technologie +

+
+
+
+
+ + + + + +
+

Proxmox LXC

+

Modernste Container-Virtualisierung auf Basis von Linux Containers (LXC) mit Proxmox-Management für maximale Effizienz.

+
+
+
+ + + + +
+

High Performance

+

Enterprise-Hardware mit NVMe SSD-Speicher und modernen Intel/AMD Prozessoren für beste Performance.

+
+
+
+ + + + + + +
+

Skalierbarkeit

+

Einfache Anpassung der Ressourcen je nach Bedarf - CPU, RAM und Speicher können flexibel skaliert werden.

+
+
+
+ + + +
+

Sicherheit

+

Isolierte Container-Umgebung mit automatischen Sicherheitsupdates und regelmäßigen Backups.

+
+
+
+
+ + +
+
+
+

Anwendungsbereiche

+

+ Perfekt geeignet für verschiedene Szenarien +

+
+
+
+

Web-Entwicklung

+

Ideale Testumgebung für Entwickler mit schneller Bereitstellung und flexibler Konfiguration.

+
+
+

Microservices

+

Effiziente Containerisierung von Microservices mit optimaler Ressourcennutzung.

+
+
+

CI/CD Pipelines

+

Automatisierte Build- und Deployment-Prozesse in isolierten Container-Umgebungen.

+
+
+

Backup-Server

+

Zuverlässige Backup-Lösungen mit redundanter Speicherung und automatischer Überwachung.

+
+
+
+
+ + +
+
+
+

Bereit für Ihren VPC?

+

Starten Sie noch heute mit einem Virtual Private Container

+
+ Jetzt bestellen + Beratung anfordern +
+
+
+
+
+ + + + + + \ No newline at end of file diff --git a/public/vps.html b/public/vps.html new file mode 100644 index 0000000..28290f4 --- /dev/null +++ b/public/vps.html @@ -0,0 +1,530 @@ + + + + + + Virtual Private Server - KVM Virtualisierung | HexaHost.de + + + + + + + + +
+ +
+ +
+ +
+
+
+
+ Home + / + Virtual Private Server +
+

+ Virtual Private Server + auf Proxmox KVM +

+

+ Maximale Flexibilität und Kontrolle mit vollwertiger KVM-Virtualisierung. + Installieren Sie jedes Betriebssystem und genießen Sie vollständigen Root-Zugriff. +

+
+
+ + + + + + Vollwertiger Server +
+
+ + + + + + Alle Betriebssysteme +
+
+ + + + + + Root-Zugriff +
+
+
+
+
+ + +
+
+
+

VPS Pakete

+

+ Leistungsstarke Virtual Private Server für jeden Bedarf +

+
+
+ +
+
+

VPS Basic

+
+ 9,99€ + /Monat +
+
+
+
+ CPU Kerne: + 2 vCores +
+
+ RAM: + 4 GB +
+
+ SSD Speicher: + 50 GB +
+
+ Traffic: + 2 TB +
+
+ IPv4 Adressen: + 1 +
+
+
+
✓ KVM Virtualisierung
+
✓ Vollzugriff (Root)
+
✓ Alle Betriebssysteme
+
✓ Backup inklusive
+
✓ 24/7 Monitoring
+
✓ Rescue-System
+
+ Jetzt bestellen +
+ + +
+
Beliebt
+
+

VPS Standard

+
+ 19,99€ + /Monat +
+
+
+
+ CPU Kerne: + 4 vCores +
+
+ RAM: + 8 GB +
+
+ SSD Speicher: + 100 GB +
+
+ Traffic: + 4 TB +
+
+ IPv4 Adressen: + 1 +
+
+
+
✓ KVM Virtualisierung
+
✓ Vollzugriff (Root)
+
✓ Alle Betriebssysteme
+
✓ Tägliches Backup
+
✓ 24/7 Monitoring
+
✓ Rescue-System
+
✓ Snapshot-Funktion
+
+ Jetzt bestellen +
+ + +
+
+

VPS Premium

+
+ 39,99€ + /Monat +
+
+
+
+ CPU Kerne: + 6 vCores +
+
+ RAM: + 16 GB +
+
+ SSD Speicher: + 200 GB +
+
+ Traffic: + 8 TB +
+
+ IPv4 Adressen: + 2 +
+
+
+
✓ KVM Virtualisierung
+
✓ Vollzugriff (Root)
+
✓ Alle Betriebssysteme
+
✓ Stündliches Backup
+
✓ 24/7 Monitoring
+
✓ Rescue-System
+
✓ Snapshot-Funktion
+
✓ Priority Support
+
+ Jetzt bestellen +
+ + +
+
+

VPS Enterprise

+
+ 79,99€ + /Monat +
+
+
+
+ CPU Kerne: + 12 vCores +
+
+ RAM: + 32 GB +
+
+ SSD Speicher: + 500 GB +
+
+ Traffic: + 15 TB +
+
+ IPv4 Adressen: + 4 +
+
+
+
✓ KVM Virtualisierung
+
✓ Vollzugriff (Root)
+
✓ Alle Betriebssysteme
+
✓ Stündliches Backup
+
✓ 24/7 Monitoring
+
✓ Rescue-System
+
✓ Snapshot-Funktion
+
✓ Priority Support
+
✓ Dedizierte CPU
+
+ Jetzt bestellen +
+
+
+
+ + +
+
+
+

Betriebssysteme

+

+ Wählen Sie aus einer Vielzahl von Betriebssystemen +

+
+
+
+
+ + + +
+

Ubuntu

+

20.04 LTS, 22.04 LTS, 24.04 LTS

+
+
+
+ + + +
+

Debian

+

11 (Bullseye), 12 (Bookworm)

+
+
+
+ + + +
+

CentOS

+

Stream 8, Stream 9

+
+
+
+ + + +
+

Rocky Linux

+

8.x, 9.x

+
+
+
+ + + +
+

Windows Server

+

2019, 2022 (auf Anfrage)

+
+
+
+ + + +
+

Weitere

+

Fedora, openSUSE, FreeBSD

+
+
+
+
+ + +
+
+
+

VPS Vorteile

+

+ Warum unsere Virtual Private Server die beste Wahl sind +

+
+
+
+
+ + + + + +
+

KVM Virtualisierung

+

Vollwertige Hardware-Virtualisierung mit garantierten Ressourcen und maximaler Isolation.

+
+
+
+ + + + + +
+

Flexible Betriebssysteme

+

Installieren Sie jedes Betriebssystem Ihrer Wahl - von Linux bis Windows Server.

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

Vollzugriff

+

Root-Zugriff und administrative Rechte für maximale Konfigurationsfreiheit.

+
+
+
+ + + +
+

Skalierbarkeit

+

Erweitern Sie CPU, RAM und Speicher jederzeit nach Ihren Anforderungen.

+
+
+
+ + + +
+

Sicherheit

+

Isolierte Umgebung mit DDoS-Schutz und regelmäßigen Sicherheitsupdates.

+
+
+
+ + + +
+

Management-Tools

+

Intuitive Verwaltung über Proxmox-Interface mit Konsolen-Zugriff und Monitoring.

+
+
+
+
+ + +
+
+
+

Anwendungsbereiche

+

+ Ideal für professionelle Anwendungen +

+
+
+
+

Web-Server

+

Hosting von Websites und Web-Anwendungen mit vollständiger Kontrolle über die Server-Konfiguration.

+
+
+

Datenbank-Server

+

MySQL, PostgreSQL, MongoDB und andere Datenbanken mit optimierter Performance.

+
+
+

Entwicklungsumgebung

+

Isolierte Entwicklungs- und Testumgebungen für komplexe Projekte.

+
+
+

Game-Server

+

Hosting von Minecraft, CS:GO und anderen Game-Servern mit garantierter Performance.

+
+
+

VPN-Server

+

Private VPN-Lösungen für sichere Verbindungen und anonymes Surfen.

+
+
+

Cloud-Storage

+

Private Cloud-Lösungen mit Nextcloud, ownCloud oder anderen Plattformen.

+
+
+
+
+ + +
+
+
+

Bereit für maximale Kontrolle?

+

Starten Sie noch heute mit einem leistungsstarken VPS

+
+ Jetzt bestellen + Beratung anfordern +
+
+
+
+
+ + + + + + \ No newline at end of file diff --git a/public/webhosting.html b/public/webhosting.html new file mode 100644 index 0000000..fbd53c1 --- /dev/null +++ b/public/webhosting.html @@ -0,0 +1,589 @@ + + + + + + Webhosting - Klassisches Hosting für Websites | HexaHost.de + + + + + + + + +
+ +
+ +
+ +
+
+
+
+ Home + / + Webhosting +
+

+ Webhosting + Alles für Ihre Website +

+

+ Klassisches Webhosting mit allem, was Sie für eine erfolgreiche Website benötigen. + PHP, MySQL, SSL-Zertifikate und E-Mail-Postfächer - alles inklusive. +

+
+
+ + + + + + Domain inklusive +
+
+ + + + SSL-Zertifikate +
+
+ + + + + E-Mail inklusive +
+
+
+
+
+ + +
+
+
+

Webhosting Pakete

+

+ Von der ersten Website bis zum professionellen Online-Shop +

+
+
+ +
+
+

Web Starter

+
+ 1,99€ + /Monat +
+
+
+
+ Webspace: + 5 GB SSD +
+
+ Domains: + 1 inklusive +
+
+ E-Mail-Postfächer: + 5 +
+
+ MySQL Datenbanken: + 2 +
+
+ Traffic: + 100 GB +
+
+
+
✓ PHP 8.2 Support
+
✓ MySQL 8.0
+
✓ SSL-Zertifikat
+
✓ WordPress Ready
+
✓ cPanel
+
✓ Tägliches Backup
+
+ Jetzt bestellen +
+ + +
+
Beliebt
+
+

Web Business

+
+ 4,99€ + /Monat +
+
+
+
+ Webspace: + 25 GB SSD +
+
+ Domains: + 3 inklusive +
+
+ E-Mail-Postfächer: + 25 +
+
+ MySQL Datenbanken: + 10 +
+
+ Traffic: + 500 GB +
+
+
+
✓ PHP 8.2 Support
+
✓ MySQL 8.0
+
✓ SSL-Zertifikat
+
✓ WordPress Ready
+
✓ cPanel
+
✓ Tägliches Backup
+
✓ Subdomain Support
+
✓ FTP-Zugänge
+
+ Jetzt bestellen +
+ + +
+
+

Web Professional

+
+ 9,99€ + /Monat +
+
+
+
+ Webspace: + 100 GB SSD +
+
+ Domains: + 10 inklusive +
+
+ E-Mail-Postfächer: + 100 +
+
+ MySQL Datenbanken: + 25 +
+
+ Traffic: + 2 TB +
+
+
+
✓ PHP 8.2 Support
+
✓ MySQL 8.0
+
✓ SSL-Zertifikat
+
✓ WordPress Ready
+
✓ cPanel
+
✓ Stündliches Backup
+
✓ Subdomain Support
+
✓ FTP-Zugänge
+
✓ Cron Jobs
+
✓ Shell-Zugang
+
+ Jetzt bestellen +
+ + +
+
+

Web Enterprise

+
+ 19,99€ + /Monat +
+
+
+
+ Webspace: + 500 GB SSD +
+
+ Domains: + unbegrenzt +
+
+ E-Mail-Postfächer: + unbegrenzt +
+
+ MySQL Datenbanken: + unbegrenzt +
+
+ Traffic: + 10 TB +
+
+
+
✓ PHP 8.2 Support
+
✓ MySQL 8.0
+
✓ SSL-Zertifikat
+
✓ WordPress Ready
+
✓ cPanel
+
✓ Stündliches Backup
+
✓ Subdomain Support
+
✓ FTP-Zugänge
+
✓ Cron Jobs
+
✓ Shell-Zugang
+
✓ Priority Support
+
✓ Staging-Umgebung
+
+ Jetzt bestellen +
+
+
+
+ + +
+
+
+

Unterstützte Technologien

+

+ Moderne Web-Technologien für Ihre Projekte +

+
+
+
+
+ + + +
+

PHP

+

Version 7.4, 8.0, 8.1, 8.2

+
+
+
+ + + +
+

MySQL

+

Version 8.0 mit InnoDB

+
+
+
+ + + +
+

WordPress

+

One-Click Installation

+
+
+
+ + + +
+

Node.js

+

Moderne JavaScript-Runtime

+
+
+
+ + + +
+

Python

+

Version 3.9, 3.10, 3.11

+
+
+
+ + + +
+

SSL/TLS

+

Let's Encrypt & Premium

+
+
+
+
+ + +
+
+
+

Webhosting Features

+

+ Alles was Sie für eine erfolgreiche Website benötigen +

+
+
+
+
+ + + + + +
+

Domain inklusive

+

Eine .de Domain ist in jedem Paket kostenfrei enthalten. Weitere Domains zu günstigen Preisen.

+
+
+
+ + + +
+

SSL-Zertifikate

+

Kostenlose Let's Encrypt SSL-Zertifikate für sichere HTTPS-Verbindungen.

+
+
+
+ + + + +
+

E-Mail-Postfächer

+

Professionelle E-Mail-Adressen mit Ihrer Domain inklusive Webmail-Interface.

+
+
+
+ + + + + + +
+

Automatische Backups

+

Tägliche Sicherungen Ihrer Website und Datenbanken für maximale Sicherheit.

+
+
+
+ + + +
+

cPanel

+

Benutzerfreundliches Control Panel für einfache Verwaltung Ihres Hostings.

+
+
+
+ + + +
+

SSD-Speicher

+

Schnelle SSD-Festplatten für optimale Performance und kurze Ladezeiten.

+
+
+
+
+ + +
+
+
+

Content Management Systeme

+

+ One-Click Installation der beliebtesten CMS +

+
+
+
+ +

WordPress

+

Das beliebteste CMS der Welt mit tausenden Themes und Plugins.

+
+
+ +

Joomla!

+

Flexibles CMS für komplexe Websites und Web-Anwendungen.

+
+
+ +

Drupal

+

Mächtiges CMS für anspruchsvolle und skalierbare Projekte.

+
+
+ +

Magento

+

Professionelle E-Commerce-Lösung für Online-Shops.

+
+
+ +

PrestaShop

+

Benutzerfreundliche Shop-Software für den Einstieg.

+
+
+ +

MediaWiki

+

Wiki-Software für Dokumentation und Wissensmanagement.

+
+
+
+
+ + +
+
+
+

Performance & Sicherheit

+

+ Optimiert für Geschwindigkeit und Sicherheit +

+
+
+
+
+ + + +
+

CDN Integration

+

Globales Content Delivery Network für schnelle Ladezeiten weltweit.

+
+
+
+ + + +
+

DDoS-Schutz

+

Automatischer Schutz vor DDoS-Attacken und anderen Bedrohungen.

+
+
+
+ + + + +
+

Caching

+

Intelligentes Caching für optimale Performance Ihrer Website.

+
+
+
+ + + + +
+

Monitoring

+

24/7 Überwachung Ihrer Website mit sofortiger Benachrichtigung bei Problemen.

+
+
+
+
+ + +
+
+
+

Starten Sie Ihre Website heute!

+

Alles was Sie brauchen für eine erfolgreiche Online-Präsenz

+
+ Jetzt bestellen + Kostenlose Beratung +
+
+
+
+
+ + + + + + \ No newline at end of file