Move trust badges, shipping/payment methods, Werkzeuge cards, product spotlight into CMS

New Payload collections, all editable without a code deploy:
- TrustBadges: the horizontal Schneller-Versand/Versandkostenfrei/Mit-
  Liebe-verpackt row (TrustRow.tsx, now an async server component).
- CartTrustBadges: the Sichere-Zahlung/14-Tage-Rückgaberecht/Nachhaltig-
  verpackt sidebar bullets — shared by /cart (title only) and /checkout
  (title + description), which previously had two different hardcoded
  bullet lists for what's conceptually the same content.
- ShippingMethods: /checkout's Versandart radios. Each method has its own
  optional freeShippingThreshold — omitted means "never free" (Express),
  not "always free". /cart's FreeShippingBanner now targets the lowest
  threshold among active methods instead of a single global constant, and
  hides entirely if no active method has one.
- PaymentMethods: /checkout's Zahlungsart radios, icons as an array
  (Kreditkarte shows 3 logos, PayPal/Überweisung show 1).
- Products: new spotlight/spotlightHeadline/spotlightText/spotlightImage/
  compareAtPrice fields. ProductSpotlight.tsx (homepage) now shows
  whichever product has `spotlight` checked instead of being hardcoded to
  ToDo-Karten, with its own marketing copy separate from the plain
  catalog name/description. AddToCartButton takes an explicit productId
  prop now instead of a hardcoded "todo-karten" constant.
- WerkzeugeCards: the homepage's "Meine Werkzeuge" 3-card grid (Tools.tsx,
  now async). Icons use a uniform box instead of the previous per-card
  hand-tuned width/height/rotation, which only worked for 3 known,
  upside-down-authored SVGs — those were re-exported as pre-flipped PNGs.

lib/payload.ts gained getTrustBadges/getCartTrustBadges/getShippingMethods/
getPaymentMethods/getWerkzeugeCards/getSpotlightProduct, all with the same
graceful-empty-array-on-fetch-failure pattern as the existing functions.

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

app/components/TrustRow.tsx

@@ -1,31 +1,24 @@
-import { FREE_SHIPPING_THRESHOLD, TOTAL_DAYS_DE } from "../lib/shipping";
-import { formatPrice } from "../lib/format";
+import { getTrustBadges } from "../lib/payload";
 
-const items = [
-  {
-    icon: "/icon-trust-shipping.png",
-    title: "Schneller Versand",
-    desc: `In ${TOTAL_DAYS_DE.min}–${TOTAL_DAYS_DE.max} Werktagen bei dir.`,
-  },
-  {
-    icon: "/icon-trust-free-shipping.png",
-    title: "Versandkostenfrei",
-    desc: `Ab ${formatPrice(FREE_SHIPPING_THRESHOLD)} Bestellwert innerhalb DE.`,
-  },
-  { icon: "/icon-trust-heart.png", title: "Mit Liebe verpackt", desc: "Für mehr Freude beim Auspacken." },
-];
+// Content now lives in Payload (TrustBadges collection) instead of being
+// hardcoded here, so copy (e.g. the shipping timeframe/threshold numbers)
+// can be updated without a code deploy. If the fetch fails or nothing is
+// seeded yet, the row just doesn't render rather than showing stale
+// hardcoded fallback text that could drift from the real numbers.
+export async function TrustRow() {
+  const items = await getTrustBadges();
+  if (items.length === 0) return null;
 
-export function TrustRow() {
   return (
     <div className="w-full bg-bg-base flex flex-col md:flex-row gap-6 md:gap-12 items-center justify-center py-8 px-[var(--layout-padding-x)]">
       {items.map((item, i) => (
-        <div key={item.title} className="flex items-center gap-6 md:gap-12">
+        <div key={item.id} className="flex items-center gap-6 md:gap-12">
           {i > 0 && <div className="hidden md:block h-10 w-px bg-border" />}
           <div className="flex gap-4 items-center">
             <img alt="" src={item.icon} className="size-8 shrink-0 object-contain" />
             <div className="flex flex-col gap-0.5 items-start">
               <p className="font-semibold text-body text-text-primary whitespace-nowrap">{item.title}</p>
-              <p className="text-body-sm text-text-muted whitespace-nowrap">{item.desc}</p>
+              <p className="text-body-sm text-text-muted whitespace-nowrap">{item.description}</p>
             </div>
           </div>
         </div>