perf(images): convert remaining <img> tags to next/image project-wide

Clears every remaining @next/next/no-img-element warning — automatic
responsive srcset, lazy-loading, and format optimization instead of
always loading the original file at full size. Fixed-size icons got
explicit width/height; dynamic-aspect photos got fill inside a
relative wrapper.

app/components/About.tsx

@@ -1,3 +1,4 @@
+import Image from "next/image";
 import { Reveal } from "./Reveal";
 
 export function About() {
@@ -75,10 +76,12 @@ export function About() {
         style={{ minHeight: "14rem" }}
         delay={0.15}
       >
-        <img
+        <Image
           alt="Björn"
           src="/about-author.jpg"
-          className="absolute inset-0 w-full h-full object-cover object-center pointer-events-none"
+          fill
+          sizes="(min-width: 768px) 58vw, 100vw"
+          className="object-cover object-center pointer-events-none"
         />
         {/* Left gradient: wide enough to cover the text-column overlap — md+ only */}
         <div className="hidden md:block absolute inset-y-0 left-0 w-72 bg-gradient-to-r from-bg-dark to-transparent pointer-events-none" />