feat: Modularer Baukasten + mitarbeiterbasiertes Pricing + Savings-ROI

Produkte: 8 Module als Baukasten (Code Security, CE-Risiko, Compliance-Docs,
Audit Manager, LLM, Academy, Jira, Full Compliance)
Pricing: nach MA (<50: 15k, 50-250: 30k, 250+: 40-50k EUR/Jahr)
Cloud Standard (BSI DE/OVH FR), Mac Mini nur fuer <10 MA

Geschaeftsmodell: ROI-Rechnung statt HW-Amortisation
(Kunde zahlt 40-50k, spart 50-110k: Pentests, CE, Auditmanager)

So funktioniert's: Cloud-Vertrag statt HW aufstellen,
Audit vorbereiten statt Audit bestehen

Competition: Pricing-Tiers auf Cloud-Modell umgestellt
FAQ: Alle 65+-Referenzen + alte Tier-Preise entfernt

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

pitch-deck/components/slides/BusinessModelSlide.tsx

@@ -1,142 +1,104 @@
 'use client'
 
-import { motion } from 'framer-motion'
-import { Language, PitchProduct } from '@/lib/types'
+import { Language } from '@/lib/types'
 import { t } from '@/lib/i18n'
 import GradientText from '../ui/GradientText'
 import FadeInView from '../ui/FadeInView'
 import GlassCard from '../ui/GlassCard'
-import { DollarSign, Repeat, TrendingUp } from 'lucide-react'
+import AnimatedCounter from '../ui/AnimatedCounter'
+import { Repeat, TrendingUp, PiggyBank, ShieldCheck, Clock, Users } from 'lucide-react'
 
 interface BusinessModelSlideProps {
   lang: Language
-  products: PitchProduct[]
+  products?: unknown[]
 }
 
-const AMORT_MONTHS = 24
-
-function computeKPIs(products: PitchProduct[]) {
-  if (!products.length) return { weightedMarginDuring: 0, weightedMarginAfter: 0, amortMonths: AMORT_MONTHS }
-
-  // Compute weighted margin based on product mix (equal weight per product as proxy)
-  const n = products.length
-  let sumMarginDuring = 0
-  let sumMarginAfter = 0
-  let maxAmortMonths = 0
-
-  for (const p of products) {
-    const price = p.monthly_price_eur
-    if (price <= 0) continue
-    const amort = p.hardware_cost_eur > 0 ? p.hardware_cost_eur / AMORT_MONTHS : 0
-    const opex = p.operating_cost_eur > 0 ? p.operating_cost_eur : 0
-
-    // Margin during amortization
-    const marginDuring = (price - amort - opex) / price
-    sumMarginDuring += marginDuring
-
-    // Margin after amortization (no more HW cost)
-    const marginAfter = (price - opex) / price
-    sumMarginAfter += marginAfter
-
-    // Payback period in months
-    if (p.hardware_cost_eur > 0 && price - opex > 0) {
-      const payback = Math.ceil(p.hardware_cost_eur / (price - opex))
-      if (payback > maxAmortMonths) maxAmortMonths = payback
-    }
-  }
-
-  return {
-    weightedMarginDuring: Math.round((sumMarginDuring / n) * 100),
-    weightedMarginAfter: Math.round((sumMarginAfter / n) * 100),
-    amortMonths: maxAmortMonths || AMORT_MONTHS,
-  }
-}
-
-export default function BusinessModelSlide({ lang, products }: BusinessModelSlideProps) {
+export default function BusinessModelSlide({ lang }: BusinessModelSlideProps) {
   const i = t(lang)
-  const { weightedMarginDuring, weightedMarginAfter, amortMonths } = computeKPIs(products)
+  const de = lang === 'de'
 
   return (
     <div>
-      <FadeInView className="text-center mb-12">
+      <FadeInView className="text-center mb-10">
         <h2 className="text-4xl md:text-5xl font-bold mb-3">
           <GradientText>{i.businessModel.title}</GradientText>
         </h2>
         <p className="text-lg text-white/50 max-w-2xl mx-auto">{i.businessModel.subtitle}</p>
       </FadeInView>
 
-      {/* Key Metrics — dynamisch berechnet */}
+      {/* Key Metrics */}
       <div className="grid md:grid-cols-3 gap-4 mb-8">
         <GlassCard delay={0.2} className="text-center">
           <Repeat className="w-6 h-6 text-indigo-400 mx-auto mb-2" />
           <p className="text-sm text-white/50 mb-1">{i.businessModel.recurringRevenue}</p>
-          <p className="text-2xl font-bold text-white">100%</p>
-          <p className="text-xs text-white/30">SaaS / Subscription</p>
+          <p className="text-2xl font-bold text-white">100% SaaS</p>
+          <p className="text-xs text-white/30">{de ? 'Mitarbeiterbasiertes Pricing' : 'Employee-based pricing'}</p>
         </GlassCard>
         <GlassCard delay={0.3} className="text-center">
-          <DollarSign className="w-6 h-6 text-green-400 mx-auto mb-2" />
+          <TrendingUp className="w-6 h-6 text-green-400 mx-auto mb-2" />
           <p className="text-sm text-white/50 mb-1">{i.businessModel.margin}</p>
-          <p className="text-2xl font-bold text-white">&gt;{weightedMarginAfter}%</p>
-          <p className="text-xs text-white/30">
-            {lang === 'de' ? 'nach Amortisation' : 'post amortization'}
-            {' · '}
-            {weightedMarginDuring}% {lang === 'de' ? 'waehrend' : 'during'}
-          </p>
+          <p className="text-2xl font-bold text-white">&gt;80%</p>
+          <p className="text-xs text-white/30">{de ? 'Cloud-native, keine HW-Kosten' : 'Cloud-native, no HW costs'}</p>
         </GlassCard>
         <GlassCard delay={0.4} className="text-center">
-          <TrendingUp className="w-6 h-6 text-purple-400 mx-auto mb-2" />
-          <p className="text-sm text-white/50 mb-1">{i.businessModel.amortization}</p>
-          <p className="text-2xl font-bold text-white">{amortMonths} {i.businessModel.months}</p>
-          <p className="text-xs text-white/30">{lang === 'de' ? 'max. Hardware-Amortisation' : 'max. Hardware Amortization'}</p>
+          <PiggyBank className="w-6 h-6 text-amber-400 mx-auto mb-2" />
+          <p className="text-sm text-white/50 mb-1">{de ? 'Kundenersparnis' : 'Customer Savings'}</p>
+          <p className="text-2xl font-bold text-white">50.000+ EUR</p>
+          <p className="text-xs text-white/30">{de ? 'pro Kunde pro Jahr' : 'per customer per year'}</p>
         </GlassCard>
       </div>
 
-      {/* Unit Economics per Product */}
+      {/* Savings Breakdown — the core argument */}
       <FadeInView delay={0.5}>
-        <h3 className="text-lg font-semibold mb-4 text-white/70">{i.businessModel.unitEconomics}</h3>
-        <div className="grid md:grid-cols-3 gap-4">
-          {products.map((p, idx) => {
-            const amort = p.hardware_cost_eur > 0 ? Math.round(p.hardware_cost_eur / AMORT_MONTHS) : 0
-            const monthlyMargin = p.monthly_price_eur - amort - (p.operating_cost_eur > 0 ? p.operating_cost_eur : 0)
-            const marginPct = Math.round((monthlyMargin / p.monthly_price_eur) * 100)
-
-            return (
-              <motion.div
-                key={p.id}
-                initial={{ opacity: 0, rotateY: -15 }}
-                animate={{ opacity: 1, rotateY: 0 }}
-                transition={{ delay: 0.6 + idx * 0.15 }}
-                className="bg-white/[0.05] border border-white/10 rounded-2xl p-5"
-              >
-                <h4 className="font-bold text-white mb-3">{p.name}</h4>
-                <div className="space-y-2 text-sm">
-                  <div className="flex justify-between">
-                    <span className="text-white/50">{lang === 'de' ? 'Monatspreis' : 'Monthly Price'}</span>
-                    <span className="text-white font-medium">{p.monthly_price_eur} EUR</span>
-                  </div>
-                  {p.hardware_cost_eur > 0 && (
-                    <div className="flex justify-between">
-                      <span className="text-white/50">{i.businessModel.hardwareCost}</span>
-                      <span className="text-white/70">-{amort} EUR/Mo</span>
+        <GlassCard hover={false} className="p-6">
+          <h3 className="text-lg font-semibold mb-5 text-white/70 text-center">
+            {de ? 'ROI-Rechnung: Kunde mit 250+ Mitarbeitern' : 'ROI Calculation: Customer with 250+ employees'}
+          </h3>
+          <div className="grid md:grid-cols-2 gap-8">
+            {/* Customer pays */}
+            <div>
+              <h4 className="text-xs font-bold text-indigo-400 uppercase tracking-wider mb-3">
+                {i.businessModel.customerPays}
+              </h4>
+              <div className="bg-indigo-500/10 border border-indigo-500/20 rounded-xl p-4">
+                <p className="text-3xl font-bold text-white text-center mb-1">
+                  <AnimatedCounter target={40} suffix="-50k" duration={1500} /> EUR
+                </p>
+                <p className="text-xs text-white/40 text-center">{de ? 'pro Jahr, modular waehlbar' : 'per year, modular choice'}</p>
+              </div>
+            </div>
+            {/* Customer saves */}
+            <div>
+              <h4 className="text-xs font-bold text-emerald-400 uppercase tracking-wider mb-3">
+                {i.businessModel.customerSaves}
+              </h4>
+              <div className="space-y-2">
+                {[
+                  { label: i.businessModel.savingsPentest, amount: '30.000', icon: ShieldCheck },
+                  { label: i.businessModel.savingsCE, amount: '20.000', icon: Clock },
+                  { label: i.businessModel.savingsAudit, amount: '60.000+', icon: Users },
+                ].map((item, idx) => (
+                  <div key={idx} className="flex items-center justify-between bg-emerald-500/10 rounded-lg px-3 py-2">
+                    <div className="flex items-center gap-2">
+                      <item.icon className="w-3.5 h-3.5 text-emerald-400" />
+                      <span className="text-xs text-white/70">{item.label}</span>
                     </div>
-                  )}
-                  {p.operating_cost_eur > 0 && (
-                    <div className="flex justify-between">
-                      <span className="text-white/50">{i.businessModel.operatingCost}</span>
-                      <span className="text-white/70">-{p.operating_cost_eur} EUR/Mo</span>
-                    </div>
-                  )}
-                  <div className="border-t border-white/10 pt-2 flex justify-between">
-                    <span className="text-white/50">{i.businessModel.margin}</span>
-                    <span className={`font-bold ${marginPct > 0 ? 'text-green-400' : 'text-red-400'}`}>
-                      {marginPct > 0 ? '+' : ''}{monthlyMargin} EUR ({marginPct}%)
-                    </span>
+                    <span className="text-xs font-bold text-emerald-300">{item.amount} EUR</span>
                   </div>
+                ))}
+                <div className="flex items-center justify-between bg-emerald-500/20 border border-emerald-500/30 rounded-lg px-3 py-2">
+                  <span className="text-xs font-bold text-white">{i.businessModel.savingsTotal}</span>
+                  <span className="text-sm font-bold text-emerald-300">50.000 - 110.000+ EUR</span>
                 </div>
-              </motion.div>
-            )
-          })}
-        </div>
+              </div>
+            </div>
+          </div>
+          <p className="text-center text-xs text-white/30 mt-4">
+            {de
+              ? '+ Strafvermeidung, Echtzeit-Kundenanfragen, kein Auditmanager noetig'
+              : '+ penalty avoidance, real-time customer inquiries, no audit manager needed'}
+          </p>
+        </GlassCard>
       </FadeInView>
     </div>
   )