add download button and styles for printing

index.html

@@ -127,7 +127,8 @@
 
 
       <footer class="footer">
-	Updated Resume: 13/09/25
+        <button class="download-btn" onclick="window.print()">Download PDF</button>
+	Updated Resume: 13/05/26
       </footer>
     </main>
   </body>

resume.css

@@ -86,6 +86,131 @@ ul li { margin: 4px 0; }
   color: #64748b;
 }
 
+.download-btn {
+  display: inline-block;
+  margin-bottom: 8px;
+  padding: 6px 16px;
+  font-size: 13px;
+  font-weight: 600;
+  color: #fff;
+  background: #0369a1;
+  border: none;
+  border-radius: 6px;
+  cursor: pointer;
+}
+.download-btn:hover { background: #0284c7; }
+
+@media print {
+  @page {
+    size: A4;
+    margin: 14mm 16mm;
+  }
+
+  * {
+    background: transparent !important;
+    color: #000 !important;
+    box-shadow: none !important;
+    text-shadow: none !important;
+  }
+
+  body {
+    font-size: 10.5pt;
+    line-height: 1.35;
+  }
+
+  .page {
+    max-width: none;
+    margin: 0;
+    padding: 0;
+    border: none;
+    border-radius: 0;
+  }
+
+  .header {
+    break-after: avoid;
+    padding-bottom: 8px;
+    margin-bottom: 12px;
+  }
+
+  .title .name {
+    font-size: 20pt;
+  }
+
+  .contact {
+    font-size: 8.5pt;
+  }
+
+  .layout {
+    grid-template-columns: 1fr 2fr;
+    gap: 14px;
+  }
+
+  .card {
+    border: 0.5pt solid #aaa;
+    padding: 10px;
+    break-inside: avoid;
+    margin-bottom: 10px;
+  }
+
+  .section-title {
+    font-size: 9pt;
+    letter-spacing: 0.8pt;
+    margin-bottom: 5px;
+  }
+
+  .item {
+    break-inside: avoid;
+    margin-bottom: 12px;
+  }
+
+  .item-header h3 {
+    font-size: 11pt;
+  }
+
+  .daterange {
+    font-size: 8.5pt;
+  }
+
+  ul {
+    padding-left: 14pt;
+  }
+
+  ul li {
+    font-size: 9.5pt;
+    margin: 2pt 0;
+  }
+
+  .muted {
+    font-size: 9pt;
+  }
+
+  .skills {
+    padding-left: 14pt;
+  }
+
+  .skills li {
+    font-size: 9pt;
+    margin-bottom: 3pt;
+  }
+
+  a {
+    text-decoration: none;
+  }
+
+  .footer {
+    font-size: 8.5pt;
+    margin-top: 10px;
+  }
+
+  .download-btn {
+    display: none !important;
+  }
+
+  .role {
+    font-size: 10pt;
+  }
+}
+
 @media (max-width: 820px) {
   .layout { grid-template-columns: 1fr; }
   .contact { text-align: left; }