## Purpose Define a standardized card layout so content cards across surfaces look consistent. ## Requirements ### Requirement: Standard card information architecture 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), with a shimmer placeholder visible while the image loads - title - summary/excerpt text, trimmed to a fixed maximum length - footer row showing: - publish date on the left - views when available (if omitted, the footer MUST still render cleanly) - the content source label (e.g., `youtube`, `podcast`, `blog`) If a field is not available (for example, views for some sources), the card MUST still render cleanly with that field omitted. #### Scenario: Card renders with all fields - **WHEN** a content item has an image, title, summary, publish date, views, and source - **THEN** the card renders those fields in the standard card layout order #### Scenario: Card renders without views - **WHEN** a content item has no views data - **THEN** the card renders the footer bar with date + source and omits views without breaking the layout #### Scenario: Card renders without featured image - **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