zwischenstand

frontend/src/lib/components/chatbotDemo/Chatbot.svelte

@@ -62,18 +62,20 @@
     <InputRow
         onSend={sendMessage}
         disabled={isStreaming}
-        quickMessages={[
+        quickMessages={messages.length
-            {
+            ? []
-                title: "Erzähl mir was über",
+            : [
-                highlight: "Kontextwerk",
+                  {
-                message: "Erzähl mir bitte mehr über Kontextwerk.",
+                      title: "Erzähl mir was über",
-            },
+                      highlight: "Kontextwerk",
-            {
+                      message: "Erzähl mir bitte mehr über Kontextwerk.",
-                title: "Ich möchte euch",
+                  },
-                highlight: "kontaktieren",
+                  {
-                message: "Ich möchte euch kontaktieren. Welche Möglichkeiten gibt es?",
+                      title: "Ich möchte euch",
-            },
+                      highlight: "kontaktieren",
-        ]}
+                      message: "Ich möchte euch kontaktieren. Welche Möglichkeiten gibt es?",
+                  },
+              ]}
     />
 </div>
 

frontend/src/lib/components/chatbotDemo/Messages.svelte

@@ -12,11 +12,21 @@
 <div class="messages">
     {#each messages as message, idx (idx)}
         {#if message.role === "assistant"}
-            <div class="message assistant">
+            {#if message.content !== ""}
-                <div class="bubble assistant-bubble">
+                <div class="message assistant">
-                    {@html message.content || ""}
+                    <div class="bubble assistant-bubble">
+                        {@html message.content || ""}
+                    </div>
                 </div>
-            </div>
+            {:else}
+                <div class="message assistant typing-indicator">
+                    <div class="bubble assistant-bubble">
+                        <span class="dot"></span>
+                        <span class="dot"></span>
+                        <span class="dot"></span>
+                    </div>
+                </div>
+            {/if}
         {:else if message.role === "user"}
             <div class="message user">
                 <div class="bubble user-bubble">
@@ -31,15 +41,6 @@
             </div>
         {/if}
     {/each}
-    {#if streaming}
-        <div class="message assistant typing-indicator">
-            <div class="bubble assistant-bubble">
-                <span class="dot"></span>
-                <span class="dot"></span>
-                <span class="dot"></span>
-            </div>
-        </div>
-    {/if}
 </div>
 
 <style lang="less">
@@ -47,7 +48,7 @@
         display: flex;
         flex-direction: column;
         gap: 0.9rem;
-        padding: 1rem 0;
+        padding: 1rem 0.6rem;
         color: var(--text-reverse-100);
     }
 

frontend/src/lib/components/staticPageRows/FAQSection.svelte

@@ -11,7 +11,7 @@
         },
         {
             question: "Brauchen wir eigene Entwickler oder IT-Ressourcen?",
-            answer: "Nein – im Starter-Paket übernehmen wir Analyse, Implementierung, Hosting und Optimierung vollständig. Wenn Sie später selbst eingreifen möchten, schulen wir Ihr Team und übergeben Code sowie Container-Artefakte.",
+            answer: "Nein – im Starter-Paket übernehmen wir Analyse, Implementierung, Hosting und Optimierung vollständig. Wenn Sie später selbst eingreifen möchten, schulen wir Ihr Team und übergeben Quellcode und containerisierte Deployments für den Eigenbetrieb.",
         },
         {
             question: "Welche Sprachen, Kanäle und Anwendungsfälle sind möglich?",
@@ -23,7 +23,7 @@
         },
         {
             question: "Welche messbaren Ergebnisse können wir erwarten?",
-            answer: "Wir tracken KPIs wie Deflection-Rate, AHT und CSAT in Echtzeit. Typische Effekte: bis zu 40 % weniger Hotline-Aufkommen, +30 % Lead-Conversion und messbar höhere Kundenzufriedenheit. Monatliche Reports machen den Erfolg transparent.",
+            answer: "Wir tracken KPIs wie Deflection-Rate, AHT und CSAT in Echtzeit. Typische Effekte: mehr qualifizierte Leads, kürzere Antwortzeiten und eine deutliche Entlastung der Mitarbeiter. Monatliche Reports machen den Erfolg transparent.",
         },
     ]
 
@@ -34,6 +34,11 @@
     }
 
     const answerId = (index: number) => `faq-answer-${index}`
+    const description = `
+        Vom ersten Prototyp bis zum laufenden Betrieb:
+        Hier finden Sie Antworten auf die meistgestellten Fragen.
+        Alles Weitere besprechen wir gerne persönlich – oder live mit unserem Demo-Bot.
+    `
 </script>
 
 <CrinkledSection
@@ -50,7 +55,7 @@
                     brightBackground={true}
                     subtitle="FAQ"
                     title="Häufige Fragen"
-                    description="Von Implementierung bis Betrieb: Wir haben die wichtigsten Fragen gesammelt und liefern klare Antworten – für alles andere können Sie uns kontaktieren, oder einen unserer Bots fragen."
+                    {description}
                 />
                 <div class="faq-list">
                     {#each faqs as faq, index}
@@ -121,13 +126,14 @@
         position: relative;
         border-radius: 1.25rem;
         background:
-            radial-gradient(130% 160% at 15% -20%, rgba(173, 81, 76, 0.12) 0%, rgba(255, 255, 255, 0.94) 65%),
+            radial-gradient(130% 160% at 15% -20%, rgba(173, 81, 76, 0.08) 0%, rgba(255, 255, 255, 0.98) 64%),
-            rgba(255, 255, 255, 0.96);
+            rgba(255, 255, 255, 0.99);
-        border: 1px solid rgba(173, 81, 76, 0.12);
+        border: 1px solid rgba(173, 81, 76, 0.1);
         box-shadow:
             0 20px 48px rgba(13, 12, 12, 0.08),
             inset 0 0 0 1px rgba(255, 255, 255, 0.6);
         overflow: hidden;
+        isolation: isolate;
         transition:
             border-color 0.3s ease,
             box-shadow 0.3s ease,
@@ -140,13 +146,14 @@
             border-radius: inherit;
             background: linear-gradient(
                 145deg,
-                rgba(173, 81, 76, 0.12) 0%,
+                rgba(173, 81, 76, 0.1) 0%,
-                rgba(255, 255, 255, 0.75) 40%,
+                rgba(255, 255, 255, 0.45) 38%,
-                transparent 95%
+                transparent 92%
             );
             opacity: 0;
             transition: opacity 0.3s ease;
             pointer-events: none;
+            z-index: -1;
         }
 
         &:hover,

frontend/src/lib/components/staticPageRows/OfferPackages.svelte

@@ -21,7 +21,7 @@
             features: [
                 "Komplettlösung: ab 2 500 €",
                 "Hosting & Monitoring im deutschen Rechenzentrum: ab 100 €/Monat",
-                "Transparente Nutzungskosten: ca. 2 € pro 100 Chat-Sessions bzw. 5 € pro 100 Telefongespräche*",
+                "Transparente Nutzungskosten: ca. 2 € auf 100 Chat-Sessions bzw. ca. 5 € auf 100 Telefongespräche*",
                 "Optionale laufende Optimierungen: ab 250 €/Monat",
                 "Vollständig DSGVO-konform, jederzeit kündbar mit 30 Tagen Frist",
             ],
@@ -34,9 +34,8 @@
             features: [
                 "On-Premise- oder Private-Cloud-Deployment (Kubernetes/Docker)",
                 "Schulung & Enablement Ihres Teams: 1–3 Tage, feste Tagessätze",
-                "Plattform-Lizenz nach Server-Knoten oder CPU/VRAM-Paketen",
+                "Plattform-Lizenz pro Serverinstanz",
-                "Premium-Support & individuelle SLA bis 24/7 verfügbar",
+                "Gleicher Funktionsumfang wie Starter",
-                "Gleicher Funktionsumfang wie Starter, jedoch mit eigener Datenhoheit und Möglichkeit, firmeneigene LLMs anzubinden.",
             ],
         },
     ]