Spaces:
Running
Running
File size: 12,339 Bytes
23c9760 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 |
<!DOCTYPE html>
<html lang="de" class="scroll-smooth">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Features - SecureDataroom Pro</title>
<meta name="description" content="Entdecken Sie alle Enterprise-Features von SecureDataroom Pro für sichere Transaktionen.">
<link rel="icon" type="image/x-icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%236366f1'%3E%3Cpath d='M12 1L3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4z'/%3E%3C/svg%3E">
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
<script src="https://unpkg.com/feather-icons"></script>
<link rel="stylesheet" href="style.css">
<script>
tailwind.config = {
theme: {
extend: {
colors: {
primary: {
50: '#f8fafc',
100: '#f1f5f9',
200: '#e2e8f0',
300: '#cbd5e1',
400: '#94a3b8',
500: '#64748b',
600: '#475569',
700: '#334155',
800: '#1e293b',
900: '#0f172a',
},
secondary: {
50: '#f5f3ff',
100: '#ede9fe',
200: '#ddd6fe',
300: '#c4b5fd',
400: '#a78bfa',
500: '#8b5cf6',
600: '#7c3aed',
700: '#6d28d9',
800: '#5b21b6',
900: '#4c1d95',
}
}
}
}
}
</script>
</head>
<body class="bg-white text-primary-900 antialiased">
<dataroom-navbar></dataroom-navbar>
<!-- Hero Section -->
<section class="relative overflow-hidden bg-gradient-to-br from-primary-50 to-secondary-50 py-20 lg:py-32">
<div class="absolute inset-0 bg-grid-primary-100/50" aria-hidden="true"></div>
<div class="relative mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
<div class="text-center">
<h1 class="text-4xl md:text-5xl lg:text-6xl font-bold tracking-tight text-primary-900 mb-6">
Alle <span class="bg-gradient-to-r from-secondary-500 to-secondary-700 bg-clip-text text-transparent">Features</span> im Überblick
</h1>
<p class="text-lg md:text-xl text-primary-600 mb-8 max-w-3xl mx-auto">
Entdecken Sie die umfassenden Möglichkeiten von SecureDataroom Pro für Ihre Transaktionen.
</p>
</div>
</div>
</section>
<!-- Feature Categories -->
<section class="py-20 bg-white">
<div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
<dataroom-feature-card
icon="shield"
title="Sicherheit & Compliance"
description="ISO 27001, GDPR, 256-Bit AES, 2FA, dynamische Wasserzeichen und umfassende Audit-Trails für maximale Sicherheit."
badge="BANK-LEVEL"
></dataroom-feature-card>
<dataroom-feature-card
icon="folder"
title="Dokumentenmanagement"
description="Intelligente Vorschau, Versionierung, KI-gestützte Suche, Batch-Upload und hierarchische Ordnerstruktur."
badge="ENTERPRISE"
></dataroom-feature-card>
<dataroom-feature-card
icon="users"
title="Kollaboration"
description="Q&A Module, Dokumenten-Kommentare, Task-Management und Multi-Channel Benachrichtigungen."
badge="TEAM"
></dataroom-feature-card>
<dataroom-feature-card
icon="bar-chart-2"
title="Analytics & Reporting"
description="Heatmaps, Zeit-Tracking, Real-Time Monitor, Custom Dashboards und Transaktions-Health Score."
badge="KI-POWERED"
></dataroom-feature-card>
<dataroom-feature-card
icon="settings"
title="Integration & API"
description="REST API, SSO/SAML, LDAP/AD, White-Labeling und Custom Workflows für nahtlose Integration."
badge="FLEXIBLE"
></dataroom-feature-card>
<dataroom-feature-card
icon="smartphone"
title="Mobile Apps"
description="Native Apps für iOS und Android mit vollem Funktionsumfang und Offline-Funktionen."
badge="ON-THE-GO"
></dataroom-feature-card>
</div>
</div>
</section>
<!-- Feature Comparison -->
<section class="py-20 bg-primary-50">
<div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
<div class="text-center mb-16">
<h2 class="text-3xl md:text-4xl font-bold text-primary-900 mb-6">
Feature-Vergleich nach Plan
</h2>
<p class="text-lg text-primary-600">
Finden Sie den perfekten Plan für Ihre Anforderungen.
</p>
</div>
<div class="overflow-x-auto">
<table class="w-full bg-white rounded-2xl shadow-lg ring-1 ring-primary-200">
<thead class="bg-secondary-50">
<tr>
<th class="px-6 py-4 text-left text-sm font-semibold text-primary-900">Feature</th>
<th class="px-6 py-4 text-center text-sm font-semibold text-primary-900">Starter</th>
<th class="px-6 py-4 text-center text-sm font-semibold text-primary-900">Professional</th>
<th class="px-6 py-4 text-center text-sm font-semibold text-primary-900">Enterprise</th>
</tr>
</thead>
<tbody class="divide-y divide-primary-200">
<tr>
<td class="px-6 py-4 text-sm text-primary-700 font-medium">Speicherplatz</td>
<td class="px-6 py-4 text-center text-sm text-primary-600">10 GB</td>
<td class="px-6 py-4 text-center text-sm text-primary-600">100 GB</td>
<td class="px-6 py-4 text-center text-sm text-primary-600">Unlimitiert</td>
</tr>
<tr>
<td class="px-6 py-4 text-sm text-primary-700 font-medium">Benutzer</td>
<td class="px-6 py-4 text-center text-sm text-primary-600">25</td>
<td class="px-6 py-4 text-center text-sm text-primary-600">Unbegrenzt</td>
<td class="px-6 py-4 text-center text-sm text-primary-600">Unbegrenzt</td>
</tr>
<tr>
<td class="px-6 py-4 text-sm text-primary-700 font-medium">2FA</td>
<td class="px-6 py-4 text-center"><i data-feather="check" class="h-5 w-5 text-green-500 mx-auto"></i></td>
<td class="px-6 py-4 text-center"><i data-feather="check" class="h-5 w-5 text-green-500 mx-auto"></i></td>
<td class="px-6 py-4 text-center"><i data-feather="check" class="h-5 w-5 text-green-500 mx-auto"></i></td>
</tr>
<tr>
<td class="px-6 py-4 text-sm text-primary-700 font-medium">Dynamische Wasserzeichen</td>
<td class="px-6 py-4 text-center"><i data-feather="x" class="h-5 w-5 text-red-400 mx-auto"></i></td>
<td class="px-6 py-4 text-center"><i data-feather="check" class="h-5 w-5 text-green-500 mx-auto"></i></td>
<td class="px-6 py-4 text-center"><i data-feather="check" class="h-5 w-5 text-green-500 mx-auto"></i></td>
</tr>
<tr>
<td class="px-6 py-4 text-sm text-primary-700 font-medium">SSO Integration</td>
<td class="px-6 py-4 text-center"><i data-feather="x" class="h-5 w-5 text-red-400 mx-auto"></i></td>
<td class="px-6 py-4 text-center"><i data-feather="check" class="h-5 w-5 text-green-500 mx-auto"></i></td>
<td class="px-6 py-4 text-center"><i data-feather="check" class="h-5 w-5 text-green-500 mx-auto"></i></td>
</tr>
<tr>
<td class="px-6 py-4 text-sm text-primary-700 font-medium">Q&A Module</td>
<td class="px-6 py-4 text-center"><i data-feather="x" class="h-5 w-5 text-red-400 mx-auto"></i></td>
<td class="px-6 py-4 text-center"><i data-feather="check" class="h-5 w-5 text-green-500 mx-auto"></i></td>
<td class="px-6 py-4 text-center"><i data-feather="check" class="h-5 w-5 text-green-500 mx-auto"></i></td>
</tr>
<tr>
<td class="px-6 py-4 text-sm text-primary-700 font-medium">White-Labeling</td>
<td class="px-6 py-4 text-center"><i data-feather="x" class="h-5 w-5 text-red-400 mx-auto"></i></td>
<td class="px-6 py-4 text-center"><i data-feather="x" class="h-5 w-5 text-red-400 mx-auto"></i></td>
<td class="px-6 py-4 text-center"><i data-feather="check" class="h-5 w-5 text-green-500 mx-auto"></i></td>
</tr>
</tbody>
</table>
</div>
</div>
</section>
<!-- CTA Section -->
<section class="py-20 bg-gradient-to-r from-secondary-600 to-secondary-700">
<div class="mx-auto max-w-4xl px-4 sm:px-6 lg:px-8 text-center">
<h2 class="text-3xl md:text-4xl font-bold text-white mb-6">
Alle Features testen?
</h2>
<p class="text-xl text-secondary-100 mb-8">
Starten Sie Ihre kostenlose 30-Tage Testversion und erleben Sie alle Enterprise-Features.
</p>
<div class="flex flex-col sm:flex-row gap-4 justify-center">
<button class="group relative inline-flex items-center justify-center rounded-lg bg-white px-8 py-3 text-secondary-600 font-semibold shadow-lg transition-all duration-300 hover:-translate-y-1 hover:shadow-xl hover:text-secondary-700 focus:outline-none focus:ring-4 focus:ring-white/30">
<span class="relative z-10">Kostenlos testen</span>
<i data-feather="arrow-right" class="relative z-10 ml-2 h-5 w-5 transition-transform duration-300 group-hover:translate-x-1"></i>
</button>
<a href="contact.html" class="inline-flex items-center justify-center rounded-lg bg-secondary-800 px-8 py-3 font-semibold text-white shadow-lg ring-1 ring-white/20 transition-all duration-300 hover:-translate-y-1 hover:shadow-xl hover:bg-secondary-900 focus:outline-none focus:ring-4 focus:ring-white/20">
<i data-feather="calendar" class="mr-2 h-5 w-5"></i>
Demo vereinbaren
</a>
</div>
</div>
</section>
<dataroom-footer></dataroom-footer>
<script src="components/navbar.js"></script>
<script src="components/feature-card.js"></script>
<script src="components/footer.js"></script>
<script src="script.js"></script>
<script>feather.replace();</script>
</body>
</html> |