114 lines
4.9 KiB
HTML
114 lines
4.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Profice</title>
|
|
<link rel="stylesheet" href="../style/design.css">
|
|
<link rel="stylesheet" href="../style/cursor.css">
|
|
</head>
|
|
<body>
|
|
<!-- Top Banner -->
|
|
<header class="top-banner dark-theme">
|
|
<div class="top-banner-left">
|
|
<div class="banner-left">
|
|
<button class="menu-toggle" id="menuToggle" aria-label="Menü">
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
</button>
|
|
<a href="../index.html" class="logo-link">
|
|
<img src="../images/logo/logo-01-complete.png" alt="Profice Logo" class="logo">
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="top-banner-center">
|
|
<nav class="main-nav">
|
|
<a href="../index.html#hero-section" class="nav-link">Startseite</a>
|
|
<a href="../index.html#enterprise" class="nav-link">Unternehmen</a>
|
|
<a href="../index.html#pricing" class="nav-link">Preise</a>
|
|
<a href="../index.html#services" class="nav-link">Lösungen</a>
|
|
</nav>
|
|
</div>
|
|
<div class="top-banner-right">
|
|
<button id="cursorToggle" aria-label="Cursor umschalten" title="Benutzerdefinierten Cursor umschalten">
|
|
<img src="../images/additional/cursor.png" alt="Standard Cursor" class="cursor-icon">
|
|
</button>
|
|
<button id="loginBtn" class="login-btn" aria-label="Anmelden" title="Anmelden">
|
|
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4"></path>
|
|
<polyline points="10 17 15 12 10 7"></polyline>
|
|
<line x1="15" y1="12" x2="3" y2="12"></line>
|
|
</svg>
|
|
Anmelden
|
|
</button>
|
|
</div>
|
|
</header>
|
|
|
|
<!-- Slide Menu -->
|
|
<nav class="slide-menu" id="slideMenu">
|
|
<a href="../index.html">Startseite</a>
|
|
<a href="offers.html" class="active">Kontakt & Anfrage</a>
|
|
<a href="leads.html">Leads Dashboard</a>
|
|
</nav>
|
|
|
|
<!-- Overlay -->
|
|
<div class="overlay" id="overlay"></div>
|
|
|
|
<!-- Main Content -->
|
|
<main class="main-content">
|
|
<div class="form-container">
|
|
<h2 class="form-title">Kontaktieren Sie uns</h2>
|
|
|
|
<form id="contactForm">
|
|
<div class="form-group">
|
|
<label for="name">Name *</label>
|
|
<input type="text" id="name" name="name" required placeholder="Ihr vollständiger Name">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="organisation">Organisation</label>
|
|
<input type="text" id="organisation" name="organisation" placeholder="Firmenname (optional)">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="contact">E-Mail oder Telefonnummer *</label>
|
|
<input type="text" id="contact" name="contact" required placeholder="email@beispiel.de oder +49 123 456789">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="service">Gewünschte Dienstleistung *</label>
|
|
<select id="service" name="service" required>
|
|
<option value="" disabled selected>Bitte wählen...</option>
|
|
<option value="website">Website</option>
|
|
<option value="ki-integration">KI Integration</option>
|
|
<option value="automatisation">Automatisation</option>
|
|
<option value="unabhaengige-wahl">Unabhängige Wahl</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="budget">Budget (€)</label>
|
|
<input type="text" id="budget" name="budget" placeholder="z.B. 5000 - 10000">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="description">Beschreibung *</label>
|
|
<textarea id="description" name="description" required placeholder="Beschreiben Sie Ihr Projekt oder Ihre Anfrage..."></textarea>
|
|
</div>
|
|
|
|
<button type="submit" class="submit-btn">Anfrage senden</button>
|
|
</form>
|
|
|
|
<div class="success-message" id="successMessage">
|
|
<h3>Vielen Dank!</h3>
|
|
<p>Ihre Anfrage wurde erfolgreich gesendet. Wir melden uns bald bei Ihnen.</p>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<script src="../scripts/script.js"></script>
|
|
<script src="../scripts/cursor.js"></script>
|
|
<script src="../scripts/scroll-header.js"></script>
|
|
</body>
|
|
</html> |