From 0d835c480e574052daa75924401f65d1d5a40314 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Thu, 5 Mar 2026 17:47:23 +0000
Subject: [PATCH 1/2] Update src/app/layout.tsx

---
 src/app/layout.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 8506183..9c88e70 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1454,4 +1454,4 @@ export default function RootLayout({
       </body>
     </html>
   );
-}
\ No newline at end of file
+}
-- 
2.49.1


From 0100df9da61d9ccb3ce59e6991e0420fdf56ecf0 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Thu, 5 Mar 2026 17:47:23 +0000
Subject: [PATCH 2/2] Update src/app/page.tsx

---
 src/app/page.tsx | 180 +++++++++++++++++++++++++++++++++++++++++++++--
 1 file changed, 175 insertions(+), 5 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index c6bf9d6..6bc7fb6 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -7,9 +7,14 @@ import ProductCardOne from '@/components/sections/product/ProductCardOne';
 import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
 import ContactCTA from '@/components/sections/contact/ContactCTA';
 import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
-import { Sparkles, Briefcase, Zap, Mail, Code, Rocket, CheckCircle } from 'lucide-react';
+import LegalSection from '@/components/legal/LegalSection';
+import { Sparkles, Briefcase, Zap, Mail, Code, Rocket, CheckCircle, Mail as MailIcon, Phone as PhoneIcon } from 'lucide-react';
+import { useState } from 'react';
 
 export default function LandingPage() {
+  const [showEmailModal, setShowEmailModal] = useState(false);
+  const [showPhoneModal, setShowPhoneModal] = useState(false);
+
   const handleScrollToPortfolio = () => {
     const element = document.getElementById('portfolio');
     if (element) {
@@ -191,6 +196,94 @@ export default function LandingPage() {
         />
       </div>
 
+      <div id="impressum" data-section="impressum">
+        <LegalSection
+          layout="section"
+          title="Impressum"
+          subtitle="Rechtliche Informationen und Kontaktdaten"
+          sections={[
+            {
+              heading: "Inhaltlich Verantwortlicher (Gemäß TMG §7 Abs. 1)",              content: [
+                {
+                  type: "paragraph",                  text: "Peter Friis\nFreelance Webdesigner\nE-Mail: peteralexanderfriis696@gmail.com\nTelefon: +49 179 2355413"
+                }
+              ]
+            },
+            {
+              heading: "Angaben gemäß § 5 TMG",              content: [
+                {
+                  type: "paragraph",                  text: "Name: Peter Friis\nBeruf: Freelancer Webdesigner\nStatus: Unternehmer gemäß USt-IdNr. (siehe Umsatzsteuer-Identifikationsnummer)"
+                }
+              ]
+            },
+            {
+              heading: "Kontaktinformation",              content: [
+                {
+                  type: "paragraph",                  text: "Telefonische Erreichbarkeit und weitere Informationen:"
+                },
+                {
+                  type: "list",                  items: [
+                    "E-Mail: peteralexanderfriis696@gmail.com",                    "Telefon: +49 179 2355413",                    "Geschäftstätigkeit: Webdesign und digitale Beratung"
+                  ]
+                }
+              ]
+            },
+            {
+              heading: "Haftung für Inhalte",              content: [
+                {
+                  type: "paragraph",                  text: "Die Inhalte unserer Seiten wurden mit großer Sorgfalt erstellt. Für die Richtigkeit, Vollständigkeit und Aktualität der Inhalte kann ich jedoch keine Gewähr übernehmen. Als Diensteanbieter bin ich gemäß § 7 Abs. 1 TMG für eigene Inhalte auf diesen Seiten nach den allgemeinen Gesetzen verantwortlich. Nach §§ 8 bis 10 TMG bin ich als Diensteanbieter jedoch nicht verpflichtet, übermittelte oder gespeicherte fremde Informationen zu überwachen oder nach Umständen zu forschen, die auf eine rechtswidrige Tätigkeit hinweisen."
+                }
+              ]
+            },
+            {
+              heading: "Haftung für Links",              content: [
+                {
+                  type: "paragraph",                  text: "Meine Website enthält Links zu externen Websites Dritter. Auf die Inhalte dieser extern verlinkten Seiten habe ich keinen Einfluss. Daher kann ich für diese fremden Inhalte auch keine Gewähr übernehmen. Für die Inhalte der verlinkten Seiten ist der jeweilige Anbieter oder Betreiber der Seite verantwortlich. Die verlinkten Seiten wurden zum Zeitpunkt der Verlinkung auf mögliche Rechtsverstöße überprüft. Illegale Inhalte waren zum Zeitpunkt der Verlinkung nicht erkennbar. Eine ständige inhaltliche Kontrolle der verlinkten Seiten ist jedoch ohne konkrete Anhaltspunkte einer Rechtsverletzung nicht zumutbar."
+                }
+              ]
+            },
+            {
+              heading: "Urheberrecht",              content: [
+                {
+                  type: "paragraph",                  text: "Die auf dieser Website präsentierten Inhalte und Werke unterliegen dem deutschen Urheberrecht. Die Vervielfältigung, Bearbeitung, Verbreitung und jede Art der Verwertung außerhalb der Grenzen des Urheberrechtes bedürfen der vorherigen schriftlichen Zustimmung des Autors oder Urhebers. Downloads und Kopien dieser Seite sind nur für den privaten, nicht kommerziellen Gebrauch gestattet."
+                }
+              ]
+            },
+            {
+              heading: "Datenschutz",              content: [
+                {
+                  type: "paragraph",                  text: "Die Nutzung dieser Website ist in der Regel ohne Angabe personenbezogener Daten möglich. Soweit auf meiner Website personenbezogene Daten (beispielsweise Name, Anschrift oder E-Mail-Adressen) erhoben werden, erfolgt dies, soweit möglich, stets auf freiwilliger Basis. Diese Daten werden ohne Ihre ausdrückliche Zustimmung nicht an Dritte weitergegeben."
+                },
+                {
+                  type: "paragraph",                  text: "Beachten Sie, dass die Datenübertragung im Internet Sicherheitslücken aufweisen kann. Ein vollständiger Schutz vor dem Zugriff durch Dritte ist nicht möglich."
+                }
+              ]
+            },
+            {
+              heading: "Verwendung von Cookies",              content: [
+                {
+                  type: "paragraph",                  text: "Diese Website nutzt Cookies, um die Benutzererfahrung zu optimieren. Sie können die Cookie-Einstellungen in Ihrem Browser jederzeit deaktivieren. Beachten Sie jedoch, dass dies zu Einschränkungen bei der Nutzbarkeit dieser Website führen kann."
+                }
+              ]
+            },
+            {
+              heading: "Rechtswirksamkeit dieses Impressums",              content: [
+                {
+                  type: "paragraph",                  text: "Dieses Impressum gilt für alle Domains und Subdomains dieser Website. Es unterliegt deutschem Recht und wird nach deutschem Recht ausgelegt."
+                }
+              ]
+            },
+            {
+              heading: "Streitbeilegung",              content: [
+                {
+                  type: "paragraph",                  text: "Die Europäische Kommission stellt eine Plattform zur Online-Streitbeilegung (OS) bereit: https://ec.europa.eu/consumers/odr/. Meine E-Mail-Adresse finden Sie in diesem Impressum. Wir sind nicht bereit oder verpflichtet, an Streitbeilegungsverfahren vor einer Verbraucherschlichtungsstelle teilzunehmen."
+                }
+              ]
+            }
+          ]}
+        />
+      </div>
+
       <div id="footer" data-section="footer">
         <FooterLogoEmphasis
           logoText="Peter Friis"
@@ -205,20 +298,97 @@ export default function LandingPage() {
             {
               items: [
                 { label: "E-Mail", href: "mailto:peteralexanderfriis696@gmail.com" },
-                { label: "Telefon", href: "tel:+49176611696541" },
-                { label: "LinkedIn", href: "#" }
+                { label: "Telefon", href: "tel:+49176611696541" }
               ]
             },
             {
               items: [
                 { label: "Datenschutzrichtlinie", href: "#" },
                 { label: "Nutzungsbedingungen", href: "#" },
-                { label: "Impressum", href: "#" }
+                { label: "Impressum", href: "impressum" }
               ]
             }
           ]}
         />
       </div>
+
+      {/* Email Modal */}
+      {showEmailModal && (
+        <div className="fixed inset-0 z-50 flex items-end justify-end p-4 sm:p-6 md:p-8">
+          <div
+            className="absolute inset-0 bg-black/50 cursor-pointer"
+            onClick={() => setShowEmailModal(false)}
+          />
+          <div className="relative bg-[var(--card)] rounded-lg shadow-lg p-6 max-w-sm w-full animate-in slide-in-from-bottom-5">
+            <button
+              onClick={() => setShowEmailModal(false)}
+              className="absolute top-4 right-4 text-[var(--foreground)] opacity-60 hover:opacity-100 transition-opacity"
+            >
+              ✕
+            </button>
+            <div className="flex items-center gap-3 mb-4">
+              <MailIcon size={24} className="text-[var(--primary-cta)]" />
+              <h3 className="text-lg font-semibold text-[var(--foreground)]">E-Mail Adresse</h3>
+            </div>
+            <p className="text-[var(--foreground)] opacity-80 mb-4">peteralexanderfriis696@gmail.com</p>
+            <a
+              href="mailto:peteralexanderfriis696@gmail.com"
+              className="inline-block w-full text-center bg-[var(--primary-cta)] hover:opacity-90 text-white font-semibold py-2 px-4 rounded-lg transition-opacity"
+            >
+              E-Mail öffnen
+            </a>
+          </div>
+        </div>
+      )}
+
+      {/* Phone Modal */}
+      {showPhoneModal && (
+        <div className="fixed inset-0 z-50 flex items-end justify-end p-4 sm:p-6 md:p-8">
+          <div
+            className="absolute inset-0 bg-black/50 cursor-pointer"
+            onClick={() => setShowPhoneModal(false)}
+          />
+          <div className="relative bg-[var(--card)] rounded-lg shadow-lg p-6 max-w-sm w-full animate-in slide-in-from-bottom-5">
+            <button
+              onClick={() => setShowPhoneModal(false)}
+              className="absolute top-4 right-4 text-[var(--foreground)] opacity-60 hover:opacity-100 transition-opacity"
+            >
+              ✕
+            </button>
+            <div className="flex items-center gap-3 mb-4">
+              <PhoneIcon size={24} className="text-[var(--primary-cta)]" />
+              <h3 className="text-lg font-semibold text-[var(--foreground)]">Telefonnummer</h3>
+            </div>
+            <p className="text-[var(--foreground)] opacity-80 mb-4">+49 179 2355413</p>
+            <a
+              href="tel:+49179235541"
+              className="inline-block w-full text-center bg-[var(--primary-cta)] hover:opacity-90 text-white font-semibold py-2 px-4 rounded-lg transition-opacity"
+            >
+              Anrufen
+            </a>
+          </div>
+        </div>
+      )}
+
+      {/* Floating Contact Buttons */}
+      <div className="fixed bottom-6 right-6 flex gap-3 z-40">
+        <button
+          onClick={() => setShowEmailModal(true)}
+          className="w-14 h-14 rounded-full bg-[var(--primary-cta)] text-white flex items-center justify-center shadow-lg hover:shadow-xl hover:scale-110 transition-all"
+          title="E-Mail"
+          aria-label="E-Mail öffnen"
+        >
+          <MailIcon size={24} />
+        </button>
+        <button
+          onClick={() => setShowPhoneModal(true)}
+          className="w-14 h-14 rounded-full bg-[var(--primary-cta)] text-white flex items-center justify-center shadow-lg hover:shadow-xl hover:scale-110 transition-all"
+          title="Telefon"
+          aria-label="Telefonnummer öffnen"
+        >
+          <PhoneIcon size={24} />
+        </button>
+      </div>
     </ThemeProvider>
   );
-}
\ No newline at end of file
+}
-- 
2.49.1