PDP: tighten gap between 'Was kann er?' heading and its icon row (they read as two unrelated sections)

app/components/ProductBlocks.tsx

@@ -98,11 +98,26 @@ export async function ProductBlocks({ product }: { product: Product }) {
       if (block.blockType === "productHero" || block.blockType === "productPricingPanel") {
         return <div key={block.id}>{renderProductBlock(block, ctx)}</div>;
       }
+      // richTextSection→stepRow is always the "Was kann er?" heading
+      // directly above its icon row on a PDP — both getting their own full
+      // py-12/16 stacked (pb of one + pt of the other) put ~100-128px
+      // between a heading and the row it's introducing, reading as two
+      // unrelated sections instead of one (reported 2026-08-30). Trim the
+      // heading's own bottom gap so the two feel like one group, while
+      // keeping the outer edges (after Hero, before Pricing) generous.
+      const isPdpHeadingBeforeIcons = block.blockType === "richTextSection";
+      const isPdpIconsAfterHeading = block.blockType === "stepRow";
       return (
-        // py-12 md:py-16 — matches der-eine's own original Focus.tsx
-        // rhythm exactly (this system's reference template); py-8 sm:py-12
-        // read as too tight right after the hero (reported 2026-08-30).
-        <Reveal key={block.id} className="w-full px-[var(--layout-padding-x)] py-12 md:py-16">
+        <Reveal
+          key={block.id}
+          className={
+            isPdpHeadingBeforeIcons
+              ? "w-full px-[var(--layout-padding-x)] pt-12 md:pt-16 pb-4 md:pb-6"
+              : isPdpIconsAfterHeading
+                ? "w-full px-[var(--layout-padding-x)] pt-2 md:pt-4 pb-12 md:pb-16"
+                : "w-full px-[var(--layout-padding-x)] py-12 md:py-16"
+          }
+        >
           {renderProductBlock(block, ctx)}
         </Reveal>
       );