fix(bestellbestaetigung): revert testimonial band to /not-found's proven structure

The 58%-wide/no-muted-bg rewrite left a large visible gap between
the photo and the quote on wide viewports, and its very wide 4.9:1
photo crop needed heavy object-cover zooming to fill a narrower
column. Reverted to the exact structure already shipped and working
on /not-found (w-[45%] column, 40px edge gradient into bg-muted) —
the only real change kept is a fixed h- instead of min-h-, which is
what actually fixed the original height-mismatch complaint.

Also re-cropped the photo twice: first to match 404-testimonial-
photo.jpg's 2.65:1 aspect ratio (avoids the aggressive cropping/zoom
a too-wide source needs to fill a taller column), then pushed the
top edge down further after finding the crop still included a few
residual pixels of a cream/shadow boundary line from the source
mockup — invisible in a downscaled preview but a visible seam once
the browser scales the 126px-tall source up 2-3x via object-cover.
Also overflows the image 4px past its container (-inset-1 instead of
inset-0) as a defensive measure against sub-pixel gaps in general.

app/bestellbestaetigung/components/BestellbestaetigungContent.tsx

@@ -241,30 +241,32 @@ export function BestellbestaetigungContent() {
         </Reveal>
       )}
 
-      {/* Testimonial band — different from /not-found's version: this
-          page's own mockup has no separate muted-bg box on the text
-          side at all, just a wide photo column that fades into the
-          plain page background at its own trailing edge, with the
-          quote sitting in a normal flex-1 column beside it (not
-          absolute-positioned with %-based offsets — that measures
-          against the row's full width and, combined with a max-w- on a
-          narrow text box, can leave almost nothing for the text itself;
-          flexbox distributes the two columns' widths correctly on its
-          own regardless of viewport size). items-stretch on a row with
-          a FIXED h- (not min-h-) keeps both columns pinned to an
+      {/* Testimonial band — same proven structure as /not-found's version
+          (see that page's own comment), not a new layout: w-[45%] image
+          column, narrow 40px edge gradient into bg-muted, quote in the
+          flex-1 remainder. Only real change from that version is a fixed
+          h- instead of min-h-, so both columns are pinned to an
           identical height regardless of how many lines the quote wraps
-          to — a min-height alone lets whichever column has more content
-          stretch the row past what the other side visually fills. */}
-      <Reveal className="relative w-full flex items-stretch h-[20rem] md:h-[24rem] bg-bg-base overflow-hidden">
-        <div className="relative w-full md:w-[58%] shrink-0">
+          to (a min-height alone lets whichever column has more content
+          stretch the row past what the other side visually fills). */}
+      <Reveal className="relative w-full flex items-stretch h-[20rem] md:h-[24rem] bg-bg-muted overflow-hidden">
+        <div className="relative w-full md:w-[45%] shrink-0">
+          {/* -inset-1, not inset-0 — this section fades in via Reveal's
+              y:28→0 transform; a plain inset-0 image can leave a
+              hairline gap at the top edge while that's still settling
+              (or from ordinary sub-pixel rounding). Overflowing the
+              image 4px past the container on every side means any such
+              gap shows the image itself, not whatever's behind it — the
+              parent's overflow-hidden clips the small overflow back
+              down to a clean box either way. */}
           <img
             alt=""
             src="/bestellbestaetigung-testimonial-photo.jpg"
-            className="absolute inset-0 w-full h-full object-cover"
+            className="absolute -inset-1 w-[calc(100%+0.5rem)] h-[calc(100%+0.5rem)] object-cover"
           />
-          <div className="hidden md:block absolute inset-y-0 right-0 w-32 bg-gradient-to-l from-transparent to-bg-base" />
+          <div className="hidden md:block absolute inset-y-0 right-0 w-40 bg-gradient-to-l from-bg-muted to-transparent" />
         </div>
-        <div className="flex-1 min-w-0 flex flex-col justify-center gap-3 px-8 md:px-12">
+        <div className="flex-1 flex flex-col justify-center gap-3 px-8 md:px-16">
           <p
             className="font-semibold text-h-section text-text-primary leading-[1.3] max-w-[28rem]"
             style={{ fontFamily: "var(--font-lora)" }}