diff --git a/app/components/ProductBlocks.tsx b/app/components/ProductBlocks.tsx
index 8c4860e..72841fe 100644
--- a/app/components/ProductBlocks.tsx
+++ b/app/components/ProductBlocks.tsx
@@ -141,6 +141,20 @@ function renderProductBlock(block: ProductBlock, ctx: ProductBlockContext): Reac
     // from there since both return their own JSX before calling this.
     case "crossSell":
       return null;
+    // Black, not brand-yellow — matching der-eine's own hand-coded Focus.tsx
+    // icons (#231f20 stroke), which this whole PDP system is meant to look
+    // like. STEP_ICONS' SVGs hardcode stroke="#f6a701" per-element (shared
+    // with Pages.layout's /lebensuhr, /3x3-system, /7-tage-klarheits-check,
+    // which DO want brand-yellow) — overriding via a CSS descendant
+    // selector here (SVG presentation attributes lose to any stylesheet
+    // rule) scopes the recolor to PDPs only, without touching the shared
+    // icon set or PageBlocks.tsx's own rendering.
+    case "stepRow":
+      return (
+        <div key={block.id} className="[&_svg_*]:!stroke-[#231f20]">
+          {renderPageBlockSync(block as PageBlock)}
+        </div>
+      );
     // A PDP-specific full-bleed treatment for this one block type only —
     // not editing the shared Quote.tsx/renderPageBlockSync, which would
     // also restyle every Pages.layout quote (e.g. /ueber-mich's).
@@ -262,7 +276,7 @@ function ProductHero({ product, shipping, taxRate, kleinunternehmer, body }: Pro
             </div>
 
             <AddToCartButton
-              label="In den Warenkorb"
+              label={`${product.name} bestellen`}
               className="w-full sm:w-auto inline-flex items-center justify-center px-8 py-[0.8125rem] rounded-sm bg-brand hover:bg-brand-hover active:scale-[0.97] transition-all font-bold text-body text-text-primary text-center focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand focus-visible:ring-offset-2 focus-visible:ring-offset-bg-base"
               numericId={product.numericId}
               outOfStock={fullyOutOfStock}
@@ -273,8 +287,15 @@ function ProductHero({ product, shipping, taxRate, kleinunternehmer, body }: Pro
           </div>
         </Reveal>
 
-        <Reveal className="order-2 lg:order-none lg:col-span-7" delay={0.15}>
-          <ProductGallery image={product.image} gallery={product.gallery} alt={product.name} badge={<ProductBadge product={product} />} />
+        {/* max-w-[28rem] + centered, not a full-bleed col-span-7 image —
+            matches der-eine's own Hero.tsx exactly (that file's own
+            comment: capping display width keeps a modest source photo
+            from blowing up). This system is meant to look like der-eine,
+            not the other way round. */}
+        <Reveal className="order-2 lg:order-none lg:col-span-7 flex lg:items-center px-[var(--layout-padding-x)] lg:px-0" delay={0.15}>
+          <div className="w-full max-w-[28rem] mx-auto lg:mx-0">
+            <ProductGallery image={product.image} gallery={product.gallery} alt={product.name} badge={<ProductBadge product={product} />} />
+          </div>
         </Reveal>
       </div>
     </section>