File size: 9,582 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
<!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>Über uns - SecureDataroom Pro</title>
    <meta name="description" content="Erfahren Sie mehr über SecureDataroom Pro - Ihr deutscher Partner für sichere Virtual Data Rooms.">
    <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">
                    Über <span class="bg-gradient-to-r from-secondary-500 to-secondary-700 bg-clip-text text-transparent">SecureDataroom Pro</span>
                </h1>
                <p class="text-lg md:text-xl text-primary-600 mb-8 max-w-3xl mx-auto">
                    Ihr vertrauenswürdiger Partner für sichere, kompatibilitätsgerechte und effiziente Virtual Data Room Lösungen.
                </p>
            </div>
        </div>
    </section>

    <!-- Content Section -->
    <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 lg:grid-cols-2 gap-16 items-center">
                <div>
                    <h2 class="text-3xl md:text-4xl font-bold text-primary-900 mb-6">
                        Unsere Mission
                    </h2>
                    <p class="text-lg text-primary-600 mb-6">
                        Wir glauben, dass Vertraulichkeit und Sicherheit keine Kompromisse sein dürfen. SecureDataroom Pro wurde von einem Team aus Sicherheitsexperten, Transaktionsberatern und Software-Entwicklern mit jahrzehntelanger Erfahrung in M&A und Due Diligence Prozessen entwickelt.
                    </p>
                    <p class="text-lg text-primary-600 mb-8">
                        Unsere Lösung kombiniert Bank-Level Sicherheit mit intuitiver Bedienbarkeit – Made in Germany und vollständig DSGVO-konform.
                    </p>
                    <div class="grid grid-cols-2 gap-6">
                        <div class="text-center">
                            <div class="text-3xl font-bold text-secondary-600">2018</div>
                            <div class="text-sm text-primary-600">Gegründet</div>
                        </div>
                        <div class="text-center">
                            <div class="text-3xl font-bold text-secondary-600">500+</div>
                            <div class="text-sm text-primary-600">Erfolgreiche Transaktionen</div>
                        </div>
                    </div>
                </div>
                <div class="relative">
                    <div class="absolute -inset-4 bg-gradient-to-r from-secondary-400/20 to-secondary-600/20 rounded-3xl blur-2xl"></div>
                    <div class="relative rounded-2xl bg-white/80 backdrop-blur-sm shadow-2xl ring-1 ring-white/50 p-8">
                        <img src="http://static.photos/office/640x360/42" alt="Team" class="rounded-lg w-full mb-6">
                        <div class="space-y-4">
                            <div class="h-4 rounded bg-primary-200/60"></div>
                            <div class="h-4 w-5/6 rounded bg-primary-200/40"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Team Section -->
    <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">
                    Unser Team
                </h2>
                <p class="text-lg text-primary-600 max-w-3xl mx-auto">
                    Ein engagiertes Team von Experten, die sich für Sicherheit und Transparenz einsetzen.
                </p>
            </div>

            <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
                <div class="rounded-lg bg-white p-6 shadow-lg ring-1 ring-primary-200 text-center">
                    <img src="http://static.photos/people/320x240/1" alt="Team Member" class="w-24 h-24 rounded-full mx-auto mb-4 object-cover">
                    <h3 class="text-xl font-bold text-primary-900 mb-2">Dr. Michael Weber</h3>
                    <p class="text-secondary-600 font-medium mb-2">CEO & Mitgründer</p>
                    <p class="text-primary-600 text-sm">20+ Jahre Erfahrung in Corporate Finance und M&A</p>
                </div>
                <div class="rounded-lg bg-white p-6 shadow-lg ring-1 ring-primary-200 text-center">
                    <img src="http://static.photos/people/320x240/2" alt="Team Member" class="w-24 h-24 rounded-full mx-auto mb-4 object-cover">
                    <h3 class="text-xl font-bold text-primary-900 mb-2">Sarah Chen</h3>
                    <p class="text-secondary-600 font-medium mb-2">CTO</p>
                    <p class="text-primary-600 text-sm">Expertin für Cybersicherheit & verschlüsselte Systeme</p>
                </div>
                <div class="rounded-lg bg-white p-6 shadow-lg ring-1 ring-primary-200 text-center">
                    <img src="http://static.photos/people/320x240/3" alt="Team Member" class="w-24 h-24 rounded-full mx-auto mb-4 object-cover">
                    <h3 class="text-xl font-bold text-primary-900 mb-2">Markus Schmidt</h3>
                    <p class="text-secondary-600 font-medium mb-2">Head of Compliance</p>
                    <p class="text-primary-600 text-sm">Experte für DSGVO und ISO-Zertifizierungen</p>
                </div>
            </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">
                Bereit zu starten?
            </h2>
            <p class="text-xl text-secondary-100 mb-8">
                Vereinbaren Sie ein kostenloses Beratungsgespräch mit unseren Experten.
            </p>
            <div class="flex flex-col sm:flex-row gap-4 justify-center">
                <a href="contact.html" 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">Kontakt aufnehmen</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>
                </a>
                <a href="index.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="home" class="mr-2 h-5 w-5"></i>
                    Zurück zur Startseite
                </a>
            </div>
        </div>
    </section>

    <dataroom-footer></dataroom-footer>

    <script src="components/navbar.js"></script>
    <script src="components/footer.js"></script>
    <script src="script.js"></script>
    <script>feather.replace();</script>
</body>
</html>