Optimize images and improve social media sharing previews

Convert images to JPG for optimization and ensure correct Open Graph tags are used for social media sharing.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 1f7e7e89-a520-4970-9645-37daadc466dc
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Event-Id: 30e90049-0ceb-4261-a159-b687b34f680b
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/f209e72a-0939-48fa-84fc-57854de71967/1f7e7e89-a520-4970-9645-37daadc466dc/s81zXmM
Replit-Helium-Checkpoint-Created: true

client/src/pages/home.tsx

@@ -66,7 +66,7 @@ interface GalleryImage {
 }
 
 function thumbUrl(src: string | null): string {
-  if (!src) return "/images/article-1.png";
+  if (!src) return "/images/article-1.jpg";
   if (src.endsWith(".webp")) return src.replace(".webp", "-thumb.webp");
   return src;
 }
@@ -88,7 +88,7 @@ function HeroCard({ article, focalPoints }: { article: Article; focalPoints?: Re
     <Link href={`/article/${article.slug}`}>
       <div className="relative group cursor-pointer rounded-lg overflow-hidden h-full" data-testid={`card-hero-${article.id}`}>
         <div className="relative h-full min-h-[280px]">
-          <SmartImage src={article.coverImage || "/images/article-1.png"} alt={article.title} className="transition-transform duration-700 group-hover:scale-105" focalPoints={focalPoints} />
+          <SmartImage src={article.coverImage || "/images/article-1.jpg"} alt={article.title} className="transition-transform duration-700 group-hover:scale-105" focalPoints={focalPoints} />
           {isVideo && (
             <div className="absolute inset-0 flex items-center justify-center z-10">
               <div className="w-14 h-14 rounded-full bg-primary/90 flex items-center justify-center group-hover:bg-primary transition-colors shadow-lg">