diff --git a/Dockerfile b/Dockerfile deleted file mode 100644 index 073140e..0000000 --- a/Dockerfile +++ /dev/null @@ -1,9 +0,0 @@ -FROM nginx:alpine - -RUN rm -rf /usr/share/nginx/html/* - -COPY ["Profice WebSite/", "/usr/share/nginx/html/"] - -RUN chmod -R 755 /usr/share/nginx/html/ - -EXPOSE 80 \ No newline at end of file diff --git a/Profice WebSite backup/.htaccess b/Profice WebSite backup/.htaccess deleted file mode 100644 index 45552cb..0000000 --- a/Profice WebSite backup/.htaccess +++ /dev/null @@ -1 +0,0 @@ -Options -Indexes \ No newline at end of file diff --git a/Profice WebSite backup/images/additional/cursor.png b/Profice WebSite backup/images/additional/cursor.png deleted file mode 100644 index d70d430..0000000 Binary files a/Profice WebSite backup/images/additional/cursor.png and /dev/null differ diff --git a/Profice WebSite backup/images/additional/spidy.png b/Profice WebSite backup/images/additional/spidy.png deleted file mode 100644 index 2dcc8af..0000000 Binary files a/Profice WebSite backup/images/additional/spidy.png and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-01.jpg b/Profice WebSite backup/images/icons/iconography-01.jpg deleted file mode 100644 index 8743a8a..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-01.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-01.png b/Profice WebSite backup/images/icons/iconography-01.png deleted file mode 100644 index 4c75a11..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-01.png and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-02.jpg b/Profice WebSite backup/images/icons/iconography-02.jpg deleted file mode 100644 index 2d5f6aa..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-02.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-02.png b/Profice WebSite backup/images/icons/iconography-02.png deleted file mode 100644 index 14aaf69..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-02.png and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-03.jpg b/Profice WebSite backup/images/icons/iconography-03.jpg deleted file mode 100644 index ca99772..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-03.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-03.png b/Profice WebSite backup/images/icons/iconography-03.png deleted file mode 100644 index ce6f89b..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-03.png and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-04 - Kopie.jpg b/Profice WebSite backup/images/icons/iconography-04 - Kopie.jpg deleted file mode 100644 index f3e3e3a..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-04 - Kopie.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-04 - Kopie.png b/Profice WebSite backup/images/icons/iconography-04 - Kopie.png deleted file mode 100644 index cb3a551..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-04 - Kopie.png and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-05.jpg b/Profice WebSite backup/images/icons/iconography-05.jpg deleted file mode 100644 index ac6d288..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-05.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-05.png b/Profice WebSite backup/images/icons/iconography-05.png deleted file mode 100644 index 61e57d4..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-05.png and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-06.jpg b/Profice WebSite backup/images/icons/iconography-06.jpg deleted file mode 100644 index 98e29cb..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-06.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-06.png b/Profice WebSite backup/images/icons/iconography-06.png deleted file mode 100644 index 1e4f6f1..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-06.png and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-07 - Kopie.jpg b/Profice WebSite backup/images/icons/iconography-07 - Kopie.jpg deleted file mode 100644 index 64f803a..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-07 - Kopie.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-07.jpg b/Profice WebSite backup/images/icons/iconography-07.jpg deleted file mode 100644 index 64f803a..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-07.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-07.png b/Profice WebSite backup/images/icons/iconography-07.png deleted file mode 100644 index 92b3a73..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-07.png and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-08.jpg b/Profice WebSite backup/images/icons/iconography-08.jpg deleted file mode 100644 index 293a6a1..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-08.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-08.png b/Profice WebSite backup/images/icons/iconography-08.png deleted file mode 100644 index 2057da8..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-08.png and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-09.jpg b/Profice WebSite backup/images/icons/iconography-09.jpg deleted file mode 100644 index 8a816da..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-09.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-09.png b/Profice WebSite backup/images/icons/iconography-09.png deleted file mode 100644 index 55a4b12..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-09.png and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-10.jpg b/Profice WebSite backup/images/icons/iconography-10.jpg deleted file mode 100644 index 6de5ef1..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-10.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/icons/iconography-10.png b/Profice WebSite backup/images/icons/iconography-10.png deleted file mode 100644 index a1b36ed..0000000 Binary files a/Profice WebSite backup/images/icons/iconography-10.png and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Appicon 1024X1024-01.png b/Profice WebSite backup/images/logo/Appicon 1024X1024-01.png deleted file mode 100644 index c06e07d..0000000 Binary files a/Profice WebSite backup/images/logo/Appicon 1024X1024-01.png and /dev/null differ diff --git a/Profice WebSite backup/images/logo/LOGO E3.jpg b/Profice WebSite backup/images/logo/LOGO E3.jpg deleted file mode 100644 index 2672503..0000000 Binary files a/Profice WebSite backup/images/logo/LOGO E3.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-01-complete.PNG b/Profice WebSite backup/images/logo/Logo-01-complete.PNG deleted file mode 100644 index 98f29e4..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-01-complete.PNG and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-01.jpg b/Profice WebSite backup/images/logo/Logo-01.jpg deleted file mode 100644 index 4957ea2..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-01.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-01.png b/Profice WebSite backup/images/logo/Logo-01.png deleted file mode 100644 index 803c96f..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-01.png and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-02.jpg b/Profice WebSite backup/images/logo/Logo-02.jpg deleted file mode 100644 index c17416a..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-02.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-02.png b/Profice WebSite backup/images/logo/Logo-02.png deleted file mode 100644 index 4346e76..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-02.png and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-03.jpg b/Profice WebSite backup/images/logo/Logo-03.jpg deleted file mode 100644 index e3f2819..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-03.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-03.png b/Profice WebSite backup/images/logo/Logo-03.png deleted file mode 100644 index 42807cd..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-03.png and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-04.jpg b/Profice WebSite backup/images/logo/Logo-04.jpg deleted file mode 100644 index 717a378..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-04.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-04.png b/Profice WebSite backup/images/logo/Logo-04.png deleted file mode 100644 index db015ea..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-04.png and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-05.jpg b/Profice WebSite backup/images/logo/Logo-05.jpg deleted file mode 100644 index 1df8d43..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-05.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-05.png b/Profice WebSite backup/images/logo/Logo-05.png deleted file mode 100644 index 1cda111..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-05.png and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-06.jpg b/Profice WebSite backup/images/logo/Logo-06.jpg deleted file mode 100644 index d06c645..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-06.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-07.jpg b/Profice WebSite backup/images/logo/Logo-07.jpg deleted file mode 100644 index 1dad7b3..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-07.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-07.png b/Profice WebSite backup/images/logo/Logo-07.png deleted file mode 100644 index 3224ded..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-07.png and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-08.jpg b/Profice WebSite backup/images/logo/Logo-08.jpg deleted file mode 100644 index c5cf31c..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-08.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-08.png b/Profice WebSite backup/images/logo/Logo-08.png deleted file mode 100644 index 64b36ca..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-08.png and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-09.jpg b/Profice WebSite backup/images/logo/Logo-09.jpg deleted file mode 100644 index fb9917c..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-09.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-09.png b/Profice WebSite backup/images/logo/Logo-09.png deleted file mode 100644 index e9cf29d..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-09.png and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-10.jpg b/Profice WebSite backup/images/logo/Logo-10.jpg deleted file mode 100644 index 2384cf8..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-10.jpg and /dev/null differ diff --git a/Profice WebSite backup/images/logo/Logo-10.png b/Profice WebSite backup/images/logo/Logo-10.png deleted file mode 100644 index 5579f7e..0000000 Binary files a/Profice WebSite backup/images/logo/Logo-10.png and /dev/null differ diff --git a/Profice WebSite backup/index.html b/Profice WebSite backup/index.html deleted file mode 100644 index 1c65d49..0000000 --- a/Profice WebSite backup/index.html +++ /dev/null @@ -1,257 +0,0 @@ - - - - - - Profice - Digitale Lösungen - - - - - -
-
- -
- -
- -
- -
- - -
-
- - - - -
- -
- -
-
-

Transformieren Sie Ihr Unternehmen digital

-

Maßgeschneiderte Lösungen für Web, KI-Integration und Prozessautomatisierung. Wir bringen Ihre Vision in die digitale Realität.

-
- Projekt starten - Mehr erfahren -
-
-
- [Bild: Digitale Transformation Illustration] -
-
- -
-

Unternehmenslösungen

-
-

Maßgeschneiderte Lösungen für große Unternehmen mit komplexen Anforderungen.

-
-
-

Skalierbarkeit

-

Lösungen, die mit Ihrem Unternehmen wachsen

-
-
-

Sicherheit

-

Unternehmenssicherheit und Compliance

-
-
-

Integration

-

Nahtlose Integration mit bestehenden Systemen

-
-
-
-
- -
-

Preise

-
-
-

Starter

-
€999
-

Perfekt für kleine Unternehmen

-
    -
  • Webentwicklung
    • -
  • Grundlegende KI-Integration
    • -
  • 3 Monate Support
    • -
-
-
-

Professional

-
€2.499
-

Ideal für wachsende Unternehmen

-
    -
  • Erweiterte Webentwicklung
    • -
  • KI & Automatisierung
    • -
  • 6 Monate Support
    • -
  • SEO Optimierung
    • -
-
-
-

Unternehmen

-
Individuell
-

Für große Unternehmen

-
    -
  • Volle Unternehmenslösungen
    • -
  • Custom KI-Entwicklung
    • -
  • 12 Monate Support
    • -
  • Dediziertes Team
    • -
-
-
-
- -
-

Unsere Expertise

-
- -
-
- 🌐 -
-

Webentwicklung

-

Moderne, responsive Webseiten, die konvertieren und Ihre Marke perfekt repräsentieren.

-
- -
-
- 🤖 -
-

KI Integration

-

Nutzen Sie die Kraft künstlicher Intelligenz, um Ihre Daten besser zu verstehen und Prozesse zu optimieren.

-
- -
-
- ⚙️ -
-

Automatisierung

-

Sparen Sie Zeit und Ressourcen durch intelligente Workflow-Automatisierungen.

-
-
-
- -
-
-
-

Warum Profice?

-

Wir verbinden technologische Exzellenz mit tiefgreifendem Geschäftsverständnis. Unser Ziel ist nicht nur die Lieferung von Software, sondern die Schaffung von echtem Mehrwert für Ihr Unternehmen.

-
    -
  • Individuelle Beratung
    • -
  • Transparente Prozesse
    • -
  • Zukunftssichere Technologien
    • -
-
-
- [Bild: Team bei der Arbeit] -
-
-
- -
- - - - - - - - - - - - - \ No newline at end of file diff --git a/Profice WebSite backup/scripts/add/send.php b/Profice WebSite backup/scripts/add/send.php deleted file mode 100644 index 8a4d7cb..0000000 --- a/Profice WebSite backup/scripts/add/send.php +++ /dev/null @@ -1,637 +0,0 @@ - $success, - 'message' => $message, - 'timestamp' => date('c') - ]; - - // Only include data if not null and not in production (security) - if ($data !== null && (!USE_PRODUCTION || DEBUG_MODE)) { - $response['data'] = $data; - } elseif ($data !== null && $success) { - // In production, only return safe data - $response['data'] = filterSafeData($data); - } - - echo json_encode($response); - exit(); -} - -function filterSafeData($data) { - // Remove sensitive fields from response - $sensitiveFields = ['webhook_url', 'ip_address', 'user_agent', 'http_code', 'error']; - - if (is_array($data)) { - foreach ($sensitiveFields as $field) { - unset($data[$field]); - } - } - - return $data; -} - -function getClientIP() { - $ipKeys = ['HTTP_CLIENT_IP', 'HTTP_X_FORWARDED_FOR', 'HTTP_X_FORWARDED', 'HTTP_FORWARDED_FOR', 'HTTP_FORWARDED', 'REMOTE_ADDR']; - - foreach ($ipKeys as $key) { - if (array_key_exists($key, $_SERVER)) { - foreach (explode(',', $_SERVER[$key]) as $ip) { - $ip = trim($ip); - if (filter_var($ip, FILTER_VALIDATE_IP, FILTER_FLAG_NO_PRIV_RANGE | FILTER_FLAG_NO_RES_RANGE) !== false) { - return $ip; - } - } - } - } - - return $_SERVER['REMOTE_ADDR'] ?? 'unknown'; -} - -function sanitizeInput($input) { - if (is_array($input)) { - return array_map('sanitizeInput', $input); - } - return htmlspecialchars(trim($input), ENT_QUOTES, 'UTF-8'); -} - -function validateCSRFToken($token) { - // Implement CSRF validation if needed - return true; -} - -function checkRateLimit($ip) { - $rateLimitFile = __DIR__ . '/rate_limits.json'; - $limits = []; - - if (file_exists($rateLimitFile)) { - $limits = json_decode(file_get_contents($rateLimitFile), true) ?: []; - } - - $now = time(); - $windowStart = $now - RATE_LIMIT_WINDOW; - - // Clean old entries - $limits = array_filter($limits, function($entry) use ($windowStart) { - return $entry['time'] > $windowStart; - }); - - // Count requests from this IP - $ipRequests = array_filter($limits, function($entry) use ($ip) { - return $entry['ip'] === $ip; - }); - - if (count($ipRequests) >= RATE_LIMIT_REQUESTS) { - return false; - } - - // Add new request - $limits[] = ['ip' => $ip, 'time' => $now]; - file_put_contents($rateLimitFile, json_encode($limits)); - - return true; -} - -// ========================================== -// WEBHOOK FUNCTIONS -// ========================================== - -function sendToWebhook($data, $webhookUrl = null) { - $url = $webhookUrl ?? WEBHOOK_URL; - - $ch = curl_init(); - curl_setopt_array($ch, [ - CURLOPT_URL => $url, - CURLOPT_RETURNTRANSFER => true, - CURLOPT_POST => true, - CURLOPT_POSTFIELDS => json_encode($data), - CURLOPT_HTTPHEADER => [ - 'Content-Type: application/json', - 'User-Agent: Profice-Web-API/2.0' - ], - CURLOPT_TIMEOUT => 30, - CURLOPT_SSL_VERIFYPEER => !DEBUG_MODE, // Disable for debugging - CURLOPT_FOLLOWLOCATION => true - ]); - - $response = curl_exec($ch); - $httpCode = curl_getinfo($ch, CURLINFO_HTTP_CODE); - $error = curl_error($ch); - curl_close($ch); - - if ($error) { - error_log("Webhook Error: " . $error); - return ['success' => false, 'error' => $error, 'response' => $response]; - } - - return [ - 'success' => $httpCode >= 200 && $httpCode < 300, - 'http_code' => $httpCode, - 'response' => $response, - 'error' => $error - ]; -} - -// ========================================== -// TRACKING FUNCTIONS - SERVER SIDE -// ========================================== - -function getTrackingConfig() { - // Return tracking configuration for client - // IDs are loaded from server, not exposed in JS - return [ - 'analytics_enabled' => !empty(GA_MEASUREMENT_ID) && GA_MEASUREMENT_ID !== 'G-XXXXXXXXXX', - 'gtm_enabled' => !empty(GTM_CONTAINER_ID) && GTM_CONTAINER_ID !== 'GTM-XXXXXXX', - 'fb_enabled' => !empty(FB_PIXEL_ID), - 'gads_enabled' => !empty(GADS_CONVERSION_ID) && GADS_CONVERSION_ID !== 'AW-XXXXXXXXXX', - 'linkedin_enabled' => !empty(LINKEDIN_PARTNER_ID) - ]; -} - -function loadTrackingScripts($preferences) { - $scripts = []; - - // Google Analytics - if ($preferences['analytics'] && !empty(GA_MEASUREMENT_ID) && GA_MEASUREMENT_ID !== 'G-XXXXXXXXXX') { - $scripts['ga'] = [ - 'type' => 'analytics', - 'src' => 'https://www.googletagmanager.com/gtag/js?id=' . GA_MEASUREMENT_ID, - 'config' => [ - 'id' => GA_MEASUREMENT_ID - ] - ]; - } - - // Google Tag Manager - if ($preferences['analytics'] && !empty(GTM_CONTAINER_ID) && GTM_CONTAINER_ID !== 'GTM-XXXXXXX') { - $scripts['gtm'] = [ - 'type' => 'gtm', - 'src' => 'https://www.googletagmanager.com/gtm.js?id=' . GTM_CONTAINER_ID, - 'config' => [ - 'id' => GTM_CONTAINER_ID - ] - ]; - } - - // Facebook Pixel - if ($preferences['marketing'] && !empty(FB_PIXEL_ID)) { - $scripts['fb'] = [ - 'type' => 'pixel', - 'src' => 'https://connect.facebook.net/en_US/fbevents.js', - 'config' => [ - 'pixel_id' => FB_PIXEL_ID - ] - ]; - } - - // Google Ads - if ($preferences['marketing'] && !empty(GADS_CONVERSION_ID) && GADS_CONVERSION_ID !== 'AW-XXXXXXXXXX') { - $scripts['gads'] = [ - 'type' => 'conversion', - 'src' => 'https://www.googletagmanager.com/gtag/js?id=' . GADS_CONVERSION_ID, - 'config' => [ - 'conversion_id' => GADS_CONVERSION_ID, - 'conversion_label' => GADS_CONVERSION_LABEL - ] - ]; - } - - // LinkedIn - if ($preferences['marketing'] && !empty(LINKEDIN_PARTNER_ID)) { - $scripts['linkedin'] = [ - 'type' => 'insight', - 'src' => 'https://snap.licdn.com/li.lms-analytics/insight.min.js', - 'config' => [ - 'partner_id' => LINKEDIN_PARTNER_ID - ] - ]; - } - - return $scripts; -} - -function sendEventToGA($data) { - if (empty(GA_MEASUREMENT_ID) || GA_MEASUREMENT_ID === 'G-XXXXXXXXXX') { - return false; - } - - $postData = [ - 'client_id' => $data['client_id'] ?? uniqid(), - 'user_id' => $data['user_id'] ?? null, - 'events' => [ - [ - 'name' => $data['event_name'], - 'params' => $data['params'] ?? [] - ] - ] - ]; - - $url = 'https://www.google-analytics.com/mp/collect'; - $url .= '?measurement_id=' . GA_MEASUREMENT_ID; - $url .= '&api_secret=' . GA_API_SECRET; - - $ch = curl_init(); - curl_setopt_array($ch, [ - CURLOPT_URL => $url, - CURLOPT_RETURNTRANSFER => true, - CURLOPT_POST => true, - CURLOPT_POSTFIELDS => json_encode($postData), - CURLOPT_HTTPHEADER => ['Content-Type: application/json'], - CURLOPT_TIMEOUT => 10 - ]); - - $response = curl_exec($ch); - $httpCode = curl_getinfo($ch, CURLINFO_HTTP_CODE); - curl_close($ch); - - return $httpCode >= 200 && $httpCode < 300; -} - -function sendEventToFB($data) { - if (empty(FB_PIXEL_ID) || empty(FB_ACCESS_TOKEN)) { - return false; - } - - $postData = [ - 'data' => [ - [ - 'event_name' => $data['event_name'], - 'event_time' => time(), - 'action_source' => 'website', - 'user_data' => $data['user_data'] ?? [], - 'custom_data' => $data['custom_data'] ?? [] - ] - ] - ]; - - $url = 'https://graph.facebook.com/v18.0/' . FB_PIXEL_ID . '/events'; - $url .= '?access_token=' . FB_ACCESS_TOKEN; - - $ch = curl_init(); - curl_setopt_array($ch, [ - CURLOPT_URL => $url, - CURLOPT_RETURNTRANSFER => true, - CURLOPT_POST => true, - CURLOPT_POSTFIELDS => json_encode($postData), - CURLOPT_HTTPHEADER => ['Content-Type: application/json'], - CURLOPT_TIMEOUT => 10 - ]); - - $response = curl_exec($ch); - $httpCode = curl_getinfo($ch, CURLINFO_HTTP_CODE); - curl_close($ch); - - return $httpCode >= 200 && $httpCode < 300; -} - -// ========================================== -// STORAGE FUNCTIONS -// ========================================== - -function storeLead($data) { - $leadFile = __DIR__ . '/data/leads.json'; - $dir = dirname($leadFile); - - if (!is_dir($dir)) { - mkdir($dir, 0755, true); - } - - $leads = []; - if (file_exists($leadFile)) { - $leads = json_decode(file_get_contents($leadFile), true) ?: []; - } - - $lead = [ - 'id' => uniqid('lead_', true), - 'datum' => date('d.m.Y'), - 'dienstleistung' => $data['service'] ?? 'Allgemein', - 'status' => 'open', - 'statusText' => 'Offen', - 'description' => $data['description'] ?? '', - 'name' => $data['name'] ?? '', - 'contact' => $data['contact'] ?? '', - 'organisation' => $data['organisation'] ?? '', - 'timestamp' => date('c'), - 'ip_address' => getClientIP() - ]; - - array_unshift($leads, $lead); - $leads = array_slice($leads, 0, 100); - - file_put_contents($leadFile, json_encode($leads, JSON_PRETTY_PRINT)); - return $lead['id']; -} - -function storeCookieConsent($data) { - $consentFile = __DIR__ . '/data/cookie_consent.json'; - $dir = dirname($consentFile); - - if (!is_dir($dir)) { - mkdir($dir, 0755, true); - } - - $consents = []; - if (file_exists($consentFile)) { - $consents = json_decode(file_get_contents($consentFile), true) ?: []; - } - - $consent = [ - 'id' => uniqid('consent_', true), - 'timestamp' => date('c'), - 'preferences' => $data['preferences'] ?? [], - 'ip_address' => getClientIP(), - 'user_agent' => $_SERVER['HTTP_USER_AGENT'] ?? '' - ]; - - array_unshift($consents, $consent); - $consents = array_slice($consents, 0, 1000); - - file_put_contents($consentFile, json_encode($consents, JSON_PRETTY_PRINT)); - return $consent['id']; -} - -function getCookieConsent() { - $consentFile = __DIR__ . '/data/cookie_consent.json'; - - if (!file_exists($consentFile)) { - return null; - } - - $consents = json_decode(file_get_contents($consentFile), true) ?: []; - return $consents[0] ?? null; -} - -// ========================================== -// REQUEST HANDLERS -// ========================================== - -function handleContactForm($data) { - $required = ['name', 'contact']; - foreach ($required as $field) { - if (empty($data[$field])) { - sendResponse(false, "Pflichtfeld fehlt: {$field}", null, 400); - } - } - - $formData = [ - 'name' => sanitizeInput($data['name']), - 'organisation' => sanitizeInput($data['organisation'] ?? ''), - 'contact' => sanitizeInput($data['contact']), - 'service' => sanitizeInput($data['service'] ?? ''), - 'budget' => sanitizeInput($data['budget'] ?? ''), - 'description' => sanitizeInput($data['description'] ?? ''), - 'timestamp' => date('c'), - 'source' => 'contact_form', - 'form_type' => 'offer', - 'ip_address' => getClientIP() - ]; - - // Store lead locally first - $leadId = storeLead($formData); - - // Send to webhook - $webhookResult = sendToWebhook($formData); - - // Always return success to user, but include webhook info in debug mode - $debugData = DEBUG_MODE ? [ - 'lead_id' => $leadId, - 'webhook_result' => $webhookResult, - 'webhook_url' => WEBHOOK_URL, - 'form_data' => $formData - ] : null; - - if ($webhookResult['success']) { - sendResponse(true, 'Formular erfolgreich gesendet', $debugData); - } else { - // Still return success to user but log the webhook error - error_log('Webhook failed but form was stored locally: ' . json_encode($webhookResult)); - sendResponse(true, 'Formular erfolgreich gesendet (Webhook-Fehler protokolliert)', $debugData); - } -} - -function handleLoginForm($data) { - $required = ['email', 'password']; - foreach ($required as $field) { - if (empty($data[$field])) { - sendResponse(false, "Pflichtfeld fehlt: {$field}", null, 400); - } - } - - // Add your login logic here - sendResponse(true, 'Login erfolgreich'); -} - -function handleRegisterForm($data) { - $required = ['name', 'email', 'password']; - foreach ($required as $field) { - if (empty($data[$field])) { - sendResponse(false, "Pflichtfeld fehlt: {$field}", null, 400); - } - } - - // Add your registration logic here - sendResponse(true, 'Registrierung erfolgreich'); -} - -function handleLeadForm($data) { - // Handle lead form submissions - $leadId = storeLead($data); - sendResponse(true, 'Lead gespeichert', ['lead_id' => $leadId]); -} - -function handleCookieConsent($data) { - $preferences = $data['preferences'] ?? []; - $consentId = storeCookieConsent(['preferences' => $preferences]); - - // Load tracking scripts based on preferences - $scripts = loadTrackingScripts($preferences); - - sendResponse(true, 'Cookie-Einstellungen gespeichert', [ - 'consent_id' => $consentId, - 'scripts' => $scripts - ]); -} - -function handleGetCookieConsent($data) { - $consent = getCookieConsent(); - if ($consent) { - sendResponse(true, 'Cookie-Einstellungen gefunden', $consent); - } else { - sendResponse(false, 'Keine Cookie-Einstellungen gefunden', null, 404); - } -} - -function handleGetTrackingConfig($data) { - $config = getTrackingConfig(); - sendResponse(true, 'Tracking-Konfiguration', $config); -} - -function handleTrackEvent($data) { - $eventName = $data['event_name'] ?? ''; - $eventData = $data['event_data'] ?? []; - - // Send to Google Analytics - $gaSuccess = sendEventToGA([ - 'event_name' => $eventName, - 'params' => $eventData - ]); - - // Send to Facebook - $fbSuccess = sendEventToFB([ - 'event_name' => $eventName, - 'custom_data' => $eventData - ]); - - sendResponse(true, 'Event gesendet', [ - 'ga_success' => $gaSuccess, - 'fb_success' => $fbSuccess - ]); -} - -// ========================================== -// MAIN REQUEST HANDLER -// ========================================== - -// Validate request method -if ($_SERVER['REQUEST_METHOD'] !== 'POST') { - sendResponse(false, 'Nur POST-Anfragen erlaubt', null, 405); -} - -// Rate limiting -$clientIP = getClientIP(); -if (!checkRateLimit($clientIP)) { - sendResponse(false, 'Zu viele Anfragen. Bitte später erneut versuchen.', null, 429); -} - -// Get JSON input -$jsonInput = file_get_contents('php://input'); -$data = json_decode($jsonInput, true); - -if (!$data) { - $data = $_POST; -} - -if (!$data || empty($data)) { - sendResponse(false, 'Keine Daten empfangen', null, 400); -} - -$requestType = $data['type'] ?? 'contact'; - -try { - switch ($requestType) { - case 'contact': - handleContactForm($data); - break; - case 'login': - handleLoginForm($data); - break; - case 'register': - handleRegisterForm($data); - break; - case 'lead': - handleLeadForm($data); - break; - case 'cookie_consent': - handleCookieConsent($data); - break; - case 'get_cookie_consent': - handleGetCookieConsent($data); - break; - case 'get_tracking_config': - handleGetTrackingConfig($data); - break; - case 'track_event': - handleTrackEvent($data); - break; - default: - sendResponse(false, 'Ungültiger Anfragetyp', null, 400); - } -} catch (Exception $e) { - error_log('API Error: ' . $e->getMessage()); - error_log('Stack trace: ' . $e->getTraceAsString()); - sendResponse(false, 'Interner Serverfehler', null, 500); -} -?> diff --git a/Profice WebSite backup/scripts/cookie-consent.js b/Profice WebSite backup/scripts/cookie-consent.js deleted file mode 100644 index 6f7177d..0000000 --- a/Profice WebSite backup/scripts/cookie-consent.js +++ /dev/null @@ -1,423 +0,0 @@ -/** - * Cookie Consent Management System - * All sensitive data (tracking IDs, URLs) are loaded from server-side PHP - * Includes fallback for local file access (no server) - * - * @version 2.1.0 - */ -document.addEventListener('DOMContentLoaded', function() { - - // ========================================== - // CONFIGURATION - // ========================================== - - const cookieCategories = ['necessary', 'analytics', 'marketing']; - const API_ENDPOINT = 'scripts/add/send.php'; - - // Detect if running from file:// protocol (no server) - const isLocalFile = window.location.protocol === 'file:'; - - let consentState = { - hasConsented: false, - preferences: {} - }; - - let previousPreferences = {}; - let trackingScripts = {}; - - // ========================================== - // DATALAYER INTEGRATION - // ========================================== - - window.dataLayer = window.dataLayer || []; - - function pushConsentToDataLayer(preferences) { - window.dataLayer.push({ - 'event': 'consent_update', - 'consent': { - 'analytics_storage': preferences.analytics ? 'granted' : 'denied', - 'ad_storage': preferences.marketing ? 'granted' : 'denied', - 'functionality_storage': preferences.necessary ? 'granted' : 'denied', - 'personalization_storage': preferences.marketing ? 'granted' : 'denied', - 'security_storage': 'granted' - } - }); - } - - function setDefaultConsent() { - window.dataLayer.push({ - 'event': 'consent_default', - 'consent': { - 'analytics_storage': 'denied', - 'ad_storage': 'denied', - 'functionality_storage': 'granted', - 'personalization_storage': 'denied', - 'security_storage': 'granted', - 'wait_for_update': 500 - } - }); - } - - // ========================================== - // STORAGE (API + LOCALSTORAGE FALLBACK) - // ========================================== - - async function saveConsentToStorage(preferences) { - // Always save to localStorage as backup - const consentData = { - hasConsented: true, - preferences: preferences, - timestamp: new Date().toISOString() - }; - localStorage.setItem('cookieConsent', JSON.stringify(consentData)); - - // Try API if not local file - if (!isLocalFile) { - try { - const response = await fetch(API_ENDPOINT, { - method: 'POST', - headers: { 'Content-Type': 'application/json' }, - body: JSON.stringify({ type: 'cookie_consent', preferences }) - }); - const result = await response.json(); - if (result.success && result.data && result.data.scripts) { - trackingScripts = result.data.scripts; - } - return result.success; - } catch (e) { - // API failed, localStorage already saved - return false; - } - } - return true; - } - - async function getConsentFromStorage() { - // Try localStorage first (faster) - const localConsent = localStorage.getItem('cookieConsent'); - if (localConsent) { - try { - return JSON.parse(localConsent); - } catch (e) { - localStorage.removeItem('cookieConsent'); - } - } - - // Try API if not local file - if (!isLocalFile) { - try { - const response = await fetch(API_ENDPOINT, { - method: 'POST', - headers: { 'Content-Type': 'application/json' }, - body: JSON.stringify({ type: 'get_cookie_consent' }) - }); - const result = await response.json(); - if (result.success && result.data) { - if (result.data.scripts) { - trackingScripts = result.data.scripts; - } - // Cache in localStorage - localStorage.setItem('cookieConsent', JSON.stringify(result.data)); - return result.data; - } - } catch (e) { - // API unavailable - } - } - - return null; - } - - // ========================================== - // SCRIPT LOADING - // ========================================== - - function loadTrackingScripts() { - if (!trackingScripts || Object.keys(trackingScripts).length === 0) return; - - if (trackingScripts.ga && consentState.preferences.analytics) { - loadGoogleAnalytics(trackingScripts.ga); - } - if (trackingScripts.gtm && consentState.preferences.analytics) { - loadGTM(trackingScripts.gtm); - } - if (trackingScripts.fb && consentState.preferences.marketing) { - loadFacebookPixel(trackingScripts.fb); - } - if (trackingScripts.gads && consentState.preferences.marketing) { - loadGoogleAds(trackingScripts.gads); - } - if (trackingScripts.linkedin && consentState.preferences.marketing) { - loadLinkedIn(trackingScripts.linkedin); - } - } - - function loadScript(src, callback) { - const script = document.createElement('script'); - script.src = src; - script.async = true; - if (callback) script.onload = callback; - document.head.appendChild(script); - } - - function loadGoogleAnalytics(config) { - if (!config.src || !config.config || !config.config.id) return; - loadScript(config.src, function() { - window.dataLayer = window.dataLayer || []; - function gtag(){dataLayer.push(arguments);} - window.gtag = gtag; - gtag('js', new Date()); - gtag('config', config.config.id); - }); - } - - function loadGTM(config) { - if (!config.id) return; - (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': - new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], - j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= - 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); - })(window,document,'script','dataLayer',config.id); - } - - function loadFacebookPixel(config) { - if (!config.id) return; - !function(f,b,e,v,n,t,s){if(f.fbq)return;n=f.fbq=function(){n.callMethod? - n.callMethod.apply(n,arguments):n.queue.push(arguments)};if(!f._fbq)f._fbq=n; - n.push=n;n.loaded=!0;n.version='2.0';n.queue=[];t=b.createElement(e);t.async=!0; - t.src=v;s=b.getElementsByTagName(e)[0];s.parentNode.insertBefore(t,s)}(window, - document,'script','https://connect.facebook.net/en_US/fbevents.js'); - fbq('init', config.id); - fbq('track', 'PageView'); - } - - function loadGoogleAds(config) { - if (!config.id) return; - loadScript('https://www.googletagmanager.com/gtag/js?id=' + config.id, function() { - window.dataLayer = window.dataLayer || []; - function gtag(){dataLayer.push(arguments);} - gtag('js', new Date()); - gtag('config', config.id); - }); - } - - function loadLinkedIn(config) { - if (!config.id) return; - window._linkedin_partner_id = config.id; - window._linkedin_data_partner_ids = window._linkedin_data_partner_ids || []; - window._linkedin_data_partner_ids.push(config.id); - loadScript('https://snap.licdn.com/li.lms-analytics/insight.min.js'); - } - - // ========================================== - // COOKIE DELETION - // ========================================== - - const cookiePatterns = { - analytics: ['_ga', '_gid', '_gat', '__utma', '__utmb', '__utmc', '__utmz'], - marketing: ['_fbp', '_fbc', 'fr', '_gcl_au', '_gcl_aw', 'IDE', 'DSID', 'NID'] - }; - - function deleteCookie(name) { - const paths = ['/', window.location.pathname]; - const domains = ['', window.location.hostname, '.' + window.location.hostname]; - - paths.forEach(path => { - domains.forEach(domain => { - document.cookie = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=${path}${domain ? '; domain=' + domain : ''}`; - }); - }); - } - - function deleteCookiesForCategory(category) { - const patterns = cookiePatterns[category] || []; - const allCookies = document.cookie.split(';'); - - allCookies.forEach(cookie => { - const cookieName = cookie.split('=')[0].trim(); - patterns.forEach(pattern => { - if (cookieName.startsWith(pattern)) { - deleteCookie(cookieName); - } - }); - }); - } - - function handlePreferenceChanges(newPreferences) { - Object.keys(cookiePatterns).forEach(category => { - if (previousPreferences[category] === true && newPreferences[category] === false) { - deleteCookiesForCategory(category); - window.dataLayer.push({ 'event': 'consent_revoked', 'consent_category': category }); - } - }); - previousPreferences = { ...newPreferences }; - } - - // ========================================== - // DOM ELEMENTS - // ========================================== - - const cookieBanner = document.getElementById('cookieBanner'); - const cookieModal = document.getElementById('cookieModal'); - const acceptAllBtn = document.getElementById('cookieAcceptAll'); - const rejectAllBtn = document.getElementById('cookieRejectAll'); - const settingsBtn = document.getElementById('cookieSettings'); - const modalCloseBtn = document.getElementById('cookieModalClose'); - const savePreferencesBtn = document.getElementById('cookieSavePreferences'); - - // ========================================== - // CORE FUNCTIONS - // ========================================== - - async function initCookieConsent() { - setDefaultConsent(); - - const savedConsent = await getConsentFromStorage(); - - if (savedConsent && savedConsent.hasConsented) { - consentState = { - hasConsented: true, - preferences: savedConsent.preferences || {} - }; - previousPreferences = { ...consentState.preferences }; - applyConsentPreferences(); - return; - } - - // Show banner after short delay - setTimeout(() => { - if (cookieBanner) cookieBanner.classList.add('show'); - }, 500); - } - - function applyConsentPreferences() { - pushConsentToDataLayer(consentState.preferences); - loadTrackingScripts(); - window.dispatchEvent(new CustomEvent('cookieConsentUpdated', { detail: consentState.preferences })); - } - - async function saveConsent(preferences) { - handlePreferenceChanges(preferences); - await saveConsentToStorage(preferences); - - consentState = { - hasConsented: true, - preferences: preferences, - timestamp: new Date().toISOString() - }; - - applyConsentPreferences(); - } - - function hideBanner() { - if (cookieBanner) cookieBanner.classList.remove('show'); - } - - function showSettingsModal() { - if (cookieModal) { - cookieModal.classList.add('show'); - populateSettingsModal(); - } - } - - function hideSettingsModal() { - if (cookieModal) cookieModal.classList.remove('show'); - } - - function populateSettingsModal() { - cookieCategories.forEach(key => { - const toggle = document.getElementById(`cookie-toggle-${key}`); - if (!toggle) return; - - const isEnabled = consentState.preferences[key] || false; - const isRequired = key === 'necessary'; - - if (isRequired) { - toggle.classList.add('active', 'disabled'); - toggle.setAttribute('aria-checked', 'true'); - toggle.setAttribute('aria-disabled', 'true'); - } else { - toggle.classList.toggle('active', isEnabled); - toggle.setAttribute('aria-checked', isEnabled ? 'true' : 'false'); - toggle.onclick = () => { - toggle.classList.toggle('active'); - toggle.setAttribute('aria-checked', toggle.classList.contains('active') ? 'true' : 'false'); - }; - } - }); - } - - function getModalPreferences() { - const preferences = {}; - cookieCategories.forEach(key => { - const toggle = document.getElementById(`cookie-toggle-${key}`); - preferences[key] = key === 'necessary' ? true : (toggle ? toggle.classList.contains('active') : false); - }); - return preferences; - } - - // ========================================== - // EVENT LISTENERS - // ========================================== - - if (acceptAllBtn) { - acceptAllBtn.addEventListener('click', () => { - const preferences = {}; - cookieCategories.forEach(key => preferences[key] = true); - saveConsent(preferences); - hideBanner(); - }); - } - - if (rejectAllBtn) { - rejectAllBtn.addEventListener('click', () => { - saveConsent({ necessary: true, analytics: false, marketing: false }); - hideBanner(); - }); - } - - if (settingsBtn) { - settingsBtn.addEventListener('click', showSettingsModal); - } - - if (modalCloseBtn) { - modalCloseBtn.addEventListener('click', hideSettingsModal); - } - - if (savePreferencesBtn) { - savePreferencesBtn.addEventListener('click', () => { - saveConsent(getModalPreferences()); - hideSettingsModal(); - hideBanner(); - }); - } - - if (cookieModal) { - cookieModal.addEventListener('click', (e) => { - if (e.target === cookieModal) hideSettingsModal(); - }); - } - - document.addEventListener('keydown', (e) => { - if (e.key === 'Escape' && cookieModal && cookieModal.classList.contains('show')) { - hideSettingsModal(); - } - }); - - // ========================================== - // PUBLIC API - // ========================================== - - window.CookieConsent = { - getConsent: () => consentState, - hasConsent: (category) => consentState.preferences[category] === true, - updateConsent: saveConsent, - showSettings: showSettingsModal - }; - - // ========================================== - // INITIALIZE - // ========================================== - - initCookieConsent(); -}); diff --git a/Profice WebSite backup/scripts/cursor.js b/Profice WebSite backup/scripts/cursor.js deleted file mode 100644 index d51d316..0000000 --- a/Profice WebSite backup/scripts/cursor.js +++ /dev/null @@ -1,210 +0,0 @@ -// cursor.js - -document.addEventListener("DOMContentLoaded", function () { - if (window.matchMedia("(pointer: coarse)").matches) return; - - // --- SETTINGS --- - const CONFIG = { - tentacleCount: 8, - triggerDist: 10, - maxLength: 300, - connectionDist: 150, - thickness: 1, - color: "rgba(20, 20, 20, 1)", - prediction: 3.5 - }; - - - const toggleBtn = document.getElementById('cursorToggle'); - const body = document.body; - - // Default to system cursor (disabled custom cursor) - let isCursorDisabled = localStorage.getItem('venomCursorDisabled') !== 'false'; - - function updateCursorState() { - if (isCursorDisabled) { - // System cursor (default) - show spidy icon - body.classList.add('system-cursor'); - if (toggleBtn) { - toggleBtn.classList.remove('active'); - const icon = toggleBtn.querySelector('.cursor-icon'); - if (icon) { - // Check if we're on a page in the sites/ folder - const currentPath = window.location.pathname; - const isInSitesFolder = currentPath.includes('/sites/'); - const imagePath = isInSitesFolder ? '../images/additional/spidy.png' : 'images/additional/spidy.png'; - icon.src = imagePath; - } - } - } else { - // Custom cursor (secondary) - show cursor icon - body.classList.remove('system-cursor'); - if (toggleBtn) { - toggleBtn.classList.add('active'); - const icon = toggleBtn.querySelector('.cursor-icon'); - if (icon) { - // Check if we're on a page in the sites/ folder - const currentPath = window.location.pathname; - const isInSitesFolder = currentPath.includes('/sites/'); - const imagePath = isInSitesFolder ? '../images/additional/cursor.png' : 'images/additional/cursor.png'; - icon.src = imagePath; - } - } - } - } - - updateCursorState(); - - if (toggleBtn) { - toggleBtn.addEventListener('click', () => { - isCursorDisabled = !isCursorDisabled; - localStorage.setItem('venomCursorDisabled', isCursorDisabled); - updateCursorState(); - }); - } - - const canvas = document.createElement("canvas"); - canvas.id = "venom-cursor"; - document.body.appendChild(canvas); - - const ctx = canvas.getContext("2d"); - const width = window.innerWidth; - const height = window.innerHeight; - canvas.width = width; - canvas.height = height; - - const tentacles = []; - const mouse = { x: 0, y: 0 }; - const oldMouse = { x: 0, y: 0 }; - - document.addEventListener("mousemove", (e) => { - mouse.x = e.clientX; - mouse.y = e.clientY; - }); - - window.addEventListener("resize", () => { - canvas.width = window.innerWidth; - canvas.height = window.innerHeight; - }); - - class Tentacle { - constructor(mx, my, targetX, targetY) { - this.dead = false; - this.anchor = { x: targetX, y: targetY }; - this.currentDist = 0; // For calculating connection opacity - } - - update(currentMouse) { - const dx = currentMouse.x - this.anchor.x; - const dy = currentMouse.y - this.anchor.y; - this.currentDist = Math.sqrt(dx*dx + dy*dy); - - if (this.currentDist > CONFIG.maxLength) { - this.dead = true; - } - } - - draw(ctx, currentMouse) { - if (this.dead) return; - - // Tension (0..1) - const tension = Math.min(this.currentDist / CONFIG.maxLength, 1); - const dynamicThickness = CONFIG.thickness * (1 - tension * 0.9); - - // Draw main line (Cursor -> Anchor) - ctx.beginPath(); - ctx.moveTo(currentMouse.x, currentMouse.y); - ctx.lineTo(this.anchor.x, this.anchor.y); - - ctx.lineWidth = Math.max(0.2, dynamicThickness); - ctx.strokeStyle = CONFIG.color; - ctx.lineCap = "butt"; - ctx.stroke(); - - // Draw anchor point - ctx.beginPath(); - ctx.arc(this.anchor.x, this.anchor.y, 1.5 * (1 - tension), 0, Math.PI * 2); - ctx.fillStyle = CONFIG.color; - ctx.fill(); - } - } - - function render() { - ctx.clearRect(0, 0, width, height); - - // 1. Create new tentacles on movement - const distMoved = Math.hypot(mouse.x - oldMouse.x, mouse.y - oldMouse.y); - - if (distMoved > CONFIG.triggerDist) { - const vx = mouse.x - oldMouse.x; - const vy = mouse.y - oldMouse.y; - - // "Spread" of shots increased slightly for better geometry - const targetX = mouse.x + vx * CONFIG.prediction + (Math.random() - 0.5) * 60; - const targetY = mouse.y + vy * CONFIG.prediction + (Math.random() - 0.5) * 60; - - tentacles.push(new Tentacle(mouse.x, mouse.y, targetX, targetY)); - oldMouse.x = mouse.x; - oldMouse.y = mouse.y; - } - - // Remove old ones (FIFO) - if (tentacles.length > CONFIG.tentacleCount) { - tentacles.shift(); - } - - // 2. Draw main tentacles - for (let i = tentacles.length - 1; i >= 0; i--) { - const t = tentacles[i]; - t.update(mouse); - if (t.dead) { - tentacles.splice(i, 1); - } else { - t.draw(ctx, mouse); - } - } - - // 3. DRAW CONNECTIONS BETWEEN ANCHORS (New logic) - // Iterate through all pairs of active tentacles - ctx.beginPath(); // Begin common path for optimization - ctx.lineWidth = 0.5; // Connections are always thin - - for (let i = 0; i < tentacles.length; i++) { - for (let j = i + 1; j < tentacles.length; j++) { - const t1 = tentacles[i]; - const t2 = tentacles[j]; - - // Calculate distance between ends of two tentacles - const dx = t1.anchor.x - t2.anchor.x; - const dy = t1.anchor.y - t2.anchor.y; - const dist = Math.sqrt(dx*dx + dy*dy); - - // If they are close to each other — connect - if (dist < CONFIG.connectionDist) { - // Opacity depends on how far apart they are - // And how much the tentacles themselves are stretched - const alpha = (1 - dist / CONFIG.connectionDist) * 0.6; - - ctx.beginPath(); // New path for each to control opacity - ctx.strokeStyle = `rgba(20, 20, 20, ${alpha})`; - ctx.moveTo(t1.anchor.x, t1.anchor.y); - ctx.lineTo(t2.anchor.x, t2.anchor.y); - ctx.stroke(); - } - } - } - - // 4. Cursor (Rhombus) - ctx.beginPath(); - ctx.fillStyle = CONFIG.color; - ctx.moveTo(mouse.x, mouse.y - 5); - ctx.lineTo(mouse.x + 5, mouse.y); - ctx.lineTo(mouse.x, mouse.y + 5); - ctx.lineTo(mouse.x - 5, mouse.y); - ctx.fill(); - - requestAnimationFrame(render); - } - - render(); -}); \ No newline at end of file diff --git a/Profice WebSite backup/scripts/leads.js b/Profice WebSite backup/scripts/leads.js deleted file mode 100644 index 18fb993..0000000 --- a/Profice WebSite backup/scripts/leads.js +++ /dev/null @@ -1,75 +0,0 @@ -// leads.js - -// ========================================== -// 1. MENU TOGGLE -// ========================================== -const menuToggle = document.getElementById('menuToggle'); -const slideMenu = document.getElementById('slideMenu'); -const overlay = document.getElementById('overlay'); - -if (menuToggle && slideMenu && overlay) { - function toggleMenu() { - menuToggle.classList.toggle('active'); - slideMenu.classList.toggle('active'); - overlay.classList.toggle('active'); - } - - menuToggle.addEventListener('click', toggleMenu); - overlay.addEventListener('click', toggleMenu); -} - -// ========================================== -// 2. LEADS TABLE LOGIC -// ========================================== - -function getLeads() { - const storedLeads = localStorage.getItem('myLeads'); - if (storedLeads) { - return JSON.parse(storedLeads); - } else { - return []; - } -} - -function populateLeadsTable() { - const tableBody = document.getElementById('leadsTableBody'); - const leadsData = getLeads(); - - if (!tableBody) return; - - if (leadsData.length === 0) { - tableBody.innerHTML = ` - - -

Keine Anfragen vorhanden

- - - `; - return; - } - - tableBody.innerHTML = leadsData.map(lead => ` - - ${lead.datum} - ${lead.dienstleistung} - - ${lead.statusText} - - - Details ansehen - - - `).join(''); - - document.querySelectorAll('.action-btn').forEach(btn => { - btn.addEventListener('click', function(e) { - e.preventDefault(); - const leadId = this.getAttribute('data-id'); - - // Redirect to lead details page - window.location.href = `lead-details.html?id=${leadId}`; - }); - }); -} - -document.addEventListener('DOMContentLoaded', populateLeadsTable); \ No newline at end of file diff --git a/Profice WebSite backup/scripts/login.js b/Profice WebSite backup/scripts/login.js deleted file mode 100644 index 60a5c8e..0000000 --- a/Profice WebSite backup/scripts/login.js +++ /dev/null @@ -1,217 +0,0 @@ -// login.js - -document.addEventListener("DOMContentLoaded", function() { - const loginForm = document.getElementById('loginForm'); - const loginBtn = document.getElementById('loginSubmit'); - const successMessage = document.getElementById('successMessage'); - const errorMessage = document.getElementById('errorMessage'); - const errorText = document.getElementById('errorText'); - const registerBtn = document.getElementById('registerBtn'); - - // Register button functionality - if (registerBtn) { - registerBtn.addEventListener('click', function(e) { - e.preventDefault(); - window.location.href = 'register.html'; - }); - } - - // Check if user is already logged in - checkExistingSession(); - - // Login form submission - if (loginForm) { - loginForm.addEventListener('submit', async function(e) { - e.preventDefault(); - - const email = document.getElementById('email').value; - const password = document.getElementById('password').value; - const remember = document.getElementById('remember').checked; - - // Simple validation - if (!email || !password) { - showError('Bitte füllen Sie alle Felder aus.'); - return; - } - - // Email validation - const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; - if (!emailRegex.test(email)) { - showError('Bitte geben Sie eine gültige E-Mail-Adresse ein.'); - return; - } - - // Show loading state - setLoadingState(true); - hideMessages(); - - // Send login data to PHP API - const loginData = { - type: 'login', - email: email, - password: password, - remember: remember - }; - - try { - const response = await fetch('../scripts/add/send.php', { - method: 'POST', - headers: { - 'Content-Type': 'application/json', - }, - body: JSON.stringify(loginData) - }); - - const result = await response.json(); - - if (result.success) { - // Store session (for demo purposes - in real app, this would come from server) - const sessionData = { - user: { email: email }, - loginTime: new Date().toISOString(), - remember: remember - }; - - if (remember) { - localStorage.setItem('userSession', JSON.stringify(sessionData)); - } else { - sessionStorage.setItem('userSession', JSON.stringify(sessionData)); - } - - // Show success message - showSuccess('Anmeldung erfolgreich! Sie werden weitergeleitet...'); - - // Redirect after delay - setTimeout(() => { - window.location.href = '../index.html'; - }, 2000); - } else { - showError('Anmeldung fehlgeschlagen: ' + result.message); - } - } catch (error) { - console.error('Login error:', error); - showError('Netzwerkfehler bei der Anmeldung. Bitte versuchen Sie es später erneut.'); - } - - setLoadingState(false); - }); - } - - // Loading state management - function setLoadingState(loading) { - if (loginBtn) { - const btnText = loginBtn.querySelector('.btn-text'); - const btnLoading = loginBtn.querySelector('.btn-loading'); - - if (loading) { - loginBtn.disabled = true; - if (btnText) btnText.style.display = 'none'; - if (btnLoading) btnLoading.style.display = 'inline-block'; - } else { - loginBtn.disabled = false; - if (btnText) btnText.style.display = 'inline-block'; - if (btnLoading) btnLoading.style.display = 'none'; - } - } - } - - // Message display functions - function showSuccess(message) { - if (successMessage) { - const messageElement = successMessage.querySelector('p'); - if (messageElement) { - messageElement.textContent = message; - } - successMessage.classList.add('show'); - } - } - - function showError(message) { - if (errorMessage && errorText) { - errorText.textContent = message; - errorMessage.classList.add('show'); - - // Hide after 5 seconds - setTimeout(() => { - errorMessage.classList.remove('show'); - }, 5000); - } - } - - function hideMessages() { - if (successMessage) successMessage.classList.remove('show'); - if (errorMessage) errorMessage.classList.remove('show'); - } -}); - -// Check existing session - DISABLED auto-redirect -function checkExistingSession() { - const sessionData = localStorage.getItem('userSession') || sessionStorage.getItem('userSession'); - - if (sessionData) { - try { - const session = JSON.parse(sessionData); - const loginTime = new Date(session.loginTime); - const now = new Date(); - const sessionAge = (now - loginTime) / (1000 * 60 * 60); // hours - - // Auto-logout after 24 hours - if (sessionAge < 24) { - // User is still logged in - just log it, don't redirect - console.log('User already logged in'); - // DISABLED: window.location.href = '../index.html'; - } else { - // Session expired, remove it - console.log('Session expired, removing...'); - localStorage.removeItem('userSession'); - sessionStorage.removeItem('userSession'); - } - } catch (error) { - console.error('Session parsing error:', error); - localStorage.removeItem('userSession'); - sessionStorage.removeItem('userSession'); - } - } -} - -// Logout function (can be called from other pages) -function logout() { - localStorage.removeItem('userSession'); - sessionStorage.removeItem('userSession'); - window.location.href = 'sites/login.html'; -} - -// Get current user (can be called from other pages) -function getCurrentUser() { - const sessionData = localStorage.getItem('userSession') || sessionStorage.getItem('userSession'); - - if (sessionData) { - try { - const session = JSON.parse(sessionData); - const loginTime = new Date(session.loginTime); - const now = new Date(); - const sessionAge = (now - loginTime) / (1000 * 60 * 60); // hours - - if (sessionAge < 24) { - return session.user; - } else { - // Session expired - localStorage.removeItem('userSession'); - sessionStorage.removeItem('userSession'); - return null; - } - } catch (error) { - console.error('Session parsing error:', error); - localStorage.removeItem('userSession'); - sessionStorage.removeItem('userSession'); - return null; - } - } - - return null; -} - -// Check if user is logged in (can be called from other pages) -function isLoggedIn() { - return getCurrentUser() !== null; -} diff --git a/Profice WebSite backup/scripts/register.js b/Profice WebSite backup/scripts/register.js deleted file mode 100644 index 5dda79a..0000000 --- a/Profice WebSite backup/scripts/register.js +++ /dev/null @@ -1,272 +0,0 @@ -// register.js - -document.addEventListener("DOMContentLoaded", function() { - const registerForm = document.getElementById('registerForm'); - const registerBtn = document.getElementById('registerSubmit'); - const successMessage = document.getElementById('successMessage'); - const errorMessage = document.getElementById('errorMessage'); - const errorText = document.getElementById('errorText'); - const passwordInput = document.getElementById('password'); - const confirmPasswordInput = document.getElementById('confirmPassword'); - const passwordStrength = document.getElementById('passwordStrength'); - - // Check if user is already logged in - checkExistingSession(); - - // Password strength checker - if (passwordInput && passwordStrength) { - passwordInput.addEventListener('input', function() { - const password = this.value; - const strength = checkPasswordStrength(password); - updatePasswordStrength(strength); - }); - } - - // Password confirmation checker - if (confirmPasswordInput && passwordInput) { - confirmPasswordInput.addEventListener('input', function() { - const password = passwordInput.value; - const confirmPassword = this.value; - - if (confirmPassword && password !== confirmPassword) { - this.setCustomValidity('Passwörter stimmen nicht überein'); - } else { - this.setCustomValidity(''); - } - }); - } - - // Registration form submission - if (registerForm) { - registerForm.addEventListener('submit', async function(e) { - e.preventDefault(); - - // Get form data - const formData = { - type: 'register', - name: `${document.getElementById('firstName').value} ${document.getElementById('lastName').value}`, - email: document.getElementById('email').value, - phone: document.getElementById('phone').value, - company: document.getElementById('company').value, - password: passwordInput.value, - confirmPassword: confirmPasswordInput.value, - terms: document.getElementById('terms').checked, - newsletter: document.getElementById('newsletter').checked, - registrationTime: new Date().toISOString() - }; - - // Validation - const validation = validateRegistrationForm(formData); - if (!validation.valid) { - showError(validation.message); - return; - } - - // Show loading state - setLoadingState(true); - hideMessages(); - - // Send registration data to PHP API - try { - const response = await fetch('../scripts/add/send.php', { - method: 'POST', - headers: { - 'Content-Type': 'application/json', - }, - body: JSON.stringify(formData) - }); - - const result = await response.json(); - - if (result.success) { - // Store user data (for demo purposes) - const userData = { - firstName: document.getElementById('firstName').value, - lastName: document.getElementById('lastName').value, - email: formData.email, - phone: formData.phone, - company: formData.company, - registrationTime: formData.registrationTime, - newsletter: formData.newsletter - }; - - // Store in localStorage (for demo purposes) - localStorage.setItem('userData', JSON.stringify(userData)); - localStorage.setItem('userRegistered', 'true'); - - // Show success message - showSuccess('Registrierung erfolgreich! Sie werden weitergeleitet...'); - - // Redirect after delay - setTimeout(() => { - window.location.href = '../index.html'; - }, 2000); - } else { - showError('Registrierung fehlgeschlagen: ' + result.message); - } - } catch (error) { - console.error('Registration error:', error); - showError('Netzwerkfehler bei der Registrierung. Bitte versuchen Sie es später erneut.'); - } - - setLoadingState(false); - }); - } - - // Password strength checker function - function checkPasswordStrength(password) { - let strength = 0; - - // Length check - if (password.length >= 8) strength++; - if (password.length >= 12) strength++; - - // Character variety checks - if (/[a-z]/.test(password)) strength++; // lowercase - if (/[A-Z]/.test(password)) strength++; // uppercase - if (/[0-9]/.test(password)) strength++; // numbers - if (/[^a-zA-Z0-9]/.test(password)) strength++; // special characters - - return strength; - } - - // Update password strength indicator - function updatePasswordStrength(strength) { - const strengthBar = passwordStrength.querySelector('.strength-bar'); - const strengthText = passwordStrength.querySelector('.strength-text'); - - // Remove all strength classes - passwordStrength.classList.remove('strength-weak', 'strength-medium', 'strength-strong'); - - if (strength <= 2) { - passwordStrength.classList.add('strength-weak'); - strengthText.textContent = 'Schwach'; - } else if (strength <= 4) { - passwordStrength.classList.add('strength-medium'); - strengthText.textContent = 'Mittel'; - } else { - passwordStrength.classList.add('strength-strong'); - strengthText.textContent = 'Stark'; - } - } - - // Form validation - function validateRegistrationForm(data) { - // Required fields check - if (!data.firstName || !data.lastName || !data.email || !data.password) { - return { valid: false, message: 'Bitte füllen Sie alle Pflichtfelder aus.' }; - } - - // Name validation - if (data.firstName.length < 2 || data.lastName.length < 2) { - return { valid: false, message: 'Vorname und Nachname müssen mindestens 2 Zeichen lang sein.' }; - } - - // Email validation - const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; - if (!emailRegex.test(data.email)) { - return { valid: false, message: 'Bitte geben Sie eine gültige E-Mail-Adresse ein.' }; - } - - // Password validation - if (data.password.length < 8) { - return { valid: false, message: 'Das Passwort muss mindestens 8 Zeichen lang sein.' }; - } - - // Password confirmation - if (data.password !== data.confirmPassword) { - return { valid: false, message: 'Die Passwörter stimmen nicht überein.' }; - } - - // Terms acceptance - if (!data.terms) { - return { valid: false, message: 'Sie müssen die Nutzungsbedingungen akzeptieren.' }; - } - - // Phone validation (if provided) - if (data.phone) { - const phoneRegex = /^[\d\s\-\+\(\)]+$/; - if (!phoneRegex.test(data.phone)) { - return { valid: false, message: 'Bitte geben Sie eine gültige Telefonnummer ein.' }; - } - } - - return { valid: true, message: 'Validierung erfolgreich' }; - } - - // Loading state management - function setLoadingState(loading) { - if (registerBtn) { - const btnText = registerBtn.querySelector('.btn-text'); - const btnLoading = registerBtn.querySelector('.btn-loading'); - - if (loading) { - registerBtn.disabled = true; - if (btnText) btnText.style.display = 'none'; - if (btnLoading) btnLoading.style.display = 'inline-block'; - } else { - registerBtn.disabled = false; - if (btnText) btnText.style.display = 'inline-block'; - if (btnLoading) btnLoading.style.display = 'none'; - } - } - } - - // Message display functions - function showSuccess(message) { - if (successMessage) { - const messageElement = successMessage.querySelector('p'); - if (messageElement) { - messageElement.textContent = message; - } - successMessage.classList.add('show'); - } - } - - function showError(message) { - if (errorMessage && errorText) { - errorText.textContent = message; - errorMessage.classList.add('show'); - - // Hide after 5 seconds - setTimeout(() => { - errorMessage.classList.remove('show'); - }, 5000); - } - } - - function hideMessages() { - if (successMessage) successMessage.classList.remove('show'); - if (errorMessage) errorMessage.classList.remove('show'); - } -}); - -// Check existing session (same as login.js) - DISABLED auto-redirect -function checkExistingSession() { - const sessionData = localStorage.getItem('userSession') || sessionStorage.getItem('userSession'); - - if (sessionData) { - try { - const session = JSON.parse(sessionData); - const loginTime = new Date(session.loginTime); - const now = new Date(); - const sessionAge = (now - loginTime) / (1000 * 60 * 60); // hours - - // Auto-logout after 24 hours - if (sessionAge < 24) { - // User is still logged in - just log it, don't redirect - console.log('User already logged in'); - // DISABLED: window.location.href = '../index.html'; - } else { - // Session expired, remove it - console.log('Session expired, removing...'); - localStorage.removeItem('userSession'); - sessionStorage.removeItem('userSession'); - } - } catch (error) { - console.error('Session parsing error:', error); - localStorage.removeItem('userSession'); - sessionStorage.removeItem('userSession'); - } - } -} diff --git a/Profice WebSite backup/scripts/script.js b/Profice WebSite backup/scripts/script.js deleted file mode 100644 index a03fbae..0000000 --- a/Profice WebSite backup/scripts/script.js +++ /dev/null @@ -1,151 +0,0 @@ -/** - * Main Script - Profice Website - * All API calls go through server-side PHP - * Includes fallback for local file access (no server) - * - * @version 2.1.0 - */ - -document.addEventListener("DOMContentLoaded", function() { - - const API_ENDPOINT = 'scripts/add/send.php'; - const isLocalFile = window.location.protocol === 'file:'; - - // ========================================== - // 1. SMOOTH SCROLLING - // ========================================== - - function initSmoothScrolling() { - document.querySelectorAll('a[href^="#"]').forEach(link => { - link.addEventListener('click', function(e) { - const targetId = this.getAttribute('href'); - if (targetId === '#') return; - - const targetElement = document.querySelector(targetId); - if (targetElement) { - e.preventDefault(); - const header = document.querySelector('.top-banner'); - const headerHeight = header ? header.offsetHeight : 90; - - window.scrollTo({ - top: targetElement.offsetTop - headerHeight - 20, - behavior: 'smooth' - }); - - history.pushState(null, null, targetId); - } - }); - }); - } - - initSmoothScrolling(); - - // ========================================== - // 2. MENU TOGGLE - // ========================================== - - const menuToggle = document.getElementById('menuToggle'); - const slideMenu = document.getElementById('slideMenu'); - const overlay = document.getElementById('overlay'); - - if (menuToggle && slideMenu && overlay) { - const toggleMenu = () => { - menuToggle.classList.toggle('active'); - slideMenu.classList.toggle('active'); - overlay.classList.toggle('active'); - }; - menuToggle.addEventListener('click', toggleMenu); - overlay.addEventListener('click', toggleMenu); - } - - // ========================================== - // 3. LOGIN BUTTON - // ========================================== - - const loginBtn = document.getElementById('loginBtn'); - if (loginBtn) { - const currentPath = window.location.pathname; - let loginPath = 'sites/login.html'; - - if (currentPath.includes('/sites/')) { - loginPath = currentPath.includes('login.html') ? 'register.html' : 'login.html'; - } - - loginBtn.onclick = (e) => { - e.preventDefault(); - window.location.href = loginPath; - }; - } - - // ========================================== - // 4. FORM SUBMISSION - // ========================================== - - const contactForm = document.getElementById('contactForm'); - const successMessage = document.getElementById('successMessage'); - - if (contactForm) { - contactForm.addEventListener('submit', async function(e) { - e.preventDefault(); - - const getValue = (id) => { - const el = document.getElementById(id); - return el ? el.value : ''; - }; - - const serviceSelect = document.getElementById('service'); - const selectedServiceText = serviceSelect ? - serviceSelect.options[serviceSelect.selectedIndex].text : 'Dienstleistung'; - - const formData = { - type: 'contact', - name: getValue('name'), - organisation: getValue('organisation'), - contact: getValue('contact'), - service: getValue('service'), - budget: getValue('budget'), - description: getValue('description') - }; - - // Always store locally for dashboard - try { - const localLead = { - id: Date.now(), - datum: new Date().toLocaleDateString('de-DE'), - dienstleistung: selectedServiceText, - status: 'open', - statusText: 'Offen', - description: formData.description - }; - const existingLeads = JSON.parse(localStorage.getItem('myLeads') || '[]'); - existingLeads.unshift(localLead); - localStorage.setItem('myLeads', JSON.stringify(existingLeads.slice(0, 100))); - } catch (err) {} - - // Send to API if not local file - if (!isLocalFile) { - try { - const response = await fetch(API_ENDPOINT, { - method: 'POST', - headers: { 'Content-Type': 'application/json' }, - body: JSON.stringify(formData) - }); - const result = await response.json(); - - if (!result.success) { - alert('Fehler beim Senden: ' + (result.message || 'Unbekannter Fehler')); - return; - } - } catch (error) { - alert('Netzwerkfehler beim Senden des Formulars'); - return; - } - } - - // Show success - contactForm.style.display = 'none'; - if (successMessage) successMessage.classList.add('show'); - contactForm.reset(); - }); - } -}); \ No newline at end of file diff --git a/Profice WebSite backup/scripts/scroll-header.js b/Profice WebSite backup/scripts/scroll-header.js deleted file mode 100644 index 7299505..0000000 --- a/Profice WebSite backup/scripts/scroll-header.js +++ /dev/null @@ -1,83 +0,0 @@ -// scroll-header.js -document.addEventListener("DOMContentLoaded", function() { - const topBanner = document.querySelector('.top-banner'); - const slideMenu = document.querySelector('.slide-menu'); - - if (!topBanner) return; - - // Scroll threshold to trigger the shrink effect - const scrollThreshold = 50; - let isScrolled = false; - let isTransitioning = false; - let lastScrollY = 0; - let scrollDirection = 'down'; - - function updateHeaderState(scrolled) { - if (isTransitioning) return; - - if (scrolled && !isScrolled) { - isTransitioning = true; - topBanner.classList.add('scrolled'); - isScrolled = true; - - if (slideMenu) { - slideMenu.style.top = '80px'; - } - - // Reset transition flag after animation completes - setTimeout(() => { - isTransitioning = false; - }, 250); - - } else if (!scrolled && isScrolled) { - isTransitioning = true; - topBanner.classList.remove('scrolled'); - isScrolled = false; - - if (slideMenu) { - slideMenu.style.top = '110px'; - } - - // Reset transition flag after animation completes - setTimeout(() => { - isTransitioning = false; - }, 250); - } - } - - function handleScroll() { - const currentScrollY = window.pageYOffset || document.documentElement.scrollTop; - - // Detect scroll direction - if (currentScrollY > lastScrollY) { - scrollDirection = 'down'; - } else if (currentScrollY < lastScrollY) { - scrollDirection = 'up'; - } - - // Only update when crossing threshold in the right direction - if (scrollDirection === 'down' && currentScrollY > scrollThreshold && !isScrolled) { - updateHeaderState(true); - } else if (scrollDirection === 'up' && currentScrollY <= scrollThreshold && isScrolled) { - updateHeaderState(false); - } - - lastScrollY = currentScrollY; - } - - // Use requestAnimationFrame for smooth scroll handling - let ticking = false; - function requestTick() { - if (!ticking) { - requestAnimationFrame(handleScroll); - ticking = true; - setTimeout(() => { ticking = false; }, 16); // ~60fps - } - } - - // Optimized scroll event listener - window.addEventListener('scroll', requestTick, { passive: true, capture: false }); - - // Initial check - handleScroll(); -}); diff --git a/Profice WebSite backup/sites/automatisation.html b/Profice WebSite backup/sites/automatisation.html deleted file mode 100644 index 9111066..0000000 --- a/Profice WebSite backup/sites/automatisation.html +++ /dev/null @@ -1,213 +0,0 @@ - - - - - - Profice - Automatisierung - - - - - - -
-
- -
-
- -
-
- - -
-
- - - - - -
- - -
-
- -
-
⚙️
-

Automatisierung

-

Sparen Sie Zeit und Ressourcen durch intelligente Workflow-Automatisierungen

-
- - -
-

Unsere Automatisierungslösungen

-

- Wir automatisieren Ihre Geschäftsprozesse, um Effizienz zu steigern und menschliche Fehler zu reduzieren. - Von einfachen wiederkehrenden Aufgaben bis zu komplexen Workflow-Integrationen - wir finden die optimale Lösung. -

-
- - -
-

Was wir automatisieren können

-
-
-
📧
-

E-Mail-Automatisierung

-

Automatische Antwortverwaltung und E-Mail-Kampagnen

-
-
-
📄
-

Datenverarbeitung

-

Automatische Datenmigration und -bereinigung

-
-
-
📋
-

Report-Generierung

-

Automatische Erstellung von Berichten und Analysen

-
-
-
🔄
-

Workflow-Integration

-

Verbindung verschiedener Systeme für nahtlose Prozesse

-
-
-
📊
-

Monitoring

-

Automatische Systemüberwachung und Alarmierung

-
-
-
🎯
-

Task-Management

-

Intelligente Aufgabenverteilung und -verfolgung

-
-
-
- - -
-

Unser Automatisierungsprozess

-
-
-
1
-
-

Prozessanalyse

-

Identifizierung von Automatisierungspotenzialen

-
-
-
-
2
-
-

Lösungsdesign

-

Entwicklung maßgeschneiderter Automatisierungslösungen

-
-
-
-
3
-
-

Implementierung

-

Setup und Konfiguration der Automatisierungstools

-
-
-
-
4
-
-

Testing

-

Gewissenhafte Tests vor der Live-Schaltung

-
-
-
-
5
-
-

Monitoring

-

Laufende Überwachung und Optimierung

-
-
-
-
- - -
-

Automatisierungstechnologien

-
-
Zapier
-
-
- - -
-

Ihre Vorteile

-
-
-
⏰️
-

Zeitersparnis

-

Bis zu 80% Zeitersparnis bei wiederkehrenden Aufgaben

-
-
-
🎯
-

Qualitätssteigerung

-

Reduzierung menschlicher Fehler und konsistente Ergebnisse

-
-
-
💰
-

Kostensenkung

-

Optimierung von Ressourcen und Betriebskosten

-
-
-
📈
-

Skalierbarkeit

-

Einfache Handhabung wachsender Geschäftsanforderungen

-
-
-
😊
-

Mitarbeiterzufriedenheit

-

Fokus auf kreative und strategische Aufgaben

-
-
- - - -
-

Bereit für mehr Effizienz?

-

Lassen Sie uns Ihre Prozesse analysieren und Potenziale identifizieren.

-
- Automatisierungs-Analyse - Mehr erfahren -
-
- -
- - - - - - diff --git a/Profice WebSite backup/sites/ki-integration.html b/Profice WebSite backup/sites/ki-integration.html deleted file mode 100644 index 77f9ba1..0000000 --- a/Profice WebSite backup/sites/ki-integration.html +++ /dev/null @@ -1,217 +0,0 @@ - - - - - - Profice - KI Integration - - - - - - -
-
- -
-
- -
-
- - -
-
- - - - - -
- - -
-
- -
-
🤖
-

KI Integration

-

Nutzen Sie die Kraft künstlicher Intelligenz, um Ihre Daten besser zu verstehen und Prozesse zu optimieren

-
- - -
-

Unsere KI-Dienstleistungen

-

- Wir integrieren künstliche Intelligenz in Ihre Geschäftsprozesse, um Effizienz zu steigern und neue Möglichkeiten zu erschließen. - Von der Datenanalyse über automatisierte Prozesse bis zu intelligenten Chatbots - wir machen KI für Sie nutzbar. -

-
- - -
-

Was wir bieten

-
-
-
📊
-

Datenanalyse

-

Intelligente Auswertung Ihrer Geschäftsdaten für bessere Entscheidungen

-
-
-
🤖
-

Chatbots

-

24/7 Kundenbetreuung und automatisierte Kommunikation

-
-
-
⚙️
-

Prozessautomatisierung

-

Automatisierung wiederkehrender Aufgaben zur Effizienzsteigerung

-
-
-
🔍
-

Bilderkennung

-

Automatische Analyse von Bildern und Dokumenten

-
-
-
📈
-

Vorhersagemodelle

-

Prognosen für Trends und Geschäftsentwicklungen

-
-
-
🎯
-

Personalisierung

-

Individuelle KI-Lösungen für Ihre spezifischen Bedürfnisse

-
-
-
- - -
-

Unser KI-Integrationsprozess

-
-
-
1
-
-

Analyse & Potenzial

-

Identifizierung von KI-Einsatzmöglichkeiten in Ihrem Unternehmen

-
-
-
-
2
-
-

Datenstrategie

-

Planung der Datenerfassung und -verarbeitung

-
-
-
-
3
-
-

Modellentwicklung

-

Training oder Auswahl passender KI-Modelle

-
-
-
-
4
-
-

Integration

-

Nahtlose Anbindung an Ihre bestehenden Systeme

-
-
-
-
5
-
-

Optimierung

-

Kontinuierliche Verbesserung der KI-Modelle

-
-
-
-
- - -
-

KI-Technologien

-
-
TensorFlow
-
PyTorch
-
Scikit-learn
-
OpenAI API
-
Google Cloud AI
-
Azure ML
-
AWS SageMaker
-
Hugging Face
-
LangChain
-
Dialogflow
-
-
- - -
-

Anwendungsfälle

-
-
-

Kundenservice

-

Intelligente Chatbots für 24/7 Unterstützung

-
-
-

Vertrieb

-

Predictive Lead Scoring und Verkaufsoptimierung

-
-
-

Marketing

-

Personalisierte Kampagnen und Content-Optimierung

-
-
-

Finanzen

-

Betrugsprüfung und Risikoanalyse

-
-
-

Produktion

-

Qualitätssicherung und Predictive Maintenance

-
-
-
- - -
-

Bereit für KI in Ihrem Unternehmen?

-

Lassen Sie uns die Potenziale für Ihr Unternehmen analysieren.

-
- KI-Analyse anfordern - Mehr erfahren -
-
-
-
- - - - - - diff --git a/Profice WebSite backup/sites/leads.html b/Profice WebSite backup/sites/leads.html deleted file mode 100644 index 78cfd8b..0000000 --- a/Profice WebSite backup/sites/leads.html +++ /dev/null @@ -1,117 +0,0 @@ - - - - - - Profice - Leads Dashboard - - - - - - -
-
- -
-
- -
-
- - -
-
- - - - - -
- - -
- -
-

Meine Anfragen

-

Übersicht Ihrer aktuellen Projektanfragen

- -
- - - - - - - - - - - - -
DatumDienstleistungStatusAktion
-
-
- - -
-

Andere Angebote von uns

-

Entdecken Sie weitere Dienstleistungen

- -
-
-
🔍
-

SEO Optimierung

-

Verbessern Sie Ihre Sichtbarkeit in Suchmaschinen und erreichen Sie mehr Kunden online.

- Details ansehen -
- -
-
☁️
-

Cloud Migration

-

Modernisieren Sie Ihre IT-Infrastruktur mit sicheren und skalierbaren Cloud-Lösungen.

- Details ansehen -
- -
-
📊
-

Datenanalyse

-

Gewinnen Sie wertvolle Einblicke aus Ihren Daten mit unseren Analyse-Lösungen.

- Details ansehen -
-
-
-
- - - - - - diff --git a/Profice WebSite backup/sites/login.html b/Profice WebSite backup/sites/login.html deleted file mode 100644 index 67c8da8..0000000 --- a/Profice WebSite backup/sites/login.html +++ /dev/null @@ -1,138 +0,0 @@ - - - - - - Profice - Anmeldung - - - - - - -
-
- -
-
- -
-
- - -
-
- - - - - -
- - -
-
- - - - - - - - - - -
-
✅
-

Erfolgreich angemeldet!

-

Sie werden weitergeleitet...

-
- -
-
❌
-

Anmeldung fehlgeschlagen

-

Bitte überprüfen Sie Ihre Anmeldedaten.

-
-
-
- - - - - - - diff --git a/Profice WebSite backup/sites/offers.html b/Profice WebSite backup/sites/offers.html deleted file mode 100644 index 16a42c3..0000000 --- a/Profice WebSite backup/sites/offers.html +++ /dev/null @@ -1,114 +0,0 @@ - - - - - - Profice - - - - - -
-
- -
-
- -
-
- - -
-
- - - - - -
- - -
-
-

Kontaktieren Sie uns

- -
-
- - -
- -
- - -
- -
- - -
- -
- - -
- -
- - -
- -
- - -
- - -
- -
-

Vielen Dank!

-

Ihre Anfrage wurde erfolgreich gesendet. Wir melden uns bald bei Ihnen.

-
-
-
- - - - - - \ No newline at end of file diff --git a/Profice WebSite backup/sites/register.html b/Profice WebSite backup/sites/register.html deleted file mode 100644 index df45d01..0000000 --- a/Profice WebSite backup/sites/register.html +++ /dev/null @@ -1,174 +0,0 @@ - - - - - - Registrierung - Profice - - - - - - -
-
- -
-
- -
-
- - -
-
- - - - - -
- - -
-
- - - - - - - - - - -
-
✅
-

Registrierung erfolgreich!

-

Ihr Konto wurde erstellt. Sie werden weitergeleitet...

-
- -
-
❌
-

Registrierung fehlgeschlagen

-

Bitte überprüfen Sie Ihre Eingaben.

-
-
-
- - - - - - - diff --git a/Profice WebSite backup/sites/website.html b/Profice WebSite backup/sites/website.html deleted file mode 100644 index 996b65f..0000000 --- a/Profice WebSite backup/sites/website.html +++ /dev/null @@ -1,191 +0,0 @@ - - - - - - Profice - Website Entwicklung - - - - - - -
-
- -
-
- -
-
- - -
-
- - - - - -
- - -
-
- -
-
🌐
-

Website Entwicklung

-

Moderne, responsive Webseiten, die konvertieren und Ihre Marke perfekt repräsentieren

-
- - -
-

Unsere Webentwicklungsdienstleistungen

-

- Wir entwickeln maßgeschneiderte Websites, die nicht nur gut aussehen, sondern auch Ergebnisse liefern. - Von der Konzeption über das Design bis zur Implementierung und Wartung begleiten wir Sie durch den gesamten Prozess. -

-
- - -
-

Was wir bieten

-
-
-
🎨
-

Responsive Design

-

Perfekte Darstellung auf allen Geräten - von Desktop bis Mobile

-
-
-
⚡
-

Performance-Optimierung

-

Schnelle Ladezeiten und beste Nutzererfahrung

-
-
-
🔒
-

SEO-Freundlich

-

Technische Grundlagen für gute Suchmaschinenplatzierungen

-
-
-
🔧
-

CMS-Integration

-

Einfache Content-Verwaltung für Ihre Mitarbeiter

-
-
-
🛡️
-

Sicherheit

-

Schutz vor Bedrohungen und sichere Datenverarbeitung

-
-
-
📊
-

Analytics & Tracking

-

Detaillierte Auswertung Ihrer Website-Performance

-
-
-
- - -
-

Unser Prozess

-
-
-
1
-
-

Analyse & Konzeption

-

Wir verstehen Ihre Ziele und entwickeln eine passende Strategie

-
-
-
-
2
-
-

Design & Prototyping

-

Visuelle Konzepte und interaktive Prototypen

-
-
-
-
3
-
-

Entwicklung

-

Saubere, performante Code-Implementierung

-
-
-
-
4
-
-

Testing & Launch

-

Gewissenhafte Tests und erfolgreicher Start

-
-
-
-
5
-
-

Support & Wartung

-

Laufende Optimierung und technische Unterstützung

-
-
-
-
- - -
-

Technologien

-
-
HTML5
-
CSS3
-
JavaScript
-
React
-
Vue.js
-
Angular
-
Node.js
-
PHP
-
WordPress
-
Shopify
-
WooCommerce
-
-
- - -
-

Bereit für Ihre neue Website?

-

Lassen Sie uns Ihr Projekt an und wir erstellen ein maßgeschneidertes Angebot.

-
- Projekt starten - Mehr erfahren -
-
-
-
- - - - - - diff --git a/Profice WebSite backup/style/cookie-consent.css b/Profice WebSite backup/style/cookie-consent.css deleted file mode 100644 index 4cefaca..0000000 --- a/Profice WebSite backup/style/cookie-consent.css +++ /dev/null @@ -1,307 +0,0 @@ -/* Cookie Consent System - Matches Profice Design System */ - -/* Cookie Banner */ -.cookie-banner { - position: fixed; - bottom: 0; - left: 0; - right: 0; - background: var(--primary-light); - border-top: 1px solid var(--primary-mid); - padding: 20px 40px; - z-index: 10000; - box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.1); - transform: translateY(100%); - transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); -} - -.cookie-banner.show { - transform: translateY(0); -} - -.cookie-banner-content { - max-width: 1200px; - margin: 0 auto; - display: flex; - align-items: center; - justify-content: space-between; - gap: 30px; -} - -.cookie-text { - flex: 1; - color: var(--primary-dark); - font-size: 14px; - line-height: 1.5; -} - -.cookie-text h3 { - margin: 0 0 8px 0; - font-size: 16px; - font-weight: 600; - color: var(--primary-dark); -} - -.cookie-text p { - margin: 0; - opacity: 0.8; -} - -.cookie-text a { - color: var(--accent-teal); - text-decoration: none; - font-weight: 500; -} - -.cookie-text a:hover { - text-decoration: underline; -} - -.cookie-buttons { - display: flex; - gap: 12px; - align-items: center; -} - -.cookie-btn { - padding: 10px 20px; - border: none; - border-radius: 8px; - font-size: 14px; - font-weight: 500; - cursor: pointer; - transition: all 0.3s ease; - text-decoration: none; - display: inline-block; -} - -.cookie-btn-primary { - background: var(--primary-dark); - color: var(--primary-light); -} - -.cookie-btn-primary:hover { - background: var(--primary-mid); - transform: translateY(-1px); -} - -.cookie-btn-secondary { - background: transparent; - color: var(--primary-dark); - border: 2px solid var(--primary-mid); -} - -.cookie-btn-secondary:hover { - background: var(--primary-mid); - color: var(--primary-light); -} - -.cookie-btn-settings { - background: transparent; - color: var(--accent-teal); - border: none; - text-decoration: underline; - font-size: 14px; - padding: 5px 0; -} - -.cookie-btn-settings:hover { - color: var(--primary-dark); -} - -/* Cookie Settings Modal */ -.cookie-modal { - position: fixed; - top: 0; - left: 0; - right: 0; - bottom: 0; - background: rgba(0, 0, 0, 0.5); - z-index: 10001; - display: flex; - align-items: center; - justify-content: center; - opacity: 0; - visibility: hidden; - transition: all 0.3s ease; -} - -.cookie-modal.show { - opacity: 1; - visibility: visible; -} - -.cookie-modal-content { - background: var(--primary-light); - border-radius: 12px; - padding: 30px; - max-width: 600px; - width: 90%; - max-height: 80vh; - overflow-y: auto; - transform: scale(0.9); - transition: transform 0.3s ease; -} - -.cookie-modal.show .cookie-modal-content { - transform: scale(1); -} - -.cookie-modal-header { - display: flex; - justify-content: space-between; - align-items: center; - margin-bottom: 20px; - padding-bottom: 15px; - border-bottom: 1px solid var(--primary-mid); -} - -.cookie-modal-title { - font-size: 20px; - font-weight: 600; - color: var(--primary-dark); - margin: 0; -} - -.cookie-modal-close { - background: none; - border: none; - font-size: 24px; - color: var(--primary-mid); - cursor: pointer; - padding: 0; - width: 30px; - height: 30px; - display: flex; - align-items: center; - justify-content: center; - border-radius: 50%; - transition: all 0.3s ease; -} - -.cookie-modal-close:hover { - background: var(--primary-mid); - color: var(--primary-light); -} - -.cookie-option { - margin-bottom: 20px; - padding: 15px; - border: 1px solid var(--primary-mid); - border-radius: 8px; - background: rgba(255, 255, 255, 0.5); -} - -.cookie-option-header { - display: flex; - align-items: center; - justify-content: space-between; - margin-bottom: 8px; -} - -.cookie-option-title { - font-weight: 600; - color: var(--primary-dark); - margin: 0; -} - -.cookie-option-description { - color: var(--primary-mid); - font-size: 14px; - line-height: 1.4; - margin: 0; -} - -.cookie-toggle { - position: relative; - width: 50px; - height: 26px; - background: var(--primary-mid); - border-radius: 13px; - cursor: pointer; - transition: background 0.3s ease; -} - -.cookie-toggle.active { - background: var(--accent-teal); -} - -.cookie-toggle-slider { - position: absolute; - top: 3px; - left: 3px; - width: 20px; - height: 20px; - background: white; - border-radius: 50%; - transition: transform 0.3s ease; -} - -.cookie-toggle.active .cookie-toggle-slider { - transform: translateX(24px); -} - -.cookie-toggle.disabled { - opacity: 0.5; - cursor: not-allowed; -} - -.cookie-modal-footer { - display: flex; - justify-content: flex-end; - gap: 12px; - margin-top: 25px; - padding-top: 20px; - border-top: 1px solid var(--primary-mid); -} - -/* Responsive Design */ -@media (max-width: 768px) { - .cookie-banner { - padding: 15px 20px; - } - - .cookie-banner-content { - flex-direction: column; - gap: 20px; - text-align: center; - } - - .cookie-buttons { - flex-direction: column; - width: 100%; - gap: 10px; - } - - .cookie-btn { - width: 100%; - text-align: center; - } - - .cookie-modal-content { - padding: 20px; - margin: 20px; - } - - .cookie-modal-footer { - flex-direction: column; - } - - .cookie-btn { - width: 100%; - } -} - -@media (max-width: 480px) { - .cookie-text h3 { - font-size: 14px; - } - - .cookie-text p { - font-size: 13px; - } - - .cookie-modal-content { - padding: 15px; - } -} diff --git a/Profice WebSite backup/style/cursor.css b/Profice WebSite backup/style/cursor.css deleted file mode 100644 index f757c04..0000000 --- a/Profice WebSite backup/style/cursor.css +++ /dev/null @@ -1,98 +0,0 @@ -/* cursor.css */ - -/* Default: System cursor (not custom) */ -body, -html, -a, -button, -input, -textarea, -select, -.menu-toggle, -label { - cursor: auto !important; -} - -/* Custom cursor only when enabled */ -body:not(.system-cursor), -body:not(.system-cursor) a, -body:not(.system-cursor) button, -body:not(.system-cursor) input, -body:not(.system-cursor) textarea, -body:not(.system-cursor) select, -body:not(.system-cursor) .menu-toggle, -body:not(.system-cursor) label { - cursor: none !important; -} - -#venom-cursor { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - pointer-events: none; - z-index: 9999; - mix-blend-mode: normal; - display: none; /* Hidden by default */ -} - -/* Show custom cursor only when not system cursor */ -body:not(.system-cursor) #venom-cursor { - display: block; -} - -@media (pointer: coarse) { - body, html, a, button, input, textarea, select { - cursor: auto !important; - } - - #venom-cursor { - display: none; - } -} - -body.system-cursor, -body.system-cursor * { - cursor: auto !important; -} - -body.system-cursor #venom-cursor { - display: none !important; - opacity: 0; - pointer-events: none; -} - -#cursorToggle { - display: flex; - align-items: center; - justify-content: center; - background: transparent; - border: 2px solid var(--primary-dark); - color: var(--primary-dark); - width: 45px; - height: 45px; - border-radius: 12px; - cursor: auto; /* Use system cursor for toggle button */ - transition: all 0.3s ease; - font-size: 20px; -} - -#cursorToggle:hover { - background: var(--primary-dark); - color: var(--primary-light); -} - -body:not(.system-cursor) #cursorToggle { - cursor: none; /* Use custom cursor when custom is enabled */ -} - -.top-banner.dark-theme #cursorToggle { - border-color: var(--primary-light); - color: var(--primary-light); -} - -.top-banner.dark-theme #cursorToggle:hover { - background: var(--primary-light); - color: var(--primary-dark); -} \ No newline at end of file diff --git a/Profice WebSite backup/style/design.css b/Profice WebSite backup/style/design.css deleted file mode 100644 index 6d689e6..0000000 --- a/Profice WebSite backup/style/design.css +++ /dev/null @@ -1,1042 +0,0 @@ -:root { - --primary-dark: #4F4747; - --primary-light: #EBEBDE; - --primary-mid: #777764; - --accent-orange: #F57C00; - --accent-teal: #26A69A; - --accent-green: #66BB6A; -} - -* { - margin: 0; - padding: 0; - box-sizing: border-box; - font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; -} - -body { - background-color: var(--primary-light); - color: var(--primary-dark); - min-height: 100vh; -} - -/* Top Banner */ -.top-banner { - background-color: var(--primary-light); - color: var(--primary-dark); - padding: 5px 40px; - height: 90px; - display: flex; - align-items: center; - justify-content: space-between; - position: sticky; - top: 0; - z-index: 1001; - border-bottom: 1px solid #4f47471a; - transition: height 0.25s cubic-bezier(0.4, 0, 0.2, 1), - padding 0.25s cubic-bezier(0.4, 0, 0.2, 1); - will-change: height, padding; - transform: translateZ(0); - backface-visibility: hidden; - contain: layout style paint; -} - -.top-banner-left { - display: flex; - align-items: center; - flex: 1; -} - -.top-banner-center { - display: flex; - justify-content: center; - flex: 2; -} - -.top-banner-right { - display: flex; - justify-content: flex-end; - flex: 1; -} - -.top-banner.scrolled { - padding: 2px 30px; - height: 60px; -} - -.top-banner.scrolled .menu-toggle, -.top-banner.scrolled #cursorToggle { - width: 35px; - height: 35px; -} - -.top-banner.scrolled .opening-hours { - font-size: 12px; - padding: 8px 15px; -} - -.banner-left { - display: flex; - align-items: center; - gap: 15px; -} - -.banner-left #cursorToggle { - margin-right: 15px; -} - -.search-container { - display: flex; - align-items: center; - background: rgba(255, 255, 255, 0.1); - border: 1px solid rgba(255, 255, 255, 0.2); - border-radius: 25px; - padding: 8px 8px 8px 15px; - transition: all 0.3s ease; - order: 1; - width: 250px; -} - -.search-container:hover { - background: rgba(255, 255, 255, 0.15); - border-color: rgba(255, 255, 255, 0.3); -} - -.search-container form { - display: flex; - align-items: center; - width: 100%; -} - -.search-field { - background: transparent; - border: none; - color: white; - font-size: 14px; - width: 100%; - outline: none; - padding: 0; - margin-right: 8px; -} - -.search-field::placeholder { - color: rgba(255, 255, 255, 0.7); -} - -.search-field:focus::placeholder { - color: rgba(255, 255, 255, 0.5); -} - -.search-btn { - background: rgba(255, 255, 255, 0.2); - border: none; - color: white; - cursor: pointer; - padding: 6px; - display: flex; - align-items: center; - justify-content: center; - transition: background 0.3s ease; - border-radius: 50%; - flex-shrink: 0; -} - -.search-btn:hover { - background: rgba(255, 255, 255, 0.3); -} - -.search-container { - display: flex; - align-items: center; - background: rgba(255, 255, 255, 0.1); - border: 1px solid rgba(255, 255, 255, 0.2); - border-radius: 25px; - padding: 8px 8px 8px 15px; - transition: all 0.3s ease; - order: 1; - width: 250px; -} - -.search-container:hover { - background: rgba(255, 255, 255, 0.15); - border-color: rgba(255, 255, 255, 0.3); -} - -.search-container form { - display: flex; - align-items: center; - width: 100%; -} - -.search-field { - background: transparent; - border: none; - color: white; - font-size: 14px; - width: 100%; - outline: none; - padding: 0; - margin-right: 8px; -} - -.search-field::placeholder { - color: rgba(255, 255, 255, 0.7); -} - -.search-field:focus::placeholder { - color: rgba(255, 255, 255, 0.5); -} - -.search-btn { - background: rgba(255, 255, 255, 0.2); - border: none; - color: white; - cursor: pointer; - padding: 6px; - display: flex; - align-items: center; - justify-content: center; - transition: background 0.3s ease; - border-radius: 50%; - flex-shrink: 0; -} - -.search-btn:hover { - background: rgba(255, 255, 255, 0.3); -} - -.main-nav { - display: flex; - align-items: center; - gap: 25px; -} - -.nav-link { - text-decoration: none; - color: white; - font-weight: 500; - font-size: 18px; - padding: 8px 12px; - border-radius: 8px; - transition: color 0.3s ease, transform 0.2s ease, background 0.3s ease; - position: relative; -} - -.nav-link:hover { - color: white; - transform: translateY(-2px); - background: rgba(255, 255, 255, 0.1); -} - -.nav-link::after { - content: ''; - position: absolute; - bottom: -5px; - left: 0; - width: 0; - height: 2px; - background: var(--accent-teal); - transition: width 0.3s ease; -} - -.nav-link:hover::after { - width: 100%; -} - -.logo-link { - text-decoration: none; - display: flex; - align-items: center; - gap: 0; - margin-left: 0; - margin-right: 15px; -} - -.logo { - height: 50px; - width: auto; - transition: height 0.25s cubic-bezier(0.4, 0, 0.2, 1); - will-change: height; -} - -.top-banner.scrolled .logo { - height: 35px; -} - -.opening-hours { - font-size: 14px; - color: var(--primary-mid); - background: rgba(79, 71, 71, 0.08); - padding: 10px 20px; - border-radius: 25px; - transition: font-size 0.25s cubic-bezier(0.4, 0, 0.2, 1), padding 0.25s cubic-bezier(0.4, 0, 0.2, 1); - will-change: font-size, padding; -} - -.menu-toggle { - background: transparent; - border: 2px solid var(--primary-dark); - color: var(--primary-dark); - width: 45px; - height: 45px; - border-radius: 12px; - cursor: pointer; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - gap: 5px; - transition: background 0.3s ease, color 0.3s ease, width 0.25s cubic-bezier(0.4, 0, 0.2, 1), height 0.25s cubic-bezier(0.4, 0, 0.2, 1); - will-change: width, height; -} - -#cursorToggle { - background: transparent; - border: 2px solid var(--primary-dark); - color: var(--primary-dark); - width: 60px; - height: 60px; - border-radius: 12px; - cursor: pointer; - display: flex; - align-items: center; - justify-content: center; - padding: 0; - transition: width 0.25s cubic-bezier(0.4, 0, 0.2, 1), height 0.25s cubic-bezier(0.4, 0, 0.2, 1), background 0.3s ease, border-color 0.3s ease; - will-change: width, height; -} - -.cursor-icon { - width: 60px; - height: 60px; - object-fit: contain; - transition: opacity 0.3s ease; - opacity: 1 !important; - filter: none !important; -} - -#cursorToggle:hover { - background: var(--primary-dark); -} - -#cursorToggle:hover .cursor-icon { - filter: brightness(0) invert(1) !important; - opacity: 1 !important; -} - -.menu-toggle:hover { - background: var(--primary-dark); -} - -.menu-toggle:hover span { - background: var(--primary-light); -} - -.menu-toggle span { - display: block; - width: 20px; - height: 2px; - background: var(--primary-dark); - border-radius: 2px; - transition: all 0.3s ease; -} - -.menu-toggle.active { - background: var(--primary-dark); -} - -.menu-toggle.active span { - background: var(--primary-light); -} - -.menu-toggle.active span:nth-child(1) { - transform: rotate(45deg) translate(5px, 5px); -} - -.menu-toggle.active span:nth-child(2) { - opacity: 0; -} - -.menu-toggle.active span:nth-child(3) { - transform: rotate(-45deg) translate(5px, -5px); -} - -/* Slide Menu */ -.slide-menu { - position: fixed; - top: 110px; - left: -280px; - width: 280px; - background: white; - box-shadow: 4px 0 25px rgba(79, 71, 71, 0.15); - border-radius: 0 20px 20px 0; - padding: 30px 0; - transition: left 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), top 0.3s ease; - z-index: 1000; -} - -.top-banner.scrolled ~ .slide-menu, -.top-banner.scrolled + .overlay + .slide-menu { - top: 80px; -} - -.slide-menu.active { - left: 0; -} - -.slide-menu a { - display: block; - padding: 18px 30px; - color: var(--primary-dark); - text-decoration: none; - font-size: 17px; - font-weight: 500; - transition: all 0.3s ease; - border-left: 4px solid transparent; -} - -.slide-menu a:hover { - background: var(--primary-light); - border-left-color: var(--accent-teal); - padding-left: 40px; - color: var(--accent-teal); -} - -.slide-menu a.active { - background: var(--primary-light); - border-left-color: var(--accent-teal); - color: var(--accent-teal); -} - -/* Main Content */ -.main-content { - max-width: 700px; - margin: 50px auto; - padding: 110px 20px 20px 20px; - transition: padding-top 0.2s ease-out; -} - -.form-container { - background: white; - padding: 45px; - border-radius: 24px; - box-shadow: 0 15px 50px rgba(79, 71, 71, 0.1); -} - -.form-title { - color: var(--primary-dark); - font-size: 28px; - margin-bottom: 35px; - text-align: center; - font-weight: 600; -} - -.form-group { - margin-bottom: 24px; -} - -.form-group label { - display: block; - margin-bottom: 8px; - color: var(--primary-mid); - font-weight: 500; - font-size: 14px; -} - -.form-group input, -.form-group textarea, -.form-group select { - width: 100%; - padding: 14px 18px; - border: 2px solid rgba(119, 119, 100, 0.2); - border-radius: 14px; - font-size: 16px; - transition: all 0.3s ease; - background: var(--primary-light); - color: var(--primary-dark); -} - -.form-group input:focus, -.form-group textarea:focus, -.form-group select:focus { - outline: none; - border-color: var(--accent-teal); - background: white; - box-shadow: 0 0 0 4px rgba(38, 166, 154, 0.15); -} - -.form-group textarea { - min-height: 120px; - resize: vertical; -} - -.form-group select { - cursor: pointer; - appearance: none; - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%234F4747' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E"); - background-repeat: no-repeat; - background-position: right 14px center; - background-size: 18px; -} - -.submit-btn { - width: 100%; - padding: 16px; - background: var(--accent-teal); - color: white; - border: none; - border-radius: 25px; - font-size: 17px; - font-weight: 600; - cursor: pointer; - transition: all 0.3s ease; - text-transform: uppercase; - letter-spacing: 1px; -} - -.submit-btn:hover { - transform: translateY(-2px); - box-shadow: 0 8px 25px rgba(38, 166, 154, 0.35); - background: #1e8e82; -} - -.submit-btn:active { - transform: translateY(0); -} - -/* Login Button Styles */ -.login-btn { - background: transparent; - border: 2px solid white; - color: white; - padding: 8px 16px; - border-radius: 8px; - font-size: 14px; - font-weight: 500; - cursor: pointer; - transition: all 0.3s ease; - display: inline-flex; - align-items: center; - gap: 8px; - text-decoration: none; - position: relative; - z-index: 10; - pointer-events: auto; -} - -.login-btn:hover { - background: white; - color: var(--primary-dark); - transform: translateY(-2px); -} - -.register-btn { - background: transparent; - border: 2px solid var(--primary-dark); - color: var(--primary-dark); - padding: 8px 16px; - border-radius: 8px; - font-size: 14px; - font-weight: 500; - cursor: pointer; - transition: all 0.3s ease; - display: inline-flex; - align-items: center; - gap: 8px; -} - -.register-btn:hover { - background: var(--primary-dark); - color: white; - transform: translateY(-2px); -} - -/* Top Banner Right Layout */ -.top-banner-right { - display: flex; - justify-content: flex-end; - align-items: center; - gap: 15px; - flex: 1; - position: relative; - z-index: 10; -} - -/* Service Details Buttons */ -.service-details { - display: flex; - gap: 15px; - margin-top: 15px; - flex-wrap: wrap; - justify-content: center; -} - -.service-btn { - padding: 12px 24px; - background: var(--accent-teal); - color: white; - text-decoration: none; - border-radius: 25px; - font-size: 14px; - font-weight: 500; - transition: all 0.3s ease; - display: inline-block; -} - -.service-btn:hover { - background: white; - color: var(--accent-teal); - transform: translateY(-2px); - box-shadow: 0 6px 20px rgba(38, 166, 154, 0.3); -} - -/* Success Message */ -.success-message { - display: none; - text-align: center; - padding: 30px; - color: var(--accent-teal); -} - -.success-message.show { - display: block; -} - -.success-message h3 { - font-size: 24px; - margin-bottom: 10px; -} - -/* Overlay */ -.overlay { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: rgba(79, 71, 71, 0.3); - opacity: 0; - visibility: hidden; - transition: all 0.3s ease; - z-index: 999; -} - -.overlay.active { - opacity: 1; - visibility: visible; -} - -@media (max-width: 600px) { - .top-banner { - flex-direction: column; - gap: 15px; - text-align: center; - padding: 15px 20px; - } - - .banner-left { - width: 100%; - justify-content: center; - } - - .form-container { - padding: 25px; - } - - .logo { - height: 100px; - width: auto; - } -} - -/* ADDITIONS FOR HOME PAGE & DARK HEADER */ - - -/* 1. Dark Header Theme */ -.top-banner.dark-theme { - background-color: var(--primary-dark); - color: var(--primary-light); - border-bottom: 1px solid rgba(235, 235, 222, 0.1); -} - -.top-banner.dark-theme .company-name { - color: var(--primary-light); -} - -.top-banner.dark-theme .opening-hours { - background: rgba(235, 235, 222, 0.1); - color: var(--primary-light); -} - -.top-banner.dark-theme .menu-toggle { - border-color: var(--primary-light); -} - -.top-banner.dark-theme .menu-toggle span { - background: var(--primary-light); -} - -.top-banner.dark-theme .menu-toggle:hover { - background: var(--primary-light); -} - -.top-banner.dark-theme .menu-toggle:hover span { - background: var(--primary-dark); -} - -/* 2. Home Page Layout */ -.home-content { - max-width: 1200px; - margin: 0 auto; - padding: 110px 20px 20px 20px; - transition: padding-top 0.2s ease-out; -} - -/* Hero Section */ -.hero-section { - display: flex; - align-items: center; - justify-content: space-between; - padding: 80px 20px; - gap: 40px; - min-height: 80vh; -} - -.hero-text { - flex: 1; - max-width: 600px; -} - -.hero-text h1 { - font-size: 48px; - line-height: 1.2; - margin-bottom: 24px; - color: var(--primary-dark); - font-weight: 700; -} - -.hero-text p { - font-size: 18px; - line-height: 1.6; - margin-bottom: 35px; - color: var(--primary-mid); -} - -.hero-buttons { - display: flex; - gap: 15px; -} - -.cta-btn { - padding: 15px 30px; - border-radius: 30px; - font-size: 16px; - font-weight: 600; - text-decoration: none; - transition: all 0.3s ease; -} - -.cta-btn.primary { - background-color: var(--accent-teal); - color: white; - border: 2px solid var(--accent-teal); -} - -.cta-btn.primary:hover { - background-color: #1e8e82; - border-color: #1e8e82; - transform: translateY(-2px); - box-shadow: 0 10px 20px rgba(38, 166, 154, 0.2); -} - -.cta-btn.secondary { - background-color: transparent; - color: var(--primary-dark); - border: 2px solid var(--primary-dark); -} - -.cta-btn.secondary:hover { - background-color: var(--primary-dark); - color: var(--primary-light); -} - -.hero-image-placeholder { - flex: 1; - height: 400px; - background-color: rgba(119, 119, 100, 0.1); - border-radius: 24px; - display: flex; - align-items: center; - justify-content: center; - border: 2px dashed var(--primary-mid); - color: var(--primary-mid); -} - -/* Services Section */ -.services-section { - padding: 60px 20px; - margin-bottom: 60px; -} - -.section-title { - text-align: center; - font-size: 32px; - color: var(--primary-dark); - margin-bottom: 50px; -} - -.services-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); - gap: 30px; -} - -.service-card { - background: white; - padding: 40px; - border-radius: 24px; - box-shadow: 0 15px 50px rgba(79, 71, 71, 0.05); - transition: transform 0.3s ease; - text-align: center; -} - -.service-card:hover { - transform: translateY(-10px); -} - -.service-icon { - font-size: 48px; - margin-bottom: 20px; - color: var(--accent-teal); -} - -.service-card h3 { - font-size: 22px; - color: var(--primary-dark); - margin-bottom: 15px; -} - -.service-card p { - color: var(--primary-mid); - line-height: 1.6; -} - -/* Info Section */ -.info-section { - background-color: white; - padding: 80px 40px; - border-radius: 24px; - margin-bottom: 80px; - box-shadow: 0 15px 50px rgba(79, 71, 71, 0.05); -} - -.info-container { - display: flex; - align-items: center; - gap: 50px; -} - -.info-content { - flex: 1; -} - -.info-content h2 { - font-size: 32px; - color: var(--primary-dark); - margin-bottom: 20px; -} - -.info-content p { - color: var(--primary-mid); - font-size: 17px; - line-height: 1.6; - margin-bottom: 30px; -} - -.info-list { - list-style: none; -} - -.info-list li { - margin-bottom: 15px; - padding-left: 30px; - position: relative; - color: var(--primary-dark); - font-weight: 500; -} - -.info-list li::before { - content: "✓"; - position: absolute; - left: 0; - color: var(--accent-green); - font-weight: bold; -} - -.info-image-placeholder { - flex: 1; - height: 300px; - background-color: var(--primary-light); - border-radius: 16px; - display: flex; - align-items: center; - justify-content: center; - border: 2px dashed var(--primary-mid); - color: var(--primary-mid); -} - -/* Enterprise Section */ -.enterprise-section { - padding: 80px 20px; - background: white; - text-align: center; -} - -.enterprise-content { - max-width: 800px; - margin: 0 auto; -} - -.enterprise-features { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); - gap: 30px; - margin-top: 50px; -} - -.feature-item { - background: var(--primary-light); - padding: 30px; - border-radius: 16px; - transition: transform 0.3s ease, box-shadow 0.3s ease; -} - -.feature-item:hover { - transform: translateY(-5px); - box-shadow: 0 10px 30px rgba(79, 71, 71, 0.1); -} - -.feature-item h3 { - color: var(--accent-teal); - margin-bottom: 15px; - font-size: 20px; -} - -.feature-item p { - color: var(--primary-mid); - line-height: 1.6; -} - -/* Pricing Section */ -.pricing-section { - padding: 80px 20px; - background: var(--primary-light); - text-align: center; -} - -.pricing-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); - gap: 30px; - max-width: 1000px; - margin: 50px auto 0; -} - -.pricing-card { - background: white; - padding: 40px 30px; - border-radius: 16px; - box-shadow: 0 5px 20px rgba(79, 71, 71, 0.1); - transition: transform 0.3s ease, box-shadow 0.3s ease; -} - -.pricing-card:hover { - transform: translateY(-5px); - box-shadow: 0 15px 40px rgba(79, 71, 71, 0.15); -} - -.pricing-card.featured { - border: 2px solid var(--accent-teal); - transform: scale(1.05); -} - -.pricing-card h3 { - color: var(--primary-dark); - font-size: 24px; - margin-bottom: 20px; -} - -.price { - font-size: 36px; - font-weight: bold; - color: var(--accent-teal); - margin-bottom: 15px; -} - -.pricing-card p { - color: var(--primary-mid); - margin-bottom: 25px; -} - -.pricing-card ul { - list-style: none; - text-align: left; -} - -.pricing-card li { - padding: 8px 0; - border-bottom: 1px solid rgba(119, 119, 100, 0.1); - color: var(--primary-dark); -} - -.pricing-card li:before { - content: "✓ "; - color: var(--accent-teal); - font-weight: bold; - margin-right: 8px; -} - -/* Responsive Home */ -@media (max-width: 900px) { - .hero-section { - flex-direction: column; - text-align: center; - padding-top: 40px; - } - - .hero-text h1 { - font-size: 36px; - } - - .hero-buttons { - justify-content: center; - } - - .info-container { - flex-direction: column-reverse; - } - - .hero-image-placeholder, - .info-image-placeholder { - width: 100%; - } -} - -/* Navigation responsive */ -@media (max-width: 768px) { - .main-nav { - display: none; - } - - .top-banner { - justify-content: space-between; - } - - .banner-left { - flex: 1; - } - - .opening-hours { - display: none; - } -} \ No newline at end of file diff --git a/Profice WebSite backup/style/details.css b/Profice WebSite backup/style/details.css deleted file mode 100644 index 2e13d8c..0000000 --- a/Profice WebSite backup/style/details.css +++ /dev/null @@ -1,151 +0,0 @@ -/* Details Page Styles */ - -.service-header { - text-align: center; - margin-bottom: 40px; - padding-bottom: 30px; - border-bottom: 2px solid var(--accent-teal); -} - -.service-icon-large { - font-size: 64px; - margin-bottom: 20px; - display: block; -} - -.service-title-large { - font-size: 36px; - color: var(--primary-dark); - margin-bottom: 15px; - font-weight: 600; -} - -.service-description-large { - font-size: 18px; - color: var(--primary-mid); - line-height: 1.6; - max-width: 600px; - margin: 0 auto; -} - -.service-content { - margin-top: 40px; -} - -.service-section { - margin-bottom: 40px; - padding: 30px; - background: var(--primary-light); - border-radius: 16px; - box-shadow: 0 4px 20px rgba(79, 71, 71, 0.1); -} - -.section-title { - font-size: 24px; - color: var(--primary-dark); - margin-bottom: 20px; - font-weight: 600; -} - -.section-text { - font-size: 16px; - line-height: 1.6; - color: var(--primary-mid); - margin-bottom: 20px; -} - -.feature-list, -.benefit-list { - list-style: none; - padding: 0; - margin: 0; -} - -.feature-list li, -.benefit-list li { - padding: 12px 0; - border-bottom: 1px solid rgba(119, 119, 100, 0.1); - color: var(--primary-dark); - font-size: 16px; - position: relative; - padding-left: 30px; -} - -.feature-list li:before, -.benefit-list li:before { - content: "✓"; - position: absolute; - left: 0; - color: var(--accent-teal); - font-weight: bold; - font-size: 18px; -} - -.feature-list li:last-child, -.benefit-list li:last-child { - border-bottom: none; -} - -.cta-buttons { - display: flex; - gap: 20px; - justify-content: center; - margin-top: 30px; - flex-wrap: wrap; -} - -.back-button-container { - text-align: center; - margin-top: 40px; - padding-top: 30px; - border-top: 1px solid rgba(119, 119, 100, 0.2); -} - -.error-message { - text-align: center; - padding: 40px; -} - -.error-message h2 { - color: var(--primary-dark); - margin-bottom: 15px; -} - -.error-message p { - color: var(--primary-mid); - margin-bottom: 25px; -} - -/* Responsive Design */ -@media (max-width: 768px) { - .service-icon-large { - font-size: 48px; - } - - .service-title-large { - font-size: 28px; - } - - .service-description-large { - font-size: 16px; - } - - .service-section { - padding: 20px; - margin-bottom: 25px; - } - - .section-title { - font-size: 20px; - } - - .cta-buttons { - flex-direction: column; - align-items: center; - } - - .cta-btn { - width: 100%; - max-width: 300px; - } -} diff --git a/Profice WebSite backup/style/lead-details.css b/Profice WebSite backup/style/lead-details.css deleted file mode 100644 index 51ee4ae..0000000 --- a/Profice WebSite backup/style/lead-details.css +++ /dev/null @@ -1,408 +0,0 @@ -/* Lead Details Page Styles */ - -.lead-details-container { - max-width: 900px; - margin: 0 auto; - padding: 120px 20px 20px 20px; -} - -.lead-header { - text-align: center; - margin-bottom: 50px; - padding-bottom: 30px; - border-bottom: 3px solid var(--accent-teal); -} - -.lead-icon { - font-size: 72px; - margin-bottom: 20px; - display: block; -} - -.lead-title { - font-size: 42px; - color: var(--primary-dark); - margin-bottom: 15px; - font-weight: 600; -} - -.lead-subtitle { - font-size: 20px; - color: var(--primary-mid); - line-height: 1.6; - max-width: 600px; - margin: 0 auto; -} - -.lead-details-card { - background: white; - border-radius: 20px; - box-shadow: 0 8px 30px rgba(79, 71, 71, 0.1); - overflow: hidden; -} - -.detail-section { - padding: 40px; - border-bottom: 1px solid rgba(119, 119, 100, 0.1); -} - -.detail-section:last-child { - border-bottom: none; -} - -.section-title { - font-size: 24px; - color: var(--primary-dark); - margin-bottom: 20px; - font-weight: 600; -} - -/* Status Styles */ -.status-container { - display: flex; - align-items: center; - gap: 20px; - flex-wrap: wrap; -} - -.status-badge { - padding: 8px 16px; - border-radius: 20px; - font-size: 14px; - font-weight: 500; - display: inline-block; -} - -.status-new { - background: #e3f2fd; - color: #1976d2; -} - -.status-in-progress { - background: #fff3e0; - color: #f57c00; -} - -.status-completed { - background: #e8f5e8; - color: #2e7d32; -} - -.status-cancelled { - background: #ffebee; - color: #c62828; -} - -.status-info { - color: var(--primary-mid); - font-size: 14px; -} - -/* Info Grid */ -.info-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); - gap: 25px; -} - -.info-item { - background: var(--primary-light); - padding: 20px; - border-radius: 12px; - border-left: 4px solid var(--accent-teal); -} - -.info-label { - font-size: 14px; - color: var(--primary-mid); - margin-bottom: 8px; - font-weight: 500; -} - -.info-value { - font-size: 18px; - color: var(--primary-dark); - font-weight: 500; -} - -/* Service Info */ -.service-info { - display: flex; - align-items: center; - gap: 20px; - background: var(--primary-light); - padding: 30px; - border-radius: 16px; -} - -.service-icon { - font-size: 48px; - flex-shrink: 0; -} - -.service-details { - flex: 1; -} - -.service-title { - font-size: 24px; - color: var(--accent-teal); - margin-bottom: 10px; -} - -.service-description { - color: var(--primary-mid); - line-height: 1.5; -} - -/* Description Box */ -.description-box { - background: var(--primary-light); - padding: 30px; - border-radius: 16px; - border-left: 4px solid var(--accent-teal); -} - -.description-text { - color: var(--primary-dark); - line-height: 1.6; - font-size: 16px; - white-space: pre-wrap; -} - -/* Timeline */ -.timeline { - position: relative; - padding-left: 30px; -} - -.timeline::before { - content: ''; - position: absolute; - left: 15px; - top: 0; - bottom: 0; - width: 2px; - background: rgba(119, 119, 100, 0.2); -} - -.timeline-item { - position: relative; - margin-bottom: 30px; - padding-left: 30px; -} - -.timeline-item:last-child { - margin-bottom: 0; -} - -.timeline-dot { - position: absolute; - left: -22px; - top: 5px; - width: 12px; - height: 12px; - border-radius: 50%; - background: rgba(119, 119, 100, 0.3); - border: 2px solid white; -} - -.timeline-item.active .timeline-dot { - background: var(--accent-teal); - box-shadow: 0 0 0 4px rgba(38, 166, 154, 0.2); -} - -.timeline-content h4 { - color: var(--primary-dark); - margin-bottom: 5px; - font-size: 18px; -} - -.timeline-content p { - color: var(--primary-mid); - font-size: 14px; -} - -/* Action Buttons */ -.action-buttons { - display: flex; - gap: 15px; - flex-wrap: wrap; -} - -.action-btn { - padding: 12px 24px; - border: none; - border-radius: 8px; - font-size: 14px; - font-weight: 500; - cursor: pointer; - transition: all 0.3s ease; - display: inline-flex; - align-items: center; - gap: 8px; -} - -.action-btn.primary { - background: var(--accent-teal); - color: white; -} - -.action-btn.primary:hover { - background: #1e8e82; - transform: translateY(-2px); -} - -.action-btn.secondary { - background: var(--primary-light); - color: var(--primary-dark); - border: 1px solid rgba(119, 119, 100, 0.2); -} - -.action-btn.secondary:hover { - background: var(--primary-mid); - color: white; - transform: translateY(-2px); -} - -/* Navigation Buttons */ -.navigation-buttons { - display: flex; - gap: 20px; - justify-content: center; - margin-top: 40px; - flex-wrap: wrap; -} - -.cta-btn { - padding: 16px 32px; - border-radius: 30px; - font-size: 18px; - font-weight: 600; - text-decoration: none; - transition: all 0.3s ease; - display: inline-block; -} - -.cta-btn.primary { - background: var(--accent-teal); - color: white; - border: 2px solid var(--accent-teal); -} - -.cta-btn.primary:hover { - background: white; - color: var(--accent-teal); - transform: translateY(-2px); - box-shadow: 0 8px 25px rgba(38, 166, 154, 0.3); -} - -.cta-btn.secondary { - background: transparent; - color: var(--primary-dark); - border: 2px solid var(--primary-dark); -} - -.cta-btn.secondary:hover { - background: var(--primary-dark); - color: white; - transform: translateY(-2px); -} - -/* Error Message */ -.error-message { - text-align: center; - padding: 60px 20px; - background: white; - border-radius: 20px; - box-shadow: 0 8px 30px rgba(79, 71, 71, 0.1); -} - -.error-message h2 { - color: var(--primary-dark); - margin-bottom: 15px; -} - -.error-message p { - color: var(--primary-mid); - margin-bottom: 25px; -} - -/* Responsive Design */ -@media (max-width: 768px) { - .lead-details-container { - padding: 100px 15px 20px 15px; - } - - .lead-icon { - font-size: 56px; - } - - .lead-title { - font-size: 32px; - } - - .lead-subtitle { - font-size: 18px; - } - - .detail-section { - padding: 30px 20px; - } - - .section-title { - font-size: 20px; - } - - .info-grid { - grid-template-columns: 1fr; - gap: 20px; - } - - .service-info { - flex-direction: column; - text-align: center; - } - - .service-icon { - font-size: 64px; - } - - .status-container { - flex-direction: column; - align-items: flex-start; - gap: 10px; - } - - .action-buttons, - .navigation-buttons { - flex-direction: column; - align-items: center; - } - - .action-btn, - .cta-btn { - width: 100%; - max-width: 300px; - } -} - -/* Print Styles */ -@media print { - .top-banner, - .slide-menu, - .overlay, - .navigation-buttons, - .action-buttons { - display: none !important; - } - - .lead-details-container { - padding: 20px; - } - - .lead-details-card { - box-shadow: none; - border: 1px solid #ddd; - } -} diff --git a/Profice WebSite backup/style/leads.css b/Profice WebSite backup/style/leads.css deleted file mode 100644 index 017cc0c..0000000 --- a/Profice WebSite backup/style/leads.css +++ /dev/null @@ -1,219 +0,0 @@ -/* Leads Dashboard Styles */ - -.leads-content { - max-width: 900px; -} - -.dashboard-container { - background: white; - padding: 40px; - border-radius: 24px; - box-shadow: 0 15px 50px rgba(79, 71, 71, 0.1); - margin-bottom: 30px; -} - -.dashboard-title { - color: var(--primary-dark); - font-size: 28px; - margin-bottom: 8px; - font-weight: 600; -} - -.dashboard-subtitle { - color: var(--primary-mid); - font-size: 15px; - margin-bottom: 30px; -} - -/* Leads Table */ -.leads-table-wrapper { - overflow-x: auto; - border-radius: 16px; - border: 1px solid rgba(119, 119, 100, 0.15); -} - -.leads-table { - width: 100%; - border-collapse: collapse; - min-width: 500px; -} - -.leads-table thead { - background: var(--primary-light); -} - -.leads-table th { - padding: 16px 20px; - text-align: left; - font-weight: 600; - color: var(--primary-dark); - font-size: 14px; - text-transform: uppercase; - letter-spacing: 0.5px; -} - -.leads-table td { - padding: 18px 20px; - border-top: 1px solid rgba(119, 119, 100, 0.1); - color: var(--primary-dark); - font-size: 15px; -} - -.leads-table tbody tr { - transition: background 0.2s ease; -} - -.leads-table tbody tr:hover { - background: rgba(235, 235, 222, 0.5); -} - -/* Status Badges */ -.status-badge { - display: inline-block; - padding: 6px 14px; - border-radius: 20px; - font-size: 13px; - font-weight: 600; - text-transform: uppercase; - letter-spacing: 0.3px; -} - -.status-badge.completed { - background: rgba(102, 187, 106, 0.15); - color: var(--accent-green); -} - -.status-badge.in-progress { - background: rgba(245, 124, 0, 0.15); - color: var(--accent-orange); -} - -.status-badge.open { - background: rgba(119, 119, 100, 0.15); - color: var(--primary-mid); -} - -/* Action Button */ -.action-btn { - padding: 8px 16px; - background: transparent; - border: 2px solid var(--accent-teal); - color: var(--accent-teal); - border-radius: 20px; - font-size: 13px; - font-weight: 600; - cursor: pointer; - transition: all 0.3s ease; - text-decoration: none; - display: inline-block; -} - -.action-btn:hover { - background: var(--accent-teal); - color: white; -} - -/* Offers Section */ -.offers-section { - margin-top: 30px; -} - -.offers-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); - gap: 24px; -} - -.offer-card { - background: var(--primary-light); - border-radius: 20px; - padding: 30px; - text-align: center; - transition: all 0.3s ease; - cursor: pointer; -} - -.offer-card:hover { - transform: translateY(-5px); - box-shadow: 0 15px 40px rgba(79, 71, 71, 0.15); - background: white; -} - -.offer-icon { - font-size: 40px; - margin-bottom: 16px; -} - -.offer-title { - color: var(--primary-dark); - font-size: 20px; - font-weight: 600; - margin-bottom: 12px; -} - -.offer-description { - color: var(--primary-mid); - font-size: 14px; - line-height: 1.6; - margin-bottom: 20px; -} - -.offer-btn { - display: inline-block; - padding: 10px 24px; - background: var(--accent-teal); - color: white; - text-decoration: none; - border-radius: 25px; - font-size: 14px; - font-weight: 600; - transition: all 0.3s ease; -} - -.offer-btn:hover { - background: #1e8e82; - box-shadow: 0 5px 20px rgba(38, 166, 154, 0.3); -} - -/* Active menu link */ -.slide-menu a.active { - background: var(--primary-light); - border-left-color: var(--accent-teal); - color: var(--accent-teal); -} - -/* Empty state */ -.empty-state { - text-align: center; - padding: 40px; - color: var(--primary-mid); -} - -.empty-state p { - font-size: 16px; -} - -/* Responsive */ -@media (max-width: 600px) { - .dashboard-container { - padding: 25px; - } - - .dashboard-title { - font-size: 22px; - } - - .leads-table th, - .leads-table td { - padding: 12px 14px; - font-size: 13px; - } - - .offer-card { - padding: 20px; - } - - .offers-grid { - grid-template-columns: 1fr; - } -} diff --git a/Profice WebSite backup/style/login.css b/Profice WebSite backup/style/login.css deleted file mode 100644 index f877ec7..0000000 --- a/Profice WebSite backup/style/login.css +++ /dev/null @@ -1,547 +0,0 @@ -/* Login Page Styles */ - -.login-content { - display: flex; - align-items: center; - justify-content: center; - min-height: 100vh; - padding: 120px 20px 20px 20px; - background: linear-gradient(135deg, var(--primary-light) 0%, white 100%); -} - -.login-container { - width: 100%; - max-width: 450px; - background: white; - border-radius: 24px; - box-shadow: 0 20px 60px rgba(79, 71, 71, 0.15); - padding: 50px 40px; - position: relative; - overflow: hidden; -} - -.login-container::before { - content: ''; - position: absolute; - top: 0; - left: 0; - right: 0; - height: 4px; - background: linear-gradient(90deg, var(--accent-teal), var(--accent-green)); -} - -.login-header { - text-align: center; - margin-bottom: 40px; -} - -.login-icon { - font-size: 64px; - margin-bottom: 20px; - display: block; -} - -.login-title { - font-size: 32px; - color: var(--primary-dark); - margin-bottom: 10px; - font-weight: 600; -} - -.login-subtitle { - color: var(--primary-mid); - font-size: 16px; - line-height: 1.5; -} - -.login-form { - margin-bottom: 30px; -} - -.login-form .form-group { - position: relative; - margin-bottom: 25px; -} - -.login-form .form-group label { - display: block; - margin-bottom: 8px; - color: var(--primary-dark); - font-weight: 500; - font-size: 14px; -} - -.login-form .form-group input { - width: 100%; - padding: 14px 45px 14px 18px; - border: 2px solid rgba(119, 119, 100, 0.2); - border-radius: 12px; - font-size: 16px; - transition: all 0.3s ease; - background: var(--primary-light); - color: var(--primary-dark); - outline: none; -} - -.login-form .form-group input:focus { - border-color: var(--accent-teal); - background: white; - box-shadow: 0 0 0 4px rgba(38, 166, 154, 0.15); -} - -.input-icon { - position: absolute; - right: 18px; - top: 50%; - transform: translateY(-50%); - font-size: 20px; - color: var(--primary-mid); - pointer-events: none; -} - -.password-toggle { - position: absolute; - right: 15px; - top: 50%; - transform: translateY(-50%); - background: none; - border: none; - color: var(--primary-mid); - cursor: pointer; - padding: 4px; - border-radius: 4px; - transition: all 0.3s ease; -} - -.password-toggle:hover { - background: rgba(119, 119, 100, 0.1); - color: var(--primary-dark); -} - -.form-options { - display: flex; - justify-content: space-between; - align-items: center; - margin-bottom: 30px; - font-size: 14px; -} - -.checkbox-label { - display: flex; - align-items: center; - cursor: pointer; - color: var(--primary-dark); -} - -.checkbox-label input[type="checkbox"] { - display: none; -} - -.checkbox-custom { - width: 18px; - height: 18px; - border: 2px solid rgba(119, 119, 100, 0.3); - border-radius: 4px; - margin-right: 8px; - position: relative; - transition: all 0.3s ease; -} - -.checkbox-label input[type="checkbox"]:checked + .checkbox-custom { - background: var(--accent-teal); - border-color: var(--accent-teal); -} - -.checkbox-label input[type="checkbox"]:checked + .checkbox-custom::after { - content: '✓'; - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - color: white; - font-size: 12px; - font-weight: bold; -} - -.forgot-password { - color: var(--accent-teal); - text-decoration: none; - font-weight: 500; - transition: color 0.3s ease; -} - -.forgot-password:hover { - color: var(--primary-dark); -} - -.login-btn-submit { - width: 100%; - padding: 16px; - background: var(--accent-teal); - color: white; - border: none; - border-radius: 12px; - font-size: 16px; - font-weight: 600; - cursor: pointer; - transition: all 0.3s ease; - display: flex; - align-items: center; - justify-content: center; - gap: 8px; -} - -.login-btn-submit:hover:not(:disabled) { - background: #1e8e82; - transform: translateY(-2px); - box-shadow: 0 8px 25px rgba(38, 166, 154, 0.3); -} - -.login-btn-submit:disabled { - opacity: 0.7; - cursor: not-allowed; -} - -.btn-loading svg { - animation: spin 1s linear infinite; -} - -@keyframes spin { - from { transform: rotate(0deg); } - to { transform: rotate(360deg); } -} - -.login-divider { - text-align: center; - margin: 30px 0; - position: relative; -} - -.login-divider::before { - content: ''; - position: absolute; - top: 50%; - left: 0; - right: 0; - height: 1px; - background: rgba(119, 119, 100, 0.2); -} - -.login-divider span { - background: white; - padding: 0 20px; - color: var(--primary-mid); - font-size: 14px; - position: relative; -} - -.social-login { - margin-bottom: 30px; -} - -.social-btn { - width: 100%; - padding: 14px; - border: 2px solid rgba(119, 119, 100, 0.2); - border-radius: 12px; - background: white; - color: var(--primary-dark); - font-size: 16px; - font-weight: 500; - cursor: pointer; - transition: all 0.3s ease; - display: flex; - align-items: center; - justify-content: center; - gap: 12px; -} - -.social-btn:hover { - border-color: var(--primary-mid); - transform: translateY(-2px); - box-shadow: 0 4px 15px rgba(79, 71, 71, 0.1); -} - -.google-btn:hover { - border-color: #4285f4; - background: #f8f9fa; -} - -.login-footer { - text-align: center; - font-size: 14px; - color: var(--primary-mid); -} - -.login-footer a { - color: var(--accent-teal); - text-decoration: none; - font-weight: 500; - transition: color 0.3s ease; -} - -.login-footer a:hover { - color: var(--primary-dark); -} - -/* Messages */ -.success-message, -.error-message { - position: absolute; - top: 0; - left: 0; - right: 0; - padding: 20px; - text-align: center; - transform: translateY(-100%); - transition: transform 0.3s ease; - z-index: 10; -} - -.success-message.show, -.error-message.show { - transform: translateY(0); -} - -.success-message { - background: linear-gradient(135deg, #e8f5e8, #d4edda); - color: #2e7d32; -} - -.error-message { - background: linear-gradient(135deg, #ffebee, #f8d7da); - color: #c62828; -} - -.success-icon, -.error-icon { - font-size: 48px; - margin-bottom: 10px; - display: block; -} - -.success-message h3, -.error-message h3 { - margin-bottom: 5px; - font-size: 18px; -} - -.success-message p, -.error-message p { - margin: 0; - font-size: 14px; -} - -/* Login Button Styles */ -.login-btn { - background: transparent; - border: 2px solid var(--primary-dark); - color: var(--primary-dark); - padding: 8px 16px; - border-radius: 8px; - font-size: 14px; - font-weight: 500; - cursor: pointer; - transition: all 0.3s ease; - display: inline-flex; - align-items: center; - gap: 8px; - text-decoration: none; -} - -.login-btn:hover { - background: var(--primary-dark); - color: white; - transform: translateY(-2px); -} - -.register-btn { - background: transparent; - border: 2px solid var(--primary-dark); - color: var(--primary-dark); - padding: 8px 16px; - border-radius: 8px; - font-size: 14px; - font-weight: 500; - cursor: pointer; - transition: all 0.3s ease; - display: inline-flex; - align-items: center; - gap: 8px; -} - -.register-btn:hover { - background: var(--primary-dark); - color: white; - transform: translateY(-2px); -} - -/* Register Button (White version) */ -.login-btn.register { - background: transparent; - border: 2px solid white; - color: white; - padding: 8px 16px; - border-radius: 8px; - font-size: 14px; - font-weight: 500; - cursor: pointer; - transition: all 0.3s ease; - display: inline-flex; - align-items: center; - gap: 8px; - text-decoration: none; -} - -.login-btn.register:hover { - background: white; - color: var(--primary-dark); - transform: translateY(-2px); -} - -/* Ensure login button is white on register page */ -body .login-btn { - background: transparent !important; - border: 2px solid white !important; - color: white !important; -} - -body .login-btn:hover { - background: white !important; - color: var(--primary-dark) !important; -} - -/* Form Row for Two Columns */ -.form-row { - display: flex; - gap: 15px; - margin-bottom: 24px; -} - -.form-row .form-group { - flex: 1; - margin-bottom: 0; -} - -/* Password Strength Indicator */ -.password-strength { - margin-top: 8px; - display: flex; - align-items: center; - gap: 10px; -} - -.strength-bar { - flex: 1; - height: 4px; - background: #e0e0e0; - border-radius: 2px; - overflow: hidden; -} - -.strength-bar::before { - content: ''; - display: block; - height: 100%; - width: 0%; - transition: width 0.3s ease, background-color 0.3s ease; - background: #f44336; -} - -.strength-text { - font-size: 12px; - color: var(--primary-mid); -} - -/* Password Strength Levels */ -.strength-weak .strength-bar::before { - width: 33%; - background: #f44336; -} - -.strength-medium .strength-bar::before { - width: 66%; - background: #ff9800; -} - -.strength-strong .strength-bar::before { - width: 100%; - background: #4caf50; -} - -.strength-weak .strength-text { - color: #f44336; -} - -.strength-medium .strength-text { - color: #ff9800; -} - -.strength-strong .strength-text { - color: #4caf50; -} - -/* Terms Links */ -.terms-link { - color: var(--accent-teal); - text-decoration: none; - font-weight: 500; -} - -.terms-link:hover { - text-decoration: underline; -} - -/* Responsive Design */ -@media (max-width: 768px) { - .login-content { - padding: 100px 15px 20px 15px; - } - - .login-container { - padding: 40px 30px; - margin: 0 10px; - } - - .login-icon { - font-size: 56px; - } - - .login-title { - font-size: 28px; - } - - .login-subtitle { - font-size: 14px; - } - - .form-options { - flex-direction: column; - align-items: flex-start; - gap: 15px; - } - - .social-btn { - font-size: 14px; - } -} - -@media (max-width: 480px) { - .login-container { - padding: 30px 20px; - } - - .login-title { - font-size: 24px; - } - - .login-form .form-group input { - font-size: 16px; - padding: 12px 40px 12px 15px; - } - - .input-icon, - .password-toggle { - right: 15px; - } -} diff --git a/Profice WebSite backup/style/service.css b/Profice WebSite backup/style/service.css deleted file mode 100644 index aafe64e..0000000 --- a/Profice WebSite backup/style/service.css +++ /dev/null @@ -1,339 +0,0 @@ -/* Service Page Styles */ - -.service-container { - max-width: 900px; - margin: 0 auto; - padding: 120px 20px 20px 20px; -} - -.service-header { - text-align: center; - margin-bottom: 60px; - padding-bottom: 40px; - border-bottom: 3px solid var(--accent-teal); -} - -.service-icon { - font-size: 72px; - margin-bottom: 20px; - display: block; -} - -.service-title { - font-size: 42px; - color: var(--primary-dark); - margin-bottom: 15px; - font-weight: 600; -} - -.service-subtitle { - font-size: 20px; - color: var(--primary-mid); - line-height: 1.6; - max-width: 600px; - margin: 0 auto; -} - -.service-section { - margin-bottom: 50px; - padding: 40px; - background: white; - border-radius: 20px; - box-shadow: 0 8px 30px rgba(79, 71, 71, 0.1); -} - -.section-title { - font-size: 28px; - color: var(--primary-dark); - margin-bottom: 20px; - font-weight: 600; -} - -.section-text { - font-size: 18px; - line-height: 1.6; - color: var(--primary-mid); - margin-bottom: 30px; -} - -/* Features Grid */ -.features-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); - gap: 30px; - margin-top: 30px; -} - -.feature-item { - background: var(--primary-light); - padding: 30px; - border-radius: 16px; - text-align: center; - transition: transform 0.3s ease, box-shadow 0.3s ease; -} - -.feature-item:hover { - transform: translateY(-5px); - box-shadow: 0 15px 40px rgba(79, 71, 71, 0.15); -} - -.feature-icon { - font-size: 48px; - margin-bottom: 15px; - display: block; -} - -.feature-item h3 { - color: var(--accent-teal); - margin-bottom: 10px; - font-size: 20px; -} - -.feature-item p { - color: var(--primary-mid); - line-height: 1.5; -} - -/* Process Timeline */ -.process-timeline { - max-width: 800px; - margin: 40px auto 0; - position: relative; -} - -.process-item { - display: flex; - align-items: flex-start; - margin-bottom: 40px; - position: relative; -} - -.process-number { - width: 50px; - height: 50px; - background: var(--accent-teal); - color: white; - border-radius: 50%; - display: flex; - align-items: center; - justify-content: center; - font-size: 24px; - font-weight: bold; - flex-shrink: 0; - margin-right: 20px; -} - -.process-content { - flex: 1; -} - -.process-content h3 { - color: var(--primary-dark); - margin-bottom: 8px; - font-size: 20px; -} - -.process-content p { - color: var(--primary-mid); - line-height: 1.5; -} - -/* Tech Grid */ -.tech-grid { - display: flex; - flex-wrap: wrap; - gap: 15px; - justify-content: center; - margin: 30px 0; -} - -.tech-item { - background: var(--primary-dark); - color: white; - padding: 12px 20px; - border-radius: 25px; - font-size: 14px; - font-weight: 500; - transition: transform 0.2s ease; -} - -.tech-item:hover { - transform: translateY(-2px); - background: var(--accent-teal); -} - -/* Benefits Grid */ -.benefits-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); - gap: 25px; - margin-top: 30px; -} - -.benefit-item { - background: linear-gradient(135deg, var(--accent-teal), var(--accent-green)); - color: white; - padding: 30px; - border-radius: 16px; - text-align: center; - transition: transform 0.3s ease, box-shadow 0.3s ease; -} - -.benefit-item:hover { - transform: translateY(-5px); - box-shadow: 0 15px 40px rgba(38, 166, 154, 0.3); -} - -.benefit-icon { - font-size: 48px; - margin-bottom: 15px; - display: block; -} - -.benefit-item h3 { - margin-bottom: 10px; - font-size: 20px; -} - -.benefit-item p { - line-height: 1.5; -} - -/* Use Cases Grid */ -.use-cases-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); - gap: 25px; - margin-top: 30px; -} - -.use-case-item { - background: var(--primary-light); - padding: 25px; - border-radius: 12px; - border-left: 4px solid var(--accent-teal); - transition: transform 0.3s ease; -} - -.use-case-item:hover { - transform: translateY(-3px); - box-shadow: 0 8px 25px rgba(79, 71, 71, 0.1); -} - -.use-case-item h3 { - color: var(--accent-teal); - margin-bottom: 10px; - font-size: 18px; -} - -.use-case-item p { - color: var(--primary-mid); - line-height: 1.5; -} - -/* CTA Buttons */ -.cta-buttons { - display: flex; - gap: 20px; - justify-content: center; - margin-top: 40px; - flex-wrap: wrap; -} - -.cta-btn { - padding: 16px 32px; - border-radius: 30px; - font-size: 18px; - font-weight: 600; - text-decoration: none; - transition: all 0.3s ease; - display: inline-block; -} - -.cta-btn.primary { - background: var(--accent-teal); - color: white; - border: 2px solid var(--accent-teal); -} - -.cta-btn.primary:hover { - background: white; - color: var(--accent-teal); - transform: translateY(-2px); - box-shadow: 0 8px 25px rgba(38, 166, 154, 0.3); -} - -.cta-btn.secondary { - background: transparent; - color: var(--primary-dark); - border: 2px solid var(--primary-dark); -} - -.cta-btn.secondary:hover { - background: var(--primary-dark); - color: white; - transform: translateY(-2px); -} - -/* Responsive Design */ -@media (max-width: 768px) { - .service-container { - padding: 100px 15px 20px 15px; - } - - .service-icon { - font-size: 56px; - } - - .service-title { - font-size: 32px; - } - - .service-subtitle { - font-size: 18px; - } - - .service-section { - padding: 30px 20px; - margin-bottom: 30px; - } - - .section-title { - font-size: 24px; - } - - .section-text { - font-size: 16px; - } - - .features-grid, - .benefits-grid, - .use-cases-grid { - grid-template-columns: 1fr; - gap: 20px; - } - - .process-item { - flex-direction: column; - text-align: center; - margin-bottom: 30px; - } - - .process-number { - margin: 0 auto 15px; - } - - .process-content { - text-align: center; - } - - .cta-buttons { - flex-direction: column; - align-items: center; - } - - .cta-btn { - width: 100%; - max-width: 300px; - } -} diff --git a/Profice WebSite.zip b/Profice WebSite.zip deleted file mode 100644 index c23d6e0..0000000 Binary files a/Profice WebSite.zip and /dev/null differ diff --git a/Profice WebSite/.htaccess b/Profice WebSite/.htaccess deleted file mode 100644 index 034467f..0000000 --- a/Profice WebSite/.htaccess +++ /dev/null @@ -1,67 +0,0 @@ -# Security - Disable directory listing -Options -Indexes - -# Enable compression - - AddOutputFilterByType DEFLATE text/plain - AddOutputFilterByType DEFLATE text/html - AddOutputFilterByType DEFLATE text/xml - AddOutputFilterByType DEFLATE text/css - AddOutputFilterByType DEFLATE application/xml - AddOutputFilterByType DEFLATE application/xhtml+xml - AddOutputFilterByType DEFLATE application/rss+xml - AddOutputFilterByType DEFLATE application/javascript - AddOutputFilterByType DEFLATE application/x-javascript - - -# Set caching headers - - ExpiresActive On - ExpiresByType text/css "access plus 1 month" - ExpiresByType application/javascript "access plus 1 month" - ExpiresByType image/png "access plus 1 month" - ExpiresByType image/jpg "access plus 1 month" - ExpiresByType image/jpeg "access plus 1 month" - ExpiresByType image/gif "access plus 1 month" - ExpiresByType image/ico "access plus 1 month" - ExpiresByType image/svg+xml "access plus 1 month" - ExpiresByType text/html "access plus 1 hour" - - -# Security headers - - Header always set X-Content-Type-Options nosniff - Header always set X-Frame-Options DENY - Header always set X-XSS-Protection "1; mode=block" - Header always set Referrer-Policy "strict-origin-when-cross-origin" - - -# PHP settings (if needed) - - php_flag display_errors Off - php_value error_reporting E_ALL & ~E_DEPRECATED & ~E_STRICT - - - - php_flag display_errors Off - php_value error_reporting E_ALL & ~E_DEPRECATED & ~E_STRICT - - -# Handle PHP files if mod_php is not available - - SetHandler application/x-httpd-php - - -# Alternative PHP handler for different server configurations - - AddHandler fcgid-script .php - - - - AddHandler cgi-script .php - - -# Force HTTPS (uncomment if you have SSL certificate) -# RewriteEngine On -# RewriteCond %{HTTPS} off -# RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301] \ No newline at end of file diff --git a/Profice WebSite/DEPLOYMENT.md b/Profice WebSite/DEPLOYMENT.md deleted file mode 100644 index 34c76a9..0000000 --- a/Profice WebSite/DEPLOYMENT.md +++ /dev/null @@ -1,89 +0,0 @@ -# Profice Website - Server Deployment Guide - -## 🚀 Ready for Production - -Your website has been prepared for server hosting with the following optimizations: - -### ✅ Completed Setup - -#### 1. **Webhook Configuration Updated** -- ✅ Switched to production webhook URLs -- ✅ Debug mode disabled for security -- ✅ Using correct N8N webhook IDs - -#### 2. **Server Security & Performance (.htaccess)** -- ✅ Directory listing disabled -- ✅ GZIP compression enabled -- ✅ Browser caching configured -- ✅ Security headers set -- ✅ PHP error display disabled -- ✅ HTTPS redirect ready (uncomment when SSL is active) - -#### 3. **Character Encoding Fixed** -- ✅ All German special characters corrected -- ✅ UTF-8 encoding properly configured - -#### 4. **File Structure Clean** -- ✅ Test files removed -- ✅ Production-ready configuration - -## 📁 Files to Upload - -Upload the entire `Profice WebSite` folder to your server: - -``` -Profice WebSite/ -├── .htaccess # Server configuration -├── index.html # Homepage -├── sites/ # Subpages -│ ├── offers.html -│ ├── leads.html -│ ├── website.html -│ ├── ki-integration.html -│ └── automatisation.html -├── scripts/ # Backend functionality -│ └── add/ -│ └── send.php # Webhook handler -├── style/ # CSS files -├── images/ # Image assets -└── components/ # Reusable components -``` - -## 🔧 Server Requirements - -### Minimum Requirements: -- ✅ PHP 7.4+ (recommended 8.0+) -- ✅ Apache server with .htaccess support -- ✅ cURL extension enabled -- ✅ JSON extension enabled - -### Optional (for better performance): -- SSL certificate (HTTPS) -- GZIP compression support -- Expires module for caching - -## 🌐 After Upload - -1. **Test the contact form** - Submit a test request -2. **Check webhook delivery** - Verify N8N receives requests -3. **Test all pages** - Ensure proper navigation -4. **Enable HTTPS** (if available) - Uncomment lines 50-53 in .htaccess - -## 🔒 Security Notes - -- All sensitive data (webhooks, tokens) are stored in `send.php` -- Debug mode is disabled in production -- Security headers are configured -- Directory listing is disabled - -## 📞 Support - -If you encounter issues: -1. Check server error logs -2. Verify PHP extensions (cURL, JSON) -3. Test webhook URLs manually -4. Ensure file permissions are correct (755 for folders, 644 for files) - ---- - -**Your website is now ready for production deployment! 🎉** diff --git a/Profice WebSite/OPTIMIZATION_REPORT.md b/Profice WebSite/OPTIMIZATION_REPORT.md deleted file mode 100644 index 8d324e1..0000000 --- a/Profice WebSite/OPTIMIZATION_REPORT.md +++ /dev/null @@ -1,27 +0,0 @@ -# Project Optimization Report - -## Files Removed: -- CSS: cookie-consent.css, details.css, lead-details.css, login.css, service.css (5 files) -- JS: cookie-consent.js, login.js, register.js (3 files) -- Images: All 20+ iconography files, duplicate logos, spidy.png (22+ files) -- Components: UnifiedWorkflow.js (1 unused component) - -## Optimizations Applied: -- Minified all CSS files (design.min.css, cursor.min.css, tech-onepager.min.css, leads.min.css) -- Minified all JS files (script.min.js, cursor.min.js, scroll-header.min.js, tech-onepager.min.js, leads.min.js) -- Updated HTML files to use minified versions -- Removed duplicate script loading -- Optimized HTML structure by removing redundant attributes - -## Final Project Stats: -- Total size: 0.57 MB -- HTML files: 6 -- CSS files: 8 (4 original + 4 minified) -- JS files: 10 (5 original + 5 minified) -- Image files: 2 (only essential ones kept) - -## Performance Improvements: -- Reduced file count by ~30 files -- Minified CSS/JS for faster loading -- Eliminated duplicate code -- Streamlined asset loading diff --git a/Profice WebSite/backup-form.html b/Profice WebSite/backup-form.html deleted file mode 100644 index 58f26a2..0000000 --- a/Profice WebSite/backup-form.html +++ /dev/null @@ -1,130 +0,0 @@ - - - - - - Kontaktformular - Profice - - - -
-

Kontaktformular (Backup)

- -
- Hinweis: Dies ist eine Backup-Version des Kontaktformulars. Wenn das Hauptformular nicht funktioniert, können Sie dieses verwenden. -
- -
-
- - -
- -
- - -
- -
- - -
- -
- - -
- -
- - -
- -
- - -
- - -
- -
-
- - - - diff --git a/Profice WebSite/images/additional/cursor.png b/Profice WebSite/images/additional/cursor.png deleted file mode 100644 index d70d430..0000000 Binary files a/Profice WebSite/images/additional/cursor.png and /dev/null differ diff --git a/Profice WebSite/images/additional/spidy.png b/Profice WebSite/images/additional/spidy.png deleted file mode 100644 index 2dcc8af..0000000 Binary files a/Profice WebSite/images/additional/spidy.png and /dev/null differ diff --git a/Profice WebSite/images/icons/facebook.png b/Profice WebSite/images/icons/facebook.png deleted file mode 100644 index 2aa1e0c..0000000 Binary files a/Profice WebSite/images/icons/facebook.png and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-01.jpg b/Profice WebSite/images/icons/iconography-01.jpg deleted file mode 100644 index 8743a8a..0000000 Binary files a/Profice WebSite/images/icons/iconography-01.jpg and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-01.png b/Profice WebSite/images/icons/iconography-01.png deleted file mode 100644 index 4c75a11..0000000 Binary files a/Profice WebSite/images/icons/iconography-01.png and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-02.jpg b/Profice WebSite/images/icons/iconography-02.jpg deleted file mode 100644 index 2d5f6aa..0000000 Binary files a/Profice WebSite/images/icons/iconography-02.jpg and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-02.png b/Profice WebSite/images/icons/iconography-02.png deleted file mode 100644 index 14aaf69..0000000 Binary files a/Profice WebSite/images/icons/iconography-02.png and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-03.jpg b/Profice WebSite/images/icons/iconography-03.jpg deleted file mode 100644 index ca99772..0000000 Binary files a/Profice WebSite/images/icons/iconography-03.jpg and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-03.png b/Profice WebSite/images/icons/iconography-03.png deleted file mode 100644 index ce6f89b..0000000 Binary files a/Profice WebSite/images/icons/iconography-03.png and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-04 - Kopie.jpg b/Profice WebSite/images/icons/iconography-04 - Kopie.jpg deleted file mode 100644 index f3e3e3a..0000000 Binary files a/Profice WebSite/images/icons/iconography-04 - Kopie.jpg and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-04 - Kopie.png b/Profice WebSite/images/icons/iconography-04 - Kopie.png deleted file mode 100644 index cb3a551..0000000 Binary files a/Profice WebSite/images/icons/iconography-04 - Kopie.png and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-05.jpg b/Profice WebSite/images/icons/iconography-05.jpg deleted file mode 100644 index ac6d288..0000000 Binary files a/Profice WebSite/images/icons/iconography-05.jpg and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-05.png b/Profice WebSite/images/icons/iconography-05.png deleted file mode 100644 index 61e57d4..0000000 Binary files a/Profice WebSite/images/icons/iconography-05.png and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-06.jpg b/Profice WebSite/images/icons/iconography-06.jpg deleted file mode 100644 index 98e29cb..0000000 Binary files a/Profice WebSite/images/icons/iconography-06.jpg and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-06.png b/Profice WebSite/images/icons/iconography-06.png deleted file mode 100644 index 1e4f6f1..0000000 Binary files a/Profice WebSite/images/icons/iconography-06.png and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-07 - Kopie.jpg b/Profice WebSite/images/icons/iconography-07 - Kopie.jpg deleted file mode 100644 index 64f803a..0000000 Binary files a/Profice WebSite/images/icons/iconography-07 - Kopie.jpg and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-07.jpg b/Profice WebSite/images/icons/iconography-07.jpg deleted file mode 100644 index 64f803a..0000000 Binary files a/Profice WebSite/images/icons/iconography-07.jpg and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-07.png b/Profice WebSite/images/icons/iconography-07.png deleted file mode 100644 index 92b3a73..0000000 Binary files a/Profice WebSite/images/icons/iconography-07.png and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-08.jpg b/Profice WebSite/images/icons/iconography-08.jpg deleted file mode 100644 index 293a6a1..0000000 Binary files a/Profice WebSite/images/icons/iconography-08.jpg and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-08.png b/Profice WebSite/images/icons/iconography-08.png deleted file mode 100644 index 2057da8..0000000 Binary files a/Profice WebSite/images/icons/iconography-08.png and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-09.jpg b/Profice WebSite/images/icons/iconography-09.jpg deleted file mode 100644 index 8a816da..0000000 Binary files a/Profice WebSite/images/icons/iconography-09.jpg and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-09.png b/Profice WebSite/images/icons/iconography-09.png deleted file mode 100644 index 55a4b12..0000000 Binary files a/Profice WebSite/images/icons/iconography-09.png and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-10.jpg b/Profice WebSite/images/icons/iconography-10.jpg deleted file mode 100644 index 6de5ef1..0000000 Binary files a/Profice WebSite/images/icons/iconography-10.jpg and /dev/null differ diff --git a/Profice WebSite/images/icons/iconography-10.png b/Profice WebSite/images/icons/iconography-10.png deleted file mode 100644 index a1b36ed..0000000 Binary files a/Profice WebSite/images/icons/iconography-10.png and /dev/null differ diff --git a/Profice WebSite/images/icons/instagram.png b/Profice WebSite/images/icons/instagram.png deleted file mode 100644 index 613aa1e..0000000 Binary files a/Profice WebSite/images/icons/instagram.png and /dev/null differ diff --git a/Profice WebSite/images/logo/Appicon 1024X1024-01.png b/Profice WebSite/images/logo/Appicon 1024X1024-01.png deleted file mode 100644 index c06e07d..0000000 Binary files a/Profice WebSite/images/logo/Appicon 1024X1024-01.png and /dev/null differ diff --git a/Profice WebSite/images/logo/LOGO E3.jpg b/Profice WebSite/images/logo/LOGO E3.jpg deleted file mode 100644 index 2672503..0000000 Binary files a/Profice WebSite/images/logo/LOGO E3.jpg and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-01-complete.PNG b/Profice WebSite/images/logo/Logo-01-complete.PNG deleted file mode 100644 index 98f29e4..0000000 Binary files a/Profice WebSite/images/logo/Logo-01-complete.PNG and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-01.jpg b/Profice WebSite/images/logo/Logo-01.jpg deleted file mode 100644 index 4957ea2..0000000 Binary files a/Profice WebSite/images/logo/Logo-01.jpg and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-01.png b/Profice WebSite/images/logo/Logo-01.png deleted file mode 100644 index 803c96f..0000000 Binary files a/Profice WebSite/images/logo/Logo-01.png and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-02.jpg b/Profice WebSite/images/logo/Logo-02.jpg deleted file mode 100644 index c17416a..0000000 Binary files a/Profice WebSite/images/logo/Logo-02.jpg and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-02.png b/Profice WebSite/images/logo/Logo-02.png deleted file mode 100644 index 4346e76..0000000 Binary files a/Profice WebSite/images/logo/Logo-02.png and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-03.jpg b/Profice WebSite/images/logo/Logo-03.jpg deleted file mode 100644 index e3f2819..0000000 Binary files a/Profice WebSite/images/logo/Logo-03.jpg and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-03.png b/Profice WebSite/images/logo/Logo-03.png deleted file mode 100644 index 42807cd..0000000 Binary files a/Profice WebSite/images/logo/Logo-03.png and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-04.jpg b/Profice WebSite/images/logo/Logo-04.jpg deleted file mode 100644 index 717a378..0000000 Binary files a/Profice WebSite/images/logo/Logo-04.jpg and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-04.png b/Profice WebSite/images/logo/Logo-04.png deleted file mode 100644 index db015ea..0000000 Binary files a/Profice WebSite/images/logo/Logo-04.png and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-05.jpg b/Profice WebSite/images/logo/Logo-05.jpg deleted file mode 100644 index 1df8d43..0000000 Binary files a/Profice WebSite/images/logo/Logo-05.jpg and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-05.png b/Profice WebSite/images/logo/Logo-05.png deleted file mode 100644 index 1cda111..0000000 Binary files a/Profice WebSite/images/logo/Logo-05.png and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-06.jpg b/Profice WebSite/images/logo/Logo-06.jpg deleted file mode 100644 index d06c645..0000000 Binary files a/Profice WebSite/images/logo/Logo-06.jpg and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-07.jpg b/Profice WebSite/images/logo/Logo-07.jpg deleted file mode 100644 index 1dad7b3..0000000 Binary files a/Profice WebSite/images/logo/Logo-07.jpg and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-07.png b/Profice WebSite/images/logo/Logo-07.png deleted file mode 100644 index 3224ded..0000000 Binary files a/Profice WebSite/images/logo/Logo-07.png and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-08.jpg b/Profice WebSite/images/logo/Logo-08.jpg deleted file mode 100644 index c5cf31c..0000000 Binary files a/Profice WebSite/images/logo/Logo-08.jpg and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-08.png b/Profice WebSite/images/logo/Logo-08.png deleted file mode 100644 index 64b36ca..0000000 Binary files a/Profice WebSite/images/logo/Logo-08.png and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-09.jpg b/Profice WebSite/images/logo/Logo-09.jpg deleted file mode 100644 index fb9917c..0000000 Binary files a/Profice WebSite/images/logo/Logo-09.jpg and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-09.png b/Profice WebSite/images/logo/Logo-09.png deleted file mode 100644 index e9cf29d..0000000 Binary files a/Profice WebSite/images/logo/Logo-09.png and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-10.jpg b/Profice WebSite/images/logo/Logo-10.jpg deleted file mode 100644 index 2384cf8..0000000 Binary files a/Profice WebSite/images/logo/Logo-10.jpg and /dev/null differ diff --git a/Profice WebSite/images/logo/Logo-10.png b/Profice WebSite/images/logo/Logo-10.png deleted file mode 100644 index 5579f7e..0000000 Binary files a/Profice WebSite/images/logo/Logo-10.png and /dev/null differ diff --git a/Profice WebSite/index.html b/Profice WebSite/index.html deleted file mode 100644 index 8e40a4c..0000000 --- a/Profice WebSite/index.html +++ /dev/null @@ -1,622 +0,0 @@ - - - - - - - - - - - - - - Profice - Digitale Mitarbeiter - - - - - - - - - - - - - - - - - - - - - - -
-
-
-
-
- - -
-
- -
- -
- -
- -
- -
-
- - - - -
- - -
-
-
-
-

- Wir bauen digitale Mitarbeiter für Vertrieb, Support und Marketing. -

-

- KI-Telefonassistenten, Chatbots und interne KI-Systeme. Integriert in eure bestehenden Tools. -

-

- Für Unternehmen, die wachsen wollen ohne mehr Personal einzustellen. -

-
- - -
-
-
- -
-
- - - - - - -
-
-
🤖
-
KI ASSISTENT
-
-
- - -
-
-
📞
-
Telefon
-
-
- -
-
-
💬
-
Website Chat
-
-
- -
-
-
📊
-
CRM
-
-
- -
-
-
🎫
-
Ticketsystem
-
-
- -
-
-
👥
-
Team
-
-
-
-
-
-
- - -
-
-

Keine Beratung. Wir bauen funktionierende Systeme.

- -
- -
-
-
-
📞
-
-
-
-
-
-
-
-
-
-
🤖
-
📊
-
-
-

KI Telefonassistent

-
-
-

Was es tut:

-
    -
  • Annahme eingehender Anrufe
    • -
  • Verständnis der Kundenanfrage
    • -
  • Weiterleitung an richtige Abteilung
    • -
  • Dokumentation im CRM
    • -
-
-
-

Ergebnis:

-
    -
  • -52% unnötige Anrufe
    • -
  • 24/7 Erreichbarkeit
    • -
  • Qualifiziertere Weiterleitungen
    • -
-
-
-
- - -
-
-
-
🌐
-
→
-
🤖
-
→
-
📋
-
→
-
👤
-
-
-

KI Chat

-
-
-

Was es tut:

-
    -
  • Website-Besucher verstehen
    • -
  • Kategorisierung der Anfragen
    • -
  • Strukturierte Datenerfassung
    • -
  • Übergabe an menschliche Mitarbeiter
    • -
-
-
-

Ergebnis:

-
    -
  • +38% Konversionsrate
    • -
  • 0 Wartezeit
    • -
  • Strukturierte Leads
    • -
-
-
-
- - -
-
-
-
🔍
-
→
-
💬
-
→
-
🤖
-
→
-
💡
-
-
-

Interne KI

-
-
-

Was es tut:

-
    -
  • Interne Dokumente analysieren
    • -
  • Mitarbeiterfragen beantworten
    • -
  • Wissen zentralisieren
    • -
  • Training neuer Mitarbeiter
    • -
-
-
-

Ergebnis:

-
    -
  • -67% Suchzeit
    • -
  • 100% Wissensverfügbarkeit
    • -
  • Schnellere Einarbeitung
    • -
-
-
-
-
-
-
- - -
-
-
-
-

Nicht geeignet wenn...

-
    -
  • -
    📋
    - Nur eine "schöne Website" gewollt -
    • -
  • -
    📋
    - Keine digitalen Prozesse vorhanden -
    • -
  • -
    📋
    - Technik-Aversion im Team -
    • -
  • -
    📋
    - Keine Notwendigkeit zur Skalierung -
    • -
-
- -
-

Sehr sinnvoll wenn...

-
    -
  • -
    ✓
    - Hoher Anrufaufkommen -
    • -
  • -
    ✓
    - Überlasteter Support -
    • -
  • -
    ✓
    - Wachsendes Unternehmen -
    • -
  • -
    ✓
    - Prozessoptimierung gewünscht -
    • -
-
-
-
-
- - -
-
-

In 3 Schritten zum digitalen Mitarbeiter.

- -
-
-
1
-
Analyse
-
-
-
-
2
-
Bau
-
-
-
-
3
-
Betrieb
-
-
- -
-
-

1. Analyse

-

Wir verstehen eure aktuellen Prozesse, identifizieren Automatisierungspotenziale und definieren klare Ziele.

-
-
-

2. Bau

-

Entwicklung der KI-Systeme, Integration in bestehende Tools und umfangreiche Tests.

-
-
-

3. Betrieb

-

Go-live, Monitoring, kontinuierliche Optimierung und Schulung eures Teams.

-
-
-
-
- - -
-
-

Messbare Ergebnisse

- -
-
-
-52%
-
Unnötige Anrufe
-
Durch KI-Vorfilterung
-
- -
-
24/7
-
Automatisierte Antworten
-
Ohne Ausfallzeiten
-
- -
-
+38%
-
Konversionsrate
-
Durch sofortige Reaktion
-
- -
-
-67%
-
Suchzeit intern
-
Durch Wissens-KI
-
- -
-
0
-
Wartezeit
-
Sofortige Verfügbarkeit
-
- -
-
100%
-
Wissensverfügbarkeit
-
Im gesamten Team
-
-
-
-
- - -
-
-

Sprich nicht mit uns. Sprich mit unserem System.

- -
-
-
-
-
🎤
-
-
-
-

KI Telefon

-

Teste unseren KI-Telefonassistenten jetzt

- -
- -
-

KI Chat

-

Starte eine Konversation mit unserer KI

-
-
-
KI Support
-
-
-
- - -
-
-
-
-
-
-
- - - - - - - - - - - - - - - - - - - - - diff --git a/Profice WebSite/scripts/add/send.php b/Profice WebSite/scripts/add/send.php deleted file mode 100644 index 2090e22..0000000 --- a/Profice WebSite/scripts/add/send.php +++ /dev/null @@ -1,653 +0,0 @@ - $success, - 'message' => $message, - 'timestamp' => date('c') - ]; - - // Only include data if not null and not in production (security) - if ($data !== null && (!USE_PRODUCTION || DEBUG_MODE)) { - $response['data'] = $data; - } elseif ($data !== null && $success) { - // In production, only return safe data - $response['data'] = filterSafeData($data); - } - - echo json_encode($response); - exit(); -} - -function filterSafeData($data) { - // Remove sensitive fields from response - $sensitiveFields = ['webhook_url', 'ip_address', 'user_agent', 'http_code', 'error']; - - if (is_array($data)) { - foreach ($sensitiveFields as $field) { - unset($data[$field]); - } - } - - return $data; -} - -function getClientIP() { - $ipKeys = ['HTTP_CLIENT_IP', 'HTTP_X_FORWARDED_FOR', 'HTTP_X_FORWARDED', 'HTTP_FORWARDED_FOR', 'HTTP_FORWARDED', 'REMOTE_ADDR']; - - foreach ($ipKeys as $key) { - if (array_key_exists($key, $_SERVER)) { - foreach (explode(',', $_SERVER[$key]) as $ip) { - $ip = trim($ip); - if (filter_var($ip, FILTER_VALIDATE_IP, FILTER_FLAG_NO_PRIV_RANGE | FILTER_FLAG_NO_RES_RANGE) !== false) { - return $ip; - } - } - } - } - - return $_SERVER['REMOTE_ADDR'] ?? 'unknown'; -} - -function sanitizeInput($input) { - if (is_array($input)) { - return array_map('sanitizeInput', $input); - } - return htmlspecialchars(trim($input), ENT_QUOTES, 'UTF-8'); -} - -function validateCSRFToken($token) { - // Implement CSRF validation if needed - return true; -} - -function checkRateLimit($ip) { - $rateLimitFile = __DIR__ . '/rate_limits.json'; - $limits = []; - - if (file_exists($rateLimitFile)) { - $limits = json_decode(file_get_contents($rateLimitFile), true) ?: []; - } - - $now = time(); - $windowStart = $now - RATE_LIMIT_WINDOW; - - // Clean old entries - $limits = array_filter($limits, function($entry) use ($windowStart) { - return $entry['time'] > $windowStart; - }); - - // Count requests from this IP - $ipRequests = array_filter($limits, function($entry) use ($ip) { - return $entry['ip'] === $ip; - }); - - if (count($ipRequests) >= RATE_LIMIT_REQUESTS) { - return false; - } - - // Add new request - $limits[] = ['ip' => $ip, 'time' => $now]; - file_put_contents($rateLimitFile, json_encode($limits)); - - return true; -} - -// ========================================== -// WEBHOOK FUNCTIONS -// ========================================== - -function sendToWebhook($data, $webhookUrl = null) { - $url = $webhookUrl ?? WEBHOOK_URL; - - $ch = curl_init(); - curl_setopt_array($ch, [ - CURLOPT_URL => $url, - CURLOPT_RETURNTRANSFER => true, - CURLOPT_POST => true, - CURLOPT_POSTFIELDS => json_encode($data), - CURLOPT_HTTPHEADER => [ - 'Content-Type: application/json', - 'User-Agent: Profice-Web-API/2.0' - ], - CURLOPT_TIMEOUT => 30, - CURLOPT_SSL_VERIFYPEER => !DEBUG_MODE, // Disable for debugging - CURLOPT_FOLLOWLOCATION => true - ]); - - $response = curl_exec($ch); - $httpCode = curl_getinfo($ch, CURLINFO_HTTP_CODE); - $error = curl_error($ch); - curl_close($ch); - - if ($error) { - error_log("Webhook Error: " . $error); - return ['success' => false, 'error' => $error, 'response' => $response]; - } - - return [ - 'success' => $httpCode >= 200 && $httpCode < 300, - 'http_code' => $httpCode, - 'response' => $response, - 'error' => $error - ]; -} - -// ========================================== -// TRACKING FUNCTIONS - SERVER SIDE -// ========================================== - -function getTrackingConfig() { - // Return tracking configuration for client - // IDs are loaded from server, not exposed in JS - return [ - 'analytics_enabled' => !empty(GA_MEASUREMENT_ID) && GA_MEASUREMENT_ID !== 'G-XXXXXXXXXX', - 'gtm_enabled' => !empty(GTM_CONTAINER_ID) && GTM_CONTAINER_ID !== 'GTM-XXXXXXX', - 'fb_enabled' => !empty(FB_PIXEL_ID), - 'gads_enabled' => !empty(GADS_CONVERSION_ID) && GADS_CONVERSION_ID !== 'AW-XXXXXXXXXX', - 'linkedin_enabled' => !empty(LINKEDIN_PARTNER_ID) - ]; -} - -function loadTrackingScripts($preferences) { - $scripts = []; - - // Google Analytics - if ($preferences['analytics'] && !empty(GA_MEASUREMENT_ID) && GA_MEASUREMENT_ID !== 'G-XXXXXXXXXX') { - $scripts['ga'] = [ - 'type' => 'analytics', - 'src' => 'https://www.googletagmanager.com/gtag/js?id=' . GA_MEASUREMENT_ID, - 'config' => [ - 'id' => GA_MEASUREMENT_ID - ] - ]; - } - - // Google Tag Manager - if ($preferences['analytics'] && !empty(GTM_CONTAINER_ID) && GTM_CONTAINER_ID !== 'GTM-XXXXXXX') { - $scripts['gtm'] = [ - 'type' => 'gtm', - 'src' => 'https://www.googletagmanager.com/gtm.js?id=' . GTM_CONTAINER_ID, - 'config' => [ - 'id' => GTM_CONTAINER_ID - ] - ]; - } - - // Facebook Pixel - if ($preferences['marketing'] && !empty(FB_PIXEL_ID)) { - $scripts['fb'] = [ - 'type' => 'pixel', - 'src' => 'https://connect.facebook.net/en_US/fbevents.js', - 'config' => [ - 'pixel_id' => FB_PIXEL_ID - ] - ]; - } - - // Google Ads - if ($preferences['marketing'] && !empty(GADS_CONVERSION_ID) && GADS_CONVERSION_ID !== 'AW-XXXXXXXXXX') { - $scripts['gads'] = [ - 'type' => 'conversion', - 'src' => 'https://www.googletagmanager.com/gtag/js?id=' . GADS_CONVERSION_ID, - 'config' => [ - 'conversion_id' => GADS_CONVERSION_ID, - 'conversion_label' => GADS_CONVERSION_LABEL - ] - ]; - } - - // LinkedIn - if ($preferences['marketing'] && !empty(LINKEDIN_PARTNER_ID)) { - $scripts['linkedin'] = [ - 'type' => 'insight', - 'src' => 'https://snap.licdn.com/li.lms-analytics/insight.min.js', - 'config' => [ - 'partner_id' => LINKEDIN_PARTNER_ID - ] - ]; - } - - return $scripts; -} - -function sendEventToGA($data) { - if (empty(GA_MEASUREMENT_ID) || GA_MEASUREMENT_ID === 'G-XXXXXXXXXX') { - return false; - } - - $postData = [ - 'client_id' => $data['client_id'] ?? uniqid(), - 'user_id' => $data['user_id'] ?? null, - 'events' => [ - [ - 'name' => $data['event_name'], - 'params' => $data['params'] ?? [] - ] - ] - ]; - - $url = 'https://www.google-analytics.com/mp/collect'; - $url .= '?measurement_id=' . GA_MEASUREMENT_ID; - $url .= '&api_secret=' . GA_API_SECRET; - - $ch = curl_init(); - curl_setopt_array($ch, [ - CURLOPT_URL => $url, - CURLOPT_RETURNTRANSFER => true, - CURLOPT_POST => true, - CURLOPT_POSTFIELDS => json_encode($postData), - CURLOPT_HTTPHEADER => ['Content-Type: application/json'], - CURLOPT_TIMEOUT => 10 - ]); - - $response = curl_exec($ch); - $httpCode = curl_getinfo($ch, CURLINFO_HTTP_CODE); - curl_close($ch); - - return $httpCode >= 200 && $httpCode < 300; -} - -function sendEventToFB($data) { - if (empty(FB_PIXEL_ID) || empty(FB_ACCESS_TOKEN)) { - return false; - } - - $postData = [ - 'data' => [ - [ - 'event_name' => $data['event_name'], - 'event_time' => time(), - 'action_source' => 'website', - 'user_data' => $data['user_data'] ?? [], - 'custom_data' => $data['custom_data'] ?? [] - ] - ] - ]; - - $url = 'https://graph.facebook.com/v18.0/' . FB_PIXEL_ID . '/events'; - $url .= '?access_token=' . FB_ACCESS_TOKEN; - - $ch = curl_init(); - curl_setopt_array($ch, [ - CURLOPT_URL => $url, - CURLOPT_RETURNTRANSFER => true, - CURLOPT_POST => true, - CURLOPT_POSTFIELDS => json_encode($postData), - CURLOPT_HTTPHEADER => ['Content-Type: application/json'], - CURLOPT_TIMEOUT => 10 - ]); - - $response = curl_exec($ch); - $httpCode = curl_getinfo($ch, CURLINFO_HTTP_CODE); - curl_close($ch); - - return $httpCode >= 200 && $httpCode < 300; -} - -// ========================================== -// STORAGE FUNCTIONS -// ========================================== - -function storeLead($data) { - $leadFile = __DIR__ . '/data/leads.json'; - $dir = dirname($leadFile); - - if (!is_dir($dir)) { - mkdir($dir, 0755, true); - } - - $leads = []; - if (file_exists($leadFile)) { - $leads = json_decode(file_get_contents($leadFile), true) ?: []; - } - - $lead = [ - 'id' => uniqid('lead_', true), - 'datum' => date('d.m.Y'), - 'dienstleistung' => $data['service'] ?? 'Allgemein', - 'status' => 'open', - 'statusText' => 'Offen', - 'description' => $data['description'] ?? '', - 'name' => $data['name'] ?? '', - 'contact' => $data['contact'] ?? '', - 'organisation' => $data['organisation'] ?? '', - 'timestamp' => date('c'), - 'ip_address' => getClientIP() - ]; - - array_unshift($leads, $lead); - $leads = array_slice($leads, 0, 100); - - file_put_contents($leadFile, json_encode($leads, JSON_PRETTY_PRINT)); - return $lead['id']; -} - -function storeCookieConsent($data) { - $consentFile = __DIR__ . '/data/cookie_consent.json'; - $dir = dirname($consentFile); - - if (!is_dir($dir)) { - mkdir($dir, 0755, true); - } - - $consents = []; - if (file_exists($consentFile)) { - $consents = json_decode(file_get_contents($consentFile), true) ?: []; - } - - $consent = [ - 'id' => uniqid('consent_', true), - 'timestamp' => date('c'), - 'preferences' => $data['preferences'] ?? [], - 'ip_address' => getClientIP(), - 'user_agent' => $_SERVER['HTTP_USER_AGENT'] ?? '' - ]; - - array_unshift($consents, $consent); - $consents = array_slice($consents, 0, 1000); - - file_put_contents($consentFile, json_encode($consents, JSON_PRETTY_PRINT)); - return $consent['id']; -} - -function getCookieConsent() { - $consentFile = __DIR__ . '/data/cookie_consent.json'; - - if (!file_exists($consentFile)) { - return null; - } - - $consents = json_decode(file_get_contents($consentFile), true) ?: []; - return $consents[0] ?? null; -} - -// ========================================== -// REQUEST HANDLERS -// ========================================== - -function handleContactForm($data) { - $required = ['name', 'contact']; - foreach ($required as $field) { - if (empty($data[$field])) { - sendResponse(false, "Pflichtfeld fehlt: {$field}", null, 400); - } - } - - $formData = [ - 'name' => sanitizeInput($data['name']), - 'organisation' => sanitizeInput($data['organisation'] ?? ''), - 'contact' => sanitizeInput($data['contact']), - 'service' => sanitizeInput($data['service'] ?? ''), - 'budget' => sanitizeInput($data['budget'] ?? ''), - 'description' => sanitizeInput($data['description'] ?? ''), - 'timestamp' => date('c'), - 'source' => 'contact_form', - 'form_type' => 'offer', - 'ip_address' => getClientIP() - ]; - - // Store lead locally first - $leadId = storeLead($formData); - - // Send to webhook - $webhookResult = sendToWebhook($formData); - - // Always return success to user, but include webhook info in debug mode - $debugData = DEBUG_MODE ? [ - 'lead_id' => $leadId, - 'webhook_result' => $webhookResult, - 'webhook_url' => WEBHOOK_URL, - 'form_data' => $formData - ] : null; - - if ($webhookResult['success']) { - sendResponse(true, 'Formular erfolgreich gesendet', $debugData); - } else { - // Still return success to user but log the webhook error - error_log('Webhook failed but form was stored locally: ' . json_encode($webhookResult)); - sendResponse(true, 'Formular erfolgreich gesendet (Webhook-Fehler protokolliert)', $debugData); - } -} - -function handleLeadForm($data) { - // Handle lead form submissions - $leadId = storeLead($data); - sendResponse(true, 'Lead gespeichert', ['lead_id' => $leadId]); -} - -function handleCookieConsent($data) { - $preferences = $data['preferences'] ?? []; - $consentId = storeCookieConsent(['preferences' => $preferences]); - - // Load tracking scripts based on preferences - $scripts = loadTrackingScripts($preferences); - - sendResponse(true, 'Cookie-Einstellungen gespeichert', [ - 'consent_id' => $consentId, - 'scripts' => $scripts - ]); -} - -function handleGetCookieConsent($data) { - $consent = getCookieConsent(); - if ($consent) { - sendResponse(true, 'Cookie-Einstellungen gefunden', $consent); - } else { - sendResponse(false, 'Keine Cookie-Einstellungen gefunden', null, 404); - } -} - -function handleGetTrackingConfig($data) { - $config = getTrackingConfig(); - sendResponse(true, 'Tracking-Konfiguration', $config); -} - -function handleChatMessage($data) { - $message = sanitizeInput($data['message'] ?? ''); - $sessionId = sanitizeInput($data['session_id'] ?? uniqid('chat_')); - - if (empty($message)) { - sendResponse(false, 'Nachricht darf nicht leer sein', null, 400); - } - - $chatData = [ - 'type' => 'chat_message', - 'session_id' => $sessionId, - 'message' => $message, - 'timestamp' => date('c'), - 'source' => 'website_chat', - 'ip_address' => getClientIP(), - 'user_agent' => $_SERVER['HTTP_USER_AGENT'] ?? '' - ]; - - // Send to webhook - $webhookResult = sendToWebhook($chatData); - - $debugData = DEBUG_MODE ? [ - 'session_id' => $sessionId, - 'webhook_result' => $webhookResult, - 'webhook_url' => WEBHOOK_URL - ] : null; - - if ($webhookResult['success']) { - // Try to parse response from webhook - $response = json_decode($webhookResult['response'], true); - $aiResponse = $response['message'] ?? 'Vielen Dank für Ihre Nachricht. Ich melde mich so schnell wie möglich bei Ihnen.'; - - sendResponse(true, 'Nachricht gesendet', array_merge($debugData, [ - 'session_id' => $sessionId, - 'ai_response' => $aiResponse, - 'timestamp' => date('c') - ])); - } else { - error_log('Chat webhook failed: ' . json_encode($webhookResult)); - sendResponse(false, 'Chat-Service derzeit nicht verfügbar. Bitte versuchen Sie es später erneut.', $debugData, 503); - } -} - -function handleTrackEvent($data) { - $eventName = $data['event_name'] ?? ''; - $eventData = $data['event_data'] ?? []; - - // Send to Google Analytics - $gaSuccess = sendEventToGA([ - 'event_name' => $eventName, - 'params' => $eventData - ]); - - // Send to Facebook - $fbSuccess = sendEventToFB([ - 'event_name' => $eventName, - 'custom_data' => $eventData - ]); - - sendResponse(true, 'Event gesendet', [ - 'ga_success' => $gaSuccess, - 'fb_success' => $fbSuccess - ]); -} - -// ========================================== -// MAIN REQUEST HANDLER -// ========================================== - -// Validate request method -if ($_SERVER['REQUEST_METHOD'] !== 'POST') { - sendResponse(false, 'Nur POST-Anfragen erlaubt', null, 405); -} - -// Rate limiting -$clientIP = getClientIP(); -if (!checkRateLimit($clientIP)) { - sendResponse(false, 'Zu viele Anfragen. Bitte später erneut versuchen.', null, 429); -} - -// Get JSON input -$jsonInput = file_get_contents('php://input'); -$data = json_decode($jsonInput, true); - -if (!$data) { - $data = $_POST; -} - -if (!$data || empty($data)) { - sendResponse(false, 'Keine Daten empfangen', null, 400); -} - -$requestType = $data['type'] ?? 'contact'; - -try { - switch ($requestType) { - case 'contact': - handleContactForm($data); - break; - case 'lead': - handleLeadForm($data); - break; - case 'cookie_consent': - handleCookieConsent($data); - break; - case 'get_cookie_consent': - handleGetCookieConsent($data); - break; - case 'get_tracking_config': - handleGetTrackingConfig($data); - break; - case 'track_event': - handleTrackEvent($data); - break; - case 'chat': - handleChatMessage($data); - break; - default: - sendResponse(false, 'Ungültiger Anfragetyp', null, 400); - } -} catch (Exception $e) { - error_log('API Error: ' . $e->getMessage()); - error_log('Stack trace: ' . $e->getTraceAsString()); - sendResponse(false, 'Interner Serverfehler', null, 500); -} -?> diff --git a/Profice WebSite/scripts/add/test.php b/Profice WebSite/scripts/add/test.php deleted file mode 100644 index 7a301ff..0000000 --- a/Profice WebSite/scripts/add/test.php +++ /dev/null @@ -1,13 +0,0 @@ - true, - 'message' => 'PHP is working correctly', - 'timestamp' => date('c'), - 'server_info' => [ - 'php_version' => phpversion(), - 'server_software' => $_SERVER['SERVER_SOFTWARE'] ?? 'Unknown' - ] -]); -?> diff --git a/Profice WebSite/scripts/chat.js b/Profice WebSite/scripts/chat.js deleted file mode 100644 index 4c9dc81..0000000 --- a/Profice WebSite/scripts/chat.js +++ /dev/null @@ -1,429 +0,0 @@ -/** - * KI Chat Widget - Functional Chat Interface - * Integrates with existing chat widget in KI Chat card - * Connects to N8N webhook via send.php - */ - -class KIChat { - constructor() { - this.sessionId = this.generateSessionId(); - this.isTyping = false; - this.messages = []; - - this.init(); - } - - init() { - this.bindEvents(); - this.loadChatHistory(); - this.setupExistingChat(); - } - - generateSessionId() { - return 'chat_' + Date.now() + '_' + Math.random().toString(36).substr(2, 9); - } - - bindEvents() { - // Chat button clicks - const chatBtn = document.getElementById('chatBtn'); - const interactionBtn = document.querySelector('#chatInteraction .interaction-btn'); - - if (chatBtn) { - chatBtn.addEventListener('click', () => this.scrollToChat()); - } - - if (interactionBtn) { - interactionBtn.addEventListener('click', () => this.focusInput()); - } - - // Send message on Enter in existing chat - const existingInput = document.querySelector('#chatInteraction .chat-input'); - if (existingInput) { - existingInput.addEventListener('keypress', (e) => { - if (e.key === 'Enter') { - e.preventDefault(); - this.sendMessage(); - } - }); - } - - // Send button click - const sendBtn = document.querySelector('#chatInteraction .chat-send'); - if (sendBtn) { - sendBtn.addEventListener('click', () => this.sendMessage()); - } - } - - setupExistingChat() { - const chatMessages = document.querySelector('#chatInteraction .chat-messages'); - const chatInput = document.querySelector('#chatInteraction .chat-input'); - const sendBtn = document.querySelector('#chatInteraction .chat-send'); - - // Add click event listener to the send button - if (sendBtn) { - sendBtn.addEventListener('click', () => this.sendMessage()); - } - - // Add welcome message - if (this.messages.length === 0 && chatMessages) { - this.addMessage('ki', 'Hallo! Ich bin Ihr KI-Assistent. Wie kann ich Ihnen helfen?'); - } - - this.updateChatDisplay(); - } - - scrollToChat() { - const chatInteraction = document.getElementById('chatInteraction'); - if (chatInteraction) { - chatInteraction.scrollIntoView({ behavior: 'smooth', block: 'center' }); - setTimeout(() => this.focusInput(), 500); - } - } - - focusInput() { - const inputField = document.querySelector('#chatInteraction .chat-input'); - if (inputField) { - inputField.focus(); - } - } - - addMessage(sender, text, timestamp = Date.now()) { - this.messages.push({ - sender: sender, - text: text, - timestamp: timestamp - }); - - // Keep only last 50 messages - if (this.messages.length > 50) { - this.messages = this.messages.slice(-50); - } - - this.saveChatHistory(); - this.updateChatDisplay(); - } - - updateChatDisplay() { - const chatMessages = document.querySelector('#chatInteraction .chat-messages'); - if (chatMessages) { - // Clear existing messages except typing indicator - const typingIndicator = chatMessages.querySelector('.typing-indicator'); - chatMessages.innerHTML = ''; - - // Add all messages - this.messages.forEach(msg => { - const messageDiv = document.createElement('div'); - messageDiv.className = `chat-message ${msg.sender}`; - messageDiv.innerHTML = ` -
${this.escapeHtml(msg.text)}
-
${this.formatTime(msg.timestamp)}
- `; - chatMessages.appendChild(messageDiv); - }); - - // Re-add typing indicator if needed - if (typingIndicator && this.isTyping) { - chatMessages.appendChild(typingIndicator); - } - - this.scrollToBottom(); - } - } - - async sendMessage() { - const inputField = document.querySelector('#chatInteraction .chat-input'); - const message = inputField?.value?.trim(); - - if (!message || this.isTyping) return; - - // Add user message - this.addMessage('user', message); - inputField.value = ''; - - // Show typing indicator - this.showTypingIndicator(); - this.isTyping = true; - - try { - const response = await fetch('scripts/add/send.php', { - method: 'POST', - headers: { - 'Content-Type': 'application/json', - }, - body: JSON.stringify({ - type: 'chat', - message: message, - session_id: this.sessionId - }) - }); - - const data = await response.json(); - - if (data.success) { - this.addMessage('ki', data.data.ai_response, data.data.timestamp); - } else { - this.addMessage('ki', 'Entschuldigung, es gab ein Problem. Bitte versuchen Sie es später erneut.'); - } - } catch (error) { - console.error('Chat error:', error); - this.addMessage('ki', 'Verbindung zum Server fehlgeschlagen. Bitte überprüfen Sie Ihre Internetverbindung.'); - } finally { - this.hideTypingIndicator(); - this.isTyping = false; - } - } - - showTypingIndicator() { - const chatMessages = document.querySelector('#chatInteraction .chat-messages'); - if (chatMessages && !chatMessages.querySelector('.typing-indicator')) { - const typingHTML = ` -
-
-
- - - -
-
-
- `; - chatMessages.insertAdjacentHTML('beforeend', typingHTML); - this.scrollToBottom(); - } - } - - hideTypingIndicator() { - const typingIndicator = document.querySelector('#chatInteraction .typing'); - if (typingIndicator) { - typingIndicator.remove(); - } - } - - scrollToBottom() { - const chatMessages = document.querySelector('#chatInteraction .chat-messages'); - if (chatMessages) { - chatMessages.scrollTop = chatMessages.scrollHeight; - } - } - - saveChatHistory() { - try { - localStorage.setItem(`ki_chat_${this.sessionId}`, JSON.stringify(this.messages)); - } catch (e) { - console.warn('Could not save chat history:', e); - } - } - - loadChatHistory() { - try { - const saved = localStorage.getItem(`ki_chat_${this.sessionId}`); - if (saved) { - this.messages = JSON.parse(saved); - } - } catch (e) { - console.warn('Could not load chat history:', e); - } - } - - formatTime(timestamp) { - const date = new Date(timestamp); - return date.toLocaleTimeString('de-DE', { - hour: '2-digit', - minute: '2-digit' - }); - } - - escapeHtml(text) { - const div = document.createElement('div'); - div.textContent = text; - return div.innerHTML; - } -} - -// Initialize chat when DOM is ready -document.addEventListener('DOMContentLoaded', () => { - window.kiChat = new KIChat(); -}); - -// Add CSS for enhanced chat functionality -const chatStyles = ` -#chatInteraction { - display: flex; - flex-direction: column; - gap: 15px; -} - -#chatInteraction h3 { - margin: 0; - font-size: 24px; - color: var(--primary-dark); - text-align: center; -} - -#chatInteraction p { - margin: 0; - color: var(--primary-mid); - text-align: center; - font-size: 16px; - line-height: 1.5; -} - -#chatInteraction .card-visual { - height: 400px; -} - -#chatInteraction .chat-window { - width: 100%; - height: 400px; - background: white; - border-radius: 12px; - box-shadow: 0 4px 20px rgba(79, 71, 71, 0.1); - display: flex; - flex-direction: column; - overflow: hidden; -} - -#chatInteraction .chat-header { - background: linear-gradient(135deg, var(--accent-teal), var(--accent-green)); - color: white; - padding: 15px 20px; - font-weight: 600; - font-size: 16px; -} - -#chatInteraction .chat-messages { - flex: 1; - padding: 20px; - overflow-y: auto !important; - background: transparent; - max-height: 300px !important; - display: flex; - flex-direction: column; - gap: 12px; - min-height: 0; - align-items: flex-start; - justify-content: flex-start; -} - -#chatInteraction .chat-message { - display: flex; - width: 100%; - background: transparent; -} - -#chatInteraction .chat-message.user { - justify-content: flex-end; -} - -#chatInteraction .chat-message.ki { - justify-content: flex-start; -} - -#chatInteraction .message-content { - background: transparent; - padding: 12px 16px; - border-radius: 16px; - box-shadow: none; - word-wrap: break-word; - line-height: 1.4; - max-width: 70%; - display: inline-block; - text-align: left; -} - -#chatInteraction .chat-message.user .message-content { - background: var(--accent-green); - color: white; -} - -#chatInteraction .chat-message.ki .message-content { - background: var(--accent-green); - color: white; -} - -#chatInteraction .message-time { - font-size: 10px; - color: #666; - margin-top: 4px; - padding: 0 16px; -} - -#chatInteraction .chat-message.ki .message-time { - text-align: left; -} - -#chatInteraction .chat-message.user .message-time { - text-align: right; -} - -#chatInteraction .chat-input-container .interaction-btn { - flex-shrink: 0; - padding: 12px 20px; - font-size: 14px; -} - -#chatInteraction .chat-send { - background: var(--accent-teal); - color: white; - border: none; - border-radius: 50%; - width: 45px; - height: 45px; - display: flex; - align-items: center; - justify-content: center; - cursor: pointer; - transition: all 0.3s ease; - flex-shrink: 0; - padding: 0; - margin-left: 8px; - box-shadow: 0 2px 8px rgba(38, 166, 154, 0.3); -} - -#chatInteraction .chat-send:hover { - background: #1e8e82; - transform: scale(1.05); - box-shadow: 0 4px 12px rgba(38, 166, 154, 0.4); -} - -#chatInteraction .chat-send:active { - transform: scale(0.95); -} - -#chatInteraction .chat-send img { - width: 22px; - height: 22px; - filter: brightness(0) invert(1); - object-fit: contain; -} - -/* Responsive adjustments */ -@media (max-width: 768px) { - #chatInteraction .card-visual { - min-height: 350px; - } - - #chatInteraction .chat-messages { - min-height: 200px; - padding: 15px; - } - - #chatInteraction .chat-input-container { - padding: 12px 15px; - } - - #chatInteraction .chat-input { - padding: 10px 14px; - } - - #chatInteraction .chat-send { - padding: 10px 16px; - font-size: 13px; - } -} -`; - -// Inject CSS -const styleSheet = document.createElement('style'); -styleSheet.textContent = chatStyles; -document.head.appendChild(styleSheet); diff --git a/Profice WebSite/scripts/cursor-simple.js b/Profice WebSite/scripts/cursor-simple.js deleted file mode 100644 index 6460222..0000000 --- a/Profice WebSite/scripts/cursor-simple.js +++ /dev/null @@ -1,227 +0,0 @@ -// Simple cursor.js - Fixed version with better line effects -document.addEventListener("DOMContentLoaded", function () { - // Check if touch device - if (window.matchMedia("(pointer: coarse)").matches) return; - - const toggleBtn = document.getElementById('cursorToggle'); - const body = document.body; - - // Start with system cursor - let isCustomCursor = false; - - function updateCursorState() { - if (isCustomCursor) { - body.classList.remove('system-cursor'); - if (toggleBtn) { - toggleBtn.classList.add('active'); - } - } else { - body.classList.add('system-cursor'); - if (toggleBtn) { - toggleBtn.classList.remove('active'); - } - } - } - - // Initialize cursor state - updateCursorState(); - - // Toggle button click handler - if (toggleBtn) { - toggleBtn.addEventListener('click', () => { - isCustomCursor = !isCustomCursor; - localStorage.setItem('customCursor', isCustomCursor); - updateCursorState(); - }); - } - - // Create canvas for custom cursor - const canvas = document.createElement("canvas"); - canvas.id = "custom-cursor"; - canvas.style.cssText = ` - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - pointer-events: none; - z-index: 999999; - display: none; - `; - document.body.appendChild(canvas); - - const ctx = canvas.getContext("2d"); - const tentacles = []; - const mouse = { x: 0, y: 0 }; - const oldMouse = { x: 0, y: 0 }; - - // Mouse move handler - document.addEventListener("mousemove", (e) => { - mouse.x = e.clientX; - mouse.y = e.clientY; - - if (isCustomCursor) { - canvas.style.display = 'block'; - } else { - canvas.style.display = 'none'; - } - }); - - // Window resize handler - window.addEventListener("resize", () => { - canvas.width = window.innerWidth; - canvas.height = window.innerHeight; - }); - - // Tentacle class with better line effects - class Tentacle { - constructor(x, y, targetX, targetY) { - this.startX = x; - this.startY = y; - this.endX = targetX; - this.endY = targetY; - this.life = 1.0; - this.decay = 0.015; - this.growth = 0; - this.maxLength = 0; - } - - update() { - // Grow the tentacle - if (this.growth < 1.0) { - this.growth += 0.1; - } - - // Calculate actual end point based on growth - const currentEndX = this.startX + (this.endX - this.startX) * this.growth; - const currentEndY = this.startY + (this.endY - this.startY) * this.growth; - - this.currentEndX = currentEndX; - this.currentEndY = currentEndY; - - // Decay over time - this.life -= this.decay; - } - - draw(ctx) { - if (this.life <= 0) return; - - const opacity = this.life * this.growth; - - // Draw main line with gradient effect - const gradient = ctx.createLinearGradient( - this.startX, this.startY, - this.currentEndX, this.currentEndY - ); - gradient.addColorStop(0, `rgba(20, 20, 20, ${opacity * 0.8})`); - gradient.addColorStop(1, `rgba(20, 20, 20, ${opacity * 0.2})`); - - ctx.strokeStyle = gradient; - ctx.lineWidth = 3 * opacity * this.growth; - ctx.lineCap = 'round'; - ctx.beginPath(); - ctx.moveTo(this.startX, this.startY); - ctx.lineTo(this.currentEndX, this.currentEndY); - ctx.stroke(); - - // Draw glowing endpoint - const glowSize = 6 * opacity; - const glowGradient = ctx.createRadialGradient( - this.currentEndX, this.currentEndY, 0, - this.currentEndX, this.currentEndY, glowSize - ); - glowGradient.addColorStop(0, `rgba(20, 20, 20, ${opacity})`); - glowGradient.addColorStop(1, `rgba(20, 20, 20, 0)`); - - ctx.fillStyle = glowGradient; - ctx.beginPath(); - ctx.arc(this.currentEndX, this.currentEndY, glowSize, 0, Math.PI * 2); - ctx.fill(); - - // Draw connection dots along the line - const dotCount = 3; - for (let i = 1; i <= dotCount; i++) { - const t = i / (dotCount + 1); - const dotX = this.startX + (this.currentEndX - this.startX) * t; - const dotY = this.startY + (this.currentEndY - this.startY) * t; - const dotOpacity = opacity * (1 - t) * 0.5; - - ctx.fillStyle = `rgba(20, 20, 20, ${dotOpacity})`; - ctx.beginPath(); - ctx.arc(dotX, dotY, 2, 0, Math.PI * 2); - ctx.fill(); - } - } - } - - // Animation loop - function animate() { - if (!isCustomCursor) { - requestAnimationFrame(animate); - return; - } - - ctx.clearRect(0, 0, canvas.width, canvas.height); - - // Create new tentacles on movement - const dx = mouse.x - oldMouse.x; - const dy = mouse.y - oldMouse.y; - const distance = Math.sqrt(dx * dx + dy * dy); - - if (distance > 3) { - // Create multiple tentacles in movement direction - const angle = Math.atan2(dy, dx); - const spread = 0.3; - - for (let i = 0; i < 4; i++) { - const spreadAngle = angle + (Math.random() - 0.5) * spread; - const length = 60 + Math.random() * 80; - const targetX = mouse.x + Math.cos(spreadAngle) * length; - const targetY = mouse.y + Math.sin(spreadAngle) * length; - tentacles.push(new Tentacle(mouse.x, mouse.y, targetX, targetY)); - } - - oldMouse.x = mouse.x; - oldMouse.y = mouse.y; - } - - // Update and draw tentacles - for (let i = tentacles.length - 1; i >= 0; i--) { - const tentacle = tentacles[i]; - tentacle.update(); - if (tentacle.life <= 0) { - tentacles.splice(i, 1); - } else { - tentacle.draw(ctx); - } - } - - // Limit tentacle count - if (tentacles.length > 15) { - tentacles.splice(0, tentacles.length - 15); - } - - // Draw cursor point with glow - const cursorGradient = ctx.createRadialGradient( - mouse.x, mouse.y, 0, - mouse.x, mouse.y, 8 - ); - cursorGradient.addColorStop(0, 'rgba(20, 20, 20, 0.8)'); - cursorGradient.addColorStop(1, 'rgba(20, 20, 20, 0)'); - - ctx.fillStyle = cursorGradient; - ctx.beginPath(); - ctx.arc(mouse.x, mouse.y, 6, 0, Math.PI * 2); - ctx.fill(); - - // Add central bright point - ctx.fillStyle = 'rgba(255, 255, 255, 0.9)'; - ctx.beginPath(); - ctx.arc(mouse.x, mouse.y, 2, 0, Math.PI * 2); - ctx.fill(); - - requestAnimationFrame(animate); - } - - animate(); -}); diff --git a/Profice WebSite/scripts/cursor.js b/Profice WebSite/scripts/cursor.js deleted file mode 100644 index 503a321..0000000 --- a/Profice WebSite/scripts/cursor.js +++ /dev/null @@ -1,256 +0,0 @@ -// cursor.js - -document.addEventListener("DOMContentLoaded", function () { - if (window.matchMedia("(pointer: coarse)").matches) return; - - // --- SETTINGS --- - const CONFIG = { - tentacleCount: 8, - triggerDist: 10, - maxLength: 300, - connectionDist: 150, - thickness: 1, - color: "rgba(20, 20, 20, 1)", - prediction: 3.5 - }; - - - const toggleBtn = document.getElementById('cursorToggle'); - const body = document.body; - - // Default to system cursor (disabled custom cursor) - let isCursorDisabled = localStorage.getItem('venomCursorDisabled') !== 'false'; - - function updateCursorState() { - if (isCursorDisabled) { - // System cursor (default) - show spidy icon - body.classList.add('system-cursor'); - if (toggleBtn) { - toggleBtn.classList.remove('active'); - let icon = toggleBtn.querySelector('.cursor-icon'); - if (icon) { - // Replace img with spidy.png if needed - if (icon.tagName !== 'IMG') { - const newIcon = document.createElement('img'); - newIcon.className = 'cursor-icon'; - newIcon.alt = 'Spider Cursor'; - - // Check if we're on a page in the sites/ folder - const currentPath = window.location.pathname; - const isInSitesFolder = currentPath.includes('/sites/'); - const imagePath = isInSitesFolder ? '../images/additional/spidy.png' : 'images/additional/spidy.png'; - newIcon.src = imagePath; - - icon.parentNode.replaceChild(newIcon, icon); - } else { - // Update existing img - const currentPath = window.location.pathname; - const isInSitesFolder = currentPath.includes('/sites/'); - const imagePath = isInSitesFolder ? '../images/additional/spidy.png' : 'images/additional/spidy.png'; - icon.src = imagePath; - } - } - } - } else { - // Custom cursor (secondary) - show standard cursor icon - body.classList.remove('system-cursor'); - if (toggleBtn) { - toggleBtn.classList.add('active'); - let icon = toggleBtn.querySelector('.cursor-icon'); - if (icon) { - // Replace img with cursor.png if needed - if (icon.tagName !== 'IMG') { - const newIcon = document.createElement('img'); - newIcon.className = 'cursor-icon'; - newIcon.alt = 'Custom Cursor'; - - // Check if we're on a page in the sites/ folder - const currentPath = window.location.pathname; - const isInSitesFolder = currentPath.includes('/sites/'); - const imagePath = isInSitesFolder ? '../images/additional/cursor.png' : 'images/additional/cursor.png'; - newIcon.src = imagePath; - - icon.parentNode.replaceChild(newIcon, icon); - } else { - // Update existing img - const currentPath = window.location.pathname; - const isInSitesFolder = currentPath.includes('/sites/'); - const imagePath = isInSitesFolder ? '../images/additional/cursor.png' : 'images/additional/cursor.png'; - icon.src = imagePath; - } - } - } - } - } - - updateCursorState(); - - if (toggleBtn) { - toggleBtn.addEventListener('click', () => { - isCursorDisabled = !isCursorDisabled; - localStorage.setItem('venomCursorDisabled', isCursorDisabled); - updateCursorState(); - }); - } - - function initCursor() { - const canvas = document.createElement("canvas"); - canvas.id = "venom-cursor"; - document.body.appendChild(canvas); - - const ctx = canvas.getContext("2d"); - const width = window.innerWidth; - const height = window.innerHeight; - canvas.width = width; - canvas.height = height; - - const tentacles = []; - const mouse = { x: 0, y: 0 }; - const oldMouse = { x: 0, y: 0 }; - - document.addEventListener("mousemove", (e) => { - mouse.x = e.clientX; - mouse.y = e.clientY; - }); - - window.addEventListener("resize", () => { - canvas.width = window.innerWidth; - canvas.height = window.innerHeight; - }); - - return { canvas, ctx, tentacles, mouse, oldMouse }; - } - - const cursorElements = initCursor(); - const canvas = cursorElements.canvas; - const ctx = cursorElements.ctx; - const tentacles = cursorElements.tentacles; - const mouse = cursorElements.mouse; - const oldMouse = cursorElements.oldMouse; - - class Tentacle { - constructor(mx, my, targetX, targetY) { - this.dead = false; - this.anchor = { x: targetX, y: targetY }; - this.currentDist = 0; // For calculating connection opacity - } - - update(currentMouse) { - const dx = currentMouse.x - this.anchor.x; - const dy = currentMouse.y - this.anchor.y; - this.currentDist = Math.sqrt(dx*dx + dy*dy); - - if (this.currentDist > CONFIG.maxLength) { - this.dead = true; - } - } - - draw(ctx, currentMouse) { - if (this.dead) return; - - // Tension (0..1) - const tension = Math.min(this.currentDist / CONFIG.maxLength, 1); - const dynamicThickness = CONFIG.thickness * (1 - tension * 0.9); - - // Draw main line (Cursor -> Anchor) - ctx.beginPath(); - ctx.moveTo(currentMouse.x, currentMouse.y); - ctx.lineTo(this.anchor.x, this.anchor.y); - - ctx.lineWidth = Math.max(0.2, dynamicThickness); - ctx.strokeStyle = CONFIG.color; - ctx.lineCap = "butt"; - ctx.stroke(); - - // Draw anchor point - ctx.beginPath(); - ctx.arc(this.anchor.x, this.anchor.y, 1.5 * (1 - tension), 0, Math.PI * 2); - ctx.fillStyle = CONFIG.color; - ctx.fill(); - } - } - - function render() { - if (isCursorDisabled) { - requestAnimationFrame(render); - return; - } - - ctx.clearRect(0, 0, canvas.width, canvas.height); - - // 1. Create new tentacles on movement - const distMoved = Math.hypot(mouse.x - oldMouse.x, mouse.y - oldMouse.y); - - if (distMoved > CONFIG.triggerDist) { - const vx = mouse.x - oldMouse.x; - const vy = mouse.y - oldMouse.y; - - // "Spread" of shots increased slightly for better geometry - const targetX = mouse.x + vx * CONFIG.prediction + (Math.random() - 0.5) * 60; - const targetY = mouse.y + vy * CONFIG.prediction + (Math.random() - 0.5) * 60; - - tentacles.push(new Tentacle(mouse.x, mouse.y, targetX, targetY)); - oldMouse.x = mouse.x; - oldMouse.y = mouse.y; - } - - // Remove old ones (FIFO) - if (tentacles.length > CONFIG.tentacleCount) { - tentacles.shift(); - } - - // 2. Draw main tentacles - for (let i = tentacles.length - 1; i >= 0; i--) { - const t = tentacles[i]; - t.update(mouse); - if (t.dead) { - tentacles.splice(i, 1); - } else { - t.draw(ctx, mouse); - } - } - - // 3. DRAW CONNECTIONS BETWEEN ANCHORS (New logic) - // Iterate through all pairs of active tentacles - ctx.beginPath(); // Begin common path for optimization - ctx.lineWidth = 0.5; // Connections are always thin - - for (let i = 0; i < tentacles.length; i++) { - for (let j = i + 1; j < tentacles.length; j++) { - const t1 = tentacles[i]; - const t2 = tentacles[j]; - - // Calculate distance between ends of two tentacles - const dx = t1.anchor.x - t2.anchor.x; - const dy = t1.anchor.y - t2.anchor.y; - const dist = Math.sqrt(dx*dx + dy*dy); - - // If they are close to each other — connect - if (dist < CONFIG.connectionDist) { - // Opacity depends on how far apart they are - // And how much the tentacles themselves are stretched - const alpha = (1 - dist / CONFIG.connectionDist) * 0.6; - - ctx.beginPath(); // New path for each to control opacity - ctx.strokeStyle = `rgba(20, 20, 20, ${alpha})`; - ctx.moveTo(t1.anchor.x, t1.anchor.y); - ctx.lineTo(t2.anchor.x, t2.anchor.y); - ctx.stroke(); - } - } - } - - // 4. Cursor (Rhombus) - ctx.beginPath(); - ctx.fillStyle = CONFIG.color; - ctx.moveTo(mouse.x, mouse.y - 5); - ctx.lineTo(mouse.x + 5, mouse.y); - ctx.lineTo(mouse.x, mouse.y + 5); - ctx.lineTo(mouse.x - 5, mouse.y); - ctx.fill(); - - requestAnimationFrame(render); - } - - render(); -}); \ No newline at end of file diff --git a/Profice WebSite/scripts/cursor.min.js b/Profice WebSite/scripts/cursor.min.js deleted file mode 100644 index b82cce9..0000000 --- a/Profice WebSite/scripts/cursor.min.js +++ /dev/null @@ -1 +0,0 @@ -// cursor.js document.addEventListener("DOMContentLoaded", function (){if (window.matchMedia("(pointer: coarse)").matches) return;// --- SETTINGS --- const CONFIG ={tentacleCount: 8, triggerDist: 10, maxLength: 300, connectionDist: 150, thickness: 1, color: "rgba(20, 20, 20, 1)", prediction: 3.5};const toggleBtn = document.getElementById('cursorToggle');const body = document.body;// Default to system cursor (disabled custom cursor) let isCursorDisabled = localStorage.getItem('venomCursorDisabled') !== 'false';function updateCursorState(){if (isCursorDisabled){// System cursor (default) - show spidy icon body.classList.add('system-cursor');if (toggleBtn){toggleBtn.classList.remove('active');const icon = toggleBtn.querySelector('.cursor-icon');if (icon){// Check if we're on a page in the sites/ folder const currentPath = window.location.pathname;const isInSitesFolder = currentPath.includes('/sites/');const imagePath = isInSitesFolder ? '../images/additional/spidy.png' : 'images/additional/spidy.png';icon.src = imagePath;}}}else{// Custom cursor (secondary) - show cursor icon body.classList.remove('system-cursor');if (toggleBtn){toggleBtn.classList.add('active');const icon = toggleBtn.querySelector('.cursor-icon');if (icon){// Check if we're on a page in the sites/ folder const currentPath = window.location.pathname;const isInSitesFolder = currentPath.includes('/sites/');const imagePath = isInSitesFolder ? '../images/additional/cursor.png' : 'images/additional/cursor.png';icon.src = imagePath;}}}}updateCursorState();if (toggleBtn){toggleBtn.addEventListener('click', () =>{isCursorDisabled = !isCursorDisabled;localStorage.setItem('venomCursorDisabled', isCursorDisabled);updateCursorState();});}const canvas = document.createElement("canvas");canvas.id = "venom-cursor";document.body.appendChild(canvas);const ctx = canvas.getContext("2d");const width = window.innerWidth;const height = window.innerHeight;canvas.width = width;canvas.height = height;const tentacles = [];const mouse ={x: 0, y: 0};const oldMouse ={x: 0, y: 0};document.addEventListener("mousemove", (e) =>{mouse.x = e.clientX;mouse.y = e.clientY;});window.addEventListener("resize", () =>{canvas.width = window.innerWidth;canvas.height = window.innerHeight;});class Tentacle{constructor(mx, my, targetX, targetY){this.dead = false;this.anchor ={x: targetX, y: targetY};this.currentDist = 0;// For calculating connection opacity}update(currentMouse){const dx = currentMouse.x - this.anchor.x;const dy = currentMouse.y - this.anchor.y;this.currentDist = Math.sqrt(dx*dx + dy*dy);if (this.currentDist > CONFIG.maxLength){this.dead = true;}}draw(ctx, currentMouse){if (this.dead) return;// Tension (0..1) const tension = Math.min(this.currentDist / CONFIG.maxLength, 1);const dynamicThickness = CONFIG.thickness * (1 - tension * 0.9);// Draw main line (Cursor -> Anchor) ctx.beginPath();ctx.moveTo(currentMouse.x, currentMouse.y);ctx.lineTo(this.anchor.x, this.anchor.y);ctx.lineWidth = Math.max(0.2, dynamicThickness);ctx.strokeStyle = CONFIG.color;ctx.lineCap = "butt";ctx.stroke();// Draw anchor point ctx.beginPath();ctx.arc(this.anchor.x, this.anchor.y, 1.5 * (1 - tension), 0, Math.PI * 2);ctx.fillStyle = CONFIG.color;ctx.fill();}}function render(){ctx.clearRect(0, 0, width, height);// 1. Create new tentacles on movement const distMoved = Math.hypot(mouse.x - oldMouse.x, mouse.y - oldMouse.y);if (distMoved > CONFIG.triggerDist){const vx = mouse.x - oldMouse.x;const vy = mouse.y - oldMouse.y;// "Spread" of shots increased slightly for better geometry const targetX = mouse.x + vx * CONFIG.prediction + (Math.random() - 0.5) * 60;const targetY = mouse.y + vy * CONFIG.prediction + (Math.random() - 0.5) * 60;tentacles.push(new Tentacle(mouse.x, mouse.y, targetX, targetY));oldMouse.x = mouse.x;oldMouse.y = mouse.y;}// Remove old ones (FIFO) if (tentacles.length > CONFIG.tentacleCount){tentacles.shift();}// 2. Draw main tentacles for (let i = tentacles.length - 1;i >= 0;i--){const t = tentacles[i];t.update(mouse);if (t.dead){tentacles.splice(i, 1);}else{t.draw(ctx, mouse);}}// 3. DRAW CONNECTIONS BETWEEN ANCHORS (New logic) // Iterate through all pairs of active tentacles ctx.beginPath();// Begin common path for optimization ctx.lineWidth = 0.5;// Connections are always thin for (let i = 0;i < tentacles.length;i++){for (let j = i + 1;j < tentacles.length;j++){const t1 = tentacles[i];const t2 = tentacles[j];// Calculate distance between ends of two tentacles const dx = t1.anchor.x - t2.anchor.x;const dy = t1.anchor.y - t2.anchor.y;const dist = Math.sqrt(dx*dx + dy*dy);// If they are close to each other — connect if (dist < CONFIG.connectionDist){// Opacity depends on how far apart they are // And how much the tentacles themselves are stretched const alpha = (1 - dist / CONFIG.connectionDist) * 0.6;ctx.beginPath();// New path for each to control opacity ctx.strokeStyle = `rgba(20, 20, 20, ${alpha})`;ctx.moveTo(t1.anchor.x, t1.anchor.y);ctx.lineTo(t2.anchor.x, t2.anchor.y);ctx.stroke();}}}// 4. Cursor (Rhombus) ctx.beginPath();ctx.fillStyle = CONFIG.color;ctx.moveTo(mouse.x, mouse.y - 5);ctx.lineTo(mouse.x + 5, mouse.y);ctx.lineTo(mouse.x, mouse.y + 5);ctx.lineTo(mouse.x - 5, mouse.y);ctx.fill();requestAnimationFrame(render);}render();}); \ No newline at end of file diff --git a/Profice WebSite/scripts/leads.js b/Profice WebSite/scripts/leads.js deleted file mode 100644 index 18fb993..0000000 --- a/Profice WebSite/scripts/leads.js +++ /dev/null @@ -1,75 +0,0 @@ -// leads.js - -// ========================================== -// 1. MENU TOGGLE -// ========================================== -const menuToggle = document.getElementById('menuToggle'); -const slideMenu = document.getElementById('slideMenu'); -const overlay = document.getElementById('overlay'); - -if (menuToggle && slideMenu && overlay) { - function toggleMenu() { - menuToggle.classList.toggle('active'); - slideMenu.classList.toggle('active'); - overlay.classList.toggle('active'); - } - - menuToggle.addEventListener('click', toggleMenu); - overlay.addEventListener('click', toggleMenu); -} - -// ========================================== -// 2. LEADS TABLE LOGIC -// ========================================== - -function getLeads() { - const storedLeads = localStorage.getItem('myLeads'); - if (storedLeads) { - return JSON.parse(storedLeads); - } else { - return []; - } -} - -function populateLeadsTable() { - const tableBody = document.getElementById('leadsTableBody'); - const leadsData = getLeads(); - - if (!tableBody) return; - - if (leadsData.length === 0) { - tableBody.innerHTML = ` - - -

Keine Anfragen vorhanden

- - - `; - return; - } - - tableBody.innerHTML = leadsData.map(lead => ` - - ${lead.datum} - ${lead.dienstleistung} - - ${lead.statusText} - - - Details ansehen - - - `).join(''); - - document.querySelectorAll('.action-btn').forEach(btn => { - btn.addEventListener('click', function(e) { - e.preventDefault(); - const leadId = this.getAttribute('data-id'); - - // Redirect to lead details page - window.location.href = `lead-details.html?id=${leadId}`; - }); - }); -} - -document.addEventListener('DOMContentLoaded', populateLeadsTable); \ No newline at end of file diff --git a/Profice WebSite/scripts/leads.min.js b/Profice WebSite/scripts/leads.min.js deleted file mode 100644 index 7e40a41..0000000 --- a/Profice WebSite/scripts/leads.min.js +++ /dev/null @@ -1 +0,0 @@ -// leads.js // ========================================== // 1. MENU TOGGLE // ========================================== const menuToggle = document.getElementById('menuToggle');const slideMenu = document.getElementById('slideMenu');const overlay = document.getElementById('overlay');if (menuToggle && slideMenu && overlay){function toggleMenu(){menuToggle.classList.toggle('active');slideMenu.classList.toggle('active');overlay.classList.toggle('active');}menuToggle.addEventListener('click', toggleMenu);overlay.addEventListener('click', toggleMenu);}// ========================================== // 2. LEADS TABLE LOGIC // ========================================== function getLeads(){const storedLeads = localStorage.getItem('myLeads');if (storedLeads){return JSON.parse(storedLeads);}else{return [];}}function populateLeadsTable(){const tableBody = document.getElementById('leadsTableBody');const leadsData = getLeads();if (!tableBody) return;if (leadsData.length === 0){tableBody.innerHTML = `

Keine Anfragen vorhanden

`;return;}tableBody.innerHTML = leadsData.map(lead => ` ${lead.datum} ${lead.dienstleistung} ${lead.statusText} Details ansehen `).join('');document.querySelectorAll('.action-btn').forEach(btn =>{btn.addEventListener('click', function(e){e.preventDefault();const leadId = this.getAttribute('data-id');// Redirect to lead details page window.location.href = `lead-details.html?id=${leadId}`;});});}document.addEventListener('DOMContentLoaded', populateLeadsTable); \ No newline at end of file diff --git a/Profice WebSite/scripts/script.js b/Profice WebSite/scripts/script.js deleted file mode 100644 index e87dcd5..0000000 --- a/Profice WebSite/scripts/script.js +++ /dev/null @@ -1,138 +0,0 @@ -/** - * Main Script - Profice Website - * All API calls go through server-side PHP - * Includes fallback for local file access (no server) - * - * @version 2.1.0 - */ - -document.addEventListener("DOMContentLoaded", function() { - - const API_ENDPOINT = 'scripts/add/send.php'; - const isLocalFile = window.location.protocol === 'file:'; - - // ========================================== - // 1. SMOOTH SCROLLING - // ========================================== - - function initSmoothScrolling() { - document.querySelectorAll('a[href^="#"]').forEach(link => { - link.addEventListener('click', function(e) { - const targetId = this.getAttribute('href'); - if (targetId === '#') return; - - const targetElement = document.querySelector(targetId); - if (targetElement) { - e.preventDefault(); - const header = document.querySelector('.top-banner'); - const headerHeight = header ? header.offsetHeight : 90; - - window.scrollTo({ - top: targetElement.offsetTop - headerHeight - 20, - behavior: 'smooth' - }); - - history.pushState(null, null, targetId); - } - }); - }); - } - - initSmoothScrolling(); - - // ========================================== - // 2. MENU TOGGLE - // ========================================== - - const menuToggle = document.getElementById('menuToggle'); - const slideMenu = document.getElementById('slideMenu'); - const overlay = document.getElementById('overlay'); - - if (menuToggle && slideMenu && overlay) { - const toggleMenu = () => { - menuToggle.classList.toggle('active'); - slideMenu.classList.toggle('active'); - overlay.classList.toggle('active'); - }; - menuToggle.addEventListener('click', toggleMenu); - overlay.addEventListener('click', toggleMenu); - } - - // ========================================== - // 3. LOGIN BUTTON (REMOVED) - // ========================================== - - // Login button functionality has been removed - - // ========================================== - // 4. FORM SUBMISSION - // ========================================== - - const contactForm = document.getElementById('contactForm'); - const successMessage = document.getElementById('successMessage'); - - if (contactForm) { - contactForm.addEventListener('submit', async function(e) { - e.preventDefault(); - - const getValue = (id) => { - const el = document.getElementById(id); - return el ? el.value : ''; - }; - - const serviceSelect = document.getElementById('service'); - const selectedServiceText = serviceSelect ? - serviceSelect.options[serviceSelect.selectedIndex].text : 'Dienstleistung'; - - const formData = { - type: 'contact', - name: getValue('name'), - organisation: getValue('organisation'), - contact: getValue('contact'), - service: getValue('service'), - budget: getValue('budget'), - description: getValue('description') - }; - - // Always store locally for dashboard - try { - const localLead = { - id: Date.now(), - datum: new Date().toLocaleDateString('de-DE'), - dienstleistung: selectedServiceText, - status: 'open', - statusText: 'Offen', - description: formData.description - }; - const existingLeads = JSON.parse(localStorage.getItem('myLeads') || '[]'); - existingLeads.unshift(localLead); - localStorage.setItem('myLeads', JSON.stringify(existingLeads.slice(0, 100))); - } catch (err) {} - - // Send to API if not local file - if (!isLocalFile) { - try { - const response = await fetch(API_ENDPOINT, { - method: 'POST', - headers: { 'Content-Type': 'application/json' }, - body: JSON.stringify(formData) - }); - const result = await response.json(); - - if (!result.success) { - alert('Fehler beim Senden: ' + (result.message || 'Unbekannter Fehler')); - return; - } - } catch (error) { - alert('Netzwerkfehler beim Senden des Formulars'); - return; - } - } - - // Show success - contactForm.style.display = 'none'; - if (successMessage) successMessage.classList.add('show'); - contactForm.reset(); - }); - } -}); \ No newline at end of file diff --git a/Profice WebSite/scripts/script.min.js b/Profice WebSite/scripts/script.min.js deleted file mode 100644 index 0e5f84b..0000000 --- a/Profice WebSite/scripts/script.min.js +++ /dev/null @@ -1 +0,0 @@ -document.addEventListener("DOMContentLoaded", function(){const API_ENDPOINT = 'scripts/add/send.php';const isLocalFile = window.location.protocol === 'file:';// ========================================== // 1. SMOOTH SCROLLING // ========================================== function initSmoothScrolling(){document.querySelectorAll('a[href^="#"]').forEach(link =>{link.addEventListener('click', function(e){const targetId = this.getAttribute('href');if (targetId === '#') return;const targetElement = document.querySelector(targetId);if (targetElement){e.preventDefault();const header = document.querySelector('.top-banner');const headerHeight = header ? header.offsetHeight : 90;window.scrollTo({top: targetElement.offsetTop - headerHeight - 20, behavior: 'smooth'});history.pushState(null, null, targetId);}});});}initSmoothScrolling();// ========================================== // 2. MENU TOGGLE // ========================================== const menuToggle = document.getElementById('menuToggle');const slideMenu = document.getElementById('slideMenu');const overlay = document.getElementById('overlay');if (menuToggle && slideMenu && overlay){const toggleMenu = () =>{menuToggle.classList.toggle('active');slideMenu.classList.toggle('active');overlay.classList.toggle('active');};menuToggle.addEventListener('click', toggleMenu);overlay.addEventListener('click', toggleMenu);}// ========================================== // 3. LOGIN BUTTON (REMOVED) // ========================================== // Login button functionality has been removed // ========================================== // 4. FORM SUBMISSION // ========================================== const contactForm = document.getElementById('contactForm');const successMessage = document.getElementById('successMessage');if (contactForm){contactForm.addEventListener('submit', async function(e){e.preventDefault();const getValue = (id) =>{const el = document.getElementById(id);return el ? el.value : '';};const serviceSelect = document.getElementById('service');const selectedServiceText = serviceSelect ? serviceSelect.options[serviceSelect.selectedIndex].text : 'Dienstleistung';const formData ={type: 'contact', name: getValue('name'), organisation: getValue('organisation'), contact: getValue('contact'), service: getValue('service'), budget: getValue('budget'), description: getValue('description')};// Always store locally for dashboard try{const localLead ={id: Date.now(), datum: new Date().toLocaleDateString('de-DE'), dienstleistung: selectedServiceText, status: 'open', statusText: 'Offen', description: formData.description};const existingLeads = JSON.parse(localStorage.getItem('myLeads') || '[]');existingLeads.unshift(localLead);localStorage.setItem('myLeads', JSON.stringify(existingLeads.slice(0, 100)));}catch (err){}// Send to API if not local file if (!isLocalFile){try{const response = await fetch(API_ENDPOINT,{method: 'POST', headers:{'Content-Type': 'application/json'}, body: JSON.stringify(formData)});const result = await response.json();if (!result.success){alert('Fehler beim Senden: ' + (result.message || 'Unbekannter Fehler'));return;}}catch (error){alert('Netzwerkfehler beim Senden des Formulars');return;}}// Show success contactForm.style.display = 'none';if (successMessage) successMessage.classList.add('show');contactForm.reset();});}}); \ No newline at end of file diff --git a/Profice WebSite/scripts/scroll-header.js b/Profice WebSite/scripts/scroll-header.js deleted file mode 100644 index 2b52676..0000000 --- a/Profice WebSite/scripts/scroll-header.js +++ /dev/null @@ -1,170 +0,0 @@ -/** - * Ultra-Smooth Scroll Header - Butter Performance - * Uses advanced techniques for maximum smoothness - */ - -document.addEventListener("DOMContentLoaded", function() { - const topBanner = document.querySelector('.top-banner'); - const slideMenu = document.querySelector('.slide-menu'); - - if (!topBanner) return; - - // Configuration for ultra-smooth performance - const scrollThreshold = 50; - const rafDelay = 8; // 120fps for ultra-smooth - const transitionDuration = 400; // Slightly longer for smoother feel - - // State tracking with performance optimization - let isScrolled = false; - let lastScrollY = 0; - let scrollDirection = 'down'; - let rafId = null; - let lastUpdateTime = 0; - let scrollVelocity = 0; - let lastScrollTime = 0; - - // Calculate scroll velocity for smoother transitions - function calculateVelocity(currentScrollY, currentTime) { - if (lastScrollTime === 0) { - lastScrollTime = currentTime; - return 0; - } - - const timeDelta = currentTime - lastScrollTime; - const scrollDelta = Math.abs(currentScrollY - lastScrollY); - const velocity = scrollDelta / timeDelta; - - lastScrollTime = currentTime; - return velocity; - } - - // Ultra-smooth header state update with velocity-based easing - function updateHeaderState(scrolled, velocity = 0) { - if (scrolled === isScrolled) return; - - // Add velocity-based class for different transition speeds - if (velocity > 5) { - topBanner.classList.add('fast-scroll'); - } else { - topBanner.classList.remove('fast-scroll'); - } - - // Use requestAnimationFrame for smooth DOM updates - requestAnimationFrame(() => { - if (scrolled) { - topBanner.classList.add('scrolled'); - if (slideMenu) { - slideMenu.style.transition = 'top 0.3s cubic-bezier(0.4, 0, 0.2, 1)'; - slideMenu.style.top = '80px'; - } - } else { - topBanner.classList.remove('scrolled'); - if (slideMenu) { - slideMenu.style.transition = 'top 0.3s cubic-bezier(0.4, 0, 0.2, 1)'; - slideMenu.style.top = '110px'; - } - } - }); - - isScrolled = scrolled; - } - - // Advanced scroll handler with velocity detection - function handleScroll(currentTime) { - // Ultra-high frequency throttling - if (currentTime - lastUpdateTime < rafDelay) { - rafId = requestAnimationFrame(handleScroll); - return; - } - - const currentScrollY = window.pageYOffset || document.documentElement.scrollTop; - const velocity = calculateVelocity(currentScrollY, currentTime); - - // Detect scroll direction with hysteresis for stability - const scrollDelta = currentScrollY - lastScrollY; - if (Math.abs(scrollDelta) > 1) { - scrollDirection = scrollDelta > 0 ? 'down' : 'up'; - } - - // Apply hysteresis to prevent flickering - let shouldScroll; - if (scrollDirection === 'down') { - shouldScroll = currentScrollY > scrollThreshold + 10; - } else { - shouldScroll = currentScrollY > scrollThreshold - 10; - } - - updateHeaderState(shouldScroll, velocity); - - lastScrollY = currentScrollY; - lastUpdateTime = currentTime; - rafId = null; - } - - // Optimized scroll listener with passive event - function onScroll() { - if (!rafId) { - rafId = requestAnimationFrame(handleScroll); - } - } - - // Add scroll listener with maximum performance - window.addEventListener('scroll', onScroll, { - passive: true, - capture: false - }); - - // Handle resize with debouncing - let resizeTimeout; - function onResize() { - clearTimeout(resizeTimeout); - resizeTimeout = setTimeout(() => { - lastScrollY = window.pageYOffset || document.documentElement.scrollTop; - updateHeaderState(lastScrollY > scrollThreshold); - }, 100); - } - - window.addEventListener('resize', onResize, { passive: true }); - - // Handle visibility change to pause/resume animations - function onVisibilityChange() { - if (document.hidden) { - if (rafId) { - cancelAnimationFrame(rafId); - rafId = null; - } - } else { - lastScrollY = window.pageYOffset || document.documentElement.scrollTop; - updateHeaderState(lastScrollY > scrollThreshold); - } - } - - document.addEventListener('visibilitychange', onVisibilityChange); - - // Initialize with smooth transition - requestAnimationFrame(() => { - updateHeaderState(window.pageYOffset > scrollThreshold); - }); - - // Add smooth scroll behavior to internal links - document.querySelectorAll('a[href^="#"]').forEach(link => { - link.addEventListener('click', function(e) { - const targetId = this.getAttribute('href'); - if (targetId === '#') return; - - const targetElement = document.querySelector(targetId); - if (targetElement) { - e.preventDefault(); - - // Smooth scroll with header offset - const headerHeight = topBanner.offsetHeight; - const targetPosition = targetElement.offsetTop - headerHeight - 20; - - window.scrollTo({ - top: targetPosition, - behavior: 'smooth' - }); - } - }); - }); -}); diff --git a/Profice WebSite/scripts/scroll-header.min.js b/Profice WebSite/scripts/scroll-header.min.js deleted file mode 100644 index 3354848..0000000 --- a/Profice WebSite/scripts/scroll-header.min.js +++ /dev/null @@ -1 +0,0 @@ -document.addEventListener("DOMContentLoaded",function(){const topBanner=document.querySelector('.top-banner');const slideMenu=document.querySelector('.slide-menu');if(!topBanner)return;const scrollThreshold=50;const rafDelay=8;let isScrolled=false;let lastScrollY=0;let scrollDirection='down';let rafId=null;let lastUpdateTime=0;let scrollVelocity=0;let lastScrollTime=0;function calculateVelocity(currentScrollY,currentTime){if(lastScrollTime===0){lastScrollTime=currentTime;return 0;}const timeDelta=currentTime-lastScrollTime;const scrollDelta=Math.abs(currentScrollY-lastScrollY);const velocity=scrollDelta/timeDelta;lastScrollTime=currentTime;return velocity;}function updateHeaderState(scrolled,velocity=0){if(scrolled===isScrolled)return;if(velocity>5){topBanner.classList.add('fast-scroll');}else{topBanner.classList.remove('fast-scroll');}requestAnimationFrame(()=>{if(scrolled){topBanner.classList.add('scrolled');if(slideMenu){slideMenu.style.transition='top 0.3s cubic-bezier(0.4, 0, 0.2, 1)';slideMenu.style.top='80px';}}else{topBanner.classList.remove('scrolled');if(slideMenu){slideMenu.style.transition='top 0.3s cubic-bezier(0.4, 0, 0.2, 1)';slideMenu.style.top='110px';}}});isScrolled=scrolled;}function handleScroll(currentTime){if(currentTime-lastUpdateTime1){scrollDirection=scrollDelta>0?'down':'up';}let shouldScroll;if(scrollDirection==='down'){shouldScroll=currentScrollY>scrollThreshold+10;}else{shouldScroll=currentScrollY>scrollThreshold-10;}updateHeaderState(shouldScroll,velocity);lastScrollY=currentScrollY;lastUpdateTime=currentTime;rafId=null;}function onScroll(){if(!rafId){rafId=requestAnimationFrame(handleScroll);}}window.addEventListener('scroll',onScroll,{passive:true,capture:false});let resizeTimeout;function onResize(){clearTimeout(resizeTimeout);resizeTimeout=setTimeout(()=>{lastScrollY=window.pageYOffset||document.documentElement.scrollTop;updateHeaderState(lastScrollY>scrollThreshold);},100);}window.addEventListener('resize',onResize,{passive:true});function onVisibilityChange(){if(document.hidden){if(rafId){cancelAnimationFrame(rafId);rafId=null;}}else{lastScrollY=window.pageYOffset||document.documentElement.scrollTop;updateHeaderState(lastScrollY>scrollThreshold);}}document.addEventListener('visibilitychange',onVisibilityChange);requestAnimationFrame(()=>{updateHeaderState(window.pageYOffset>scrollThreshold);});document.querySelectorAll('a[href^="#"]').forEach(link=>{link.addEventListener('click',function(e){const targetId=this.getAttribute('href');if(targetId==='#')return;const targetElement=document.querySelector(targetId);if(targetElement){e.preventDefault();const headerHeight=topBanner.offsetHeight;const targetPosition=targetElement.offsetTop-headerHeight-20;window.scrollTo({top:targetPosition,behavior:'smooth'});}});});}); diff --git a/Profice WebSite/scripts/tech-onepager.js b/Profice WebSite/scripts/tech-onepager.js deleted file mode 100644 index 32ae86a..0000000 --- a/Profice WebSite/scripts/tech-onepager.js +++ /dev/null @@ -1,595 +0,0 @@ -/** - * Tech-Onepager JavaScript - Interactive Elements and Animations - * System being built aesthetic with smooth micro-animations - */ - -document.addEventListener('DOMContentLoaded', function() { - - // ===== GLOBAL VARIABLES ===== - let currentTooltip = null; - - // ===== SYSTEM GRAPHIC ANIMATIONS ===== - const systemGraphic = document.getElementById('systemGraphic'); - const connections = document.getElementById('connections'); - const dataPoints = document.getElementById('dataPoints'); - - if (systemGraphic && connections) { - initializeSystemGraphic(); - } - - function initializeSystemGraphic() { - const nodes = systemGraphic.querySelectorAll('.node'); - const centralNode = systemGraphic.querySelector('.central-node'); - - // Draw connection lines - drawConnections(); - - // Initialize tooltip system - initializeTooltips(); - - // Add node interactions - nodes.forEach(node => { - node.addEventListener('mouseenter', function() { - activateConnection(this); - }); - - node.addEventListener('mouseleave', function() { - deactivateConnections(); - }); - - // Special handling for central node - if (node.classList.contains('central-node')) { - node.addEventListener('click', function() { - triggerCentralNode(this); - }); - } - }); - - // Scroll-based activation - setupScrollActivation(); - } - - // ===== TOOLTIP SYSTEM ===== - function initializeTooltips() { - const nodes = systemGraphic.querySelectorAll('.node[data-tooltip]'); - - nodes.forEach(node => { - let hoverTimeout; - - node.addEventListener('mouseenter', function() { - const tooltip = this.getAttribute('data-tooltip'); - if (!tooltip) return; - - // Clear any existing timeout - clearTimeout(hoverTimeout); - - // Set 1-second delay before showing tooltip - hoverTimeout = setTimeout(() => { - showTooltip(this, tooltip); - }, 1000); - }); - - node.addEventListener('mouseleave', function() { - // Clear the timeout if mouse leaves before 1 second - clearTimeout(hoverTimeout); - - // Hide any visible tooltip - hideTooltip(); - }); - }); - } - - function showTooltip(node, text) { - // Remove any existing tooltip - hideTooltip(); - - // Create tooltip element - const tooltip = document.createElement('div'); - tooltip.className = 'node-tooltip'; - tooltip.textContent = text; - - // Position the tooltip - const nodeRect = node.getBoundingClientRect(); - const systemGraphicRect = systemGraphic.getBoundingClientRect(); - - // Calculate position relative to system graphic - let left = nodeRect.left - systemGraphicRect.left + (nodeRect.width / 2) - 140; // Center horizontally - let top = nodeRect.top - systemGraphicRect.top - 60; // Position above node - - // Adjust if tooltip goes outside bounds - if (left < 10) left = 10; - if (left + 280 > systemGraphicRect.width - 10) left = systemGraphicRect.width - 290; - if (top < 10) top = nodeRect.top - systemGraphicRect.top + nodeRect.height + 10; // Show below if not enough space above - - tooltip.style.left = left + 'px'; - tooltip.style.top = top + 'px'; - - // Add to system graphic - systemGraphic.appendChild(tooltip); - - // Trigger show animation - setTimeout(() => { - tooltip.classList.add('show'); - }, 10); - - currentTooltip = tooltip; - } - - function hideTooltip() { - if (currentTooltip) { - currentTooltip.classList.remove('show'); - setTimeout(() => { - if (currentTooltip && currentTooltip.parentNode) { - currentTooltip.parentNode.removeChild(currentTooltip); - } - currentTooltip = null; - }, 300); - } - } - - // Cleanup function - function cleanupTooltips() { - hideTooltip(); - } - - // Add cleanup on page unload - window.addEventListener('beforeunload', cleanupTooltips); - - function drawConnections() { - const centralNode = systemGraphic.querySelector('.central-node'); - const otherNodes = systemGraphic.querySelectorAll('.node:not(.central-node)'); - - const centralRect = centralNode.getBoundingClientRect(); - const graphicRect = systemGraphic.getBoundingClientRect(); - - const centerX = centralRect.left - graphicRect.left + centralRect.width / 2; - const centerY = centralRect.top - graphicRect.top + centralRect.height / 2; - - connections.innerHTML = ''; - - otherNodes.forEach(node => { - const nodeRect = node.getBoundingClientRect(); - const nodeX = nodeRect.left - graphicRect.left + nodeRect.width / 2; - const nodeY = nodeRect.top - graphicRect.top + nodeRect.height / 2; - - const line = document.createElementNS('http://www.w3.org/2000/svg', 'line'); - line.setAttribute('x1', centerX); - line.setAttribute('y1', centerY); - line.setAttribute('x2', nodeX); - line.setAttribute('y2', nodeY); - line.setAttribute('class', 'connection-line'); - line.setAttribute('data-target', node.dataset.node); - - connections.appendChild(line); - }); - } - - - function triggerCentralNode(node) { - // Add triggered class for growth animation - node.classList.add('triggered'); - - // Activate all connections - const lines = connections.querySelectorAll('.connection-line'); - lines.forEach((line, index) => { - setTimeout(() => { - line.classList.add('active'); - }, index * 100); - }); - - // Remove triggered class after animation - setTimeout(() => { - node.classList.remove('triggered'); - - // Deactivate connections - setTimeout(() => { - lines.forEach(line => line.classList.remove('active')); - }, 500); - }, 2000); - } - - function activateConnection(node) { - const targetNode = node.dataset.node; - const line = connections.querySelector(`[data-target="${targetNode}"]`); - if (line) { - line.classList.add('active'); - } - } - - function deactivateConnections() { - const lines = connections.querySelectorAll('.connection-line'); - lines.forEach(line => line.classList.remove('active')); - } - - function setupScrollActivation() { - const observer = new IntersectionObserver((entries) => { - entries.forEach(entry => { - if (entry.isIntersecting) { - const lines = connections.querySelectorAll('.connection-line'); - lines.forEach((line, index) => { - setTimeout(() => { - line.classList.add('active'); - setTimeout(() => { - line.classList.remove('active'); - }, 2000); - }, index * 200); - }); - } - }); - }, { threshold: 0.5 }); - - observer.observe(systemGraphic); - } - - // ===== PROCESS LINE ANIMATION ===== - const processLine = document.getElementById('processLine'); - const processSteps = document.querySelectorAll('.process-step'); - const processConnectors = document.querySelectorAll('.process-connector'); - const stepDetails = document.querySelectorAll('.step-detail'); - - if (processLine) { - setupProcessAnimation(); - } - - function setupProcessAnimation() { - const observer = new IntersectionObserver((entries) => { - entries.forEach(entry => { - if (entry.isIntersecting) { - animateProcessLine(); - observer.unobserve(entry.target); - } - }); - }, { threshold: 0.3 }); - - observer.observe(processLine); - } - - function animateProcessLine() { - // Animate connectors sequentially - processConnectors.forEach((connector, index) => { - setTimeout(() => { - connector.classList.add('active'); - }, 500 + (index * 500)); - }); - - // Activate steps sequentially - processSteps.forEach((step, index) => { - setTimeout(() => { - step.classList.add('active'); - activateStepDetail(index + 1); - }, 200 + (index * 500)); - }); - } - - function activateStepDetail(stepNumber) { - const detail = document.querySelector(`[data-step-detail="${stepNumber}"]`); - if (detail) { - setTimeout(() => { - detail.classList.add('active'); - }, 300); - } - } - - // Step click interactions - processSteps.forEach((step, index) => { - step.addEventListener('click', () => { - // Reset all steps - processSteps.forEach(s => s.classList.remove('active')); - processConnectors.forEach(c => c.classList.remove('active')); - stepDetails.forEach(d => d.classList.remove('active')); - - // Activate up to clicked step - for (let i = 0; i <= index; i++) { - processSteps[i].classList.add('active'); - activateStepDetail(i + 1); - - if (i < processConnectors.length) { - processConnectors[i].classList.add('active'); - } - } - }); - }); - - // ===== INTERACTION CARD ANIMATIONS ===== - const phoneInteraction = document.getElementById('phoneInteraction'); - const chatInteraction = document.getElementById('chatInteraction'); - - if (phoneInteraction) { - setupPhoneInteraction(); - } - - if (chatInteraction) { - setupChatInteraction(); - } - - function setupPhoneInteraction() { - const microphone = phoneInteraction.querySelector('.microphone'); - const pulseRing = phoneInteraction.querySelector('.pulse-ring'); - const micIcon = phoneInteraction.querySelector('.mic-icon'); - - if (microphone && pulseRing && micIcon) { - microphone.addEventListener('mouseenter', () => { - pulseRing.style.animation = 'pulse 0.8s infinite'; - micIcon.style.transform = 'scale(1.1)'; - }); - - microphone.addEventListener('mouseleave', () => { - pulseRing.style.animation = 'pulse 2s infinite'; - micIcon.style.transform = 'scale(1)'; - }); - - microphone.addEventListener('click', () => { - // Enhanced click animation - microphone.style.transform = 'scale(0.9)'; - micIcon.style.transform = 'scale(0.8)'; - - // Create ripple effect - const ripple = document.createElement('div'); - ripple.style.cssText = ` - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - width: 20px; - height: 20px; - background: rgba(255, 255, 255, 0.5); - border-radius: 50%; - animation: rippleEffect 0.6s ease-out; - pointer-events: none; - `; - microphone.appendChild(ripple); - - setTimeout(() => { - microphone.style.transform = 'scale(1.15)'; - micIcon.style.transform = 'scale(1.1)'; - setTimeout(() => { - microphone.style.transform = 'scale(1)'; - micIcon.style.transform = 'scale(1)'; - ripple.remove(); - }, 200); - }, 100); - - // Show feedback - showInteractionFeedback('KI Telefon wird verbunden...'); - }); - } - } - - function setupChatInteraction() { - const chatWindow = chatInteraction.querySelector('.chat-window'); - const typingIndicator = chatInteraction.querySelector('.typing-indicator'); - const chatHeader = chatInteraction.querySelector('.chat-header'); - - if (chatWindow && typingIndicator && chatHeader) { - chatInteraction.addEventListener('mouseenter', () => { - // Enhanced typing animation - const spans = typingIndicator.querySelectorAll('span'); - spans.forEach((span, index) => { - span.style.animation = 'typing 1.2s infinite ease-in-out'; - span.style.animationDelay = `${-0.32 + (index * 0.16)}s`; - span.style.background = 'var(--accent-teal)'; - }); - - // Animate chat window - chatWindow.style.transform = 'scale(1.02)'; - chatHeader.style.background = 'linear-gradient(135deg, var(--accent-green), var(--accent-teal))'; - }); - - chatInteraction.addEventListener('mouseleave', () => { - const spans = typingIndicator.querySelectorAll('span'); - spans.forEach(span => { - span.style.background = 'var(--primary-mid)'; - }); - chatWindow.style.transform = 'scale(1)'; - chatHeader.style.background = 'linear-gradient(135deg, var(--accent-teal), var(--accent-green))'; - }); - - const chatBtn = chatInteraction.querySelector('.interaction-btn.secondary'); - if (chatBtn) { - chatBtn.addEventListener('click', () => { - // Enhanced click animation - chatWindow.style.transform = 'scale(0.95)'; - setTimeout(() => { - chatWindow.style.transform = 'scale(1.05)'; - setTimeout(() => { - chatWindow.style.transform = 'scale(1)'; - }, 200); - }, 100); - - showInteractionFeedback('KI Chat wird gestartet...'); - }); - } - } - } - - function showInteractionFeedback(message) { - // Create temporary feedback element - const feedback = document.createElement('div'); - feedback.style.cssText = ` - position: fixed; - top: 100px; - left: 50%; - transform: translateX(-50%); - background: var(--accent-teal); - color: white; - padding: 16px 24px; - border-radius: 8px; - font-weight: 600; - z-index: 10000; - box-shadow: 0 8px 30px rgba(38, 166, 154, 0.4); - animation: slideDown 0.3s ease; - `; - feedback.textContent = message; - - document.body.appendChild(feedback); - - setTimeout(() => { - feedback.style.animation = 'slideUp 0.3s ease'; - setTimeout(() => { - feedback.remove(); - }, 300); - }, 2000); - } - - // ===== HERO BUTTON INTERACTIONS ===== - const kiPhoneBtn = document.getElementById('kiPhoneBtn'); - const chatBtn = document.getElementById('chatBtn'); - - if (kiPhoneBtn) { - kiPhoneBtn.addEventListener('click', () => { - showInteractionFeedback('KI Telefon wird verbunden...'); - // Scroll to interaction section - document.getElementById('interaction')?.scrollIntoView({ - behavior: 'smooth', - block: 'center' - }); - }); - } - - if (chatBtn) { - chatBtn.addEventListener('click', () => { - showInteractionFeedback('KI Chat wird gestartet...'); - // Scroll to interaction section - document.getElementById('interaction')?.scrollIntoView({ - behavior: 'smooth', - block: 'center' - }); - }); - } - - // ===== SYSTEM CARD HOVER EFFECTS ===== - const systemCards = document.querySelectorAll('.system-card'); - - systemCards.forEach(card => { - card.addEventListener('mouseenter', function() { - // Add subtle glow effect - this.style.boxShadow = '0 25px 50px rgba(38, 166, 154, 0.2)'; - - // Animate internal components - const flowItems = this.querySelectorAll('.flow-item, .phone-icon, .ki-processor, .crm-output'); - flowItems.forEach((item, index) => { - setTimeout(() => { - item.style.transform = 'translateY(-2px)'; - setTimeout(() => { - item.style.transform = 'translateY(0)'; - }, 200); - }, index * 100); - }); - }); - - card.addEventListener('mouseleave', function() { - this.style.boxShadow = '0 12px 30px rgba(79, 71, 71, 0.1)'; - }); - }); - - // ===== DATA CARD ANIMATIONS ===== - const dataCards = document.querySelectorAll('.data-card'); - - const dataCardObserver = new IntersectionObserver((entries) => { - entries.forEach((entry, index) => { - if (entry.isIntersecting) { - setTimeout(() => { - entry.target.style.animation = 'fadeInUp 0.6s ease forwards'; - }, index * 100); - dataCardObserver.unobserve(entry.target); - } - }); - }, { threshold: 0.1 }); - - dataCards.forEach(card => { - dataCardObserver.observe(card); - }); - - // ===== SMOOTH SCROLL FOR INTERNAL 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' - }); - } - }); - }); - - // ===== UTILITY ANIMATIONS ===== - // Add CSS animations dynamically - const style = document.createElement('style'); - style.textContent = ` - @keyframes slideDown { - from { - opacity: 0; - transform: translate(-50%, -20px); - } - to { - opacity: 1; - transform: translate(-50%, 0); - } - } - - @keyframes slideUp { - from { - opacity: 1; - transform: translate(-50%, 0); - } - to { - opacity: 0; - transform: translate(-50%, -20px); - } - } - - @keyframes fadeInUp { - from { - opacity: 0; - transform: translateY(30px); - } - to { - opacity: 1; - transform: translateY(0); - } - } - - @keyframes rippleEffect { - from { - width: 20px; - height: 20px; - opacity: 0.5; - } - to { - width: 100px; - height: 100px; - opacity: 0; - } - } - - @keyframes shimmer { - 0% { transform: translateX(-100%) translateY(-100%) rotate(45deg); opacity: 0; } - 50% { opacity: 1; } - 100% { transform: translateX(100%) translateY(100%) rotate(45deg); opacity: 0; } - } - `; - document.head.appendChild(style); - - // ===== PERFORMANCE OPTIMIZATION ===== - // Throttle scroll events - let ticking = false; - function requestTick() { - if (!ticking) { - requestAnimationFrame(updateScrollEffects); - ticking = true; - setTimeout(() => { ticking = false; }, 16); - } - } - - function updateScrollEffects() { - // Add scroll-based effects here if needed - // Parallax, fade-ins, etc. - } - - window.addEventListener('scroll', requestTick, { passive: true }); - - // ===== INITIALIZATION COMPLETE ===== - console.log('Tech-Onepager initialized successfully'); -}); diff --git a/Profice WebSite/scripts/tech-onepager.min.js b/Profice WebSite/scripts/tech-onepager.min.js deleted file mode 100644 index 8c6caa5..0000000 --- a/Profice WebSite/scripts/tech-onepager.min.js +++ /dev/null @@ -1 +0,0 @@ -document.addEventListener('DOMContentLoaded', function(){// ===== SYSTEM GRAPHIC ANIMATIONS ===== const systemGraphic = document.getElementById('systemGraphic');const connections = document.getElementById('connections');const dataPoints = document.getElementById('dataPoints');if (systemGraphic && connections && dataPoints){initializeSystemGraphic();}function initializeSystemGraphic(){const nodes = systemGraphic.querySelectorAll('.node');const centralNode = systemGraphic.querySelector('.central-node');// Draw connection lines drawConnections();// Create animated data points createDataPoints();// Add node interactions nodes.forEach(node =>{node.addEventListener('mouseenter', function(){activateConnection(this);});node.addEventListener('mouseleave', function(){deactivateConnections();});// Special handling for central node if (node.classList.contains('central-node')){node.addEventListener('click', function(){triggerCentralNode(this);});}});// Scroll-based activation setupScrollActivation();}function drawConnections(){const centralNode = systemGraphic.querySelector('.central-node');const otherNodes = systemGraphic.querySelectorAll('.node:not(.central-node)');const centralRect = centralNode.getBoundingClientRect();const graphicRect = systemGraphic.getBoundingClientRect();const centerX = centralRect.left - graphicRect.left + centralRect.width / 2;const centerY = centralRect.top - graphicRect.top + centralRect.height / 2;connections.innerHTML = '';otherNodes.forEach(node =>{const nodeRect = node.getBoundingClientRect();const nodeX = nodeRect.left - graphicRect.left + nodeRect.width / 2;const nodeY = nodeRect.top - graphicRect.top + nodeRect.height / 2;const line = document.createElementNS('http://www.w3.org/2000/svg', 'line');line.setAttribute('x1', centerX);line.setAttribute('y1', centerY);line.setAttribute('x2', nodeX);line.setAttribute('y2', nodeY);line.setAttribute('class', 'connection-line');line.setAttribute('data-target', node.dataset.node);connections.appendChild(line);});}function createDataPoints(){setInterval(() =>{if (Math.random() > 0.7){const dataPoint = document.createElement('div');dataPoint.className = 'data-point';const startNode = systemGraphic.querySelectorAll('.node:not(.central-node)')[ Math.floor(Math.random() * 5) ];const centralNode = systemGraphic.querySelector('.central-node');const startRect = startNode.getBoundingClientRect();const centralRect = centralNode.getBoundingClientRect();const graphicRect = systemGraphic.getBoundingClientRect();const startX = startRect.left - graphicRect.left + startRect.width / 2;const startY = startRect.top - graphicRect.top + startRect.height / 2;const endX = centralRect.left - graphicRect.left + centralRect.width / 2;const endY = centralRect.top - graphicRect.top + centralRect.height / 2;dataPoint.style.left = startX + 'px';dataPoint.style.top = startY + 'px';dataPoints.appendChild(dataPoint);// Animate along path animateDataPoint(dataPoint, startX, startY, endX, endY);// Remove after animation setTimeout(() =>{dataPoint.remove();}, 3000);}}, 800);}function animateDataPoint(point, startX, startY, endX, endY){const duration = 3000;const startTime = Date.now();function animate(){const elapsed = Date.now() - startTime;const progress = Math.min(elapsed / duration, 1);const easeProgress = 1 - Math.pow(1 - progress, 3);// Ease out cubic const currentX = startX + (endX - startX) * easeProgress;const currentY = startY + (endY - startY) * easeProgress;point.style.left = currentX + 'px';point.style.top = currentY + 'px';if (progress < 1){requestAnimationFrame(animate);}}requestAnimationFrame(animate);}function triggerCentralNode(node){// Add triggered class for growth animation node.classList.add('triggered');// Activate all connections const lines = connections.querySelectorAll('.connection-line');lines.forEach((line, index) =>{setTimeout(() =>{line.classList.add('active');}, index * 100);});// Remove triggered class after animation setTimeout(() =>{node.classList.remove('triggered');// Deactivate connections setTimeout(() =>{lines.forEach(line => line.classList.remove('active'));}, 500);}, 2000);}function activateConnection(node){const targetNode = node.dataset.node;const line = connections.querySelector(`[data-target="${targetNode}"]`);if (line){line.classList.add('active');}}function deactivateConnections(){const lines = connections.querySelectorAll('.connection-line');lines.forEach(line => line.classList.remove('active'));}function setupScrollActivation(){const observer = new IntersectionObserver((entries) =>{entries.forEach(entry =>{if (entry.isIntersecting){const lines = connections.querySelectorAll('.connection-line');lines.forEach((line, index) =>{setTimeout(() =>{line.classList.add('active');setTimeout(() =>{line.classList.remove('active');}, 2000);}, index * 200);});}});},{threshold: 0.5});observer.observe(systemGraphic);}// ===== PROCESS LINE ANIMATION ===== const processLine = document.getElementById('processLine');const processSteps = document.querySelectorAll('.process-step');const processConnectors = document.querySelectorAll('.process-connector');const stepDetails = document.querySelectorAll('.step-detail');if (processLine){setupProcessAnimation();}function setupProcessAnimation(){const observer = new IntersectionObserver((entries) =>{entries.forEach(entry =>{if (entry.isIntersecting){animateProcessLine();observer.unobserve(entry.target);}});},{threshold: 0.3});observer.observe(processLine);}function animateProcessLine(){// Animate connectors sequentially processConnectors.forEach((connector, index) =>{setTimeout(() =>{connector.classList.add('active');}, 500 + (index * 500));});// Activate steps sequentially processSteps.forEach((step, index) =>{setTimeout(() =>{step.classList.add('active');activateStepDetail(index + 1);}, 200 + (index * 500));});}function activateStepDetail(stepNumber){const detail = document.querySelector(`[data-step-detail="${stepNumber}"]`);if (detail){setTimeout(() =>{detail.classList.add('active');}, 300);}}// Step click interactions processSteps.forEach((step, index) =>{step.addEventListener('click', () =>{// Reset all steps processSteps.forEach(s => s.classList.remove('active'));processConnectors.forEach(c => c.classList.remove('active'));stepDetails.forEach(d => d.classList.remove('active'));// Activate up to clicked step for (let i = 0;i <= index;i++){processSteps[i].classList.add('active');activateStepDetail(i + 1);if (i < processConnectors.length){processConnectors[i].classList.add('active');}}});});// ===== INTERACTION CARD ANIMATIONS ===== const phoneInteraction = document.getElementById('phoneInteraction');const chatInteraction = document.getElementById('chatInteraction');if (phoneInteraction){setupPhoneInteraction();}if (chatInteraction){setupChatInteraction();}function setupPhoneInteraction(){const microphone = phoneInteraction.querySelector('.microphone');const pulseRing = phoneInteraction.querySelector('.pulse-ring');if (microphone && pulseRing){microphone.addEventListener('mouseenter', () =>{pulseRing.style.animation = 'pulse 0.8s infinite';});microphone.addEventListener('mouseleave', () =>{pulseRing.style.animation = 'pulse 2s infinite';});microphone.addEventListener('click', () =>{// Simulate phone call initiation microphone.style.transform = 'scale(0.95)';setTimeout(() =>{microphone.style.transform = 'scale(1.1)';setTimeout(() =>{microphone.style.transform = 'scale(1)';}, 200);}, 100);// Show feedback showInteractionFeedback('KI Telefon wird verbunden...');});}}function setupChatInteraction(){const chatWindow = chatInteraction.querySelector('.chat-window');const typingIndicator = chatInteraction.querySelector('.typing-indicator');if (chatWindow && typingIndicator){chatInteraction.addEventListener('mouseenter', () =>{// Start typing animation const spans = typingIndicator.querySelectorAll('span');spans.forEach((span, index) =>{span.style.animation = 'typing 1.4s infinite ease-in-out';span.style.animationDelay = `${-0.32 + (index * 0.16)}s`;});});const chatBtn = chatInteraction.querySelector('.interaction-btn.secondary');if (chatBtn){chatBtn.addEventListener('click', () =>{showInteractionFeedback('KI Chat wird gestartet...');});}}}function showInteractionFeedback(message){// Create temporary feedback element const feedback = document.createElement('div');feedback.style.cssText = ` position: fixed;top: 100px;left: 50%;transform: translateX(-50%);background: var(--accent-teal);color: white;padding: 16px 24px;border-radius: 8px;font-weight: 600;z-index: 10000;box-shadow: 0 8px 30px rgba(38, 166, 154, 0.4);animation: slideDown 0.3s ease;`;feedback.textContent = message;document.body.appendChild(feedback);setTimeout(() =>{feedback.style.animation = 'slideUp 0.3s ease';setTimeout(() =>{feedback.remove();}, 300);}, 2000);}// ===== HERO BUTTON INTERACTIONS ===== const kiPhoneBtn = document.getElementById('kiPhoneBtn');const chatBtn = document.getElementById('chatBtn');if (kiPhoneBtn){kiPhoneBtn.addEventListener('click', () =>{showInteractionFeedback('KI Telefon wird verbunden...');// Scroll to interaction section document.getElementById('interaction')?.scrollIntoView({behavior: 'smooth', block: 'center'});});}if (chatBtn){chatBtn.addEventListener('click', () =>{showInteractionFeedback('KI Chat wird gestartet...');// Scroll to interaction section document.getElementById('interaction')?.scrollIntoView({behavior: 'smooth', block: 'center'});});}// ===== SYSTEM CARD HOVER EFFECTS ===== const systemCards = document.querySelectorAll('.system-card');systemCards.forEach(card =>{card.addEventListener('mouseenter', function(){// Add subtle glow effect this.style.boxShadow = '0 20px 40px rgba(38, 166, 154, 0.15)';});card.addEventListener('mouseleave', function(){this.style.boxShadow = '0 12px 30px rgba(79, 71, 71, 0.1)';});});// ===== DATA CARD ANIMATIONS ===== const dataCards = document.querySelectorAll('.data-card');const dataCardObserver = new IntersectionObserver((entries) =>{entries.forEach((entry, index) =>{if (entry.isIntersecting){setTimeout(() =>{entry.target.style.animation = 'fadeInUp 0.6s ease forwards';}, index * 100);dataCardObserver.unobserve(entry.target);}});},{threshold: 0.1});dataCards.forEach(card =>{dataCardObserver.observe(card);});// ===== SMOOTH SCROLL FOR INTERNAL 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'});}});});// ===== UTILITY ANIMATIONS ===== // Add CSS animations dynamically const style = document.createElement('style');style.textContent = ` @keyframes slideDown{from{opacity: 0;transform: translate(-50%, -20px);}to{opacity: 1;transform: translate(-50%, 0);}}@keyframes slideUp{from{opacity: 1;transform: translate(-50%, 0);}to{opacity: 0;transform: translate(-50%, -20px);}}@keyframes fadeInUp{from{opacity: 0;transform: translateY(30px);}to{opacity: 1;transform: translateY(0);}}`;document.head.appendChild(style);// ===== PERFORMANCE OPTIMIZATION ===== // Throttle scroll events let ticking = false;function requestTick(){if (!ticking){requestAnimationFrame(updateScrollEffects);ticking = true;setTimeout(() =>{ticking = false;}, 16);}}function updateScrollEffects(){// Add scroll-based effects here if needed // Parallax, fade-ins, etc.}window.addEventListener('scroll', requestTick,{passive: true});// ===== INITIALIZATION COMPLETE ===== console.log('Tech-Onepager initialized successfully');}); \ No newline at end of file diff --git a/Profice WebSite/sites/automatisation.html b/Profice WebSite/sites/automatisation.html deleted file mode 100644 index 2163eb7..0000000 --- a/Profice WebSite/sites/automatisation.html +++ /dev/null @@ -1,301 +0,0 @@ - - - - - - - - - - - - - automatisation - Profice - - - - - - - - - - - - -
-
- -
-
-
- -
-
- - - - - -
- - -
-
- -
-
⚙️
-

Automatisierung

-

Sparen Sie Zeit und Ressourcen durch intelligente Workflow-Automatisierungen

-
- - -
-

Unsere Automatisierungslösungen

-

- Wir automatisieren Ihre Geschäftsprozesse, um Effizienz zu steigern und menschliche Fehler zu reduzieren. - Von einfachen wiederkehrenden Aufgaben bis zu komplexen Workflow-Integrationen - wir finden die optimale Lösung. -

-
- - -
-

Was wir automatisieren können

-
-
-
📧
-

E-Mail-Automatisierung

-

Automatische Antwortverwaltung und E-Mail-Kampagnen

-
-
-
📄
-

Datenverarbeitung

-

Automatische Datenmigration und -bereinigung

-
-
-
📋
-

Report-Generierung

-

Automatische Erstellung von Berichten und Analysen

-
-
-
🔄
-

Workflow-Integration

-

Verbindung verschiedener Systeme für nahtlose Prozesse

-
-
-
📊
-

Monitoring

-

Automatische Systemüberwachung und Alarmierung

-
-
-
🎯
-

Task-Management

-

Intelligente Aufgabenverteilung und -verfolgung

-
-
-
- - -
-

Unser Automatisierungsprozess

-
-
-
1
-
-

Prozessanalyse

-

Identifizierung von Automatisierungspotenzialen

-
-
-
-
2
-
-

Lösungsdesign

-

Entwicklung maßgeschneiderter Automatisierungslösungen

-
-
-
-
3
-
-

Implementierung

-

Setup und Konfiguration der Automatisierungstools

-
-
-
-
4
-
-

Testing

-

Gewissenhafte Tests vor der Live-Schaltung

-
-
-
-
5
-
-

Monitoring

-

Laufende Ãœberwachung und Optimierung

-
-
-
-
- - -
-

Automatisierungstechnologien

-
-
Zapier
-
-
- - -
-

Ihre Vorteile

-
-
-
⏰️
-

Zeitersparnis

-

Bis zu 80% Zeitersparnis bei wiederkehrenden Aufgaben

-
-
-
🎯
-

Qualitätssteigerung

-

Reduzierung menschlicher Fehler und konsistente Ergebnisse

-
-
-
💰
-

Kostensenkung

-

Optimierung von Ressourcen und Betriebskosten

-
-
-
📈
-

Skalierbarkeit

-

Einfache Handhabung wachsender Geschäftsanforderungen

-
-
-
😊
-

Mitarbeiterzufriedenheit

-

Fokus auf kreative und strategische Aufgaben

-
-
- - - -
-

Bereit für mehr Effizienz?

-

Lassen Sie uns Ihre Prozesse analysieren und Potenziale identifizieren.

-
- Automatisierungs-Analyse - Mehr erfahren -
-
- -
- - - - - - - - - - - - - - - diff --git a/Profice WebSite/sites/ki-integration.html b/Profice WebSite/sites/ki-integration.html deleted file mode 100644 index 89c23b7..0000000 --- a/Profice WebSite/sites/ki-integration.html +++ /dev/null @@ -1,313 +0,0 @@ - - - - - - - - - - - - - ki integration - Profice - - - - - - - - - - - - -
-
- -
-
-
- - -
-
- - - - - -
- - -
-
- -
-
🤖
-

KI Integration

-

Nutzen Sie die Kraft künstlicher Intelligenz, um Ihre Daten besser zu verstehen und Prozesse zu optimieren

-
- - -
-

Unsere KI-Dienstleistungen

-

- Wir integrieren künstliche Intelligenz in Ihre Geschäftsprozesse, um Effizienz zu steigern und neue Möglichkeiten zu erschließen. - Von der Datenanalyse über automatisierte Prozesse bis zu intelligenten Chatbots - wir machen KI für Sie nutzbar. -

-
- - -
-

Was wir bieten

-
-
-
📊
-

Datenanalyse

-

Intelligente Auswertung Ihrer Geschäftsdaten für bessere Entscheidungen

-
-
-
🤖
-

Chatbots

-

24/7 Kundenbetreuung und automatisierte Kommunikation

-
-
-
⚙️
-

Prozessautomatisierung

-

Automatisierung wiederkehrender Aufgaben zur Effizienzsteigerung

-
-
-
🔍
-

Bilderkennung

-

Automatische Analyse von Bildern und Dokumenten

-
-
-
📈
-

Vorhersagemodelle

-

Prognosen für Trends und Geschäftsentwicklungen

-
-
-
🎯
-

Personalisierung

-

Individuelle KI-Lösungen für Ihre spezifischen Bedürfnisse

-
-
-
- - -
-

Unser KI-Integrationsprozess

-
-
-
1
-
-

Analyse & Potenzial

-

Identifizierung von KI-Einsatzmöglichkeiten in Ihrem Unternehmen

-
-
-
-
2
-
-

Datenstrategie

-

Planung der Datenerfassung und -verarbeitung

-
-
-
-
3
-
-

Modellentwicklung

-

Training oder Auswahl passender KI-Modelle

-
-
-
-
4
-
-

Integration

-

Nahtlose Anbindung an Ihre bestehenden Systeme

-
-
-
-
5
-
-

Optimierung

-

Kontinuierliche Verbesserung der KI-Modelle

-
-
-
-
- - -
-

KI-Technologien

-
-
TensorFlow
-
PyTorch
-
Scikit-learn
-
OpenAI API
-
Google Cloud AI
-
Azure ML
-
AWS SageMaker
-
Hugging Face
-
LangChain
-
Dialogflow
-
-
- - -
-

Anwendungsfälle

-
-
-

Kundenservice

-

Intelligente Chatbots für 24/7 Unterstützung

-
-
-

Vertrieb

-

Predictive Lead Scoring und Verkaufsoptimierung

-
-
-

Marketing

-

Personalisierte Kampagnen und Content-Optimierung

-
-
-

Finanzen

-

Betrugsprüfung und Risikoanalyse

-
-
-

Produktion

-

Qualitätssicherung und Predictive Maintenance

-
-
-
- - -
-

Bereit für KI in Ihrem Unternehmen?

-

Lassen Sie uns die Potenziale für Ihr Unternehmen analysieren.

-
- KI-Analyse anfordern - Mehr erfahren -
-
-
-
- - - - - - - - - - - - - - - diff --git a/Profice WebSite/sites/leads.html b/Profice WebSite/sites/leads.html deleted file mode 100644 index baf98f9..0000000 --- a/Profice WebSite/sites/leads.html +++ /dev/null @@ -1,203 +0,0 @@ - - - - - - - - - - - - - Leads Dashboard - Profice - - - - - - - - - - - - - -
-
- -
-
-
- -
-
- - - - - -
- - -
- -
-

Meine Anfragen

-

Ãœbersicht Ihrer aktuellen Projektanfragen

- -
- - - - - - - - - - - - -
DatumDienstleistungStatusAktion
-
-
- - -
-

Andere Angebote von uns

-

Entdecken Sie weitere Dienstleistungen

- -
-
-
🔍
-

SEO Optimierung

-

Verbessern Sie Ihre Sichtbarkeit in Suchmaschinen und erreichen Sie mehr Kunden online.

- Details ansehen -
- -
-
☁️
-

Cloud Migration

-

Modernisieren Sie Ihre IT-Infrastruktur mit sicheren und skalierbaren Cloud-Lösungen.

- Details ansehen -
- -
-
📊
-

Datenanalyse

-

Gewinnen Sie wertvolle Einblicke aus Ihren Daten mit unseren Analyse-Lösungen.

- Details ansehen -
-
-
-
- - - - - - - - - - - - diff --git a/Profice WebSite/sites/offers.html b/Profice WebSite/sites/offers.html deleted file mode 100644 index e25a5b3..0000000 --- a/Profice WebSite/sites/offers.html +++ /dev/null @@ -1,199 +0,0 @@ - - - - - - - - - - - - - Kontakt & Anfrage - Profice - - - - - - - - - - - - -
-
- -
-
-
- -
-
- - - - - -
- - -
-
-

Kontaktieren Sie uns

- -
-
- - -
- -
- - -
- -
- - -
- -
- - -
- -
- - -
- -
- - -
- - -
- -
-

Vielen Dank!

-

Ihre Anfrage wurde erfolgreich gesendet. Wir melden uns bald bei Ihnen.

-
-
-
- - - - - - - - - - - diff --git a/Profice WebSite/sites/website.html b/Profice WebSite/sites/website.html deleted file mode 100644 index 50fb8f2..0000000 --- a/Profice WebSite/sites/website.html +++ /dev/null @@ -1,287 +0,0 @@ - - - - - - - - - - - - - website - Profice - - - - - - - - - - - - -
-
- -
-
-
- - -
-
- - - - - -
- - -
-
- -
-
🌐
-

Website Entwicklung

-

Moderne, responsive Webseiten, die konvertieren und Ihre Marke perfekt repräsentieren

-
- - -
-

Unsere Webentwicklungsdienstleistungen

-

- Wir entwickeln maßgeschneiderte Websites, die nicht nur gut aussehen, sondern auch Ergebnisse liefern. - Von der Konzeption über das Design bis zur Implementierung und Wartung begleiten wir Sie durch den gesamten Prozess. -

-
- - -
-

Was wir bieten

-
-
-
🎨
-

Responsive Design

-

Perfekte Darstellung auf allen Geräten - von Desktop bis Mobile

-
-
-
âš¡
-

Performance-Optimierung

-

Schnelle Ladezeiten und beste Nutzererfahrung

-
-
-
🔒
-

SEO-Freundlich

-

Technische Grundlagen für gute Suchmaschinenplatzierungen

-
-
-
🔧
-

CMS-Integration

-

Einfache Content-Verwaltung für Ihre Mitarbeiter

-
-
-
🛡️
-

Sicherheit

-

Schutz vor Bedrohungen und sichere Datenverarbeitung

-
-
-
📊
-

Analytics & Tracking

-

Detaillierte Auswertung Ihrer Website-Performance

-
-
-
- - -
-

Unser Prozess

-
-
-
1
-
-

Analyse & Konzeption

-

Wir verstehen Ihre Ziele und entwickeln eine passende Strategie

-
-
-
-
2
-
-

Design & Prototyping

-

Visuelle Konzepte und interaktive Prototypen

-
-
-
-
3
-
-

Entwicklung

-

Saubere, performante Code-Implementierung

-
-
-
-
4
-
-

Testing & Launch

-

Gewissenhafte Tests und erfolgreicher Start

-
-
-
-
5
-
-

Support & Wartung

-

Laufende Optimierung und technische Unterstützung

-
-
-
-
- - -
-

Technologien

-
-
HTML5
-
CSS3
-
JavaScript
-
React
-
Vue.js
-
Angular
-
Node.js
-
PHP
-
WordPress
-
Shopify
-
WooCommerce
-
-
- - -
-

Bereit für Ihre neue Website?

-

Lassen Sie uns Ihr Projekt an und wir erstellen ein maßgeschneidertes Angebot.

-
- Projekt starten - Mehr erfahren -
-
-
-
- - - - - - - - - - - - - - - diff --git a/Profice WebSite/style/cursor.css b/Profice WebSite/style/cursor.css deleted file mode 100644 index 621d741..0000000 --- a/Profice WebSite/style/cursor.css +++ /dev/null @@ -1,98 +0,0 @@ -/* cursor.css */ - -/* Default: System cursor (not custom) */ -body, -html, -a, -button, -input, -textarea, -select, -.menu-toggle, -label { - cursor: auto !important; -} - -/* Custom cursor only when enabled */ -body:not(.system-cursor), -body:not(.system-cursor) a, -body:not(.system-cursor) button, -body:not(.system-cursor) input, -body:not(.system-cursor) textarea, -body:not(.system-cursor) select, -body:not(.system-cursor) .menu-toggle, -body:not(.system-cursor) label { - cursor: none !important; -} - -#venom-cursor { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - pointer-events: none; - z-index: 999999; - mix-blend-mode: normal; - display: none; -} - -/* Show custom cursor only when not system cursor */ -body:not(.system-cursor) #venom-cursor { - display: block; -} - -@media (pointer: coarse) { - body, html, a, button, input, textarea, select { - cursor: auto !important; - } - - #venom-cursor { - display: none; - } -} - -body.system-cursor, -body.system-cursor * { - cursor: auto !important; -} - -body.system-cursor #venom-cursor { - display: none !important; - opacity: 0; - pointer-events: none; -} - -#cursorToggle { - display: flex; - align-items: center; - justify-content: center; - background: transparent; - border: 2px solid var(--primary-dark); - color: var(--primary-dark); - width: 45px; - height: 45px; - border-radius: 12px; - cursor: auto; /* Use system cursor for toggle button */ - transition: all 0.3s ease; - font-size: 20px; -} - -#cursorToggle:hover { - background: var(--primary-dark); - color: var(--primary-light); -} - -body:not(.system-cursor) #cursorToggle { - cursor: none; /* Use custom cursor when custom is enabled */ -} - -.top-banner.dark-theme #cursorToggle { - border-color: var(--primary-light); - color: var(--primary-light); -} - -.top-banner.dark-theme #cursorToggle:hover { - background: var(--primary-light); - color: var(--primary-dark); -} \ No newline at end of file diff --git a/Profice WebSite/style/design.css b/Profice WebSite/style/design.css deleted file mode 100644 index e80907d..0000000 --- a/Profice WebSite/style/design.css +++ /dev/null @@ -1,1494 +0,0 @@ -:root { - --primary-dark: #4F4747; - --primary-light: #EBEBDE; - --primary-mid: #777764; - --accent-orange: #F57C00; - --accent-teal: #26A69A; - --accent-green: #66BB6A; -} - -* { - margin: 0; - padding: 0; - box-sizing: border-box; - font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; -} - -body { - background-color: var(--primary-light); - color: var(--primary-dark); - min-height: 100vh; -} - -/* Top Banner - Ultra Smooth Performance */ -.top-banner { - background-color: var(--primary-light); - color: var(--primary-dark); - padding: 5px 40px; - height: 90px; - display: flex; - align-items: center; - justify-content: space-between; - position: fixed; - top: 0; - left: 0; - right: 0; - z-index: 1001; - border-bottom: 3px solid var(--accent-orange); - overflow: hidden; - - /* Ultra-smooth transitions with hardware acceleration */ - transition: height 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), - padding 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), - background-color 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); - - /* Performance optimizations */ - will-change: height, padding, transform; - transform: translateZ(0); - backface-visibility: hidden; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - contain: layout style paint; - - /* Prevent sub-pixel rendering issues */ - box-shadow: 0 0 0 rgba(0,0,0,0); -} - -/* Scrolled state with smooth transitions */ -.top-banner.scrolled { - height: 70px; - padding: 5px 30px; - background-color: rgba(235, 235, 222, 0.95); - backdrop-filter: blur(10px); - -webkit-backdrop-filter: blur(10px); - box-shadow: 0 2px 20px rgba(79, 71, 71, 0.1); -} - -/* Fast scroll state for velocity-based transitions */ -.top-banner.fast-scroll { - transition-duration: 0.2s; -} - -/* Light blink effect for top banner */ -.top-banner::before { - content: ''; - position: absolute; - top: 0; - left: -100%; - width: 100%; - height: 2px; - background: var(--accent-orange); - animation: lightBlink 3s ease-in-out infinite; - z-index: 1; - pointer-events: none; -} - -@keyframes lightBlink { - 0% { - left: -100%; - opacity: 0; - } - 10% { - opacity: 1; - } - 90% { - opacity: 1; - } - 100% { - left: 100%; - opacity: 0; - } -} - -.top-banner-left { - display: flex; - align-items: center; - flex: 1; - position: relative; - z-index: 2; -} - -.top-banner-center { - display: flex; - justify-content: center; - flex: 2; - position: relative; - z-index: 2; -} - -.top-banner-right { - display: flex; - justify-content: flex-end; - flex: 1; - position: relative; - z-index: 2; -} - -.banner-left { - display: flex; - align-items: center; - gap: 15px; -} - -.banner-left #cursorToggle { - margin-right: 15px; -} - -.logo-link { - text-decoration: none; - display: flex; - align-items: center; - gap: 0; - margin-left: 0; - margin-right: 15px; -} - -.logo { - height: 50px; - width: auto; - transition: height 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); - will-change: height; -} - -.top-banner.scrolled .logo { - height: 40px; -} - -.menu-toggle { - background: transparent; - border: 2px solid var(--primary-dark); - color: var(--primary-dark); - width: 45px; - height: 45px; - border-radius: 12px; - cursor: pointer; - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; - transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); - will-change: width, height; -} - -.top-banner.scrolled .menu-toggle, -.top-banner.scrolled #cursorToggle { - width: 35px; - height: 35px; -} - -.opening-hours { - font-size: 14px; - color: var(--primary-mid); - background: rgba(79, 71, 71, 0.08); - padding: 10px 20px; - border-radius: 25px; - transition: font-size 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), - padding 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); - will-change: font-size, padding; -} - -.top-banner.scrolled .opening-hours { - font-size: 12px; - padding: 8px 15px; - background: rgba(255, 255, 255, 0.1); - border: 1px solid rgba(255, 255, 255, 0.2); - border-radius: 25px; - padding: 8px 8px 8px 15px; - transition: all 0.3s ease; - order: 1; - width: 250px; -} - -.search-container:hover { - background: rgba(255, 255, 255, 0.15); - border-color: rgba(255, 255, 255, 0.3); -} - -.search-container form { - display: flex; - align-items: center; - width: 100%; -} - -.search-field { - background: transparent; - border: none; - color: white; - font-size: 14px; - width: 100%; - outline: none; - padding: 0; - margin-right: 8px; -} - -.search-field::placeholder { - color: rgba(255, 255, 255, 0.7); -} - -.search-field:focus::placeholder { - color: rgba(255, 255, 255, 0.5); -} - -.search-btn { - background: rgba(255, 255, 255, 0.2); - border: none; - color: white; - cursor: pointer; - padding: 6px; - display: flex; - align-items: center; - justify-content: center; - transition: background 0.3s ease; - border-radius: 50%; - flex-shrink: 0; -} - -.search-btn:hover { - background: rgba(255, 255, 255, 0.3); -} - -.search-container { - display: flex; - align-items: center; - background: rgba(255, 255, 255, 0.1); - border: 1px solid rgba(255, 255, 255, 0.2); - border-radius: 25px; - padding: 8px 8px 8px 15px; - transition: all 0.3s ease; - order: 1; - width: 250px; -} - -.search-container:hover { - background: rgba(255, 255, 255, 0.15); - border-color: rgba(255, 255, 255, 0.3); -} - -.search-container form { - display: flex; - align-items: center; - width: 100%; -} - -.search-field { - background: transparent; - border: none; - color: white; - font-size: 14px; - width: 100%; - outline: none; - padding: 0; - margin-right: 8px; -} - -.search-field::placeholder { - color: rgba(255, 255, 255, 0.7); -} - -.search-field:focus::placeholder { - color: rgba(255, 255, 255, 0.5); -} - -.search-btn { - background: rgba(255, 255, 255, 0.2); - border: none; - color: white; - cursor: pointer; - padding: 6px; - display: flex; - align-items: center; - justify-content: center; - transition: background 0.3s ease; - border-radius: 50%; - flex-shrink: 0; -} - -.search-btn:hover { - background: rgba(255, 255, 255, 0.3); -} - -.main-nav { - display: flex; - align-items: center; - gap: 25px; -} - -.nav-link { - text-decoration: none; - color: white; - font-weight: 500; - font-size: 18px; - padding: 8px 12px; - border-radius: 8px; - transition: color 0.3s ease, transform 0.2s ease, background 0.3s ease; - position: relative; -} - -.nav-link:hover { - color: white; - transform: translateY(-2px); - background: rgba(255, 255, 255, 0.1); -} - -.nav-link::after { - content: ''; - position: absolute; - bottom: -5px; - left: 0; - width: 0; - height: 2px; - background: var(--accent-teal); - transition: width 0.3s ease; -} - -.nav-link:hover::after { - width: 100%; -} - -.logo-link { - text-decoration: none; - display: flex; - align-items: center; - gap: 0; - margin-left: 0; - margin-right: 15px; -} - -.logo { - height: 50px; - width: auto; - transition: height 0.25s cubic-bezier(0.4, 0, 0.2, 1); - will-change: height; -} - -.top-banner.scrolled .logo { - height: 35px; -} - -.opening-hours { - font-size: 14px; - color: var(--primary-mid); - background: rgba(79, 71, 71, 0.08); - padding: 10px 20px; - border-radius: 25px; - transition: font-size 0.25s cubic-bezier(0.4, 0, 0.2, 1), padding 0.25s cubic-bezier(0.4, 0, 0.2, 1); - will-change: font-size, padding; -} - -.menu-toggle { - background: transparent; - border: 2px solid var(--primary-dark); - color: var(--primary-dark); - width: 45px; - height: 45px; - border-radius: 12px; - cursor: pointer; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - gap: 5px; - transition: background 0.3s ease, color 0.3s ease, width 0.25s cubic-bezier(0.4, 0, 0.2, 1), height 0.25s cubic-bezier(0.4, 0, 0.2, 1); - will-change: width, height; -} - -#cursorToggle { - background: transparent; - border: 2px solid var(--primary-dark); - color: var(--primary-dark); - width: 60px; - height: 60px; - border-radius: 12px; - cursor: pointer; - display: flex; - align-items: center; - justify-content: center; - padding: 0; - transition: width 0.25s cubic-bezier(0.4, 0, 0.2, 1), height 0.25s cubic-bezier(0.4, 0, 0.2, 1), background 0.3s ease, border-color 0.3s ease; - will-change: width, height; -} - -.cursor-icon { - width: 60px; - height: 60px; - object-fit: contain; - transition: opacity 0.3s ease; - opacity: 1 !important; - filter: none !important; -} - -#cursorToggle:hover { - background: var(--primary-dark); -} - -#cursorToggle:hover .cursor-icon { - filter: brightness(0) invert(1) !important; - opacity: 1 !important; -} - -.menu-toggle:hover { - background: var(--primary-dark); -} - -.menu-toggle:hover span { - background: var(--primary-light); -} - -.menu-toggle span { - display: block; - width: 20px; - height: 2px; - background: var(--primary-dark); - border-radius: 2px; - transition: all 0.3s ease; -} - -.menu-toggle.active { - background: var(--primary-dark); -} - -.menu-toggle.active span { - background: var(--primary-light); -} - -.menu-toggle.active span:nth-child(1) { - transform: rotate(45deg) translate(5px, 5px); -} - -.menu-toggle.active span:nth-child(2) { - opacity: 0; -} - -.menu-toggle.active span:nth-child(3) { - transform: rotate(-45deg) translate(5px, -5px); -} - -/* Slide Menu */ -.slide-menu { - position: fixed; - top: 110px; - left: -280px; - width: 280px; - background: white; - box-shadow: 4px 0 25px rgba(79, 71, 71, 0.15); - border-radius: 0 20px 20px 0; - padding: 30px 0; - transition: left 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), top 0.3s ease; - z-index: 1000; -} - -.top-banner.scrolled ~ .slide-menu, -.top-banner.scrolled + .overlay + .slide-menu { - top: 80px; -} - -.slide-menu.active { - left: 0; -} - -.slide-menu a { - display: block; - padding: 18px 30px; - color: var(--primary-dark); - text-decoration: none; - font-size: 17px; - font-weight: 500; - transition: all 0.3s ease; - border-left: 4px solid transparent; -} - -.slide-menu a:hover { - background: var(--primary-light); - border-left-color: var(--accent-teal); - padding-left: 40px; - color: var(--accent-teal); -} - -.slide-menu a.active { - background: var(--primary-light); - border-left-color: var(--accent-teal); - color: var(--accent-teal); -} - -/* Main Content */ -.main-content { - max-width: 700px; - margin: 50px auto; - padding: 110px 20px 20px 20px; - transition: padding-top 0.2s ease-out; -} - -.form-container { - background: white; - padding: 45px; - border-radius: 24px; - box-shadow: 0 15px 50px rgba(79, 71, 71, 0.1); -} - -.form-title { - color: var(--primary-dark); - font-size: 28px; - margin-bottom: 35px; - text-align: center; - font-weight: 600; -} - -.form-group { - margin-bottom: 24px; -} - -.form-group label { - display: block; - margin-bottom: 8px; - color: var(--primary-mid); - font-weight: 500; - font-size: 14px; -} - -.form-group input, -.form-group textarea, -.form-group select { - width: 100%; - padding: 14px 18px; - border: 2px solid rgba(119, 119, 100, 0.2); - border-radius: 14px; - font-size: 16px; - transition: all 0.3s ease; - background: var(--primary-light); - color: var(--primary-dark); -} - -.form-group input:focus, -.form-group textarea:focus, -.form-group select:focus { - outline: none; - border-color: var(--accent-teal); - background: white; - box-shadow: 0 0 0 4px rgba(38, 166, 154, 0.15); -} - -.form-group textarea { - min-height: 120px; - resize: vertical; -} - -.form-group select { - cursor: pointer; - appearance: none; - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%234F4747' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E"); - background-repeat: no-repeat; - background-position: right 14px center; - background-size: 18px; -} - -.submit-btn { - width: 100%; - padding: 16px; - background: var(--accent-teal); - color: white; - border: none; - border-radius: 25px; - font-size: 17px; - font-weight: 600; - cursor: pointer; - transition: all 0.3s ease; - text-transform: uppercase; - letter-spacing: 1px; -} - -.submit-btn:hover { - transform: translateY(-2px); - box-shadow: 0 8px 25px rgba(38, 166, 154, 0.35); - background: #1e8e82; -} - -.submit-btn:active { - transform: translateY(0); -} - -/* Login Button Styles */ -.login-btn { - background: transparent; - border: 2px solid white; - color: white; - padding: 8px 16px; - border-radius: 8px; - font-size: 14px; - font-weight: 500; - cursor: pointer; - transition: all 0.3s ease; - display: inline-flex; - align-items: center; - gap: 8px; - text-decoration: none; - position: relative; - z-index: 10; - pointer-events: auto; -} - -.login-btn:hover { - background: white; - color: var(--primary-dark); - transform: translateY(-2px); -} - -.register-btn { - background: transparent; - border: 2px solid var(--primary-dark); - color: var(--primary-dark); - padding: 8px 16px; - border-radius: 8px; - font-size: 14px; - font-weight: 500; - cursor: pointer; - transition: all 0.3s ease; - display: inline-flex; - align-items: center; - gap: 8px; -} - -.register-btn:hover { - background: var(--primary-dark); - color: white; - transform: translateY(-2px); -} - -/* Top Banner Right Layout */ -.top-banner-right { - display: flex; - justify-content: flex-end; - align-items: center; - gap: 15px; - flex: 1; - position: relative; - z-index: 10; -} - -/* Service Details Buttons */ -.service-details { - display: flex; - gap: 15px; - margin-top: 15px; - flex-wrap: wrap; - justify-content: center; -} - -.service-btn { - padding: 12px 24px; - background: var(--accent-teal); - color: white; - text-decoration: none; - border-radius: 25px; - font-size: 14px; - font-weight: 500; - transition: all 0.3s ease; - display: inline-block; -} - -.service-btn:hover { - background: white; - color: var(--accent-teal); - transform: translateY(-2px); - box-shadow: 0 6px 20px rgba(38, 166, 154, 0.3); -} - -/* Success Message */ -.success-message { - display: none; - text-align: center; - padding: 30px; - color: var(--accent-teal); -} - -.success-message.show { - display: block; -} - -.success-message h3 { - font-size: 24px; - margin-bottom: 10px; -} - -/* Overlay */ -.overlay { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: rgba(79, 71, 71, 0.3); - opacity: 0; - visibility: hidden; - transition: all 0.3s ease; - z-index: 999; -} - -.overlay.active { - opacity: 1; - visibility: visible; -} - -@media (max-width: 600px) { - .top-banner { - flex-direction: column; - gap: 15px; - text-align: center; - padding: 15px 20px; - } - - .banner-left { - width: 100%; - justify-content: center; - } - - .form-container { - padding: 25px; - } - - .logo { - height: 100px; - width: auto; - } -} - -/* ADDITIONS FOR HOME PAGE & DARK HEADER */ - - -/* 1. Dark Header Theme */ -.top-banner.dark-theme { - background-color: var(--primary-dark); - color: var(--primary-light); - border-bottom: 3px solid var(--accent-orange); -} - -.top-banner.dark-theme .company-name { - color: var(--primary-light); -} - -.top-banner.dark-theme .opening-hours { - background: rgba(235, 235, 222, 0.1); - color: var(--primary-light); -} - -.top-banner.dark-theme .menu-toggle { - border-color: var(--primary-light); -} - -.top-banner.dark-theme .menu-toggle span { - background: var(--primary-light); -} - -.top-banner.dark-theme .menu-toggle:hover { - background: var(--primary-light); -} - -.top-banner.dark-theme .menu-toggle:hover span { - background: var(--primary-dark); -} - -/* 2. Home Page Layout */ -.home-content { - max-width: 1200px; - margin: 0 auto; - padding: 110px 20px 20px 20px; - transition: padding-top 0.2s ease-out; -} - -/* Green Highlight Box */ -.green-highlight-box { - display: inline-block; - background: rgba(34, 197, 94, 0.5); /* 50% transparent green */ - padding: 8px 16px 8px 16px; - border-radius: 8px; - color: var(--primary-dark); - font-weight: 500; - backdrop-filter: blur(2px); - border: 1px solid rgba(34, 197, 94, 0.3); - box-shadow: 0 2px 8px rgba(34, 197, 94, 0.2); - margin-right: 0px; /* Move even further to the left */ - position: relative; -} - -/* Hero Section */ -.hero-section { - display: flex; - align-items: center; - justify-content: space-between; - padding: 80px 20px; - gap: 40px; - min-height: 80vh; -} - -.hero-text { - flex: 1; - max-width: 600px; -} - -.hero-text h1 { - font-size: 48px; - line-height: 1.2; - margin-bottom: 24px; - color: var(--primary-dark); - font-weight: 700; -} - -.hero-text p { - font-size: 18px; - line-height: 1.6; - margin-bottom: 35px; - color: var(--primary-mid); -} - -.hero-buttons { - display: flex; - gap: 15px; -} - -.cta-btn { - padding: 15px 30px; - border-radius: 30px; - font-size: 16px; - font-weight: 600; - text-decoration: none; - transition: all 0.3s ease; -} - -.cta-btn.primary { - background-color: var(--accent-teal); - color: white; - border: 2px solid var(--accent-teal); -} - -.cta-btn.primary:hover { - background-color: #1e8e82; - border-color: #1e8e82; - transform: translateY(-2px); - box-shadow: 0 10px 20px rgba(38, 166, 154, 0.2); -} - -.cta-btn.secondary { - background-color: transparent; - color: var(--primary-dark); - border: 2px solid var(--primary-dark); -} - -.cta-btn.secondary:hover { - background-color: var(--primary-dark); - color: var(--primary-light); -} - -.hero-image-placeholder { - flex: 1; - height: 400px; - background-color: rgba(119, 119, 100, 0.1); - border-radius: 24px; - display: flex; - align-items: center; - justify-content: center; - border: 2px dashed var(--primary-mid); - color: var(--primary-mid); -} - -/* Services Section */ -.services-section { - padding: 60px 20px; - margin-bottom: 60px; -} - -.section-title { - text-align: center; - font-size: 32px; - color: var(--primary-dark); - margin-bottom: 50px; -} - -.services-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); - gap: 30px; -} - -.service-card { - background: white; - padding: 40px; - border-radius: 24px; - box-shadow: 0 15px 50px rgba(79, 71, 71, 0.05); - transition: transform 0.3s ease; - text-align: center; -} - -.service-card:hover { - transform: translateY(-10px); -} - -.service-icon { - font-size: 48px; - margin-bottom: 20px; - color: var(--accent-teal); -} - -.service-card h3 { - font-size: 22px; - color: var(--primary-dark); - margin-bottom: 15px; -} - -.service-card p { - color: var(--primary-mid); - line-height: 1.6; -} - -/* Info Section */ -.info-section { - background-color: white; - padding: 80px 40px; - border-radius: 24px; - margin-bottom: 80px; - box-shadow: 0 15px 50px rgba(79, 71, 71, 0.05); -} - -.info-container { - display: flex; - align-items: center; - gap: 50px; -} - -.info-content { - flex: 1; -} - -.info-content h2 { - font-size: 32px; - color: var(--primary-dark); - margin-bottom: 20px; -} - -.info-content p { - color: var(--primary-mid); - font-size: 17px; - line-height: 1.6; - margin-bottom: 30px; -} - -.info-list { - list-style: none; -} - -.info-list li { - margin-bottom: 15px; - padding-left: 30px; - position: relative; - color: var(--primary-dark); - font-weight: 500; -} - -.info-list li::before { - content: "✓"; - position: absolute; - left: 0; - color: var(--accent-green); - font-weight: bold; -} - -.info-image-placeholder { - flex: 1; - height: 300px; - background-color: var(--primary-light); - border-radius: 16px; - display: flex; - align-items: center; - justify-content: center; - border: 2px dashed var(--primary-mid); - color: var(--primary-mid); -} - -/* Enterprise Section */ -.enterprise-section { - padding: 80px 20px; - background: white; - text-align: center; -} - -.enterprise-content { - max-width: 800px; - margin: 0 auto; -} - -.enterprise-features { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); - gap: 30px; - margin-top: 50px; -} - -.feature-item { - background: var(--primary-light); - padding: 30px; - border-radius: 16px; - transition: transform 0.3s ease, box-shadow 0.3s ease; -} - -.feature-item:hover { - transform: translateY(-5px); - box-shadow: 0 10px 30px rgba(79, 71, 71, 0.1); -} - -.feature-item h3 { - color: var(--accent-teal); - margin-bottom: 15px; - font-size: 20px; -} - -.feature-item p { - color: var(--primary-mid); - line-height: 1.6; -} - -/* Pricing Section */ -.pricing-section { - padding: 80px 20px; - background: var(--primary-light); - text-align: center; -} - -.pricing-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); - gap: 30px; - max-width: 1000px; - margin: 50px auto 0; -} - -.pricing-card { - background: white; - padding: 40px 30px; - border-radius: 16px; - box-shadow: 0 5px 20px rgba(79, 71, 71, 0.1); - transition: transform 0.3s ease, box-shadow 0.3s ease; -} - -.pricing-card:hover { - transform: translateY(-5px); - box-shadow: 0 15px 40px rgba(79, 71, 71, 0.15); -} - -.pricing-card.featured { - border: 2px solid var(--accent-teal); - transform: scale(1.05); -} - -.pricing-card h3 { - color: var(--primary-dark); - font-size: 24px; - margin-bottom: 20px; -} - -.price { - font-size: 36px; - font-weight: bold; - color: var(--accent-teal); - margin-bottom: 15px; -} - -.pricing-card p { - color: var(--primary-mid); - margin-bottom: 25px; -} - -.pricing-card ul { - list-style: none; - text-align: left; -} - -.pricing-card li { - padding: 8px 0; - border-bottom: 1px solid rgba(119, 119, 100, 0.1); - color: var(--primary-dark); -} - -.pricing-card li:before { - content: "✓ "; - color: var(--accent-teal); - font-weight: bold; - margin-right: 8px; -} - -/* Responsive Home */ -@media (max-width: 900px) { - .hero-section { - flex-direction: column; - text-align: center; - padding-top: 40px; - } - - .hero-text h1 { - font-size: 36px; - } - - .hero-buttons { - justify-content: center; - } - - .info-container { - flex-direction: column-reverse; - } - - .hero-image-placeholder, - .info-image-placeholder { - width: 100%; - } -} - -/* Navigation responsive */ -@media (max-width: 768px) { - .main-nav { - display: none; - } - - .top-banner { - justify-content: space-between; - } - - .banner-left { - flex: 1; - } - - .opening-hours { - display: none; - } -} - -/* Footer Banner Styles */ -.footer-banner { - background: #2a2a2a !important; - color: var(--primary-light) !important; - padding: 60px 0 30px; - margin: 80px 0 0 0; - border-top: 3px solid var(--accent-orange); - width: 100%; - position: relative; - overflow: hidden; -} - -.footer-banner::before { - content: ''; - position: absolute; - top: 0; - left: 0; - right: 0; - height: 1px; - background: linear-gradient(90deg, transparent, var(--accent-orange), transparent); - animation: shimmer 3s infinite; -} - -@keyframes shimmer { - 0% { transform: translateX(-100%); } - 100% { transform: translateX(100%); } -} - -.footer-container { - max-width: 1200px; - margin: 0 auto; - padding: 0 40px; - position: relative; - z-index: 1; -} - -.footer-content { - display: grid; - grid-template-columns: repeat(4, 1fr); - gap: 40px; - width: 100%; - margin-bottom: 40px; - align-items: start; -} - -.footer-section { - display: flex; - flex-direction: column; - gap: 20px; -} - -.footer-logo { - margin-bottom: 15px; -} - -.footer-logo-img { - height: 40px; - width: auto; - filter: brightness(0) invert(1); - opacity: 0.9; -} - -.footer-description p { - line-height: 1.6; - opacity: 0.8; - font-size: 14px; - margin: 0; -} - -.footer-title { - color: var(--accent-orange); - font-size: 16px; - margin: 0 0 15px 0; - font-weight: 600; - text-transform: uppercase; - letter-spacing: 1px; -} - -.footer-nav { - display: flex; - flex-direction: column; - gap: 12px; -} - -.footer-link { - color: var(--primary-light); - text-decoration: none; - font-size: 14px; - opacity: 0.7; - transition: all 0.3s ease; - position: relative; - padding-left: 0; -} - -.footer-link:hover { - opacity: 1; - color: var(--accent-orange); - transform: translateX(5px); -} - -.footer-link::before { - content: '▸'; - position: absolute; - left: -15px; - opacity: 0; - transition: opacity 0.3s ease; - color: var(--accent-orange); -} - -.footer-link:hover::before { - opacity: 1; -} - -.footer-contact { - display: flex; - flex-direction: column; - gap: 12px; - margin-bottom: 20px; -} - -.contact-item { - display: flex; - align-items: center; - gap: 12px; - font-size: 14px; - opacity: 0.8; -} - -.contact-icon { - font-size: 16px; - width: 20px; - text-align: center; -} - -.social-media { - margin-top: -10px; -} - -.social-icons { - display: flex; - gap: 15px; -} - -.social-link { - display: flex; - align-items: center; - justify-content: center; - color: var(--primary-light); - text-decoration: none; - width: 40px; - height: 40px; - border-radius: 8px; - transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); - background: rgba(255, 255, 255, 0.05); - border: 1px solid rgba(255, 255, 255, 0.1); - backdrop-filter: blur(10px); -} - -.social-link:hover { - background: var(--accent-orange); - transform: translateY(-3px) scale(1.1); - box-shadow: 0 8px 25px rgba(245, 124, 0, 0.3); -} - -.social-link:hover svg { - filter: brightness(0) invert(1); -} - -.social-link.instagram:hover { - background: linear-gradient(45deg, #E4405F, #C13584, #833AB4); - border-color: transparent; -} - -.social-link.linkedin:hover { - background: #0077B5; - border-color: transparent; -} - -.social-link img { - width: 40px; - height: 40px; - border-radius: 8px; - transition: transform 0.3s ease; -} - -.social-link svg { - width: 16px; - height: 16px; - transition: transform 0.3s ease; -} - -.social-link.facebook:hover svg { - filter: brightness(0) invert(1); -} - -.social-link.instagram:hover svg { - filter: brightness(0) invert(1); -} - -.footer-bottom { - border-top: 1px solid rgba(255, 255, 255, 0.1); - padding-top: 25px; - margin-top: 20px; -} - -.footer-bottom-content { - display: flex; - justify-content: space-between; - align-items: center; -} - -.footer-bottom p { - opacity: 0.6; - font-size: 13px; - margin: 0; -} - -.footer-bottom-links { - display: flex; - align-items: center; - gap: 15px; -} - -.footer-bottom-links .footer-link { - font-size: 13px; - opacity: 0.6; -} - -.footer-bottom-links .footer-link:hover { - opacity: 1; -} - -.separator { - opacity: 0.4; - font-size: 12px; -} - -/* Footer Responsive Design */ -@media (max-width: 1024px) { - .footer-content { - grid-template-columns: repeat(2, 1fr); - gap: 30px; - } -} - -@media (max-width: 768px) { - .footer-content { - grid-template-columns: 1fr; - gap: 30px; - } - - .footer-container { - padding: 0 20px; - } - - .footer-banner { - padding: 40px 0 25px; - } - - .footer-bottom-content { - flex-direction: column; - gap: 15px; - text-align: center; - } - - .social-icons { - justify-content: center; - } -} - -@media (max-width: 480px) { - .footer-banner { - padding: 30px 0 20px; - margin-top: 60px; - } - - .footer-content { - gap: 25px; - } - - .footer-title { - font-size: 15px; - } - - .footer-logo-img { - height: 35px; - } - - .social-link { - width: 35px; - height: 35px; - } - - .social-link svg { - width: 14px; - height: 14px; - } -} - -/* Chat Send Button Styles */ -.chat-send { - background: var(--accent-teal); - color: white; - border: none; - border-radius: 50%; - width: 70px; - height: 70px; - display: flex; - align-items: center; - justify-content: center; - cursor: pointer; - transition: all 0.3s ease; - flex-shrink: 0; - padding: 0; - margin-left: 10px; - box-shadow: 0 2px 8px rgba(38, 166, 154, 0.3); -} - -.chat-send:hover { - background: #1e8e82; - transform: scale(1.05); - box-shadow: 0 4px 12px rgba(38, 166, 154, 0.4); -} - -.chat-send:active { - transform: scale(0.95); -} - -.chat-send img { - width: 64px; - height: 64px; - filter: brightness(0) invert(1); - object-fit: contain; -} \ No newline at end of file diff --git a/Profice WebSite/style/leads.css b/Profice WebSite/style/leads.css deleted file mode 100644 index 017cc0c..0000000 --- a/Profice WebSite/style/leads.css +++ /dev/null @@ -1,219 +0,0 @@ -/* Leads Dashboard Styles */ - -.leads-content { - max-width: 900px; -} - -.dashboard-container { - background: white; - padding: 40px; - border-radius: 24px; - box-shadow: 0 15px 50px rgba(79, 71, 71, 0.1); - margin-bottom: 30px; -} - -.dashboard-title { - color: var(--primary-dark); - font-size: 28px; - margin-bottom: 8px; - font-weight: 600; -} - -.dashboard-subtitle { - color: var(--primary-mid); - font-size: 15px; - margin-bottom: 30px; -} - -/* Leads Table */ -.leads-table-wrapper { - overflow-x: auto; - border-radius: 16px; - border: 1px solid rgba(119, 119, 100, 0.15); -} - -.leads-table { - width: 100%; - border-collapse: collapse; - min-width: 500px; -} - -.leads-table thead { - background: var(--primary-light); -} - -.leads-table th { - padding: 16px 20px; - text-align: left; - font-weight: 600; - color: var(--primary-dark); - font-size: 14px; - text-transform: uppercase; - letter-spacing: 0.5px; -} - -.leads-table td { - padding: 18px 20px; - border-top: 1px solid rgba(119, 119, 100, 0.1); - color: var(--primary-dark); - font-size: 15px; -} - -.leads-table tbody tr { - transition: background 0.2s ease; -} - -.leads-table tbody tr:hover { - background: rgba(235, 235, 222, 0.5); -} - -/* Status Badges */ -.status-badge { - display: inline-block; - padding: 6px 14px; - border-radius: 20px; - font-size: 13px; - font-weight: 600; - text-transform: uppercase; - letter-spacing: 0.3px; -} - -.status-badge.completed { - background: rgba(102, 187, 106, 0.15); - color: var(--accent-green); -} - -.status-badge.in-progress { - background: rgba(245, 124, 0, 0.15); - color: var(--accent-orange); -} - -.status-badge.open { - background: rgba(119, 119, 100, 0.15); - color: var(--primary-mid); -} - -/* Action Button */ -.action-btn { - padding: 8px 16px; - background: transparent; - border: 2px solid var(--accent-teal); - color: var(--accent-teal); - border-radius: 20px; - font-size: 13px; - font-weight: 600; - cursor: pointer; - transition: all 0.3s ease; - text-decoration: none; - display: inline-block; -} - -.action-btn:hover { - background: var(--accent-teal); - color: white; -} - -/* Offers Section */ -.offers-section { - margin-top: 30px; -} - -.offers-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); - gap: 24px; -} - -.offer-card { - background: var(--primary-light); - border-radius: 20px; - padding: 30px; - text-align: center; - transition: all 0.3s ease; - cursor: pointer; -} - -.offer-card:hover { - transform: translateY(-5px); - box-shadow: 0 15px 40px rgba(79, 71, 71, 0.15); - background: white; -} - -.offer-icon { - font-size: 40px; - margin-bottom: 16px; -} - -.offer-title { - color: var(--primary-dark); - font-size: 20px; - font-weight: 600; - margin-bottom: 12px; -} - -.offer-description { - color: var(--primary-mid); - font-size: 14px; - line-height: 1.6; - margin-bottom: 20px; -} - -.offer-btn { - display: inline-block; - padding: 10px 24px; - background: var(--accent-teal); - color: white; - text-decoration: none; - border-radius: 25px; - font-size: 14px; - font-weight: 600; - transition: all 0.3s ease; -} - -.offer-btn:hover { - background: #1e8e82; - box-shadow: 0 5px 20px rgba(38, 166, 154, 0.3); -} - -/* Active menu link */ -.slide-menu a.active { - background: var(--primary-light); - border-left-color: var(--accent-teal); - color: var(--accent-teal); -} - -/* Empty state */ -.empty-state { - text-align: center; - padding: 40px; - color: var(--primary-mid); -} - -.empty-state p { - font-size: 16px; -} - -/* Responsive */ -@media (max-width: 600px) { - .dashboard-container { - padding: 25px; - } - - .dashboard-title { - font-size: 22px; - } - - .leads-table th, - .leads-table td { - padding: 12px 14px; - font-size: 13px; - } - - .offer-card { - padding: 20px; - } - - .offers-grid { - grid-template-columns: 1fr; - } -} diff --git a/Profice WebSite/style/leads.min.css b/Profice WebSite/style/leads.min.css deleted file mode 100644 index caef58e..0000000 --- a/Profice WebSite/style/leads.min.css +++ /dev/null @@ -1 +0,0 @@ -.leads-content{max-width:900px}.dashboard-container{background:white;padding:40px;border-radius:24px;box-shadow:0 15px 50px rgba(79,71,71,0.1);margin-bottom:30px}.dashboard-title{color:var(--primary-dark);font-size:28px;margin-bottom:8px;font-weight:600}.dashboard-subtitle{color:var(--primary-mid);font-size:15px;margin-bottom:30px}.leads-table-wrapper{overflow-x:auto;border-radius:16px;border:1px solid rgba(119,119,100,0.15)}.leads-table{width:100%;border-collapse:collapse;min-width:500px}.leads-table thead{background:var(--primary-light)}.leads-table th{padding:16px 20px;text-align:left;font-weight:600;color:var(--primary-dark);font-size:14px;text-transform:uppercase;letter-spacing:0.5px}.leads-table td{padding:18px 20px;border-top:1px solid rgba(119,119,100,0.1);color:var(--primary-dark);font-size:15px}.leads-table tbody tr{transition:background 0.2s ease}.leads-table tbody tr:hover{background:rgba(235,235,222,0.5)}.status-badge{display:inline-block;padding:6px 14px;border-radius:20px;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:0.3px}.status-badge.completed{background:rgba(102,187,106,0.15);color:var(--accent-green)}.status-badge.in-progress{background:rgba(245,124,0,0.15);color:var(--accent-orange)}.status-badge.open{background:rgba(119,119,100,0.15);color:var(--primary-mid)}.action-btn{padding:8px 16px;background:transparent;border:2px solid var(--accent-teal);color:var(--accent-teal);border-radius:20px;font-size:13px;font-weight:600;cursor:pointer;transition:all 0.3s ease;text-decoration:none;display:inline-block}.action-btn:hover{background:var(--accent-teal);color:white}.offers-section{margin-top:30px}.offers-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:24px}.offer-card{background:var(--primary-light);border-radius:20px;padding:30px;text-align:center;transition:all 0.3s ease;cursor:pointer}.offer-card:hover{transform:translateY(-5px);box-shadow:0 15px 40px rgba(79,71,71,0.15);background:white}.offer-icon{font-size:40px;margin-bottom:16px}.offer-title{color:var(--primary-dark);font-size:20px;font-weight:600;margin-bottom:12px}.offer-description{color:var(--primary-mid);font-size:14px;line-height:1.6;margin-bottom:20px}.offer-btn{display:inline-block;padding:10px 24px;background:var(--accent-teal);color:white;text-decoration:none;border-radius:25px;font-size:14px;font-weight:600;transition:all 0.3s ease}.offer-btn:hover{background:#1e8e82;box-shadow:0 5px 20px rgba(38,166,154,0.3)}.slide-menu a.active{background:var(--primary-light);border-left-color:var(--accent-teal);color:var(--accent-teal)}.empty-state{text-align:center;padding:40px;color:var(--primary-mid)}.empty-state p{font-size:16px}@media (max-width:600px){.dashboard-container{padding:25px}.dashboard-title{font-size:22px}.leads-table th,.leads-table td{padding:12px 14px;font-size:13px}.offer-card{padding:20px}.offers-grid{grid-template-columns:1fr}} \ No newline at end of file diff --git a/Profice WebSite/style/tech-onepager-fixed.css b/Profice WebSite/style/tech-onepager-fixed.css deleted file mode 100644 index 9c0b112..0000000 --- a/Profice WebSite/style/tech-onepager-fixed.css +++ /dev/null @@ -1,30 +0,0 @@ -/* Fixed list styling for system cards */ -.what-it-does ul, -.result ul { - list-style: none; - padding: 0; -} - -.what-it-does li, -.result li { - font-size: 0.9rem; - line-height: 1.5; - margin-bottom: 8px; - padding-left: 20px; - position: relative; -} - -.what-it-does li::before { - content: '→'; - position: absolute; - left: 0; - color: var(--primary-mid); -} - -.result li::before { - content: '✓'; - position: absolute; - left: 0; - color: var(--accent-green); - font-weight: bold; -} diff --git a/Profice WebSite/style/tech-onepager.css b/Profice WebSite/style/tech-onepager.css deleted file mode 100644 index ceb0ca6..0000000 --- a/Profice WebSite/style/tech-onepager.css +++ /dev/null @@ -1,2321 +0,0 @@ -/** - * Tech-Onepager Styles - High-Conversion, Technology-Focused Design - * System being built aesthetic - not marketing campaign - */ - -/* ===== TECH BACKGROUND ===== */ -.tech-background { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - z-index: -1; - overflow: hidden; -} - -.grid-overlay { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background-image: - linear-gradient(rgba(79, 71, 71, 0.12) 1px, transparent 1px), - linear-gradient(90deg, rgba(79, 71, 71, 0.12) 1px, transparent 1px); - background-size: 50px 50px; - pointer-events: none; -} - -.dot-pattern { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background-image: radial-gradient(circle, rgba(79, 71, 71, 0.12) 1px, transparent 1px); - background-size: 20px 20px; - pointer-events: none; -} - -.gradient-overlay { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: linear-gradient(135deg, - rgba(235, 235, 222, 0.8) 0%, - rgba(235, 235, 222, 0.6) 50%, - rgba(235, 235, 222, 0.4) 100%); - pointer-events: none; -} - -/* ===== HERO SECTION ===== */ -.hero-section { - min-height: 100vh; - display: flex; - align-items: center; - padding: 120px 40px 60px; - position: relative; -} - -.hero-container { - max-width: 1400px; - margin: 0 auto; - display: grid; - grid-template-columns: 1fr 1fr; - gap: 80px; - align-items: center; -} - -.hero-left { - max-width: 600px; -} - -.hero-headline { - font-size: clamp(2.5rem, 5vw, 3.5rem); - font-weight: 700; - line-height: 1.2; - color: var(--primary-dark); - margin-bottom: 24px; - font-family: 'Segoe UI', system-ui, sans-serif; -} - -.hero-subline { - font-size: 1.25rem; - line-height: 1.6; - color: var(--primary-mid); - margin-bottom: 20px; - font-weight: 400; -} - -.hero-proof { - font-size: 1.1rem; - color: var(--accent-teal); - font-weight: 500; - margin-bottom: 40px; - padding-left: 20px; - border-left: 3px solid var(--accent-teal); -} - -.hero-buttons { - display: flex; - gap: 20px; - flex-wrap: wrap; -} - -.cta-btn { - padding: 16px 32px; - border: none; - border-radius: 8px; - font-size: 1.1rem; - font-weight: 600; - cursor: pointer; - transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94); - text-decoration: none; - display: inline-block; - position: relative; - overflow: hidden; -} - -.cta-btn.primary { - background: linear-gradient(135deg, var(--accent-green), var(--accent-teal)); - color: white; - box-shadow: 0 4px 20px rgba(102, 187, 106, 0.3); -} - -.cta-btn.primary:hover { - transform: translateY(-2px); - box-shadow: 0 8px 30px rgba(102, 187, 106, 0.4); -} - -.cta-btn.secondary { - background: white; - color: var(--primary-dark); - border: 2px solid var(--primary-dark); -} - -.cta-btn.secondary:hover { - background: var(--primary-dark); - color: white; - transform: translateY(-2px); -} - -/* ===== SYSTEM GRAPHIC ===== */ -.hero-right { - position: relative; - height: 500px; -} - -.system-graphic { - position: relative; - width: 100%; - height: 100%; -} - -.connections { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - pointer-events: none; - z-index: 1; -} - -.data-points { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - pointer-events: none; - z-index: 2; -} - -.node { - position: absolute; - background: rgba(255, 255, 255, 0.95); - border: 2px solid var(--primary-mid); - border-radius: 12px; - padding: 16px; - min-width: 120px; - text-align: center; - backdrop-filter: blur(15px); - transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); - cursor: pointer; - z-index: 3; - box-shadow: 0 4px 20px rgba(79, 71, 71, 0.1); -} - -.node:hover { - border-color: var(--accent-teal); - box-shadow: 0 6px 25px rgba(38, 166, 154, 0.2); - background: rgba(255, 255, 255, 0.98); -} - -/* Specific hover effects for outer nodes - updated for circular layout */ -.phone-node:hover { - transform: translate(-50%, -50%) scale(1.05); -} - -.chat-node:hover { - transform: translate(50%, -50%) scale(1.05); -} - -.crm-node:hover { - transform: translate(50%, -50%) scale(1.05); -} - -.ticket-node:hover { - transform: translate(-50%, 50%) scale(1.05); -} - -.team-node:hover { - transform: translate(-50%, -50%) scale(1.05); -} - -.central-node { - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - background: linear-gradient(135deg, var(--accent-teal), var(--accent-green)); - color: white; - border: none; - border-radius: 25px; - min-width: 140px; - max-width: 160px; - padding: 10px 20px; - box-shadow: 0 8px 25px rgba(38, 166, 154, 0.4); - z-index: 4; - transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); - position: relative; - overflow: hidden; - display: flex; - align-items: center; - justify-content: center; -} - -.central-node::before { - content: ''; - position: absolute; - top: -50%; - left: -50%; - width: 200%; - height: 200%; - background: linear-gradient(45deg, transparent, rgba(255, 255, 255, 0.1), transparent); - transform: rotate(45deg); - transition: all 0.6s ease; - opacity: 0; -} - -.central-node:hover::before { - animation: shimmer 0.6s ease; -} - -@keyframes shimmer { - 0% { transform: translateX(-100%) translateY(-100%) rotate(45deg); opacity: 0; } - 50% { opacity: 1; } - 100% { transform: translateX(100%) translateY(100%) rotate(45deg); opacity: 0; } -} - -@keyframes nodePulse { - 0%, 100% { - transform: scale(1.08); - box-shadow: 0 8px 30px rgba(38, 166, 154, 0.25); - } - 50% { - transform: scale(1.15); - box-shadow: 0 12px 40px rgba(38, 166, 154, 0.4); - } -} - -@keyframes centralNodePulse { - 0%, 100% { - transform: translate(-50%, -50%) scale(1.08); - box-shadow: 0 12px 35px rgba(38, 166, 154, 0.5); - } - 50% { - transform: translate(-50%, -50%) scale(1.15); - box-shadow: 0 16px 45px rgba(38, 166, 154, 0.7); - } -} - -.central-node:hover { - transform: translate(-50%, -50%); - box-shadow: 0 8px 25px rgba(38, 166, 154, 0.4); - background: linear-gradient(135deg, var(--accent-teal), var(--accent-green)); -} - -/* Linear workflow layout - evenly spaced nodes */ -.phone-node { - top: 15%; - left: 20%; - transform: translate(-50%, -50%); -} - -.chat-node { - top: 15%; - right: 20%; - transform: translate(50%, -50%); -} - -.crm-node { - top: 50%; - right: 15%; - transform: translate(50%, -50%); -} - -.ticket-node { - bottom: 15%; - left: 20%; - transform: translate(-50%, 50%); -} - -.team-node { - top: 50%; - left: 15%; - transform: translate(-50%, -50%); -} - -.central-node .node-content { - display: flex; - flex-direction: row; - align-items: center; - gap: 8px; -} - -.central-node .node-icon { - font-size: 1.2rem; - flex-shrink: 0; -} - -.node .node-content { - display: flex; - flex-direction: column; - align-items: center; - gap: 8px; -} - -.node .node-icon { - font-size: 1.5rem; -} - -.node-label { - font-size: 0.85rem; - font-weight: 600; - line-height: 1.2; -} - -.central-node .node-label { - color: white; -} - -.connections { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - pointer-events: none; - z-index: 1; -} - -.connection-line { - stroke: var(--accent-green); - stroke-width: 2; - fill: none; - opacity: 0.6; - stroke-dasharray: 5, 5; /* Dotted line pattern */ - stroke-linecap: round; -} - -.connection-line:hover { - opacity: 1; - stroke-width: 3; -} - -/* ===== SYSTEME SECTION ===== */ -.systeme-section { - padding: 100px 40px; - background: rgba(255, 255, 255, 0.3); - backdrop-filter: blur(10px); -} - -.container { - max-width: 1200px; - margin: 0 auto; -} - -.section-headline { - font-size: 2.5rem; - font-weight: 700; - text-align: center; - margin-bottom: 60px; - color: var(--primary-dark); -} - -.systeme-grid { - display: grid; - grid-template-columns: 1fr 1fr 1fr; - gap: 40px; - max-width: 1600px; - margin: 0 auto; -} - -.system-card { - background: rgba(255, 255, 255, 0.8); - border: 1px solid rgba(79, 71, 71, 0.1); - border-radius: 16px; - padding: 40px; - backdrop-filter: blur(20px); - transition: all 0.3s ease; - position: relative; - overflow: hidden; - max-width: 900px; -} - -.system-card::before { - content: ''; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 4px; - background: linear-gradient(90deg, var(--accent-teal), var(--accent-green)); -} - -.system-card:hover { - transform: translateY(-8px); - box-shadow: 0 20px 40px rgba(79, 71, 71, 0.1); - border-color: var(--accent-teal); -} - -.system-visual { - margin-bottom: 30px; - min-height: 100px; - display: flex; - align-items: center; - justify-content: center; - position: relative; -} - -/* Enhanced Technical Flow Visuals */ -.tech-flow { - display: flex; - align-items: center; - gap: 12px; - font-size: 1.2rem; - position: relative; -} - -.flow-item { - background: rgba(255, 255, 255, 0.9); - border: 2px solid rgba(79, 71, 71, 0.2); - border-radius: 10px; - padding: 14px; - display: flex; - align-items: center; - justify-content: center; - position: relative; - transition: all 0.3s ease; - backdrop-filter: blur(10px); -} - -.flow-item:hover { - border-color: var(--accent-teal); - transform: translateY(-2px); - box-shadow: 0 8px 25px rgba(38, 166, 154, 0.15); -} - -.flow-arrow { - color: var(--primary-mid); - font-weight: bold; - font-size: 1.4rem; - position: relative; - z-index: 1; -} - -.flow-arrow::after { - content: ''; - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - width: 20px; - height: 2px; - background: linear-gradient(90deg, transparent, var(--accent-teal), transparent); - opacity: 0; - transition: opacity 0.3s ease; -} - -.tech-flow:hover .flow-arrow::after { - opacity: 1; - animation: arrowFlow 1.5s ease-in-out infinite; -} - -@keyframes arrowFlow { - 0% { transform: translate(-50%, -50%) scaleX(0); opacity: 0; } - 50% { transform: translate(-50%, -50%) scaleX(1); opacity: 1; } - 100% { transform: translate(-50%, -50%) scaleX(0); opacity: 0; } -} - -/* Electric Workflow Animation */ -.electric-workflow { - position: relative; - width: 100%; - height: 250px; - display: flex; - align-items: center; - justify-content: center; - margin: 0 auto; - max-width: 900px; -} - -.workflow-svg { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - z-index: 1; -} - -/* Background paths (always visible gray dashed lines) */ -.background-paths { - position: relative; - z-index: 1; -} - -/* Animated paths and borders (green overlay) */ -.animated-paths, .node-borders { - position: relative; - z-index: 3; -} - -.electric-path { - opacity: 0; - transition: all 0.3s ease; - stroke-dashoffset: 150; -} - -.electric-spark { - filter: url(#glow); - opacity: 0; - transform: translate(0, 0); -} - -.node-border { - fill: none; - stroke: rgba(79, 71, 71, 0.2); - stroke-width: 2; - stroke-dasharray: 200; - stroke-dashoffset: 200; - transition: all 0.3s ease; -} - -.workflow-nodes { - position: relative; - z-index: 3; - display: flex; - width: 100%; - height: 100%; - justify-content: center; - align-items: center; -} - -.workflow-nodes .node { - position: absolute; - display: flex; - align-items: center; - justify-content: center; - font-size: 1.5rem; - background: rgba(79, 71, 71, 0.05); - border: 1px solid rgba(79, 71, 71, 0.1); - border-radius: 8px; - padding: 12px 24px; - min-width: 50px; - transition: all 0.3s ease; -} - -/* Exact coordinate positioning for mathematical alignment */ -.workflow-nodes .node-1 { - left: 50px; - top: 125px; - transform: translate(-50%, -50%); -} - -.workflow-nodes .node-2 { - left: 450px; - top: 60px; - transform: translate(-50%, -50%); -} - -.workflow-nodes .node-3 { - left: 450px; - top: 190px; - transform: translate(-50%, -50%); -} - -.workflow-nodes .node-4 { - left: 800px; - top: 125px; - transform: translate(-50%, -50%); -} - -.workflow-nodes .node-5 { - left: 880px; - top: 125px; - transform: translate(-50%, -50%); -} - -/* Single Unified 12-Second Animation Timeline - Mathematical Precision */ - -/* Node 1: 0-8% border trace */ -@keyframes node1Glow { - 0%, 8%, 100% { stroke-dashoffset: 200; stroke: rgba(79, 71, 71, 0.2); filter: none; } - 4% { stroke-dashoffset: 0; stroke: #00FF00; filter: drop-shadow(0 0 15px #00FF00); } - 8%, 100% { stroke-dashoffset: 0; stroke: rgba(0, 255, 0, 0.9); filter: drop-shadow(0 0 10px #00FF00); } -} - -/* Path 1: 8-16% from Node 1 to Split Point */ -@keyframes path1Glow { - 0%, 8%, 100% { opacity: 0; stroke-dashoffset: 150; } - 8%, 16% { opacity: 1; stroke-dashoffset: 0; filter: drop-shadow(0 0 12px #00FF00); } - 16%, 100% { opacity: 1; stroke-dashoffset: 0; } -} - -/* Spark 1: 8-16% moves along Path 1 (stroke-dasharray trail) */ -@keyframes spark1Move { - 0%, 8%, 16%, 100% { opacity: 0; } - 12% { opacity: 1; transform: translate(125px, 125px); } - 16% { opacity: 0; transform: translate(200px, 125px); } -} - -/* Nodes 2&3: 16-35% border trace (parallel with paths) */ -@keyframes node2Glow { - 0%, 16%, 35%, 100% { stroke-dashoffset: 200; stroke: rgba(79, 71, 71, 0.2); filter: none; } - 25% { stroke-dashoffset: 0; stroke: #00FF00; filter: drop-shadow(0 0 15px #00FF00); } - 35%, 100% { stroke-dashoffset: 0; stroke: rgba(0, 255, 0, 0.9); filter: drop-shadow(0 0 10px #00FF00); } -} - -@keyframes node3Glow { - 0%, 16%, 35%, 100% { stroke-dashoffset: 200; stroke: rgba(79, 71, 71, 0.2); filter: none; } - 25% { stroke-dashoffset: 0; stroke: #00FF00; filter: drop-shadow(0 0 15px #00FF00); } - 35%, 100% { stroke-dashoffset: 0; stroke: rgba(0, 255, 0, 0.9); filter: drop-shadow(0 0 10px #00FF00); } -} - -/* Paths 2a&2b: 16-35% from Split Point to Nodes 2&3 (parallel with borders) */ -@keyframes path2Glow { - 0%, 16%, 35%, 100% { opacity: 0; stroke-dashoffset: 265; } - 16%, 35% { opacity: 1; stroke-dashoffset: 0; filter: drop-shadow(0 0 12px #00FF00); } - 35%, 100% { opacity: 1; stroke-dashoffset: 0; } -} - -/* Sparks 2a&2b: 16-35% move along Paths 2a&2b (stroke-dasharray trail) */ -@keyframes spark2aMove { - 0%, 16%, 35%, 100% { opacity: 0; } - 20% { opacity: 1; transform: translate(200px, 125px); } - 27% { opacity: 1; transform: translate(325px, 60px); } - 35% { opacity: 0; transform: translate(450px, 60px); } -} - -@keyframes spark2bMove { - 0%, 16%, 35%, 100% { opacity: 0; } - 20% { opacity: 1; transform: translate(200px, 125px); } - 27% { opacity: 1; transform: translate(325px, 190px); } - 35% { opacity: 0; transform: translate(450px, 190px); } -} - -/* Paths 3a&3b: 35-50% from Nodes 2&3 to Merge Point */ -@keyframes path3Glow { - 0%, 35%, 50%, 100% { opacity: 0; stroke-dashoffset: 315; } - 35%, 50% { opacity: 1; stroke-dashoffset: 0; filter: drop-shadow(0 0 12px #00FF00); } - 50%, 100% { opacity: 1; stroke-dashoffset: 0; } -} - -/* Sparks 3a&3b: 35-50% move along Paths 3a&3b (stroke-dasharray trail) */ -@keyframes spark3aMove { - 0%, 35%, 50%, 100% { opacity: 0; } - 40% { opacity: 1; transform: translate(450px, 60px); } - 45% { opacity: 1; transform: translate(575px, 60px); } - 50% { opacity: 0; transform: translate(700px, 125px); } -} - -@keyframes spark3bMove { - 0%, 35%, 50%, 100% { opacity: 0; } - 40% { opacity: 1; transform: translate(450px, 190px); } - 45% { opacity: 1; transform: translate(575px, 190px); } - 50% { opacity: 0; transform: translate(700px, 125px); } -} - -/* Node 4: 50-65% border trace */ -@keyframes node4Glow { - 0%, 50%, 65%, 100% { stroke-dashoffset: 200; stroke: rgba(79, 71, 71, 0.2); filter: none; } - 57% { stroke-dashoffset: 0; stroke: #00FF00; filter: drop-shadow(0 0 15px #00FF00); } - 65%, 100% { stroke-dashoffset: 0; stroke: rgba(0, 255, 0, 0.9); filter: drop-shadow(0 0 10px #00FF00); } -} - -/* Path 4: 65-75% from Merge Point to Node 4 */ -@keyframes path4Glow { - 0%, 65%, 75%, 100% { opacity: 0; stroke-dashoffset: 100; } - 65%, 75% { opacity: 1; stroke-dashoffset: 0; filter: drop-shadow(0 0 12px #00FF00); } - 75%, 100% { opacity: 1; stroke-dashoffset: 0; } -} - -/* Spark 4: 65-75% moves along Path 4 (stroke-dasharray trail) */ -@keyframes spark4Move { - 0%, 65%, 75%, 100% { opacity: 0; } - 70% { opacity: 1; transform: translate(700px, 125px); } - 75% { opacity: 0; transform: translate(800px, 125px); } -} - -/* Path 5: 75-90% from Node 4 to Node 5 */ -@keyframes path5Glow { - 0%, 75%, 90%, 100% { opacity: 0; stroke-dashoffset: 80; } - 75%, 90% { opacity: 1; stroke-dashoffset: 0; filter: drop-shadow(0 0 12px #00FF00); } - 90%, 100% { opacity: 1; stroke-dashoffset: 0; } -} - -/* Spark 5: 75-90% moves along Path 5 (stroke-dasharray trail) */ -@keyframes spark5Move { - 0%, 75%, 90%, 100% { opacity: 0; } - 82% { opacity: 1; transform: translate(800px, 125px); } - 90% { opacity: 0; transform: translate(880px, 125px); } -} - -/* Node 5: 75-90% border trace */ -@keyframes node5Glow { - 0%, 75%, 90%, 100% { stroke-dashoffset: 200; stroke: rgba(79, 71, 71, 0.2); filter: none; } - 82% { stroke-dashoffset: 0; stroke: #00FF00; filter: drop-shadow(0 0 15px #00FF00); } - 90%, 100% { stroke-dashoffset: 0; stroke: rgba(0, 255, 0, 0.9); filter: drop-shadow(0 0 10px #00FF00); } -} - -/* Apply unified 12-second animations to all elements */ -#node1-border { animation: node1Glow 12s infinite; } -#path1 { animation: path1Glow 12s infinite; } -#spark1 { animation: spark1Move 12s infinite; } - -#node2-border { animation: node2Glow 12s infinite; } -#node3-border { animation: node3Glow 12s infinite; } -#path2a, #path2b { animation: path2Glow 12s infinite; } -#spark2a { animation: spark2aMove 12s infinite; } -#spark2b { animation: spark2bMove 12s infinite; } - -#path3a, #path3b { animation: path3Glow 12s infinite; } -#spark3a { animation: spark3aMove 12s infinite; } -#spark3b { animation: spark3bMove 12s infinite; } - -#node4-border { animation: node4Glow 12s infinite; } -#path4 { animation: path4Glow 12s infinite; } -#spark4 { animation: spark4Move 12s infinite; } - -#node5-border { animation: node5Glow 12s infinite; } -#path5 { animation: path5Glow 12s infinite; } -#spark5 { animation: spark5Move 12s infinite; } - -/* Node Tooltip Styles */ -.node-tooltip { - position: absolute; - background: rgba(79, 71, 71, 0.95); - color: var(--primary-light); - padding: 12px 16px; - border-radius: 8px; - font-size: 14px; - line-height: 1.4; - max-width: 280px; - z-index: 1000; - pointer-events: none; - opacity: 0; - transform: translateY(-10px); - transition: all 0.3s ease; - box-shadow: 0 8px 25px rgba(79, 71, 71, 0.3); - backdrop-filter: blur(10px); - border: 1px solid rgba(255, 255, 255, 0.1); -} - -.node-tooltip.show { - opacity: 1; - transform: translateY(0); -} - -.node-tooltip::after { - content: ''; - position: absolute; - bottom: -6px; - left: 50%; - transform: translateX(-50%); - width: 0; - height: 0; - border-left: 6px solid transparent; - border-right: 6px solid transparent; - border-top: 6px solid rgba(79, 71, 71, 0.95); -} - -/* Responsive adjustments */ -@media (max-width: 768px) { - .electric-workflow { - height: 220px; - } - - .workflow-nodes .node { - font-size: 1.2rem; - padding: 8px 16px; - min-width: 40px; - } - - .node-tooltip { - font-size: 12px; - max-width: 220px; - padding: 10px 12px; - } - - .workflow-nodes .node-1 { left: 5%; } - .workflow-nodes .node-2 { left: 35%; top: 20%; } - .workflow-nodes .node-3 { left: 35%; top: 80%; } - .workflow-nodes .node-4 { left: 65%; } - .workflow-nodes .node-5 { left: 85%; } -} - -/* Phone System Visual */ -.phone-system { - position: relative; - width: 100%; - height: 80px; - display: flex; - align-items: center; - justify-content: space-between; -} - -.phone-icon { - width: 35px; - height: 35px; - background: linear-gradient(135deg, var(--primary-mid), var(--primary-dark)); - border-radius: 8px; - display: flex; - align-items: center; - justify-content: center; - color: white; - font-size: 1rem; - position: relative; -} - -.phone-icon::after { - content: ''; - position: absolute; - top: -5px; - right: -5px; - width: 12px; - height: 12px; - background: var(--accent-green); - border-radius: 50%; - /* animation: pulse 2s infinite; */ -} - -.waveform { - flex: 1; - height: 25px; - margin: 0 8px; - display: flex; - align-items: center; - justify-content: center; - position: relative; -} - -.waveform-bar { - width: 3px; - height: 8px; - background: var(--accent-teal); - margin: 0 2px; - border-radius: 2px; - animation: wave 1s ease-in-out infinite; -} - -.waveform-bar:nth-child(2) { animation-delay: 0.1s; height: 12px; } -.waveform-bar:nth-child(3) { animation-delay: 0.2s; height: 16px; } -.waveform-bar:nth-child(4) { animation-delay: 0.3s; height: 20px; } -.waveform-bar:nth-child(5) { animation-delay: 0.4s; height: 16px; } -.waveform-bar:nth-child(6) { animation-delay: 0.5s; height: 12px; } -.waveform-bar:nth-child(7) { animation-delay: 0.6s; height: 8px; } - -@keyframes wave { - 0%, 100% { transform: scaleY(1); } - 50% { transform: scaleY(1.5); } -} - -.ki-processor { - width: 38px; - height: 38px; - background: linear-gradient(135deg, var(--accent-teal), var(--accent-green)); - border-radius: 10px; - display: flex; - align-items: center; - justify-content: center; - color: white; - font-size: 1.2rem; - position: relative; - box-shadow: 0 4px 15px rgba(38, 166, 154, 0.3); -} - -.ki-processor::before { - content: ''; - position: absolute; - top: -3px; - left: -3px; - right: -3px; - bottom: -3px; - border: 2px solid rgba(38, 166, 154, 0.3); - border-radius: 17px; - /* animation: rotate 3s linear infinite; */ -} - -@keyframes rotate { - from { transform: rotate(0deg); } - to { transform: rotate(360deg); } -} - -.crm-output { - width: 35px; - height: 35px; - background: rgba(79, 71, 71, 0.1); - border: 2px solid var(--primary-mid); - border-radius: 6px; - display: flex; - align-items: center; - justify-content: center; - color: var(--primary-dark); - font-size: 1rem; - position: relative; -} - -.crm-output::after { - content: '✓'; - position: absolute; - bottom: -8px; - right: -8px; - width: 20px; - height: 20px; - background: var(--accent-green); - color: white; - border-radius: 50%; - display: flex; - align-items: center; - justify-content: center; - font-size: 0.8rem; - font-weight: bold; -} - -/* Chat System Visual */ -.chat-system { - position: relative; - width: 100%; - height: 80px; - display: flex; - align-items: center; - justify-content: space-between; -} - -.website-input { - width: 50px; - height: 50px; - background: linear-gradient(135deg, var(--primary-mid), var(--primary-dark)); - border-radius: 12px; - display: flex; - align-items: center; - justify-content: center; - color: white; - font-size: 1.5rem; - position: relative; -} - -.website-input::after { - content: ''; - position: absolute; - top: -5px; - right: -5px; - width: 12px; - height: 12px; - background: var(--accent-green); - border-radius: 50%; - /* animation: pulse 2s infinite; */ -} - -.category-output { - width: 50px; - height: 50px; - background: rgba(102, 187, 106, 0.15); - border: 2px solid var(--accent-green); - border-radius: 8px; - display: flex; - align-items: center; - justify-content: center; - color: var(--accent-green); - font-size: 1.3rem; - position: relative; -} - -.category-output::after { - content: '✓'; - position: absolute; - bottom: -8px; - right: -8px; - width: 20px; - height: 20px; - background: var(--accent-green); - color: white; - border-radius: 50%; - display: flex; - align-items: center; - justify-content: center; - font-size: 0.8rem; - font-weight: bold; -} - -.human-output { - width: 50px; - height: 50px; - background: rgba(79, 71, 71, 0.1); - border: 2px solid var(--primary-mid); - border-radius: 8px; - display: flex; - align-items: center; - justify-content: center; - color: var(--primary-dark); - font-size: 1.3rem; - position: relative; -} - -/* Internal System Visual */ -.internal-system { - position: relative; - width: 100%; - height: 80px; - display: flex; - align-items: center; - justify-content: space-between; -} - -.search-input { - width: 50px; - height: 50px; - background: linear-gradient(135deg, var(--primary-mid), var(--primary-dark)); - border-radius: 12px; - display: flex; - align-items: center; - justify-content: center; - color: white; - font-size: 1.5rem; - position: relative; -} - -.search-input::after { - content: ''; - position: absolute; - top: -5px; - right: -5px; - width: 12px; - height: 12px; - background: var(--accent-green); - border-radius: 50%; - animation: pulse 2s infinite; -} - -.documents-cloud { - width: 50px; - height: 50px; - background: rgba(79, 71, 71, 0.1); - border: 2px solid var(--primary-mid); - border-radius: 50%; - display: flex; - align-items: center; - justify-content: center; - color: var(--primary-dark); - font-size: 1.3rem; - position: relative; -} - -.documents-cloud::before { - content: ''; - position: absolute; - top: -3px; - left: -3px; - right: -3px; - bottom: -3px; - border: 1px dashed rgba(79, 71, 71, 0.3); - border-radius: 50%; - /* animation: rotate 4s linear infinite; */ -} - -.answer-output { - width: 50px; - height: 50px; - background: linear-gradient(135deg, rgba(255, 193, 7, 0.2), rgba(255, 152, 0, 0.2)); - border: 2px solid rgba(255, 193, 7, 0.5); - border-radius: 50%; - display: flex; - align-items: center; - justify-content: center; - color: rgba(255, 193, 7, 0.8); - font-size: 1.3rem; - position: relative; - box-shadow: 0 0 20px rgba(255, 193, 7, 0.2); -} - -.answer-output::after { - content: ''; - position: absolute; - top: -5px; - left: -5px; - right: -5px; - bottom: -5px; - background: radial-gradient(circle, rgba(255, 193, 7, 0.3), transparent); - border-radius: 50%; - /* animation: glow 2s ease-in-out infinite; */ -} - -@keyframes glow { - 0%, 100% { transform: scale(1); opacity: 0.5; } - 50% { transform: scale(1.2); opacity: 0.8; } -} - -.chat-message { - background: transparent; - border-radius: 8px; - padding: 12px; - margin-bottom: 10px; - font-size: 0.9rem; -} - -.chat-message.user { - background: transparent; -} - -.chat-message.ai { - background: transparent; -} - -.chat-label { - background: var(--accent-teal); - color: white; - padding: 4px 8px; - border-radius: 4px; - font-size: 0.75rem; - font-weight: 600; - margin-bottom: 10px; - display: inline-block; -} - -.data-card { - background: rgba(255, 255, 255, 0.6); - border: 1px solid rgba(79, 71, 71, 0.1); - border-radius: 8px; - padding: 12px; - margin-top: 10px; -} - -.card-field { - font-size: 0.85rem; - color: var(--primary-mid); - margin-bottom: 4px; -} - -.search-flow { - display: flex; - flex-direction: column; - align-items: center; - gap: 10px; - max-width: 300px; -} - -.search-field { - background: rgba(79, 71, 71, 0.05); - border: 1px solid rgba(79, 71, 71, 0.1); - border-radius: 8px; - padding: 12px; - width: 100%; - text-align: center; - font-size: 0.9rem; -} - -.documents { - font-size: 1.5rem; -} - -.answer-card { - background: rgba(102, 187, 106, 0.1); - border: 1px solid var(--accent-green); - border-radius: 8px; - padding: 12px; - width: 100%; - text-align: center; - font-weight: 600; - color: var(--primary-dark); -} - -.system-card h3 { - font-size: 1.5rem; - font-weight: 700; - margin-bottom: 20px; - color: var(--primary-dark); -} - -.system-details { - display: grid; - grid-template-columns: 1fr 1fr; - gap: 30px; -} - -.what-it-does h4, -.result h4 { - font-size: 1rem; - font-weight: 600; - margin-bottom: 12px; - color: var(--primary-dark); -} - -.what-it-does ul, -.result ul { - list-style: none; - padding: 0; -} - -.what-it-does li, -.result li { - font-size: 0.9rem; - line-height: 1.5; - margin-bottom: 8px; - padding-left: 20px; - position: relative; -} - -.what-it-does li::before { - content: '→'; - position: absolute; - left: 0; - color: var(--primary-mid); -} - -.result li::before { - content: '✓'; - position: absolute; - left: 0; - color: var(--accent-green); - font-weight: bold; -} - -/* ===== QUALIFICATION SECTION ===== */ -.qualification-section { - padding: 100px 40px; - background: rgba(255, 255, 255, 0.2); - backdrop-filter: blur(10px); -} - -.qualification-grid { - display: grid; - grid-template-columns: 1fr 1fr; - gap: 60px; - max-width: 1200px; - margin: 0 auto; -} - -.qual-left { - background: linear-gradient(135deg, rgba(244, 67, 54, 0.1), rgba(244, 67, 54, 0.05)); - border: 2px solid rgba(244, 67, 54, 0.2); - border-radius: 20px; - padding: 40px; - position: relative; - overflow: hidden; - backdrop-filter: blur(15px); - transition: all 0.3s ease; -} - -.qual-left::before { - content: ''; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 3px; - background: linear-gradient(90deg, rgba(244, 67, 54, 0.6), rgba(244, 67, 54, 0.2)); -} - -.qual-left:hover { - transform: translateY(-4px); - box-shadow: 0 20px 40px rgba(244, 67, 54, 0.15); - border-color: rgba(244, 67, 54, 0.3); -} - -.qual-right { - background: linear-gradient(135deg, rgba(102, 187, 106, 0.1), rgba(102, 187, 106, 0.05)); - border: 2px solid rgba(102, 187, 106, 0.2); - border-radius: 20px; - padding: 40px; - position: relative; - overflow: hidden; - backdrop-filter: blur(15px); - transition: all 0.3s ease; -} - -.qual-right::before { - content: ''; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 3px; - background: linear-gradient(90deg, rgba(102, 187, 106, 0.6), rgba(102, 187, 106, 0.2)); -} - -.qual-right:hover { - transform: translateY(-4px); - box-shadow: 0 20px 40px rgba(102, 187, 106, 0.15); - border-color: rgba(102, 187, 106, 0.3); -} - -.qualification-grid h3 { - font-size: 1.5rem; - font-weight: 700; - margin-bottom: 30px; - color: var(--primary-dark); -} - -.qual-list { - list-style: none; - padding: 0; -} - -.qual-item { - display: flex; - align-items: center; - gap: 16px; - margin-bottom: 20px; - font-size: 1rem; - line-height: 1.5; -} - -.qual-icon { - width: 44px; - height: 44px; - border-radius: 12px; - display: flex; - align-items: center; - justify-content: center; - font-size: 1.3rem; - flex-shrink: 0; - position: relative; - transition: all 0.3s ease; -} - -.qual-icon.chaos { - background: linear-gradient(135deg, rgba(244, 67, 54, 0.2), rgba(244, 67, 54, 0.1)); - border: 2px solid rgba(244, 67, 54, 0.3); - position: relative; -} - -.qual-icon.chaos::before { - content: ''; - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - width: 20px; - height: 20px; - background: rgba(244, 67, 54, 0.1); - border-radius: 4px; - transform: translate(-50%, -50%) rotate(45deg); -} - -.qual-icon.chaos::after { - content: '✕'; - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - color: rgba(244, 67, 54, 0.6); - font-size: 1rem; - font-weight: bold; -} - -.qual-icon.check { - background: linear-gradient(135deg, rgba(102, 187, 106, 0.2), rgba(102, 187, 106, 0.1)); - border: 2px solid rgba(102, 187, 106, 0.3); - color: #4CAF50; - font-weight: bold; - position: relative; -} - -.qual-icon.check::before { - content: ''; - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - width: 24px; - height: 24px; - background: rgba(102, 187, 106, 0.1); - border-radius: 50%; - animation: checkPulse 2s ease-in-out infinite; -} - -@keyframes checkPulse { - 0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.3; } - 50% { transform: translate(-50%, -50%) scale(1.3); opacity: 0.6; } -} - -/* ===== PROCESS SECTION ===== */ -.process-section { - padding: 100px 40px; - background: rgba(255, 255, 255, 0.3); - backdrop-filter: blur(10px); - position: relative; - overflow: hidden; -} - -.process-section::before { - content: ''; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: linear-gradient(90deg, - transparent 0%, - rgba(38, 166, 154, 0.05) 50%, - transparent 100%); - pointer-events: none; -} - -.process-line { - display: flex; - align-items: center; - justify-content: center; - gap: 0; - margin-bottom: 60px; - max-width: 800px; - margin-left: auto; - margin-right: auto; - position: relative; - z-index: 2; -} - -.process-step { - display: flex; - flex-direction: column; - align-items: center; - gap: 16px; - position: relative; - z-index: 3; -} - -.step-circle { - width: 80px; - height: 80px; - border-radius: 50%; - background: white; - border: 3px solid var(--primary-mid); - display: flex; - align-items: center; - justify-content: center; - font-size: 1.5rem; - font-weight: 700; - color: var(--primary-mid); - transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); - cursor: pointer; - position: relative; - overflow: hidden; - box-shadow: 0 4px 15px rgba(79, 71, 71, 0.1); -} - -.step-circle::before { - content: ''; - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%) scale(0); - width: 100%; - height: 100%; - background: radial-gradient(circle, var(--accent-teal), var(--accent-green)); - border-radius: 50%; - transition: all 0.4s ease; - z-index: -1; -} - -.step-circle.active { - background: var(--accent-teal); - border-color: var(--accent-teal); - color: white; - box-shadow: 0 12px 40px rgba(38, 166, 154, 0.4); - transform: scale(1.1); -} - -.step-circle.active::before { - transform: translate(-50%, -50%) scale(1); - opacity: 0.3; -} - -.step-circle:hover { - transform: scale(1.05); - box-shadow: 0 8px 25px rgba(79, 71, 71, 0.15); -} - -.step-circle.active:hover { - transform: scale(1.15); - box-shadow: 0 15px 45px rgba(38, 166, 154, 0.5); -} - -.step-label { - font-size: 1.1rem; - font-weight: 600; - color: var(--primary-dark); - transition: all 0.3s ease; - opacity: 0.7; -} - -.step-circle.active + .step-label { - opacity: 1; - color: var(--accent-teal); - font-weight: 700; -} - -.process-connector { - width: 100px; - height: 3px; - background: var(--primary-mid); - opacity: 0.3; - transition: all 0.4s ease; - position: relative; - overflow: hidden; -} - -.process-connector::before { - content: ''; - position: absolute; - top: 0; - left: -100%; - width: 100%; - height: 100%; - background: linear-gradient(90deg, transparent, var(--accent-teal), transparent); - transition: all 0.4s ease; -} - -.process-connector.active { - background: var(--accent-teal); - opacity: 1; - height: 4px; - box-shadow: 0 0 10px rgba(38, 166, 154, 0.3); -} - -.process-connector.active::before { - left: 100%; - transition: left 0.8s ease; -} - -.process-details { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); - gap: 40px; - max-width: 1200px; - margin: 0 auto; - position: relative; - z-index: 2; -} - -.step-detail { - background: rgba(255, 255, 255, 0.8); - border: 1px solid rgba(79, 71, 71, 0.1); - border-radius: 20px; - padding: 30px; - backdrop-filter: blur(20px); - opacity: 0.3; - transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); - position: relative; - overflow: hidden; - transform: translateY(20px); -} - -.step-detail::before { - content: ''; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 3px; - background: linear-gradient(90deg, var(--accent-teal), var(--accent-green)); - transform: scaleX(0); - transform-origin: left; - transition: transform 0.4s ease; -} - -.step-detail.active { - opacity: 1; - transform: translateY(-4px); - box-shadow: 0 20px 40px rgba(79, 71, 71, 0.15); - border-color: var(--accent-teal); -} - -.step-detail.active::before { - transform: scaleX(1); -} - -.step-detail:hover { - transform: translateY(-8px); - box-shadow: 0 25px 50px rgba(79, 71, 71, 0.2); -} - -.step-detail.active:hover { - transform: translateY(-12px); - box-shadow: 0 30px 60px rgba(38, 166, 154, 0.25); -} - -.step-detail h3 { - font-size: 1.3rem; - font-weight: 700; - margin-bottom: 16px; - color: var(--primary-dark); -} - -.step-detail p { - font-size: 1rem; - line-height: 1.6; - color: var(--primary-mid); -} - -/* ===== ERGEBNISSE SECTION ===== */ -.results-section { - padding: 100px 40px; - background: rgba(255, 255, 255, 0.15); - backdrop-filter: blur(15px); - position: relative; - overflow: hidden; -} - -.results-section::before { - content: ''; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: radial-gradient(circle at 30% 50%, rgba(38, 166, 154, 0.1) 0%, transparent 50%), - radial-gradient(circle at 70% 50%, rgba(102, 187, 106, 0.1) 0%, transparent 50%); - pointer-events: none; -} - -.results-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); - gap: 30px; - max-width: 1200px; - margin: 0 auto; - position: relative; - z-index: 2; -} - -.data-card { - background: rgba(255, 255, 255, 0.25); - backdrop-filter: blur(25px); - border: 1px solid rgba(255, 255, 255, 0.3); - border-radius: 20px; - padding: 35px; - text-align: center; - transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); - position: relative; - overflow: hidden; - box-shadow: 0 8px 32px rgba(79, 71, 71, 0.1); -} - -.data-card::before { - content: ''; - position: absolute; - top: 0; - left: 0; - right: 0; - height: 1px; - background: linear-gradient(90deg, - transparent, - rgba(255, 255, 255, 0.6), - transparent); -} - -.data-card::after { - content: ''; - position: absolute; - top: -50%; - left: -50%; - width: 200%; - height: 200%; - background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%); - opacity: 0; - transition: opacity 0.3s ease; - pointer-events: none; -} - -.data-card:hover { - transform: translateY(-12px) scale(1.02); - box-shadow: 0 25px 60px rgba(79, 71, 71, 0.15); - border-color: rgba(38, 166, 154, 0.3); - background: rgba(255, 255, 255, 0.35); -} - -.data-card:hover::after { - opacity: 1; -} - -.card-metric { - font-size: 3.2rem; - font-weight: 800; - color: var(--accent-teal); - margin-bottom: 15px; - background: linear-gradient(135deg, var(--accent-teal), var(--accent-green)); - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - background-clip: text; - position: relative; - display: inline-block; - transition: all 0.3s ease; -} - -.card-metric::before { - content: attr(data-metric); - position: absolute; - top: 0; - left: 0; - background: linear-gradient(135deg, var(--accent-green), var(--accent-teal)); - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - background-clip: text; - opacity: 0; - transition: opacity 0.3s ease; -} - -.data-card:hover .card-metric::before { - opacity: 1; -} - -.card-label { - font-size: 1.15rem; - font-weight: 600; - color: var(--primary-dark); - margin-bottom: 10px; - transition: color 0.3s ease; -} - -.data-card:hover .card-label { - color: var(--accent-teal); -} - -.card-detail { - font-size: 0.95rem; - color: var(--primary-mid); - line-height: 1.5; - opacity: 0.8; - transition: opacity 0.3s ease; -} - -.data-card:hover .card-detail { - opacity: 1; -} - -/* ===== INTERACTION SECTION ===== */ -.interaction-section { - padding: 100px 40px; - background: rgba(255, 255, 255, 0.3); - backdrop-filter: blur(10px); - position: relative; - overflow: hidden; -} - -.interaction-section::before { - content: ''; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: linear-gradient(45deg, - transparent 30%, - rgba(38, 166, 154, 0.05) 50%, - transparent 70%); - pointer-events: none; -} - -.interaction-cards { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); - gap: 40px; - max-width: 1000px; - margin: 0 auto; - position: relative; - z-index: 2; -} - -.interaction-card { - background: rgba(255, 255, 255, 0.9); - border: 1px solid rgba(79, 71, 71, 0.1); - border-radius: 24px; - padding: 45px; - text-align: center; - transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); - cursor: pointer; - position: relative; - overflow: hidden; - backdrop-filter: blur(20px); - box-shadow: 0 8px 32px rgba(79, 71, 71, 0.1); -} - -.interaction-card::before { - content: ''; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 3px; - background: linear-gradient(90deg, var(--accent-teal), var(--accent-green)); - transform: scaleX(0); - transform-origin: left; - transition: transform 0.4s ease; -} - -.interaction-card:hover { - transform: translateY(-16px) scale(1.02); - box-shadow: 0 30px 70px rgba(79, 71, 71, 0.2); - border-color: var(--accent-teal); - background: rgba(255, 255, 255, 0.95); -} - -.interaction-card:hover::before { - transform: scaleX(1); -} - -.card-visual { - margin-bottom: 35px; - height: 140px; - display: flex; - align-items: center; - justify-content: center; - position: relative; -} - -.microphone { - position: relative; - width: 90px; - height: 90px; - background: linear-gradient(135deg, var(--accent-teal), var(--accent-green)); - border-radius: 50%; - display: flex; - align-items: center; - justify-content: center; - cursor: pointer; - transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); - box-shadow: 0 8px 30px rgba(38, 166, 154, 0.3); - overflow: hidden; -} - -.microphone::before { - content: ''; - position: absolute; - top: -50%; - left: -50%; - width: 200%; - height: 200%; - background: linear-gradient(45deg, transparent, rgba(255, 255, 255, 0.1), transparent); - transform: rotate(45deg); - transition: all 0.6s ease; - opacity: 0; -} - -.microphone:hover { - transform: scale(1.15); - box-shadow: 0 15px 50px rgba(38, 166, 154, 0.5); -} - -.microphone:hover::before { - animation: shimmer 0.6s ease; -} - -.mic-icon { - font-size: 2.2rem; - color: white; - position: relative; - z-index: 2; - transition: transform 0.3s ease; -} - -.microphone:hover .mic-icon { - transform: scale(1.1); -} - -.pulse-ring { - position: absolute; - top: -15px; - left: -15px; - right: -15px; - bottom: -15px; - border: 3px solid var(--accent-teal); - border-radius: 50%; - animation: pulse 2s infinite; - opacity: 0; -} - -.microphone:hover .pulse-ring { - animation: pulse 1s infinite; -} - -.microphone:active .pulse-ring { - animation: pulseRapid 0.5s infinite; -} - -@keyframes pulseRapid { - 0% { transform: scale(1); opacity: 0.8; } - 50% { transform: scale(1.2); opacity: 0.4; } - 100% { transform: scale(1); opacity: 0.8; } -} - -@keyframes pulse { - 0% { - transform: scale(1); - opacity: 0.8; - } - 100% { - transform: scale(1.3); - opacity: 0; - } -} - -.chat-window { - background: white; - border: 2px solid rgba(79, 71, 71, 0.1); - border-radius: 16px; - width: 320px; - height: 400px !important; - overflow: hidden; - box-shadow: 0 8px 25px rgba(79, 71, 71, 0.1); - transition: all 0.3s ease; - display: flex; - flex-direction: column; -} - -.interaction-card:hover .chat-window { - transform: scale(1.05); - box-shadow: 0 12px 35px rgba(79, 71, 71, 0.15); - border-color: var(--accent-teal); -} - -.chat-header { - background: linear-gradient(135deg, var(--accent-teal), var(--accent-green)); - color: white; - padding: 14px 18px; - font-weight: 600; - text-align: center; - position: relative; - overflow: hidden; - flex-shrink: 0; - min-height: 50px; - display: flex; - align-items: center; - justify-content: center; -} - -.chat-header::before { - content: ''; - position: absolute; - top: 0; - left: -100%; - width: 100%; - height: 100%; - background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent); - transition: left 0.8s ease; -} - -.interaction-card:hover .chat-header::before { - left: 100%; -} - -.chat-messages { - padding: 25px; - flex: 1; - overflow-y: auto !important; - max-height: 300px !important; - display: flex; - flex-direction: column; - align-items: flex-start; - justify-content: flex-start; - background: transparent; - min-height: 0; -} - -/* Chat message styling */ -.chat-message { - width: 100%; - margin-bottom: 12px; - display: flex; - flex-direction: column; - background: transparent; -} - -.chat-message.user { - align-items: flex-end; - justify-content: flex-end; -} - -.chat-message.ki { - align-items: flex-start; - justify-content: flex-start; -} - -.message-content { - background: transparent; - padding: 12px 16px; - border-radius: 16px; - box-shadow: none; - max-width: 80%; - word-wrap: break-word; - line-height: 1.4; - display: inline-block; - text-align: left; -} - -.chat-message.user .message-content { - background: var(--accent-green); - color: white; -} - -.chat-message.ki .message-content { - background: var(--accent-green); - color: white; - border-left: none; -} - -.message-time { - font-size: 11px; - color: var(--primary-mid); - margin-top: 4px; - opacity: 0.7; -} - -/* Custom scrollbar for chat messages */ -.chat-messages::-webkit-scrollbar { - width: 6px; -} - -.chat-messages::-webkit-scrollbar-track { - background: rgba(79, 71, 71, 0.1); - border-radius: 3px; -} - -.chat-messages::-webkit-scrollbar-thumb { - background: rgba(79, 71, 71, 0.3); - border-radius: 3px; -} - -.chat-messages::-webkit-scrollbar-thumb:hover { - background: rgba(79, 71, 71, 0.5); -} - -/* Chat input container styling */ -.chat-input-container { - display: flex; - gap: 10px; - align-items: center; - padding: 15px 20px; - background: white; - border-top: 1px solid rgba(79, 71, 71, 0.1); - flex-shrink: 0; - min-height: 60px; -} - -.chat-input { - flex: 1; - border: 1px solid rgba(79, 71, 71, 0.2); - border-radius: 25px; - padding: 12px 16px; - font-size: 14px; - outline: none; - transition: border-color 0.3s ease; - background: rgba(255, 255, 255, 0.8); -} - -.chat-input:focus { - border-color: var(--accent-teal); - background: white; -} - -.chat-input-container .interaction-btn { - flex-shrink: 0; - padding: 12px 20px; - font-size: 14px; -} - -.chat-send { - background: var(--accent-teal); - color: white; - border: none; - border-radius: 50%; - width: 70px; - height: 70px; - display: flex; - align-items: center; - justify-content: center; - cursor: pointer; - transition: all 0.3s ease; - flex-shrink: 0; - padding: 0; - margin-left: 10px; - box-shadow: 0 2px 8px rgba(38, 166, 154, 0.3); -} - -.chat-send:hover { - background: #1e8e82; - transform: scale(1.05); - box-shadow: 0 4px 12px rgba(38, 166, 154, 0.4); -} - -.chat-send:active { - transform: scale(0.95); -} - -.chat-send img { - width: 64px; - height: 64px; - filter: brightness(0) invert(1); - object-fit: contain; -} - -.interaction-card h3 { - font-size: 1.5rem; - font-weight: 700; - margin-bottom: 12px; - color: var(--primary-dark); -} - -.interaction-card p { - font-size: 1rem; - line-height: 1.5; - color: var(--primary-mid); - margin-bottom: 24px; -} - -.interaction-btn { - padding: 14px 28px; - border: none; - border-radius: 8px; - font-size: 1rem; - font-weight: 600; - cursor: pointer; - transition: all 0.3s ease; - text-decoration: none; - display: inline-block; -} - -.interaction-btn.primary { - background: linear-gradient(135deg, var(--accent-green), var(--accent-teal)); - color: white; - box-shadow: 0 4px 20px rgba(102, 187, 106, 0.3); -} - -.interaction-btn.primary:hover { - transform: translateY(-2px); - box-shadow: 0 8px 30px rgba(102, 187, 106, 0.4); -} - -.interaction-btn.secondary { - background: white; - color: var(--primary-dark); - border: 2px solid var(--primary-dark); -} - -.interaction-btn.secondary:hover { - background: var(--primary-dark); - color: white; - transform: translateY(-2px); -} - -/* ===== RESPONSIVE DESIGN ===== */ -@media (max-width: 1024px) { - .hero-container { - grid-template-columns: 1fr; - gap: 60px; - text-align: center; - } - - .hero-right { - height: 400px; - order: -1; - } - - .system-details { - grid-template-columns: 1fr; - gap: 20px; - } - - .qualification-grid { - grid-template-columns: 1fr; - gap: 40px; - } - - .interaction-cards { - grid-template-columns: 1fr; - } -} - -@media (max-width: 768px) { - .hero-section { - padding: 100px 20px 40px; - } - - .hero-headline { - font-size: 2rem; - } - - .hero-buttons { - justify-content: center; - } - - .systeme-section, - .qualification-section, - .process-section, - .results-section, - .interaction-section { - padding: 60px 20px; - } - - .section-headline { - font-size: 2rem; - } - - .systeme-grid { - grid-template-columns: 1fr; - } - - .results-grid { - grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); - } - - .process-line { - flex-direction: column; - gap: 20px; - } - - .process-connector { - width: 3px; - height: 60px; - } - - .hero-container { - grid-template-columns: 1fr; - gap: 40px; - text-align: center; - } - - .hero-right { - height: 400px; - margin-top: 40px; - } - - .system-graphic { - transform: scale(0.9); - width: 110%; - margin-left: -5%; - } - - .central-node { - min-width: 120px; - max-width: 140px; - padding: 8px 16px; - border-radius: 20px; - } - - .central-node .node-icon { - font-size: 1rem; - } - - .central-node .node-label { - font-size: 0.75rem; - } - - .node { - min-width: 90px; - padding: 10px; - font-size: 0.8rem; - } - - .node-icon { - font-size: 1.2rem; - } - - .node-label { - font-size: 0.75rem; - } - - /* Compact circular layout for mobile */ - .phone-node { - top: 10%; - left: 50%; - transform: translateX(-50%) scale(0.9); - } - - .chat-node { - top: 30%; - right: 10%; - transform: scale(0.9); - } - - .crm-node { - bottom: 30%; - right: 10%; - transform: scale(0.9); - } - - .ticket-node { - bottom: 10%; - left: 50%; - transform: translateX(-50%) scale(0.9); - } - - .team-node { - top: 30%; - left: 10%; - transform: scale(0.9); - } -}