feat: Add professional portfolio images and Hero redesign

- Add 15 optimized WebP images for portfolio (21-53KB each)
- Redesign Hero section with full-width background image
- Add SSR support for Hero component
- Update About section with new portrait image
- Update Contact page with professional headshot
- Add images to Services/Leistungen page
- Add image optimization script (sharp)
- Update translations for gallery section

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

src/app/[locale]/imprint/page.tsx

@@ -6,24 +6,49 @@ type Props = {
   params: Promise<{ locale: string }>;
 };
 
+const BASE_URL = process.env.NEXT_PUBLIC_SITE_URL || 'https://damjan-savic.com';
+
 export async function generateMetadata({ params }: Props): Promise<Metadata> {
   const { locale } = await params;
 
   const titles: Record<string, string> = {
-    de: 'Impressum',
-    en: 'Imprint',
-    sr: 'Impresum',
+    de: 'Impressum | Damjan Savić - KI Entwickler Köln',
+    en: 'Legal Notice | Damjan Savić - AI Developer',
+    sr: 'Impresum | Damjan Savić - AI Developer',
   };
 
   const descriptions: Record<string, string> = {
-    de: 'Impressum fuer die Portfolio-Website von Damjan Savic',
-    en: 'Legal notice for Damjan Savic portfolio website',
-    sr: 'Pravno obavestenje za portfolio veb sajt Damjana Savica',
+    de: 'Impressum und rechtliche Informationen für die Portfolio-Website von Damjan Savić, KI Entwickler und Automation Specialist aus Köln.',
+    en: 'Legal notice and contact information for Damjan Savić portfolio website, AI Developer and Automation Specialist.',
+    sr: 'Pravno obavestenje i kontakt informacije za portfolio veb sajt Damjana Savica, AI Developer i Automation Specialist.',
   };
 
+  const localePath = locale === 'de' ? '/imprint' : `/${locale}/imprint`;
+
   return {
     title: titles[locale] || titles.de,
     description: descriptions[locale] || descriptions.de,
+    alternates: {
+      canonical: `${BASE_URL}${localePath}`,
+      languages: {
+        'x-default': `${BASE_URL}/imprint`,
+        de: `${BASE_URL}/imprint`,
+        en: `${BASE_URL}/en/imprint`,
+        sr: `${BASE_URL}/sr/imprint`,
+      },
+    },
+    openGraph: {
+      title: titles[locale] || titles.de,
+      description: descriptions[locale] || descriptions.de,
+      url: `${BASE_URL}${localePath}`,
+      type: 'website',
+      locale: locale === 'de' ? 'de_DE' : locale === 'sr' ? 'sr_RS' : 'en_US',
+      alternateLocale: ['de_DE', 'en_US', 'sr_RS'].filter(l => l !== (locale === 'de' ? 'de_DE' : locale === 'sr' ? 'sr_RS' : 'en_US')),
+    },
+    robots: {
+      index: true,
+      follow: true,
+    },
   };
 }
 
@@ -46,7 +71,7 @@ export default async function ImprintPage({ params }: Props) {
       contact: {
         title: 'Kontakt',
         content: [
-          'Damjan Savic',
+          'Damjan Savić',
           'Fullstack Developer & Digital Solutions Consultant',
           'E-Mail: info@damjan-savic.com',
           'Website: https://damjan-savic.com',
@@ -56,18 +81,18 @@ export default async function ImprintPage({ params }: Props) {
         title: 'Haftungsausschluss',
         sections: [
           {
-            title: 'Haftung fuer Inhalte',
-            content: 'Die Inhalte meiner Seiten wurden mit groesster Sorgfalt erstellt. Fuer die Richtigkeit, Vollstaendigkeit und Aktualitaet der Inhalte kann ich jedoch keine Gewaehr uebernehmen.',
+            title: 'Haftung für Inhalte',
+            content: 'Die Inhalte meiner Seiten wurden mit größter Sorgfalt erstellt. Für die Richtigkeit, Vollständigkeit und Aktualität der Inhalte kann ich jedoch keine Gewähr übernehmen.',
           },
           {
-            title: 'Haftung fuer Links',
-            content: 'Meine Website enthaelt Links zu externen Websites Dritter, auf deren Inhalte ich keinen Einfluss habe. Deshalb kann ich fuer diese fremden Inhalte auch keine Gewaehr uebernehmen. Fuer die Inhalte der verlinkten Seiten ist stets der jeweilige Anbieter oder Betreiber der Seiten verantwortlich.',
+            title: 'Haftung für Links',
+            content: 'Meine Website enthält Links zu externen Websites Dritter, auf deren Inhalte ich keinen Einfluss habe. Deshalb kann ich für diese fremden Inhalte auch keine Gewähr übernehmen. Für die Inhalte der verlinkten Seiten ist stets der jeweilige Anbieter oder Betreiber der Seiten verantwortlich.',
           },
         ],
       },
       copyright: {
         title: 'Urheberrecht',
-        content: 'Die durch den Seitenbetreiber erstellten Inhalte und Werke auf diesen Seiten unterliegen dem deutschen Urheberrecht. Die Vervielfaeltigung, Bearbeitung, Verbreitung und jede Art der Verwertung ausserhalb der Grenzen des Urheberrechtes beduerfen der schriftlichen Zustimmung des jeweiligen Autors bzw. Erstellers.',
+        content: 'Die durch den Seitenbetreiber erstellten Inhalte und Werke auf diesen Seiten unterliegen dem deutschen Urheberrecht. Die Vervielfältigung, Bearbeitung, Verbreitung und jede Art der Verwertung außerhalb der Grenzen des Urheberrechtes bedürfen der schriftlichen Zustimmung des jeweiligen Autors bzw. Erstellers.',
       },
       images: {
         title: 'Bildnachweise',
@@ -79,12 +104,12 @@ export default async function ImprintPage({ params }: Props) {
       },
       privacy: {
         title: 'Datenschutz',
-        content: 'Die Nutzung unserer Webseite ist in der Regel ohne Angabe personenbezogener Daten moeglich. Weitere Informationen zum Datenschutz finden Sie in unserer',
-        link: 'Datenschutzerklaerung',
+        content: 'Die Nutzung unserer Webseite ist in der Regel ohne Angabe personenbezogener Daten möglich. Weitere Informationen zum Datenschutz finden Sie in unserer',
+        link: 'Datenschutzerklärung',
       },
       technical: {
         title: 'Technische Umsetzung',
-        design: 'Design & Entwicklung: Damjan Savic',
+        design: 'Design & Entwicklung: Damjan Savić',
         tech: 'Technologien: Next.js, TypeScript, Tailwind CSS',
       },
       copyrightNotice: 'Alle Rechte vorbehalten.',
@@ -94,7 +119,7 @@ export default async function ImprintPage({ params }: Props) {
       contact: {
         title: 'Contact',
         content: [
-          'Damjan Savic',
+          'Damjan Savić',
           'Fullstack Developer & Digital Solutions Consultant',
           'Email: info@damjan-savic.com',
           'Website: https://damjan-savic.com',
@@ -132,7 +157,7 @@ export default async function ImprintPage({ params }: Props) {
       },
       technical: {
         title: 'Technical Implementation',
-        design: 'Design & Development: Damjan Savic',
+        design: 'Design & Development: Damjan Savić',
         tech: 'Technologies: Next.js, TypeScript, Tailwind CSS',
       },
       copyrightNotice: 'All rights reserved.',
@@ -142,7 +167,7 @@ export default async function ImprintPage({ params }: Props) {
       contact: {
         title: 'Kontakt',
         content: [
-          'Damjan Savic',
+          'Damjan Savić',
           'Fullstack Developer & Digital Solutions Consultant',
           'Email: info@damjan-savic.com',
           'Website: https://damjan-savic.com',
@@ -180,7 +205,7 @@ export default async function ImprintPage({ params }: Props) {
       },
       technical: {
         title: 'Tehnicka implementacija',
-        design: 'Dizajn i razvoj: Damjan Savic',
+        design: 'Dizajn i razvoj: Damjan Savić',
         tech: 'Tehnologije: Next.js, TypeScript, Tailwind CSS',
       },
       copyrightNotice: 'Sva prava zadrzana.',
@@ -266,7 +291,7 @@ export default async function ImprintPage({ params }: Props) {
           {/* Copyright Notice */}
           <section>
             <p className="text-zinc-400">
-              &copy; {new Date().getFullYear()} Damjan Savic. {c.copyrightNotice}
+              &copy; {new Date().getFullYear()} Damjan Savić. {c.copyrightNotice}
             </p>
           </section>
         </div>