diff --git a/components/page-progress.tsx b/components/page-progress.tsx
index f9af5a3..78f6374 100644
--- a/components/page-progress.tsx
+++ b/components/page-progress.tsx
@@ -69,8 +69,11 @@ function PageProgressContent() {
   if (!isVisible && progress === 0) return null
 
   return (
-    <div className="fixed top-0 left-0 w-full z-50 pointer-events-none">
-      <Progress value={progress} className="h-1 w-full rounded-none bg-transparent" />
+    <div
+      className="fixed top-0 left-0 w-full z-50 pointer-events-none transition-opacity duration-300"
+      style={{ opacity: isVisible ? 1 : 0 }}
+    >
+      <Progress value={progress} className="h-0.75 w-full rounded-none bg-transparent" />
     </div>
   )
 }