diff --git a/Wireframe/index.html b/Wireframe/index.html
index 0e014e535..e886740cb 100644
--- a/Wireframe/index.html
+++ b/Wireframe/index.html
@@ -8,26 +8,51 @@
   </head>
   <body>
     <header>
-      <h1>Wireframe</h1>
+      <h1>Understanding Git and Wireframes</h1>
       <p>
-        This is the default, provided code and no changes have been made yet.
+       This page explains the basics of Git, the purpose of a README file, and how wireframes help developers plan and structure a webpage before writing code. It gives a clear overview of how these tools are used together in real-world web development.
       </p>
     </header>
     <main>
-      <article>
-        <img src="placeholder.svg" alt="" />
-        <h2>Title</h2>
-        <p>
-          Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam,
-          voluptates. Quisquam, voluptates.
-        </p>
+      <section>
+      <article class="card">
+        <img src="placeholder.svg" alt="Wireframe illustration" />
+        <div class="card-content">
+        <h2>Purpose of a Wireframe</h2>
+        <p> A wireframe is a simple visual guide used to plan layout and structure
+      before adding design and content.</p>
         <a href="">Read more</a>
+        </div>
       </article>
+      <article class="card">
+        <img src="placeholder.svg" alt="Git illustration" />
+        <div class="card-content">
+          <h2>Purpose of a README File</h2>
+          <p>A README file explains what a project is about, how to set it up, and how to use it. It helps other developers understand the project quickly without reading all the code.</p>
+          <a href="">Read more</a>
+        </div>
+      </article>
+      <article class="card">
+        <img src="placeholder.svg" alt="Git illustration" />
+        <div class="card-content">
+          <h2>What is a Git Branch</h2>
+          <p>A Git branch is a separate version of the code that allows developers to work on new features or fixes without affecting the main codebase. Once the work is complete, the branch can be merged back into the main branch safely.</p>
+          <a href="">Read more</a>
+        </div>
+      </article>
+      </section>
+
     </main>
     <footer>
-      <p>
-        This is the default, provided code and no changes have been made yet.
-      </p>
-    </footer>
+     <nav>
+    <a href="#">Home</a>
+    <a href="#">About</a>
+    <a href="mailto:arunnkumar7@gmail.com">Contact</a>
+    <a href="https://github.com/arunkumarakilan" target="_blank" rel="noopener">GitHub</a>
+    <a href="https://www.linkedin.com/in/arunkumar-akilan-0a87aa3a1/" target="_blank" rel="noopener">LinkedIn</a>
+  </nav>
+  <p>© 2026 Arunkumar Akilan</p>
+
+    </footer> 
   </body>
 </html>
diff --git a/Wireframe/style.css b/Wireframe/style.css
index be835b6c7..349877c4a 100644
--- a/Wireframe/style.css
+++ b/Wireframe/style.css
@@ -30,6 +30,7 @@ body {
   background: var(--paper);
   color: var(--ink);
   font: var(--font);
+  padding: 80px;
 }
 a {
   padding: var(--space);
@@ -48,12 +49,34 @@ https://www.w3.org/WAI/tutorials/page-structure/regions/
 main {
   max-width: var(--container);
   margin: 0 auto calc(var(--space) * 4) auto;
+  padding-bottom: 80px;
 }
 footer {
   position: fixed;
+  left: 0;
+  right: 0;
   bottom: 0;
+  z-index: 10; 
+  padding: 4px 0;
+  background: white;
   text-align: center;
 }
+footer nav{
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  gap: var(--space);
+  flex-direction: row;
+  flex-wrap: wrap;
+}
+footer nav a{
+  padding: 4px 8px;
+  border: none;
+  max-width: fit-content;
+  text-decoration: none;
+  color: #222;
+  font-size: 0.9rem;
+} 
 /* ====== Articles Grid Layout ====
 Setting the rules for how articles are placed in the main element.
 Inspect this in Devtools and click the "grid" button in the Elements view
@@ -87,3 +110,11 @@ article {
     grid-column: span 3;
   }
 }
+main>section{
+  display:grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 16px;
+}
+main>section article:first-child {
+  grid-column: 1 / -1;
+}
