Refactor code structure for improved readability and maintainability

components/blog-detail-content.tsx

@@ -123,9 +123,10 @@ export function BlogDetailContent({ post }: BlogDetailContentProps) {
           </header>
 
           <Card className="relative aspect-[16/8] overflow-hidden rounded-sm border-border">
-            <img
+            <Image
               src={post.coverImage}
               alt={post.title}
+              fill
               sizes="(max-width: 768px) 100vw, 50vw"
               className="object-cover"
             />

components/content-content.tsx

@@ -8,6 +8,7 @@ import { Icon } from "@iconify/react";
 import { Badge, Button, Card, Typography } from "poyraz-ui/atoms";
 import { Modal, ModalContent, ModalTitle, Sheet, SheetContent, SheetTitle } from "poyraz-ui/molecules";
 import type { PodcastEpisode } from "@/data/content-types";
+import { getYoutubeEmbedUrl } from "@/lib/youtube";
 
 type ContentContentProps = {
   yazilimEpisodes: PodcastEpisode[];
@@ -102,16 +103,6 @@ function PdfFirstPagePreview({ src, title }: { src: string; title: string }) {
   );
 }
 
-function getYoutubeEmbedUrl(link: string) {
-  try {
-    const url = new URL(link);
-    const videoId = url.searchParams.get("v");
-    return videoId ? `https://www.youtube.com/embed/${videoId}` : null;
-  } catch {
-    return null;
-  }
-}
-
 function PodcastColumn({
   title,
   subtitle,

components/home-videos-section.tsx

@@ -1,15 +1,6 @@
 import { Card, Typography } from "poyraz-ui/atoms";
 import { YOUTUBE_VIDEO_LINKS } from "@/data/youtube-videos";
-
-function getYoutubeEmbedUrl(link: string) {
-  try {
-    const url = new URL(link);
-    const videoId = url.searchParams.get("v");
-    return videoId ? `https://www.youtube.com/embed/${videoId}` : null;
-  } catch {
-    return null;
-  }
-}
+import { getYoutubeEmbedUrl } from "@/lib/youtube";
 
 export function HomeVideosSection() {
   return (

components/references-section.tsx

@@ -4,7 +4,7 @@ import { ReferenceCards } from "@/components/reference-cards";
 
 export function ReferencesSection() {
   return (
-    <section className="space-y-8 md:pt-12">
+    <section className="space-y-8 md:pt-4">
       <div className="relative overflow-hidden rounded-sm">
         <ReferenceCards className="flex w-max gap-3" />
         <div