ProductCard (am-product-card)

ProductCard 是可序列化的 product discovery card，提供商品圖片、名稱、分類、價格、比較價、變體數與 detail link。圖片會保留 aspect-ratio，避免載入時造成 layout shift。

---
import ProductCard from "@astromer/core/components/ProductCard.astro";
---

<ProductCard
  title="Field notebook"
  href="/shop/field-notebook"
  category="Desk goods"
  price="NT$420"
  compareAtPrice="NT$480"
  variantCount={3}
  variantLabel="covers"
  image={{ src: "/images/field-notebook.webp", alt: "Field notebook", width: 960, height: 1200 }}
/>

整張 card 是導向 detail 的 link；若需要加入購物車、庫存或價格重算，請由 consumer 另外組合 action 與 workflow，避免巢狀互動控制項。詳見 playground /playground/marketing/。