lazy-loading done

openspec/specs/card-layout-system/spec.md

@@ -8,7 +8,7 @@ Define a standardized card layout so content cards across surfaces look consiste
 All content cards rendered by the site MUST use a standardized layout so cards across different surfaces look consistent.
 
 The standard card layout MUST be:
-- featured image displayed prominently at the top (when available)
+- featured image displayed prominently at the top (when available), with a shimmer placeholder visible while the image loads
 - title
 - summary/excerpt text, trimmed to a fixed maximum length
 - footer row showing:
@@ -30,3 +30,10 @@ If a field is not available (for example, views for some sources), the card MUST
 - **WHEN** a content item has no featured image
 - **THEN** the card renders a placeholder media area and still renders the remaining fields
 
+#### Scenario: Card image shows shimmer while loading
+- **WHEN** a content item has an image URL and the image has not yet loaded
+- **THEN** the card media area displays an animated shimmer placeholder until the image loads and fades in
+
+#### Scenario: Card image load failure shows static placeholder
+- **WHEN** a content item has an image URL but the image fails to load
+- **THEN** the card media area displays a static placeholder (no broken image icon) and the card remains visually intact