feat: Erfolgs-Modal nach Zahlung + Redirect

- Zeigt Bestätigungsnachricht nach erfolgreicher Zahlung
- Payment Links mit Redirect zur Startseite
- Links öffnen im selben Tab

🤖 Generated with Claude Code

Co-Authored-By: Claude <noreply@anthropic.com>

src/App.tsx

@@ -29,6 +29,17 @@ function useScrollAnimation() {
 function App() {
   const [activeTestimonial, setActiveTestimonial] = useState(0);
   const [openFaq, setOpenFaq] = useState<number | null>(null);
+  const [showSuccess, setShowSuccess] = useState(false);
+
+  // Check for successful payment redirect
+  useEffect(() => {
+    const params = new URLSearchParams(window.location.search);
+    if (params.get('success') === 'true') {
+      setShowSuccess(true);
+      // Remove query param from URL
+      window.history.replaceState({}, '', window.location.pathname);
+    }
+  }, []);
 
   // Scroll animation refs
   const problemSection = useScrollAnimation();
@@ -68,6 +79,27 @@ function App() {
 
   return (
     <div className="min-h-screen scroll-smooth">
+      {/* SUCCESS MODAL */}
+      {showSuccess && (
+        <div className="fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-50">
+          <div className="bg-white rounded-lg shadow-2xl p-8 max-w-md mx-4 text-center">
+            <div className="w-16 h-16 bg-green-500 rounded-full flex items-center justify-center mx-auto mb-4">
+              <Check className="w-8 h-8 text-white" />
+            </div>
+            <h2 className="text-2xl font-bold text-gray-900 mb-2">Buchung erfolgreich!</h2>
+            <p className="text-gray-600 mb-6">
+              Vielen Dank für Ihre Buchung. Sie erhalten in Kürze eine Bestätigungs-E-Mail mit allen Details zu Ihrer SunHouse-Führung.
+            </p>
+            <button
+              onClick={() => setShowSuccess(false)}
+              className="bg-green-500 hover:bg-green-600 text-white font-bold px-6 py-3 rounded-lg transition-colors duration-300"
+            >
+              Verstanden
+            </button>
+          </div>
+        </div>
+      )}
+
       {/* SECTION 1: HERO */}
       <section className="relative min-h-screen flex items-center justify-center bg-gray-900">
         <div
@@ -439,9 +471,7 @@ function App() {
                 </ul>
 
                 <a
-                  href="https://buy.stripe.com/test_4gM8wOfv2chEcf83XGebu00"
+                  href="https://buy.stripe.com/test_fZu28q3Mk4Pcdjcbq8ebu03"
-                  target="_blank"
-                  rel="noopener noreferrer"
                   className="block w-full text-center border-2 border-green-500 text-green-500 font-bold px-6 py-3 rounded-lg hover:bg-green-50 transition-colors duration-300"
                 >
                   Jetzt Buchen
@@ -493,9 +523,7 @@ function App() {
                 </ul>
 
                 <a
-                  href="https://buy.stripe.com/test_5kQ00ibeM95sbb4eCkebu01"
+                  href="https://buy.stripe.com/test_9B628qfv25Tga70gKsebu04"
-                  target="_blank"
-                  rel="noopener noreferrer"
                   className="block w-full text-center bg-green-500 text-white font-bold px-6 py-3 rounded-lg hover:bg-green-600 transition-colors duration-300"
                 >
                   Gruppe Buchen
@@ -542,9 +570,7 @@ function App() {
                 </ul>
 
                 <a
-                  href="https://buy.stripe.com/test_aFa8wObeMa9wfrk9i0ebu02"
+                  href="https://buy.stripe.com/test_bJe7sKfv2bdA4MGdygebu05"
-                  target="_blank"
-                  rel="noopener noreferrer"
                   className="block w-full text-center border-2 border-green-500 text-green-500 font-bold px-6 py-3 rounded-lg hover:bg-green-50 transition-colors duration-300"
                 >
                   Premium Buchen