Mobile: SVG-Grafik, auf kleinen Screens sichtbar

- programmer-graphic.tsx: programmierer-vector.svg statt PNG (336 KB statt 1,6 MB)
- hero.tsx: hidden lg:block entfernt, Grafik jetzt auch auf Mobile sichtbar
- Mobile-Größe: max-w-xs/sm, Desktop: max-w-md

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

components/hero.tsx

@@ -83,7 +83,7 @@ export function Hero() {
             initial={{ opacity: 0, scale: 0.95 }}
             animate={{ opacity: 1, scale: 1 }}
             transition={{ duration: 0.8, delay: 0.3 }}
-            className="lg:col-span-5 hidden lg:block"
+            className="lg:col-span-5"
           >
             <ProgrammerGraphic />
           </motion.div>

components/programmer-graphic.tsx

@@ -2,7 +2,7 @@
 
 import { motion } from 'framer-motion'
 import Image from 'next/image'
-import programmiererImg from '../public/Programmierer.png'
+import programmiererSvg from '../public/programmierer-vector.svg'
 
 export function ProgrammerGraphic() {
   return (
@@ -10,10 +10,10 @@ export function ProgrammerGraphic() {
       initial={{ opacity: 0, scale: 0.95 }}
       animate={{ opacity: 1, scale: 1 }}
       transition={{ duration: 0.8 }}
-      className="relative w-full max-w-md mx-auto aspect-[3/5] lg:aspect-square"
+      className="relative w-full max-w-xs mx-auto aspect-[3/5] sm:max-w-sm lg:max-w-md lg:aspect-square"
     >
       <Image
-        src={programmiererImg}
+        src={programmiererSvg}
         alt="Programmierung: Von 1976 bis heute – 50 Jahre Code"
         fill
         className="object-contain drop-shadow-lg"