diff --git a/frontend/src/app/(public)/page.tsx b/frontend/src/app/(public)/page.tsx
index 6582e53..b8ab3eb 100644
--- a/frontend/src/app/(public)/page.tsx
+++ b/frontend/src/app/(public)/page.tsx
@@ -287,7 +287,7 @@ export default function Home() {
                 }))
               : FALLBACK_PROJECTS
             ).map((project) => (
-              <div key={project.id} className="group relative overflow-hidden rounded-xl h-[400px] cursor-pointer">
+              <Link key={project.id} href={`/projetos/${project.id}`} className="group relative overflow-hidden rounded-xl h-[400px] cursor-pointer block">
                 <div className="absolute inset-0 bg-cover bg-center transition-transform duration-500 group-hover:scale-110" style={{ backgroundImage: `url('${project.image}')` }}></div>
                 <div className="absolute inset-0 bg-linear-to-t from-black/90 via-black/20 to-transparent opacity-80 group-hover:opacity-90 transition-opacity"></div>
                 <div className="absolute bottom-0 left-0 p-8 w-full transform translate-y-4 group-hover:translate-y-0 transition-transform">
@@ -299,7 +299,7 @@ export default function Home() {
                     </span>
                   </div>
                 </div>
-              </div>
+              </Link>
             ))}
           </div>
         </div>
diff --git a/frontend/src/app/(public)/projetos/page.tsx b/frontend/src/app/(public)/projetos/page.tsx
index 3f84ad0..aa2157c 100644
--- a/frontend/src/app/(public)/projetos/page.tsx
+++ b/frontend/src/app/(public)/projetos/page.tsx
@@ -168,7 +168,7 @@ export default function ProjetosPage() {
           {!loading && filteredProjects.length > 0 && (
             <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
               {filteredProjects.map((project) => (
-                <div key={project.id} className="group bg-white dark:bg-secondary rounded-xl overflow-hidden shadow-sm hover:shadow-xl transition-all duration-300 border border-gray-100 dark:border-white/10 flex flex-col">
+                <Link key={project.id} href={`/projetos/${project.id}`} className="group bg-white dark:bg-secondary rounded-xl overflow-hidden shadow-sm hover:shadow-xl transition-all duration-300 border border-gray-100 dark:border-white/10 flex flex-col cursor-pointer">
                   <div className="relative h-64 overflow-hidden">
                     <div
                       className="absolute inset-0 bg-cover bg-center transition-transform duration-700 group-hover:scale-110"
@@ -196,11 +196,11 @@ export default function ProjetosPage() {
                         {project.description}
                       </p>
                     )}
-                    <Link href={`/projetos/${project.id}`} className="inline-flex items-center gap-2 text-primary font-bold hover:gap-3 transition-all mt-auto">
+                    <span className="inline-flex items-center gap-2 text-primary font-bold group-hover:gap-3 transition-all mt-auto">
                       <T>Ver Detalhes</T> <i className="ri-arrow-right-line"></i>
-                    </Link>
+                    </span>
                   </div>
-                </div>
+                </Link>
               ))}
             </div>
           )}
diff --git a/frontend/src/app/[locale]/page.tsx b/frontend/src/app/[locale]/page.tsx
index 63f174a..2a6adaa 100644
--- a/frontend/src/app/[locale]/page.tsx
+++ b/frontend/src/app/[locale]/page.tsx
@@ -281,7 +281,7 @@ export default function Home() {
                 }))
               : FALLBACK_PROJECTS
             ).map((project) => (
-              <div key={project.id} className="group relative overflow-hidden rounded-xl h-[400px] cursor-pointer">
+              <Link key={project.id} href={`${prefix}/projetos/${project.id}`} className="group relative overflow-hidden rounded-xl h-[400px] cursor-pointer block">
                 <div className="absolute inset-0 bg-cover bg-center transition-transform duration-500 group-hover:scale-110" style={{ backgroundImage: `url('${project.image}')` }}></div>
                 <div className="absolute inset-0 bg-linear-to-t from-black/90 via-black/20 to-transparent opacity-80 group-hover:opacity-90 transition-opacity"></div>
                 <div className="absolute bottom-0 left-0 p-8 w-full transform translate-y-4 group-hover:translate-y-0 transition-transform">
@@ -293,7 +293,7 @@ export default function Home() {
                     </span>
                   </div>
                 </div>
-              </div>
+              </Link>
             ))}
           </div>
         </div>
diff --git a/frontend/src/app/[locale]/projetos/page.tsx b/frontend/src/app/[locale]/projetos/page.tsx
index e7dbfa9..b2fcd2b 100644
--- a/frontend/src/app/[locale]/projetos/page.tsx
+++ b/frontend/src/app/[locale]/projetos/page.tsx
@@ -195,7 +195,7 @@ export default function ProjetosPage() {
                 const description = project.description || (locale === 'pt' ? 'Descrição disponível em breve.' : locale === 'es' ? 'Descripción disponible pronto.' : 'Description coming soon.');
 
                 return (
-                  <div key={project.id} className="group bg-white dark:bg-secondary rounded-xl overflow-hidden shadow-sm hover:shadow-xl transition-all duration-300 border border-gray-100 dark:border-white/10 flex flex-col">
+                  <Link key={project.id} href={`${prefix}/projetos/${project.id}`} className="group bg-white dark:bg-secondary rounded-xl overflow-hidden shadow-sm hover:shadow-xl transition-all duration-300 border border-gray-100 dark:border-white/10 flex flex-col cursor-pointer">
                     <div className="relative h-64 overflow-hidden">
                       <div className="absolute inset-0 bg-cover bg-center transition-transform duration-700 group-hover:scale-110" style={{ backgroundImage: `url('${image}')` }}></div>
                       <div className="absolute inset-0 bg-black/20 group-hover:bg-black/0 transition-colors"></div>
@@ -212,11 +212,11 @@ export default function ProjetosPage() {
                       <p className="text-gray-600 dark:text-gray-400 text-sm mb-6 line-clamp-3 grow">
                         {description}
                       </p>
-                      <Link href={`${prefix}/projetos/${project.id}`} className="inline-flex items-center gap-2 text-primary font-bold hover:gap-3 transition-all mt-auto">
+                      <span className="inline-flex items-center gap-2 text-primary font-bold group-hover:gap-3 transition-all mt-auto">
                         {t('projects.viewDetails')} <i className="ri-arrow-right-line"></i>
-                      </Link>
+                      </span>
                     </div>
-                  </div>
+                  </Link>
                 );
               })}
             </div>