Move low-stock warning from image badge to a text hint, add it to the cart

The image-overlaid pill made the low-stock message read as clutter on
product photos and had no equivalent in the cart at all. It's now a text
line next to the price (ProductGrid/ProductSpotlight/RelatedProducts/
Pricing) and under the product name in cart line items (variant-specific,
not "any variant low"). The line's height is always reserved, not
conditionally rendered, so cards in the same row stay equal-height
regardless of low-stock state — the exact regression an earlier text-based
version of this hint caused before it was replaced by the image badge.

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

app/components/ProductSpotlight.tsx

@@ -56,19 +56,10 @@ export async function ProductSpotlight() {
               Ausverkauft
             </span>
           ) : (
-            (discount !== null || anyLowStock) && (
-              <div className="absolute top-3 left-3 flex flex-col items-start gap-1">
-                {discount !== null && (
-                  <span className="rounded-full bg-brand px-2.5 py-1 text-label font-bold text-text-primary">
-                    -{discount}%
-                  </span>
-                )}
-                {anyLowStock && (
-                  <span className="rounded-full bg-warning px-2.5 py-1 text-label font-bold text-text-on-dark">
-                    Nur noch wenige verfügbar
-                  </span>
-                )}
-              </div>
+            discount !== null && (
+              <span className="absolute top-3 left-3 rounded-full bg-brand px-2.5 py-1 text-label font-bold text-text-primary">
+                -{discount}%
+              </span>
             )
           )}
         </div>
@@ -99,6 +90,10 @@ export async function ProductSpotlight() {
               Lieferzeit: {shipping.totalDays.min}–{shipping.totalDays.max} Werktage innerhalb Deutschlands
             </p>
           </div>
+          {/* Single product, no grid siblings to stay equal-height with
+              (unlike ProductGrid.tsx/RelatedProducts.tsx), so this can be
+              a plain conditional line instead of a reserved-height slot. */}
+          {anyLowStock && <p className="text-label font-bold text-warning">Nur noch wenige verfügbar</p>}
           {/* items-start at sm: — without it, the default cross-axis
               stretch makes "Mehr erfahren" grow to match
               AddToCartButton's own height whenever that one gets taller