diff --git a/app/components/ProgressBar.tsx b/app/components/ProgressBar.tsx
index 185ea79..f2a421d 100644
--- a/app/components/ProgressBar.tsx
+++ b/app/components/ProgressBar.tsx
@@ -2,9 +2,11 @@
 
 import { useEffect, useState } from 'react';
 import { usePathname } from 'next/navigation';
+import { ArrowUp } from 'lucide-react';
 
 export default function ProgressBar() {
   const [scrollPercentage, setScrollPercentage] = useState(0);
+  const [showBackToTop, setShowBackToTop] = useState(false);
   const pathname = usePathname();
 
   useEffect(() => {
@@ -14,6 +16,7 @@ export default function ProgressBar() {
       const scrollY = window.scrollY;
 
       const scrollableDistance = documentHeight - windowHeight;
+      setShowBackToTop(scrollY > 300);
       
       if (scrollableDistance > 0) {
         const percentage = (scrollY / scrollableDistance) * 100;
@@ -30,20 +33,38 @@ export default function ProgressBar() {
     return () => window.removeEventListener('scroll', handleScroll);
   }, [pathname]);
 
-  if (!pathname.startsWith('/sem')) {
-    return null;
-  }
+ const scrollToTop = () => {
+    window.scrollTo({ top: 0, behavior: 'smooth' });
+  };
 
   return (
-    
-    <div className="fixed top-0 left-0 w-full h-1.5 z-[99999] bg-black/20 pointer-events-none">
-      <div 
-        className="h-full transition-all duration-150 ease-out"
+    <>
+      {pathname.startsWith('/sem') && (
+        <div className="fixed top-0 left-0 w-full h-1.5 z-[99999] bg-black/20 pointer-events-none">
+          <div 
+            className="h-full transition-all duration-150 ease-out"
         style={{ 
           width: `${scrollPercentage}%`, 
           backgroundColor: '#C7A669' 
         }}
-      />
-    </div>
+          />
+        </div>
+      )}
+
+      {showBackToTop && (
+        <button
+          type="button"
+          onClick={scrollToTop}
+          aria-label="Back to top"
+          className="fixed bottom-6 right-6 z-[99999] flex items-center justify-center
+              h-12 w-12 rounded-full border border-[#d2b48c]/40
+            bg-[#1B0D00] text-[#FAE8D7] shadow-[0_12px_32px_rgba(0,0,0,0.28)]
+              transition duration-300 hover:-translate-y-1 hover:bg-[#d2b48c] hover:text-[#1B0D00]
+              focus:outline-none focus:ring-2 focus:ring-[#d2b48c] focus:ring-offset-2 focus:ring-offset-[#1B0D00]"
+        >
+          <ArrowUp size={20} />
+        </button>
+      )}
+    </>
   );
 }
\ No newline at end of file
diff --git a/app/components/footer.tsx b/app/components/footer.tsx
index 5a1db1b..b3021f2 100644
--- a/app/components/footer.tsx
+++ b/app/components/footer.tsx
@@ -13,7 +13,6 @@ export default function Footer() {
   const scrollToTop = () => {
     window.scrollTo({ top: 0, behavior: "smooth" });
   };
-
   return (
     <footer className="bg-[#1B0D00] text-[#FAE8D7] py-12 px-6 border-t-4 border-[#2b1b0e]">
       <div className="max-w-7xl mx-auto grid grid-cols-1 md:grid-cols-3 gap-12">
@@ -59,7 +58,7 @@ export default function Footer() {
               <Mail size={24} />
             </a>
           </div>
-          
+
           <button 
             onClick={scrollToTop}
             className="flex items-center gap-2 mt-6 text-lg hover:text-[#d2b48c] transition"