diff --git a/apps/docs/components/ui/image.tsx b/apps/docs/components/ui/image.tsx
index 311f1d649e..f667508a99 100644
--- a/apps/docs/components/ui/image.tsx
+++ b/apps/docs/components/ui/image.tsx
@@ -25,7 +25,7 @@ export function Image({
     <NextImage
       className={cn(
         'overflow-hidden rounded-xl border border-border object-cover',
-        enableLightbox && 'transition-opacity group-hover:opacity-95',
+        enableLightbox && 'cursor-pointer transition-opacity group-hover:opacity-95',
         className
       )}
       alt={alt}
@@ -41,7 +41,7 @@ export function Image({
           type='button'
           onClick={openLightbox}
           aria-label={`Open ${alt} in media viewer`}
-          className='group block w-full cursor-pointer rounded-xl p-0 text-left'
+          className='group contents'
         >
           {image}
         </button>
diff --git a/apps/docs/components/ui/video.tsx b/apps/docs/components/ui/video.tsx
index a4eb58dd3b..b4aee09475 100644
--- a/apps/docs/components/ui/video.tsx
+++ b/apps/docs/components/ui/video.tsx
@@ -45,7 +45,10 @@ export function Video({
       playsInline={playsInline}
       width={width}
       height={height}
-      className={cn(className, enableLightbox && 'transition-opacity group-hover:opacity-[0.97]')}
+      className={cn(
+        className,
+        enableLightbox && 'cursor-pointer transition-opacity group-hover:opacity-[0.97]'
+      )}
       src={getAssetUrl(src)}
     />
   )
@@ -57,7 +60,7 @@ export function Video({
           type='button'
           onClick={openLightbox}
           aria-label={`Open ${src} in media viewer`}
-          className='group block w-full cursor-pointer rounded-xl p-0 text-left'
+          className='group contents'
         >
           {video}
         </button>
diff --git a/apps/docs/content/docs/en/introduction/index.mdx b/apps/docs/content/docs/en/introduction/index.mdx
index 891667249f..b9e783df71 100644
--- a/apps/docs/content/docs/en/introduction/index.mdx
+++ b/apps/docs/content/docs/en/introduction/index.mdx
@@ -10,13 +10,13 @@ import { FAQ } from '@/components/ui/faq'
 
 Sim is the open-source AI workspace where teams build, deploy, and manage AI agents. Create agents visually with the workflow builder, conversationally through Mothership, or programmatically with the API. Connect AI models, databases, APIs, and 1,000+ business tools to build agents that automate real work — from chatbots and compliance agents to data pipelines and ITSM automation.
 
-<div className="flex justify-center">
+<div className="mx-auto w-full overflow-hidden rounded-lg my-6">
   <Image
     src="/static/introduction.png"
     alt="Sim visual workflow canvas"
     width={700}
     height={450}
-    className="my-6"
+    className="w-full"
   />
 </div>