Generate page-specific social preview cards for Projects and Insights

Priority: Medium

Problem

Public pages currently reuse a default social image. That keeps metadata valid but makes shared project and Insight links difficult to distinguish in LinkedIn, messaging apps, and other preview surfaces.

Goal

Generate deterministic, page-specific Open Graph/Twitter preview cards that make shared engineering content immediately identifiable without creating a manual design burden.

Scope

• Define one restrained card template for Insights and one for Projects, or one shared template if sufficient.
• Include page title, content type/category, and Mantosh Kumar branding; avoid promotional clutter.
• Generate 1200×630 images during the build from existing content metadata.
• Wire generated images into Open Graph/Twitter metadata.
• Provide a default/fallback image for utility pages.
• Keep generated artifacts within repository performance/build constraints.

Acceptance criteria

• Published Insights and Projects have page-specific social preview images.
• Preview cards are generated automatically from canonical metadata.
• LinkedIn/Open Graph and Twitter metadata reference the correct per-page image.
• Long titles degrade gracefully and remain readable.
• Utility pages retain an appropriate fallback.
• Generation is deterministic and covered by release/audit checks where practical.

Start by tracing the build pipeline, canonical content metadata, and the Open Graph/Twitter metadata entry points for Insights, Projects, and utility pages. Identify where generated assets and release or audit checks belong. Done means deterministic 1200×630 cards are produced for each supported page, metadata points to the correct image, long titles remain readable, and utility pages use a fallback.