diff --git a/src/components/IssueList.astro b/src/components/IssueList.astro
index a04b60a4..691bc749 100644
--- a/src/components/IssueList.astro
+++ b/src/components/IssueList.astro
@@ -120,7 +120,7 @@ if (repoInfo) {
   {issues.length > 0 ? (
     <div class="Issues-List">
       {issues.map((issue) => (
-        <a href={issue.html_url} target="_blank" class="Issue-Card">
+        <a href={issue.html_url} target="_blank" rel="noopener noreferrer" class="Issue-Card">
           <div class="Issue-Content">
             <div class="Issue-Title">{issue.title}</div>
             <div class="Issue-Meta">
diff --git a/src/components/ProjectCard.astro b/src/components/ProjectCard.astro
index b765d70d..b43713b7 100644
--- a/src/components/ProjectCard.astro
+++ b/src/components/ProjectCard.astro
@@ -14,7 +14,7 @@ const { projectLink, logoLink, name, description, tags = [], loadIssues = false
 ---
 
 <div class="Card-Container">
-  <a class="Card-Real-Link" href={projectLink} target="_blank">
+  <div class="Card-Content" data-project-link={projectLink}>
     <div class="Card-Header">
       <img
         class="Project-Logo"
@@ -41,10 +41,10 @@ const { projectLink, logoLink, name, description, tags = [], loadIssues = false
         <IssueList projectLink={projectLink} projectName={name} />
       )}
     </div>
-    <div class="Card-Link">
+    <a class="Card-Link" href={projectLink} target="_blank" rel="noopener noreferrer">
       <span>Go to Project</span>
-    </div>
-  </a>
+    </a>
+  </div>
 </div>
 
 <style>
@@ -86,9 +86,7 @@ const { projectLink, logoLink, name, description, tags = [], loadIssues = false
     background: rgba(255, 255, 255, 0.12);
   }
 
-  .Card-Real-Link {
-    display: block;
-    text-decoration: none;
+  .Card-Content {
     color: inherit;
     height: 100%;
     display: flex;
@@ -157,6 +155,7 @@ const { projectLink, logoLink, name, description, tags = [], loadIssues = false
 
 
   .Card-Link {
+    display: block;
     background: linear-gradient(135deg, rgba(102, 126, 234, 0.8) 0%, rgba(118, 75, 162, 0.8) 100%);
     backdrop-filter: blur(20px);
     -webkit-backdrop-filter: blur(20px);
@@ -167,6 +166,7 @@ const { projectLink, logoLink, name, description, tags = [], loadIssues = false
     font-weight: 600;
     margin-top: auto;
     border-radius: 12px;
+    text-decoration: none;
     transition: all 0.3s ease;
     position: relative;
     overflow: hidden;
@@ -219,4 +219,3 @@ const { projectLink, logoLink, name, description, tags = [], loadIssues = false
     }
   }
 </style>
-
diff --git a/src/components/ProjectList.astro b/src/components/ProjectList.astro
index 8a8806b8..b84687e0 100644
--- a/src/components/ProjectList.astro
+++ b/src/components/ProjectList.astro
@@ -42,15 +42,16 @@ const allTags = [...new Set(projectList.flatMap(project => project.tags || []))]
 <script>
   // Get all projects data from the server-rendered content
   const projectList = Array.from(document.querySelectorAll('.Card-Container')).map(card => {
-    const link = card.querySelector('.Card-Real-Link');
+    const link = card.querySelector('.Card-Link');
     const title = card.querySelector('.Card-Title');
     const description = card.querySelector('.Card-Description p');
     const tags = Array.from(card.querySelectorAll('.Card-Tag p')).map(tag => tag.textContent);
+    const content = card.querySelector('.Card-Content');
     const logo = card.querySelector('.Project-Logo');
     
     return {
       name: title?.textContent || '',
-      projectLink: link?.href || '',
+      projectLink: link?.href || content?.getAttribute('data-project-link') || '',
       description: description?.textContent || '',
       tags: tags,
       imageSrc: logo?.src || '',