Repository: Hardhat-Enterprises/website
Pull request #298: Skills page fixed
Author: login: Anshpreet1907
Labels: name: 2025T1
Created: 2025-05-07T08:47:03Z | Merged: 2025-05-23T16:14:55Z

I fixed up the skills page by removing it from the navigation bar and make it more user-friendly


Diff:
diff --git a/home/templates/pages/DeakinThreatmirror/deakinthreatmirror_skills.html b/home/templates/pages/DeakinThreatmirror/deakinthreatmirror_skills.html
new file mode 100644
index 000000000..39aa7fcbc
--- /dev/null
+++ b/home/templates/pages/DeakinThreatmirror/deakinthreatmirror_skills.html
@@ -0,0 +1,65 @@
+{% extends 'layouts/base.html' %} {% load static %} {% block content %}
+<main>
+    {% include 'includes/preloader-dtm.html' %}
+
+    <section class="section bg-primary-app py-5">
+        <div class="container">
+            <div class="text-center mb-5">
+                <h1 class="fw-bolder text-warning">⚡ Core Skills Explained</h1>
+                <h2 class="text-light fw-bold display-2">Core Threat Mirror Skills</h2>
+            </div>
+
+            <div class="row g-5">
+                <!-- Threat Modeling -->
+                <div class="col-md-4">
+                    <div class="card shadow-lg border-0 h-100" style="border-radius: 20px;">
+                        <div class="card-body">
+                            <h4 class="card-title text-warning">🛡️ Threat Modeling & Visualization</h4>
+                            <p class="card-text text-white">
+                                Threat modeling is the process of identifying potential security threats and vulnerabilities in a system, application, or process. In this project, we used visual tools to map out threat actors, attack surfaces, and mitigation strategies to anticipate
+                                risks before they become incidents.
+                                <br><br>
+                                <b>Tools Used:</b> Draw.io, Lucidchart, MITRE ATT&CK Matrix.
+                            </p>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Dashboard Design -->
+                <div class="col-md-4">
+                    <div class="card shadow-lg border-0 h-100" style="border-radius: 20px;">
+                        <div class="card-body">
+                            <h4 class="card-title text-warning">📊 Dashboard Design</h4>
+                            <p class="card-text text-white">
+                                Dashboard design involves creating intuitive, data-rich interfaces that display real-time or historical analytics. We built dashboards that showcase key cybersecurity metrics like malware trends, login anomalies, and threat detections—ensuring stakeholders
+                                can make informed decisions quickly.
+                                <br><br>
+                                <b>Tools Used:</b> Plotly, Chart.js, Tableau (Mockups).
+                            </p>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- SIEM Integration -->
+                <div class="col-md-4">
+                    <div class="card shadow-lg border-0 h-100" style="border-radius: 20px;">
+                        <div class="card-body">
+                            <h4 class="card-title text-warning">📡 SIEM Data Integration</h4>
+                            <p class="card-text text-white">
+                                SIEM (Security Information and Event Management) systems aggregate and analyze logs from multiple sources. In the Deakin Threat Mirror project, we simulated the integration of security logs into a SIEM-like interface to detect threats and suspicious activities
+                                in real-time.
+                                <br><br>
+                                <b>Concepts Covered:</b> Log parsing, event correlation, alert triggering.
+                            </p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="text-center mt-5">
+                <a href="{% url 'Deakin_Threat_mirror_main' %}" class="btn btn-dark"> ⬅️ Back to Project</a>
+            </div>
+        </div>
+    </section>
+</main>
+{% endblock content %}
\ No newline at end of file
diff --git a/home/templates/pages/DeakinThreatmirror/main.html b/home/templates/pages/DeakinThreatmirror/main.html
index 68cf65f7e..972fdba1b 100644
--- a/home/templates/pages/DeakinThreatmirror/main.html
+++ b/home/templates/pages/DeakinThreatmirror/main.html
@@ -1,19 +1,14 @@
-{% extends 'layouts/base.html' %}
-{% load static %}
+{% extends 'layouts/base.html' %} {% load static %} {% block seo %}
+<title>Deakin Threat Mirror - Threat Intelligence Platform & Cybersecurity Visualization</title>
+<meta name="description" content="Deakin Threat Mirror is an open-source threat intelligence platform for SMEs, offering cybersecurity visualization and actionable threat analysis tools. Project currently paused.">
+<meta name="keywords" content="threat intelligence platform, cybersecurity visualization, threat analysis tools, cybersecurity tools, ethical hacking tools, Hardhat Enterprises">
+<meta property="og:title" content="Deakin Threat Mirror - Threat Intelligence Platform">
+<meta property="og:description" content="Discover Deakin Threat Mirror, an open-source platform for cybersecurity visualization and threat analysis, designed for SMEs. Project currently paused.">
+<meta property="og:image" content="{% static 'assets/img/pages/home/deakin_threat_mirror.svg' %}"> {% endblock %} {% block content %}
 
-{% block seo %}
-    <title>Deakin Threat Mirror - Threat Intelligence Platform & Cybersecurity Visualization</title>
-    <meta name="description" content="Deakin Threat Mirror is an open-source threat intelligence platform for SMEs, offering cybersecurity visualization and actionable threat analysis tools. Project currently paused.">
-    <meta name="keywords" content="threat intelligence platform, cybersecurity visualization, threat analysis tools, cybersecurity tools, ethical hacking tools, Hardhat Enterprises">
-    <meta property="og:title" content="Deakin Threat Mirror - Threat Intelligence Platform">
-    <meta property="og:description" content="Discover Deakin Threat Mirror, an open-source platform for cybersecurity visualization and threat analysis, designed for SMEs. Project currently paused.">
-    <meta property="og:image" content="{% static 'assets/img/pages/home/deakin_threat_mirror.svg' %}">
-{% endblock %}
-
-{% block content %}
 <main>
     {% include 'includes/preloader-dtm.html' %}
-
+ 
     <!-- Hero -->
     <div class="section-header bg-primary-app pb-0">
         <div class="container">
@@ -28,6 +23,62 @@ <h4 class="fw-normal">Project Paused: Awaiting Next Steps.</h4>
             </div>
         </div>
     </div>
+
+    <a href="{% url 'deakinthreatmirror_skills' %}" style="text-decoration: none;">
+        <div class="container d-flex justify-content-center">
+            <div style="
+      background: rgba(30, 31, 63, 0.85);
+      border-radius: 20px;
+      padding: 1.8rem;
+      border: 2px solid transparent;
+      background-image: linear-gradient(135deg, rgba(30, 31, 63, 0.85), rgba(42, 44, 79, 0.85)),
+                        linear-gradient(135deg, #ffc107, #ff5722);
+      background-origin: border-box;
+      background-clip: padding-box, border-box;
+      color: white;
+      box-shadow: 0 10px 40px rgba(0, 0, 0, 0.7);
+      transition: transform 0.3s ease, box-shadow 0.3s ease;
+      backdrop-filter: blur(10px);
+      animation: glowPulse 3s infinite ease-in-out;
+      max-width: 700px;
+      width: 100%;
+      text-align: center;
+    " onmouseover="this.style.transform='scale(1.04)'; this.style.boxShadow='0 14px 50px rgba(255, 193, 7, 0.4)'" onmouseout="this.style.transform='scale(1)'; this.style.boxShadow='0 10px 40px rgba(0, 0, 0, 0.7)'">
+
+                <h4 style="color: #ffc107; margin-bottom: 1.2rem; font-weight: bold; letter-spacing: 0.5px;">📊 Deakin Threat Mirror (On Hold)</h4>
+
+                <ul style="list-style: none; padding-left: 0; margin: 0; font-size: 1.2rem;">
+                    <li style="margin-bottom: 0.8rem;">
+                        <span style="margin-right: 0.5rem;">🧠</span>Threat Modeling and Visualization
+                    </li>
+                    <li style="margin-bottom: 0.8rem;">
+                        <span style="margin-right: 0.5rem;">📊</span>Dashboard Design
+                    </li>
+                    <li>
+                        <span style="margin-right: 0.5rem;">📡</span>SIEM Data Integration
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </a>
+
+    <style>
+        @keyframes glowPulse {
+            0% {
+                box-shadow: 0 0 10px rgba(255, 193, 7, 0.3);
+            }
+            50% {
+                box-shadow: 0 0 30px rgba(255, 193, 7, 0.5);
+            }
+            100% {
+                box-shadow: 0 0 10px rgba(255, 193, 7, 0.3);
+            }
+        }
+    </style>
+    </div>
+    </div>
+    </div>
+    </div>
     <!-- End of Hero Section -->
 
     <section>
@@ -37,7 +88,8 @@ <h4 class="fw-normal">Project Paused: Awaiting Next Steps.</h4>
                 <div class="col-lg-6">
                     <h2 class="fw-bolder text-dark">Overview of Deakin Threat Mirror</h2>
                     <p class="mb-4">
-                        Deakin Threat Mirror is an open-source threat intelligence platform designed to aggregate, process, and visualize cyber threat data. Aimed at small and medium-sized enterprises (SMEs) and developing economies, it provides actionable cybersecurity visualization and threat analysis tools to enhance security. Note: This project is currently paused, awaiting further development.
+                        Deakin Threat Mirror is an open-source threat intelligence platform designed to aggregate, process, and visualize cyber threat data. Aimed at small and medium-sized enterprises (SMEs) and developing economies, it provides actionable cybersecurity visualization
+                        and threat analysis tools to enhance security. Note: This project is currently paused, awaiting further development.
                     </p>
                 </div>
                 <div class="col-lg-6">
@@ -77,7 +129,8 @@ <h2 class="fw-bolder text-dark">Objectives</h2>
                         <div class="mt-4 mb-5">
                             <h2 class="fw-bolder text-dark">Stay Updated on Deakin Threat Mirror</h2>
                             <p class="mb-4">
-                                While Deakin Threat Mirror is currently paused, we invite you to stay informed about its future updates. Join our community to contribute ideas or follow the project’s progress as we aim to enhance cybersecurity awareness through a powerful threat intelligence platform.
+                                While Deakin Threat Mirror is currently paused, we invite you to stay informed about its future updates. Join our community to contribute ideas or follow the project’s progress as we aim to enhance cybersecurity awareness through a powerful threat intelligence
+                                platform.
                             </p>
                             <a href="{% url 'threat_mirror_join_us' %}" class="btn btn-primary animate-up-2" alt="Join the Deakin Threat Mirror community">
                                 <span class="fas fa-handshake me-2"></span>Join Us
@@ -106,7 +159,8 @@ <h2 class="accordion-header" id="panelsStayOpen-headingOne">
                             </h2>
                             <div id="panelsStayOpen-collapseOne" class="accordion-collapse collapse" aria-labelledby="panelsStayOpen-headingOne">
                                 <div class="accordion-body">
-                                    Deakin Threat Mirror is an open-source threat intelligence platform designed to aggregate, process, and visualize diverse threat feeds into actionable intelligence. It focuses on supporting SMEs and developing economies by making cybersecurity more accessible through cybersecurity visualization.
+                                    Deakin Threat Mirror is an open-source threat intelligence platform designed to aggregate, process, and visualize diverse threat feeds into actionable intelligence. It focuses on supporting SMEs and developing economies by making cybersecurity more accessible
+                                    through cybersecurity visualization.
                                 </div>
                             </div>
                         </div>
@@ -189,9 +243,9 @@ <h2 class="accordion-header" id="panelsStayOpen-headingEight">
                                 </button>
                             </h2>
                             <div id="panelsStayOpen-collapseEight" class="accordion-collapse collapse" aria-labelledby="panelsStayOpen-headingEight">
-                              <div class="accordion-body">
-                                Interested parties can get involved or contribute to the project by participating in the technical review, providing feedback, or contributing to the development of the platform. They can also follow the project's progress and updates on platforms like GitHub
-                              </div>
+                                <div class="accordion-body">
+                                    Interested parties can get involved or contribute to the project by participating in the technical review, providing feedback, or contributing to the development of the platform. They can also follow the project's progress and updates on platforms like
+                                    GitHub
                                 </div>
                             </div>
                         </div>
@@ -199,7 +253,8 @@ <h2 class="accordion-header" id="panelsStayOpen-headingEight">
                 </div>
             </div>
         </div>
+        </div>
     </section>
     <!-- End of FAQ Section -->
 </main>
-{% endblock content %}
\ No newline at end of file
+{% endblock content %}
diff --git a/home/templates/pages/Vr/cybersafe_vr_skills.html b/home/templates/pages/Vr/cybersafe_vr_skills.html
new file mode 100644
index 000000000..fd3e61cc4
--- /dev/null
+++ b/home/templates/pages/Vr/cybersafe_vr_skills.html
@@ -0,0 +1,77 @@
+{% extends 'layouts/base.html' %} {% load static %} {% block content %}
+<main>
+    {% include 'includes/preloader-vr.html' %}
+
+    <section style="background-color: #ffc107; padding: 6rem 0 4rem;">
+        <div class="container text-center">
+            <h2 class="text-light fw-bold display-2">Core CyberSafe VR Skills</h2>
+            <div class="row justify-content-center g-4">
+
+                <!-- VR Development Card -->
+                <div class="col-md-6 col-lg-4">
+                    <div style="
+                        background: #1e1f3f;
+                        color: white;
+                        padding: 2rem;
+                        border-radius: 20px;
+                        box-shadow: 0 10px 40px rgba(0,0,0,0.5);
+                        text-align: left;
+                        height: 100%;
+                    ">
+                        <h4 style="color: #ffc107;">🎮 Virtual Reality Development</h4>
+                        <p>
+                            Created immersive simulations using Unity and Unreal Engine to simulate cybersecurity environments. These VR experiences help users interactively learn about threats and responses.
+                        </p>
+                        <p><strong>Tools Used:</strong> Unity, Unreal Engine, Blender</p>
+                    </div>
+                </div>
+
+                <!-- Cybersecurity Awareness Card -->
+                <div class="col-md-6 col-lg-4">
+                    <div style="
+                        background: #1e1f3f;
+                        color: white;
+                        padding: 2rem;
+                        border-radius: 20px;
+                        box-shadow: 0 10px 40px rgba(0,0,0,0.5);
+                        text-align: left;
+                        height: 100%;
+                    ">
+                        <h4 style="color: #ffc107;">🛡️ Cybersecurity Awareness Training</h4>
+                        <p>
+                            Developed engaging VR-based training to teach users about phishing, malware, and secure online behavior. Training focused on real-life scenarios and best practices.
+                        </p>
+                        <p><strong>Deliverables:</strong> Training Modules, Interactive Lessons, Gamified Challenges</p>
+                    </div>
+                </div>
+
+                <!-- UX Design Card -->
+                <div class="col-md-6 col-lg-4">
+                    <div style="
+                        background: #1e1f3f;
+                        color: white;
+                        padding: 2rem;
+                        border-radius: 20px;
+                        box-shadow: 0 10px 40px rgba(0,0,0,0.5);
+                        text-align: left;
+                        height: 100%;
+                    ">
+                        <h4 style="color: #ffc107;">🎯 User Experience (UX) Design</h4>
+                        <p>
+                            Applied UX design to enhance usability within VR, ensuring accessibility and ease of use for participants. Iterative feedback and testing improved interface clarity and engagement.
+                        </p>
+                        <p><strong>Tools Used:</strong> Figma, Adobe XD, Unity UI Toolkit</p>
+                    </div>
+                </div>
+
+            </div>
+
+            <div class="mt-5">
+                <a href="{% url 'Vr_main' %}" class="btn btn-dark">
+                    ⬅️ Back to Project
+                </a>
+            </div>
+        </div>
+    </section>
+</main>
+{% endblock content %}
\ No newline at end of file
diff --git a/home/templates/pages/Vr/main.html b/home/templates/pages/Vr/main.html
index 5e8661471..66bf1a42c 100644
--- a/home/templates/pages/Vr/main.html
+++ b/home/templates/pages/Vr/main.html
@@ -48,49 +48,50 @@ <h1 class="fw-bold display-1">Deakin Cybersafe VR</h1>
     <!-- End of Hero Section -->
 
     <!-- Tools -->
-<section class="section section-lg bg-light py-5">
-    <div class="container">
-        <h2 class="fw-bolder display-3 text-center mb-5">Tools for Effective Cybersecurity</h2>
-        <div class="row row-cols-1 row-cols-md-2 row-cols-lg-3 g-4">
-            <div class="col">
-                <div class="card shadow-sm border-0 rounded-4 overflow-hidden h-100">
-                    <div class="card-body d-flex flex-column align-items-center text-center p-5">
-                        <div class="icon-container mb-4">
-                            <i class="fas fa-shield-alt fa-3x text-primary"></i>
+    <section class="section section-lg bg-light py-5">
+        <div class="container">
+            <h2 class="fw-bolder display-3 text-center mb-5">Tools for Effective Cybersecurity</h2>
+            <div class="row row-cols-1 row-cols-md-2 row-cols-lg-3 g-4">
+                <div class="col">
+                    <div class="card shadow-sm border-0 rounded-4 overflow-hidden h-100">
+                        <div class="card-body d-flex flex-column align-items-center text-center p-5">
+                            <div class="icon-container mb-4">
+                                <i class="fas fa-shield-alt fa-3x text-primary"></i>
+                            </div>
+                            <h5 class="card-title fw-bold mb-3">Intrusion Detection System (IDS) Monitor</h5>
+                            <p class="card-text mb-4">Detect and respond to cybersecurity threats in real time, ensuring the safety of your organization's network and data.</p>
+                            <a href="https://info.connectwise.com/cybersecurity/mdr-demo?utm_campaign=PAI8015&utm_medium=paidsearch&utm_source=google&utm_content=demo&loc=apac&utm_term=cyber%20intrusion%20detection%20system&_bt=746923465181&_bk=cyber%20intrusion%20detection%20system&_bm=e&_bn=g&_bg=170121420913&cq_cmp=21797821199&cq_plac=&cq_net=g&gad_source=1&gbraid=0AAAAAD0G_qhH1CGCLQGVwEkwRRZvP3IgB&gclid=EAIaIQobChMI_pCy-YCHjQMVsalmAh0gOzKzEAAYASAAEgKFgPD_BwE"
+                                class="btn btn-primary btn-sm mt-auto">Learn More</a>
                         </div>
-                        <h5 class="card-title fw-bold mb-3">Intrusion Detection System (IDS) Monitor</h5>
-                        <p class="card-text mb-4">Detect and respond to cybersecurity threats in real time, ensuring the safety of your organization's network and data.</p>
-                        <a href="https://info.connectwise.com/cybersecurity/mdr-demo?utm_campaign=PAI8015&utm_medium=paidsearch&utm_source=google&utm_content=demo&loc=apac&utm_term=cyber%20intrusion%20detection%20system&_bt=746923465181&_bk=cyber%20intrusion%20detection%20system&_bm=e&_bn=g&_bg=170121420913&cq_cmp=21797821199&cq_plac=&cq_net=g&gad_source=1&gbraid=0AAAAAD0G_qhH1CGCLQGVwEkwRRZvP3IgB&gclid=EAIaIQobChMI_pCy-YCHjQMVsalmAh0gOzKzEAAYASAAEgKFgPD_BwE" class="btn btn-primary btn-sm mt-auto">Learn More</a>
                     </div>
                 </div>
-            </div>
-            <div class="col">
-                <div class="card shadow-sm border-0 rounded-4 overflow-hidden h-100">
-                    <div class="card-body d-flex flex-column align-items-center text-center p-5">
-                        <div class="icon-container mb-4">
-                            <i class="fas fa-lock fa-3x text-primary"></i>
+                <div class="col">
+                    <div class="card shadow-sm border-0 rounded-4 overflow-hidden h-100">
+                        <div class="card-body d-flex flex-column align-items-center text-center p-5">
+                            <div class="icon-container mb-4">
+                                <i class="fas fa-lock fa-3x text-primary"></i>
+                            </div>
+                            <h5 class="card-title fw-bold mb-3">Data Encryption Station</h5>
+                            <p class="card-text mb-4">Secure sensitive data with encryption protocols and configure policies for encryption across all digital assets.</p>
+                            <a href="https://cloudian.com/guides/data-protection/data-encryption-the-ultimate-guide/" class="btn btn-primary btn-sm mt-auto">Learn More</a>
                         </div>
-                        <h5 class="card-title fw-bold mb-3">Data Encryption Station</h5>
-                        <p class="card-text mb-4">Secure sensitive data with encryption protocols and configure policies for encryption across all digital assets.</p>
-                        <a href="https://cloudian.com/guides/data-protection/data-encryption-the-ultimate-guide/" class="btn btn-primary btn-sm mt-auto">Learn More</a>
                     </div>
                 </div>
-            </div>
-            <div class="col">
-                <div class="card shadow-sm border-0 rounded-4 overflow-hidden h-100">
-                    <div class="card-body d-flex flex-column align-items-center text-center p-5">
-                        <div class="icon-container mb-4">
-                            <i class="fas fa-chart-line fa-3x text-primary"></i>
+                <div class="col">
+                    <div class="card shadow-sm border-0 rounded-4 overflow-hidden h-100">
+                        <div class="card-body d-flex flex-column align-items-center text-center p-5">
+                            <div class="icon-container mb-4">
+                                <i class="fas fa-chart-line fa-3x text-primary"></i>
+                            </div>
+                            <h5 class="card-title fw-bold mb-3">Risk Assessment Tool</h5>
+                            <p class="card-text mb-4">Identify system vulnerabilities and prioritize mitigations to safeguard your organization against potential risks.</p>
+                            <a href="https://safetyculture.com/topics/risk-assessment/" class="btn btn-primary btn-sm mt-auto">Learn More</a>
                         </div>
-                        <h5 class="card-title fw-bold mb-3">Risk Assessment Tool</h5>
-                        <p class="card-text mb-4">Identify system vulnerabilities and prioritize mitigations to safeguard your organization against potential risks.</p>
-                        <a href="https://safetyculture.com/topics/risk-assessment/" class="btn btn-primary btn-sm mt-auto">Learn More</a>
                     </div>
                 </div>
             </div>
         </div>
-    </div>
-</section>
+    </section>
     <!-- End Tools -->
 
     <!-- Join Us -->
@@ -131,7 +132,8 @@ <h2 class="mb-3">Join Deakin Cybersafe VR Today!</h2>
                 <div class="col-lg-6">
                     <h2 class="fw-bolder text-dark">Overview of Deakin Cybersafe VR</h2>
                     <p class="mb-4">
-                        Deakin Cybersafe VR is an innovative cybersecurity education VR project that uses immersive virtual reality to educate users about cyber threats. By simulating real-world scenarios like phishing and network attacks, users learn best practices in a safe, engaging environment, empowering them to navigate the digital landscape securely with confidence.
+                        Deakin Cybersafe VR is an innovative cybersecurity education VR project that uses immersive virtual reality to educate users about cyber threats. By simulating real-world scenarios like phishing and network attacks, users learn best practices in a safe,
+                        engaging environment, empowering them to navigate the digital landscape securely with confidence.
                     </p>
                 </div>
                 <div class="col-lg-6">
@@ -160,6 +162,49 @@ <h2 class="fw-bolder text-dark">Objectives</h2>
                         <li>Conduct user testing to improve the VR experience based on feedback</li>
                         <li>Partner with Deakin University to distribute Cybersafe VR to students and educators</li>
                     </ul>
+
+                    <a href="{% url 'cybersafe_vr_skills' %}" style="text-decoration: none;">
+                        <div class="mt-4" style="
+                        background: rgba(30, 31, 63, 0.85);
+                        border-radius: 20px;
+                        padding: 1.8rem;
+                        border: 2px solid transparent;
+                        background-image: linear-gradient(135deg, rgba(30, 31, 63, 0.85), rgba(42, 44, 79, 0.85)),
+                                          linear-gradient(135deg, #ffc107, #ff5722);
+                        background-origin: border-box;
+                        background-clip: padding-box, border-box;
+                        color: white;
+                        box-shadow: 0 10px 40px rgba(0, 0, 0, 0.7);
+                        transition: transform 0.3s ease, box-shadow 0.3s ease;
+                        backdrop-filter: blur(10px);
+                        animation: glowPulse 3s infinite ease-in-out;
+                        max-width: 100%;
+                        text-align: center;
+                      " onmouseover="this.style.transform='scale(1.04)'; this.style.boxShadow='0 14px 50px rgba(255, 193, 7, 0.4)'" onmouseout="this.style.transform='scale(1)'; this.style.boxShadow='0 10px 40px rgba(0, 0, 0, 0.7)'">
+
+                            <h4 style="color: #ffc107; margin-bottom: 1.2rem; font-weight: bold; letter-spacing: 0.5px;">⚡ Core Skills</h4>
+
+                            <ul style="list-style: none; padding-left: 0; margin: 0; font-size: 1.2rem;">
+                                <li style="margin-bottom: 0.8rem;"><span style="margin-right: 0.5rem;">🎮</span>Virtual Reality Development (Unity or Unreal)</li>
+                                <li style="margin-bottom: 0.8rem;"><span style="margin-right: 0.5rem;">🛡️</span>Cybersecurity Awareness Training</li>
+                                <li><span style="margin-right: 0.5rem;">🎯</span>User Experience (UX) Design</li>
+                            </ul>
+                        </div>
+                    </a>
+
+                    <style>
+                        @keyframes glowPulse {
+                            0% {
+                                box-shadow: 0 0 10px rgba(255, 193, 7, 0.3);
+                            }
+                            50% {
+                                box-shadow: 0 0 30px rgba(255, 193, 7, 0.5);
+                            }
+                            100% {
+                                box-shadow: 0 0 10px rgba(255, 193, 7, 0.3);
+                            }
+                        }
+                    </style>
                 </div>
             </div>
             <!-- End of Goals -->
@@ -212,7 +257,8 @@ <h2 class="accordion-header" id="panelsStayOpen-headingTwo">
                             </h2>
                             <div id="panelsStayOpen-collapseTwo" class="accordion-collapse collapse" aria-labelledby="panelsStayOpen-headingTwo">
                                 <div class="accordion-body">
-                                    The project aims to develop an immersive VR cybersecurity training platform, enhancing practical understanding of cybersecurity principles for small businesses. It covers topics like password security, data encryption, and recognizing cyber threats like phishing.
+                                    The project aims to develop an immersive VR cybersecurity training platform, enhancing practical understanding of cybersecurity principles for small businesses. It covers topics like password security, data encryption, and recognizing cyber threats like
+                                    phishing.
                                 </div>
                             </div>
                         </div>
@@ -295,4 +341,4 @@ <h2 class="accordion-header" id="panelsStayOpen-headingEight">
     </section>
     <!-- End of FAQ Section -->
 </main>
-{% endblock content %}
\ No newline at end of file
+{% endblock content %}
diff --git a/home/templates/pages/appattack/appattack_skills.html b/home/templates/pages/appattack/appattack_skills.html
new file mode 100644
index 000000000..5657943af
--- /dev/null
+++ b/home/templates/pages/appattack/appattack_skills.html
@@ -0,0 +1,68 @@
+{% extends 'layouts/base.html' %} {% load static %} {% block content %}
+<main>
+    {% include 'includes/preloader-appattack.html' %}
+
+    <section class="section bg-primary-app py-5">
+        <div class="container">
+            <div class="text-center mb-5">
+                <h1 class="fw-bolder text-warning">⚡ Core Skills Explained</h1>
+                <h2 class="text-light fw-bold display-2">Core AppAttack Skills</h2>
+            </div>
+
+            <div class="row g-5">
+                <!-- Penetration Testing -->
+                <div class="col-md-4">
+                    <div class="card shadow-lg border-0 h-100" style="border-radius: 20px;">
+                        <div class="card-body">
+                            <h4 class="card-title text-warning">💥 Penetration Testing</h4>
+                            <p class="card-text text-white">
+                                Penetration Testing involves simulating cyberattacks on systems to identify security weaknesses before real attackers do. We test for vulnerabilities in networks, applications, and configurations using both manual and automated techniques.
+                                <br><br>
+                                <b>Tools Used:</b> Nmap, Burp Suite, OWASP ZAP.
+                            </p>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Secure Code Review -->
+                <div class="col-md-4">
+                    <div class="card shadow-lg border-0 h-100" style="border-radius: 20px;">
+                        <div class="card-body">
+                            <h4 class="card-title text-warning">🔐 Secure Code Review</h4>
+                            <p class="card-text text-white">
+                                Secure Code Review is the practice of analyzing source code to identify and fix security flaws such as injection points, broken authentication, or misconfigurations. We ensure the application follows secure coding best practices.
+                                <br><br>
+                                <b>Tools Used:</b> Coverity, Checkmarx, Veracode.
+                            </p>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Reporting -->
+                <div class="col-md-4">
+                    <div class="card shadow-lg border-0 h-100" style="border-radius: 20px;">
+                        <div class="card-body">
+                            <h4 class="card-title text-warning">📝 Security Reporting & Documentation</h4>
+                            <p class="card-text text-white">
+                                This involves creating professional reports for identified vulnerabilities including severity levels, proof-of-concept screenshots, and recommended fixes. Clear documentation helps development teams quickly understand and resolve issues.
+                                <br><br>
+                                <b>Deliverables:</b> Risk Reports, Executive Summaries, Remediation Plans.
+                            </p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="text-center my-5">
+                <a href="{% url 'appattack' %}" class="btn btn-dark"> ⬅️ Back to Project</a>
+
+
+
+            </div>
+
+
+
+        </div>
+    </section>
+</main>
+{% endblock content %}
\ No newline at end of file
diff --git a/home/templates/pages/appattack/main.html b/home/templates/pages/appattack/main.html
index b50a302d9..7db9f70cb 100644
--- a/home/templates/pages/appattack/main.html
+++ b/home/templates/pages/appattack/main.html
@@ -1,3 +1,6 @@
+
+
+
 {% extends 'layouts/base.html' %}
 {% load static %}
 
@@ -107,6 +110,65 @@ <h1 style="text-align: center;">Offical Documentation of App Attack For Upskilli
 		</div>
 	</section>
 	<!-- End Tools -->
+	
+
+
+<!-- Core Skills Section -->
+    <section class="section section-lg bg-tertiary py-4">
+
+
+        <a href="{% url 'Appattack_Skills' %}" style="text-decoration: none;">
+            <div class="container d-flex justify-content-center">
+                <div style="
+              background: rgba(30, 31, 63, 0.85);
+              border-radius: 20px;
+              padding: 1.8rem;
+              border: 2px solid transparent;
+              background-image: linear-gradient(135deg, rgba(30, 31, 63, 0.85), rgba(42, 44, 79, 0.85)),
+                                linear-gradient(135deg, #ffc107, #ff5722);
+              background-origin: border-box;
+              background-clip: padding-box, border-box;
+              color: white;
+              box-shadow: 0 10px 40px rgba(0, 0, 0, 0.7);
+              transition: transform 0.3s ease, box-shadow 0.3s ease;
+              backdrop-filter: blur(10px);
+              animation: glowPulse 3s infinite ease-in-out;
+              max-width: 700px;
+              width: 100%;
+              text-align: center;
+            " onmouseover="this.style.transform='scale(1.04)'; this.style.boxShadow='0 14px 50px rgba(255, 193, 7, 0.4)'" onmouseout="this.style.transform='scale(1)'; this.style.boxShadow='0 10px 40px rgba(0, 0, 0, 0.7)'">
+                    <h4 style="color: #ffc107; margin-bottom: 1.2rem; font-weight: bold; letter-spacing: 0.5px;">⚡ Core Skills</h4>
+
+                    <ul style="list-style: none; padding-left: 0; margin: 0; font-size: 1.2rem;">
+                        <li style="margin-bottom: 0.8rem;">
+                            <span style="margin-right: 0.5rem;">💥</span>Penetration Testing
+                        </li>
+                        <li style="margin-bottom: 0.8rem;">
+                            <span style="margin-right: 0.5rem;">🔐</span>Secure Code Review
+                        </li>
+                        <li>
+                            <span style="margin-right: 0.5rem;">📝</span>Security Reporting & Documentation
+                        </li>
+                    </ul>
+                </div>
+            </div>
+        </a>
+
+        <style>
+            @keyframes glowPulse {
+                0% {
+                    box-shadow: 0 0 10px rgba(255, 193, 7, 0.3);
+                }
+                50% {
+                    box-shadow: 0 0 30px rgba(255, 193, 7, 0.5);
+                }
+                100% {
+                    box-shadow: 0 0 10px rgba(255, 193, 7, 0.3);
+                }
+            }
+        </style>
+
+    </section>
 	<!-- Join Us -->
 	<section class="section section-md">
 		<div class="container">
@@ -230,4 +292,4 @@ <h2 class="accordion-header" id="panelsStayOpen-headingSix">
 
 </main>
 
-{% endblock content %}
\ No newline at end of file
+{% endblock content %}
diff --git a/home/templates/pages/malware_visualization/main.html b/home/templates/pages/malware_visualization/main.html
index 992f8071b..4ce53dddd 100644
--- a/home/templates/pages/malware_visualization/main.html
+++ b/home/templates/pages/malware_visualization/main.html
@@ -1,16 +1,10 @@
-{% extends 'layouts/base.html' %}
-{% load static %}
-
-{% block seo %}
-    <title>Malware Visualization Tool - Cybersecurity Visualization & Malware Analysis</title>
-    <meta name="description" content="Malware Visualization offers an interactive tool for cybersecurity visualization, helping professionals analyze and mitigate malware threats effectively.">
-    <meta name="keywords" content="malware visualization, malware analysis tools, cybersecurity visualization, cybersecurity tools, ethical hacking tools, Hardhat Enterprises">
-    <meta property="og:title" content="Malware Visualization Tool - Cybersecurity Analysis Platform">
-    <meta property="og:description" content="Explore Malware Visualization, an interactive cybersecurity visualization tool for analyzing and mitigating malware threats.">
-    <meta property="og:image" content="{% static 'assets/img/pages/home/mvp-Cyber attack-amico.svg' %}">
-{% endblock %}
-
-{% block content %}
+{% extends 'layouts/base.html' %} {% load static %} {% block seo %}
+<title>Malware Visualization Tool - Cybersecurity Visualization & Malware Analysis</title>
+<meta name="description" content="Malware Visualization offers an interactive tool for cybersecurity visualization, helping professionals analyze and mitigate malware threats effectively.">
+<meta name="keywords" content="malware visualization, malware analysis tools, cybersecurity visualization, cybersecurity tools, ethical hacking tools, Hardhat Enterprises">
+<meta property="og:title" content="Malware Visualization Tool - Cybersecurity Analysis Platform">
+<meta property="og:description" content="Explore Malware Visualization, an interactive cybersecurity visualization tool for analyzing and mitigating malware threats.">
+<meta property="og:image" content="{% static 'assets/img/pages/home/mvp-Cyber attack-amico.svg' %}"> {% endblock %} {% block content %}
 <main>
     {% include 'includes/pre-loader.html' %}
 
@@ -38,7 +32,8 @@ <h5 class="fw-normal text-dark">Dive Deep into Cybersecurity Visualization with
                     <h2 class="h1">About Malware Visualization</h2>
                     <p class="mb-4 lead fw-bold">The Sherlock Holmes of Malware Analysis</p>
                     <p class="mb-4">
-                        The Malware Visualization project delivers an interactive cybersecurity visualization tool to simplify malware analysis. Integrated with existing tools, this stand-alone application provides user-friendly visual analysis of malware patterns. This approach enhances the detection and mitigation of malware threats, including novel variants, without requiring deep expertise.
+                        The Malware Visualization project delivers an interactive cybersecurity visualization tool to simplify malware analysis. Integrated with existing tools, this stand-alone application provides user-friendly visual analysis of malware patterns. This approach
+                        enhances the detection and mitigation of malware threats, including novel variants, without requiring deep expertise.
                     </p>
                 </div>
                 <div class="col-12 col-lg-6 order-lg-1">
@@ -57,6 +52,7 @@ <h2 class="h1 d-flex align-items-center">Project Goals</h2>
                         <li>Improve efficiency of threat detection using cybersecurity visualization</li>
                         <li>Contribute to stronger security postures for organizations</li>
                     </ul>
+
                     <h2>Project Objectives</h2>
                     <ul>
                         <li>Refine the web application for optimal user experience</li>
@@ -65,71 +61,124 @@ <h2>Project Objectives</h2>
                         <li>Foster collaboration within the cybersecurity community</li>
                         <li>Contribute to a more secure cybersecurity landscape</li>
                     </ul>
+
+                    <!-- Malware Box -->
+                    <a href="{% url 'malware_skills' %}" style="text-decoration: none;">
+                        <div class="mt-4" style="
+                            background: rgba(30, 31, 63, 0.85);
+                            border-radius: 20px;
+                            padding: 1.8rem;
+                            border: 2px solid transparent;
+                            background-image: linear-gradient(135deg, rgba(30, 31, 63, 0.85), rgba(42, 44, 79, 0.85)),
+                                              linear-gradient(135deg, #ffc107, #ff5722);
+                            background-origin: border-box;
+                            background-clip: padding-box, border-box;
+                            color: white;
+                            box-shadow: 0 10px 40px rgba(0, 0, 0, 0.7);
+                            transition: transform 0.3s ease, box-shadow 0.3s ease;
+                            backdrop-filter: blur(10px);
+                            animation: glowPulse 3s infinite ease-in-out;
+                            max-width: 100%;
+                            text-align: center;
+                        " onmouseover="this.style.transform='scale(1.04)'; this.style.boxShadow='0 14px 50px rgba(255, 193, 7, 0.4)'" onmouseout="this.style.transform='scale(1)'; this.style.boxShadow='0 10px 40px rgba(0, 0, 0, 0.7)'">
+
+                            <h4 style="color: #ffc107; margin-bottom: 1.2rem; font-weight: bold; letter-spacing: 0.5px;">⚡ Core Skills</h4>
+
+                            <ul style="list-style: none; padding-left: 0; margin: 0; font-size: 1.2rem;">
+                                <li style="margin-bottom: 0.8rem;"><span style="margin-right: 0.5rem;">🦠</span>Malware Analysis</li>
+                                <li style="margin-bottom: 0.8rem;"><span style="margin-right: 0.5rem;">🔁</span>Reverse Engineering</li>
+                                <li><span style="margin-right: 0.5rem;">🧠</span>Threat Intelligence</li>
+                            </ul>
+                        </div>
+                    </a>
                 </div>
+
+                <!-- Right Column: Image -->
                 <div class="col-lg-6">
-                    <img src="{% static 'assets/img/pages/home/mvp-Team goals-pana.svg' %}" alt="Malware Visualization project goals illustration" class="img-fluid" loading="lazy">
+
+                    <img src="{% static 'assets/img/pages/home/mvp-Team goals-pana.svg' %}" alt="Teamwork illustration" class="img-fluid">
                 </div>
             </div>
-            <!-- End of Project Goals Section -->
 
-            <!-- Project Delivery Section -->
-            <div class="row justify-content-between align-items-center mb-5 mb-lg-7">
-                <div class="col-12 col-lg-5 order-lg-2 mb-5 mb-lg-0">
-                    <h2 class="h1 d-flex align-items-center">See the Project Yourself!</h2>
-                    <p class="mb-4 lead fw-bold">Enough Reading, Explore Our Malware Analysis Tools</p>
-                    <p class="mb-4">
-                        Discover our latest malware visualization products designed to enhance your cybersecurity experience! We’ve created innovative tools and cutting-edge solutions to redefine malware analysis. Ready to learn more? Click below to explore our services and unlock a world of possibilities in cybersecurity visualization.
-                    </p>
-                    <!-- Link to Project Delivery -->
-                    <a href="{% url 'malware_products' %}" class="btn btn-primary animate-up-2">
-                        <span class="fas fa-chart-line me-2"></span>
-                        Explore Our Services!
-                    </a>
-                </div>
-                <div class="col-12 col-lg-6 order-lg-1">
-                    <img src="{% static 'assets/img/pages/home/mvp-Product presentation-rafiki.svg' %}" alt="Malware Visualization project delivery preview" class="img-fluid" loading="lazy">
-                </div>
+            <style>
+                @keyframes glowPulse {
+                    0% {
+                        box-shadow: 0 0 10px rgba(255, 193, 7, 0.3);
+                    }
+                    50% {
+                        box-shadow: 0 0 30px rgba(255, 193, 7, 0.5);
+                    }
+                    100% {
+                        box-shadow: 0 0 10px rgba(255, 193, 7, 0.3);
+                    }
+                }
+            </style>
+
+
+
+            End of Out goals section Project Delivery section
+
+            <img src="{% static 'assets/img/pages/home/mvp-Team goals-pana.svg' %}" alt="Malware Visualization project goals illustration" class="img-fluid" loading="lazy">
+        </div>
+        </div>
+
+        <!-- Project Delivery Section -->
+        <div class="row justify-content-between align-items-center mb-5 mb-lg-7">
+            <div class="col-12 col-lg-5 order-lg-2 mb-5 mb-lg-0">
+                <h2 class="h1 d-flex align-items-center">See the Project Yourself!</h2>
+                <p class="mb-4 lead fw-bold">Enough Reading, Explore Our Malware Analysis Tools</p>
+                <p class="mb-4">
+                    Discover our latest malware visualization products designed to enhance your cybersecurity experience! We’ve created innovative tools and cutting-edge solutions to redefine malware analysis. Ready to learn more? Click below to explore our services and
+                    unlock a world of possibilities in cybersecurity visualization.
+                </p>
+                <!-- Link to Project Delivery -->
+                <a href="{% url 'malware_products' %}" class="btn btn-primary animate-up-2">
+                    <span class="fas fa-chart-line me-2"></span> Explore Our Services!
+                </a>
+            </div>
+            <div class="col-12 col-lg-6 order-lg-1">
+                <img src="{% static 'assets/img/pages/home/mvp-Product presentation-rafiki.svg' %}" alt="Malware Visualization project delivery preview" class="img-fluid" loading="lazy">
             </div>
-            <!-- End of Project Delivery Section -->
+        </div>
+        <!-- End of Project Delivery Section -->
 
-            <!-- Join Us Section -->
-            <div class="row justify-content-between align-items-center mb-5 mb-lg-7">
-                <div class="col-lg-5 mb-5 mb-lg-0">
-                    <h2 class="h1 d-flex align-items-center">Interested in the Project?</h2>
-                    <p class="mb-4 lead fw-bold">Join Our Cybersecurity Visualization Mission!</p>
-                    <p class="mb-4">
-                        Join us in revolutionizing cybersecurity with the Malware Visualization Platform! Whether you're a seasoned professional or a tech enthusiast, your skills can help shape the future of digital security. Be part of our team and contribute to a safer online world using advanced malware analysis tools.
-                    </p>
-                    <!-- Link to Join Us -->
-                    <a href="{% url 'malware_viz_joinus' %}" target="_blank" class="btn btn-primary mt-2 animate-up-2">
-                        <span class="fas fa-th-large me-2"></span>
-                        Click to Join!
-                    </a>
-                </div>
-                <div class="col-lg-6">
-                    <img src="{% static 'assets/img/pages/home/mvp-Get in touch-cuate.svg' %}" alt="Malware Visualization join us illustration" class="img-fluid" loading="lazy">
-                </div>
+        <!-- Join Us Section -->
+        <div class="row justify-content-between align-items-center mb-5 mb-lg-7">
+            <div class="col-lg-5 mb-5 mb-lg-0">
+                <h2 class="h1 d-flex align-items-center">Interested in the Project?</h2>
+                <p class="mb-4 lead fw-bold">Join Our Cybersecurity Visualization Mission!</p>
+                <p class="mb-4">
+                    Join us in revolutionizing cybersecurity with the Malware Visualization Platform! Whether you're a seasoned professional or a tech enthusiast, your skills can help shape the future of digital security. Be part of our team and contribute to a safer online
+                    world using advanced malware analysis tools.
+                </p>
+                <!-- Link to Join Us -->
+                <a href="{% url 'malware_viz_joinus' %}" target="_blank" class="btn btn-primary mt-2 animate-up-2">
+                    <span class="fas fa-th-large me-2"></span> Click to Join!
+                </a>
             </div>
-            <!-- End of Join Us Section -->
-
-            <!-- Call to Action Section -->
-            <div class="bg-primary-app">
-                <div class="row justify-content-center text-center">
-                    <div class="col-lg-8">
-                        <div class="mt-4 mb-5">
-                            <h2 class="fw-bolder text-dark">Join the Malware Visualization Community</h2>
-                            <p class="mb-4">
-                                Join our mission to revolutionize cybersecurity through advanced malware visualization and analysis tools. Whether you're a developer, cybersecurity enthusiast, or advocate for digital safety, there are numerous ways to contribute to a safer online world.
-                            </p>
-                            <a href="{% url 'malware_viz_joinus' %}" class="btn btn-primary animate-up-2" alt="Join the Malware Visualization community">
-                                <span class="fas fa-handshake me-2"></span>
-                                Join Us
-                            </a>
-                        </div>
+            <div class="col-lg-6">
+                <img src="{% static 'assets/img/pages/home/mvp-Get in touch-cuate.svg' %}" alt="Malware Visualization join us illustration" class="img-fluid" loading="lazy">
+            </div>
+        </div>
+        <!-- End of Join Us Section -->
+
+        <!-- Call to Action Section -->
+        <div class="bg-primary-app">
+            <div class="row justify-content-center text-center">
+                <div class="col-lg-8">
+                    <div class="mt-4 mb-5">
+                        <h2 class="fw-bolder text-dark">Join the Malware Visualization Community</h2>
+                        <p class="mb-4">
+                            Join our mission to revolutionize cybersecurity through advanced malware visualization and analysis tools. Whether you're a developer, cybersecurity enthusiast, or advocate for digital safety, there are numerous ways to contribute to a safer online world.
+                        </p>
+                        <a href="{% url 'malware_viz_joinus' %}" class="btn btn-primary animate-up-2" alt="Join the Malware Visualization community">
+                            <span class="fas fa-handshake me-2"></span> Join Us
+                        </a>
                     </div>
                 </div>
             </div>
-            <!-- End of Call to Action Section -->
+        </div>
+        <!-- End of Call to Action Section -->
         </div>
     </section>
 </main>
diff --git a/home/templates/pages/malware_visualization/malware_skills.html b/home/templates/pages/malware_visualization/malware_skills.html
new file mode 100644
index 000000000..08a1a6292
--- /dev/null
+++ b/home/templates/pages/malware_visualization/malware_skills.html
@@ -0,0 +1,77 @@
+{% extends 'layouts/base.html' %} {% load static %} {% block content %}
+<main>
+    {% include 'includes/pre-loader.html' %}
+
+    <section style="background-color: #ffc107; padding: 6rem 0 4rem;">
+        <div class="container text-center">
+            <h2 class="text-light fw-bold display-2">Core Malware Skills</h2>
+            <div class="row justify-content-center g-4">
+
+                <!-- Card 1: Malware Analysis -->
+                <div class="col-md-6 col-lg-4">
+                    <div style="
+                    background: #1e1f3f;
+                    color: white;
+                    padding: 2rem;
+                    border-radius: 20px;
+                    box-shadow: 0 10px 40px rgba(0,0,0,0.5);
+                    text-align: left;
+                    height: 100%;
+                ">
+                        <h4 style="color: #ffc107;">🦠 Malware Analysis</h4>
+                        <p>
+                            Analyze malicious code to understand its behavior, intent, and impact. This helps identify indicators of compromise (IOCs) and craft effective defensive strategies.
+                        </p>
+                        <p><strong>Tools Used:</strong> Cuckoo Sandbox, VirusTotal, IDA Pro</p>
+                    </div>
+                </div>
+
+                <!-- Card 2: Reverse Engineering -->
+                <div class="col-md-6 col-lg-4">
+                    <div style="
+                    background: #1e1f3f;
+                    color: white;
+                    padding: 2rem;
+                    border-radius: 20px;
+                    box-shadow: 0 10px 40px rgba(0,0,0,0.5);
+                    text-align: left;
+                    height: 100%;
+                ">
+                        <h4 style="color: #ffc107;">🔁 Reverse Engineering</h4>
+                        <p>
+                            Disassemble and analyze software to uncover internal functionality. Commonly used for malware behavior analysis, vulnerability detection, and understanding code logic.
+                        </p>
+                        <p><strong>Tools Used:</strong> Ghidra, IDA Free, Radare2</p>
+                    </div>
+                </div>
+
+                <!-- Card 3: Threat Intelligence -->
+                <div class="col-md-6 col-lg-4">
+                    <div style="
+                    background: #1e1f3f;
+                    color: white;
+                    padding: 2rem;
+                    border-radius: 20px;
+                    box-shadow: 0 10px 40px rgba(0,0,0,0.5);
+                    text-align: left;
+                    height: 100%;
+                ">
+                        <h4 style="color: #ffc107;">🧠 Threat Intelligence</h4>
+                        <p>
+                            Collect and analyze data on potential and existing cyber threats. This information is used to proactively defend systems and improve situational awareness.
+                        </p>
+                        <p><strong>Deliverables:</strong> Threat Reports, IOCs, Adversary Profiles</p>
+                    </div>
+                </div>
+
+            </div>
+
+            <div class="mt-5">
+                <a href="{% url 'malware_viz_main' %}" class="btn btn-dark">
+                ⬅️ Back to Project
+            </a>
+            </div>
+        </div>
+    </section>
+</main>
+{% endblock content %}
\ No newline at end of file
diff --git a/home/templates/pages/pt_gui/main.html b/home/templates/pages/pt_gui/main.html
index 87ef915bd..f031feaec 100644
--- a/home/templates/pages/pt_gui/main.html
+++ b/home/templates/pages/pt_gui/main.html
@@ -1,16 +1,10 @@
-{% extends 'layouts/base.html' %}
-{% load static %}
-
-{% block seo %}
-    <title>Deakin Detonator Toolkit (DDT) - Penetration Testing GUI & Cybersecurity Tools</title>
-    <meta name="description" content="Deakin Detonator Toolkit (DDT) by PT-GUI offers a user-friendly penetration testing GUI with cybersecurity tools for beginners and professionals, simplifying ethical hacking workflows.">
-    <meta name="keywords" content="penetration testing GUI, cybersecurity tools, ethical hacking tools, cybersecurity tools for beginners, ethical hacking software, Hardhat Enterprises">
-    <meta property="og:title" content="Deakin Detonator Toolkit (DDT) - Penetration Testing GUI">
-    <meta property="og:description" content="Explore the Deakin Detonator Toolkit (DDT) by PT-GUI, a user-friendly penetration testing GUI with cybersecurity tools for ethical hacking.">
-    <meta property="og:image" content="{% static 'assets/img/pages/home/pt-gui-card.svg' %}">
-{% endblock %}
-
-{% block content %}
+{% extends 'layouts/base.html' %} {% load static %} {% block seo %}
+<title>Deakin Detonator Toolkit (DDT) - Penetration Testing GUI & Cybersecurity Tools</title>
+<meta name="description" content="Deakin Detonator Toolkit (DDT) by PT-GUI offers a user-friendly penetration testing GUI with cybersecurity tools for beginners and professionals, simplifying ethical hacking workflows.">
+<meta name="keywords" content="penetration testing GUI, cybersecurity tools, ethical hacking tools, cybersecurity tools for beginners, ethical hacking software, Hardhat Enterprises">
+<meta property="og:title" content="Deakin Detonator Toolkit (DDT) - Penetration Testing GUI">
+<meta property="og:description" content="Explore the Deakin Detonator Toolkit (DDT) by PT-GUI, a user-friendly penetration testing GUI with cybersecurity tools for ethical hacking.">
+<meta property="og:image" content="{% static 'assets/img/pages/home/pt-gui-card.svg' %}"> {% endblock %} {% block content %}
 <main>
     {% include 'includes/preloader-pt.html' %}
 
@@ -39,7 +33,9 @@ <h5 class="fw-normal text-dark">Your Gateway to Mastering Cybersecurity Tools wi
                 <div class="col-lg-6">
                     <h2 class="fw-bolder text-dark">About Deakin Detonator Toolkit</h2>
                     <p class="mb-4">
-                        The Deakin Detonator Toolkit (DDT) by PT-GUI is a cutting-edge penetration testing GUI for modern cybersecurity professionals. Built with the Tauri framework, React, and Mantine, DDT offers an intuitive interface that simplifies complex pen-testing workflows. Powered by Python, it automates vulnerability exploitation with precision, featuring 44 ethical hacking tools, 5 attack vectors, 12 HackTheBox challenge walkthroughs, and comprehensive dependency references as of T2 2023—perfect for beginners and experts alike.
+                        The Deakin Detonator Toolkit (DDT) by PT-GUI is a cutting-edge penetration testing GUI for modern cybersecurity professionals. Built with the Tauri framework, React, and Mantine, DDT offers an intuitive interface that simplifies complex pen-testing workflows.
+                        Powered by Python, it automates vulnerability exploitation with precision, featuring 44 ethical hacking tools, 5 attack vectors, 12 HackTheBox challenge walkthroughs, and comprehensive dependency references as of T2 2023—perfect
+                        for beginners and experts alike.
                     </p>
                 </div>
                 <div class="col-lg-6">
@@ -70,6 +66,49 @@ <h2 class="fw-bolder text-dark">Objectives</h2>
                         <li>Foster a community of cybersecurity enthusiasts, encouraging collaboration and knowledge sharing</li>
                         <li>Ensure accessibility to a broader audience with varying technical expertise</li>
                     </ul>
+
+                    <a href="{% url 'ptgui_skills' %}" style="text-decoration: none;">
+                        <div class="mt-4" style="
+                            background: rgba(30, 31, 63, 0.85);
+                            border-radius: 20px;
+                            padding: 1.8rem;
+                            border: 2px solid transparent;
+                            background-image: linear-gradient(135deg, rgba(30, 31, 63, 0.85), rgba(42, 44, 79, 0.85)),
+                                              linear-gradient(135deg, #ffc107, #ff5722);
+                            background-origin: border-box;
+                            background-clip: padding-box, border-box;
+                            color: white;
+                            box-shadow: 0 10px 40px rgba(0, 0, 0, 0.7);
+                            transition: transform 0.3s ease, box-shadow 0.3s ease;
+                            backdrop-filter: blur(10px);
+                            animation: glowPulse 3s infinite ease-in-out;
+                            max-width: 100%;
+                            text-align: center;
+                        " onmouseover="this.style.transform='scale(1.04)'; this.style.boxShadow='0 14px 50px rgba(255, 193, 7, 0.4)'" onmouseout="this.style.transform='scale(1)'; this.style.boxShadow='0 10px 40px rgba(0, 0, 0, 0.7)'">
+
+                            <h4 style="color: #ffc107; margin-bottom: 1.2rem; font-weight: bold; letter-spacing: 0.5px;">⚡ Core Skills</h4>
+
+                            <ul style="list-style: none; padding-left: 0; margin: 0; font-size: 1.2rem;">
+                                <li style="margin-bottom: 0.8rem;"><span style="margin-right: 0.5rem;">💻</span>GUI Development (Python)</li>
+                                <li style="margin-bottom: 0.8rem;"><span style="margin-right: 0.5rem;">🛠️</span>Tool Integration for Security Testing</li>
+                                <li><span style="margin-right: 0.5rem;">👥</span>User-Centered Design</li>
+                            </ul>
+                        </div>
+                    </a>
+
+                    <style>
+                        @keyframes glowPulse {
+                            0% {
+                                box-shadow: 0 0 10px rgba(255, 193, 7, 0.3);
+                            }
+                            50% {
+                                box-shadow: 0 0 30px rgba(255, 193, 7, 0.5);
+                            }
+                            100% {
+                                box-shadow: 0 0 10px rgba(255, 193, 7, 0.3);
+                            }
+                        }
+                    </style>
                 </div>
             </div>
             <!-- End of Goals -->
@@ -93,7 +132,8 @@ <h5 class="fw-normal text-dark">Effortless Penetration Testing with Our Intuitiv
                 <div class="col-lg-6">
                     <h2 class="fw-bolder text-dark">Simplified Penetration Testing GUI</h2>
                     <p class="mb-4">
-                        Explore penetration testing with ease using DDT’s GUI-based ethical hacking tools. Our user-friendly interface eliminates the complexity of command lines, empowering users to conduct cybersecurity assessments efficiently and making penetration testing accessible to all.
+                        Explore penetration testing with ease using DDT’s GUI-based ethical hacking tools. Our user-friendly interface eliminates the complexity of command lines, empowering users to conduct cybersecurity assessments efficiently and making penetration testing
+                        accessible to all.
                     </p>
                 </div>
                 <div class="col-lg-6">
@@ -132,10 +172,10 @@ <h2 class="fw-bolder text-dark">Beginner’s Cyber Toolkit</h2>
         </div>
         <div class="text-center my-4">
             <a href="/ptgui_viz/tools/" class="btn btn-primary animate-up-2">
-              <span class="fas fa-toolbox me-2"></span> Explore Cybersecurity Tools
+                <span class="fas fa-toolbox me-2"></span> Explore Cybersecurity Tools
             </a>
-          </div>
-          
+        </div>
+
     </section>
 
     <section>
@@ -227,8 +267,7 @@ <h2 class="fw-bolder">Deakin Detonator Toolkit GitHub</h2>
                             <img src="{% static 'assets/img/pages/home/pt-gui-git.svg' %}" alt="Deakin Detonator Toolkit GitHub preview" width="500" height="400" loading="lazy">
                             <div>
                                 <a href="https://github.com/Hardhat-Enterprises/Deakin-Detonator-Toolkit" class="btn btn-outline-gray-100 me-md-3">
-                                    <span class="fab fa-github me-2"></span>
-                                    Visit GitHub
+                                    <span class="fab fa-github me-2"></span> Visit GitHub
                                 </a>
                             </div>
                         </div>
@@ -248,12 +287,10 @@ <h2 class="fw-bolder text-dark">Ignite Your PenTest Journey with DDT</h2>
                             Ready to level up your cybersecurity skills? Join us to experience user-friendly penetration testing GUI tools and collaborative learning for white-hat hackers.
                         </p>
                         <a href="{% url 'ptgui_contact-us' %}" class="btn btn-primary animate-up-2" alt="Contact us to immerse yourself in practical cybersecurity experiences">
-                            <span class="fas fa-envelope"></span>
-                            Get in Touch
+                            <span class="fas fa-envelope"></span> Get in Touch
                         </a>
                         <a href="{% url 'ptgui_join_us' %}" class="btn btn-primary animate-up-2" alt="Join our team of cybersecurity professionals">
-                            <span class="fas fa-handshake me-2"></span>
-                            Join Us
+                            <span class="fas fa-handshake me-2"></span> Join Us
                         </a>
                     </div>
                 </div>
@@ -278,7 +315,8 @@ <h2 class="accordion-header" id="panelsStayOpen-headingOne">
                             </h2>
                             <div id="panelsStayOpen-collapseOne" class="accordion-collapse collapse" aria-labelledby="panelsStayOpen-headingOne">
                                 <div class="accordion-body">
-                                    You can install PT-GUI and the Deakin Detonator Toolkit (DDT) by following the instructions in the official documentation. The process involves downloading files, configuring dependencies, and running the installation script for this penetration testing GUI.
+                                    You can install PT-GUI and the Deakin Detonator Toolkit (DDT) by following the instructions in the official documentation. The process involves downloading files, configuring dependencies, and running the installation script for this penetration testing
+                                    GUI.
                                 </div>
                             </div>
                         </div>
@@ -397,4 +435,4 @@ <h2 class="accordion-header" id="panelsStayOpen-headingTen">
     </section>
     <!-- End of FAQ Section -->
 </main>
-{% endblock content %}
\ No newline at end of file
+{% endblock content %}
diff --git a/home/templates/pages/pt_gui/ptgui_skills.html b/home/templates/pages/pt_gui/ptgui_skills.html
new file mode 100644
index 000000000..ad5e4341e
--- /dev/null
+++ b/home/templates/pages/pt_gui/ptgui_skills.html
@@ -0,0 +1,79 @@
+{% extends 'layouts/base.html' %} {% load static %} {% block content %}
+<main>
+    {% include 'includes/preloader-pt.html' %}
+
+    <section style="background-color: #ffc107; padding: 6rem 0 4rem;">
+        <div class="container text-center">
+            <h2 class="text-light fw-bold display-2">Core PT-GUI Skills</h2>
+            <div class="row justify-content-center g-4">
+
+                <!-- PT-GUI Card -->
+                <!-- Card 1: GUI Development (Python) -->
+                <div class="col-md-6 col-lg-4">
+                    <div style="
+        background: #1e1f3f;
+        color: white;
+        padding: 2rem;
+        border-radius: 20px;
+        box-shadow: 0 10px 40px rgba(0,0,0,0.5);
+        text-align: left;
+        height: 100%;
+    ">
+                        <h4 style="color: #ffc107;">💻 GUI Development (Python)</h4>
+                        <p>
+                            Built a clean and responsive graphical interface using Python libraries to simplify penetration testing workflows and reduce command-line complexity.
+                        </p>
+                        <p><strong>Tools Used:</strong> Python (Tkinter, PyQt)</p>
+                    </div>
+                </div>
+
+                <!-- Card 2: Tool Integration for Security Testing -->
+                <div class="col-md-6 col-lg-4">
+                    <div style="
+        background: #1e1f3f;
+        color: white;
+        padding: 2rem;
+        border-radius: 20px;
+        box-shadow: 0 10px 40px rgba(0,0,0,0.5);
+        text-align: left;
+        height: 100%;
+    ">
+                        <h4 style="color: #ffc107;">🛠️ Tool Integration for Security Testing</h4>
+                        <p>
+                            Integrated essential security tools into the GUI to allow users to perform scanning, payload generation, and vulnerability analysis within a single interface.
+                        </p>
+                        <p><strong>Tools Used:</strong> Nmap, Burp Suite</p>
+                    </div>
+                </div>
+
+                <!-- Card 3: User-Centered Design -->
+                <div class="col-md-6 col-lg-4">
+                    <div style="
+        background: #1e1f3f;
+        color: white;
+        padding: 2rem;
+        border-radius: 20px;
+        box-shadow: 0 10px 40px rgba(0,0,0,0.5);
+        text-align: left;
+        height: 100%;
+    ">
+                        <h4 style="color: #ffc107;">👥 User-Centered Design</h4>
+                        <p>
+                            Applied human-centered design principles to ensure the interface was intuitive, accessible, and efficient for users with varying levels of cybersecurity expertise.
+                        </p>
+                        <p><strong>Deliverables:</strong> Usability Testing, UX Improvements</p>
+                    </div>
+                </div>
+
+
+            </div>
+
+            <div class="mt-5">
+                <a href="{% url 'ptgui_viz_main' %}" class="btn btn-dark">
+                    ⬅️ Back to Project
+                </a>
+            </div>
+        </div>
+    </section>
+</main>
+{% endblock content %}
\ No newline at end of file
diff --git a/home/templates/pages/smishing_detection/main.html b/home/templates/pages/smishing_detection/main.html
index b65f2d0f3..276c2ad41 100644
--- a/home/templates/pages/smishing_detection/main.html
+++ b/home/templates/pages/smishing_detection/main.html
@@ -1,17 +1,11 @@
-{% extends 'layouts/base.html' %}
-{% load static %}
-
-{% block seo %}
-    <title>Smishing Detection App - Mobile Cybersecurity & SMS Phishing Protection</title>
-    <meta name="description" content="Smishing Detection app uses AI to protect Android and iOS devices from SMS phishing attacks, enhancing mobile cybersecurity and user awareness.">
-    <meta name="keywords" content="smishing detection, mobile cybersecurity, SMS phishing protection, cybersecurity tools, ethical hacking tools, Hardhat Enterprises">
-    <meta property="og:title" content="Smishing Detection App - Mobile Cybersecurity Solution">
-    <meta property="og:description" content="Protect your device from SMS phishing with the Smishing Detection app, a mobile cybersecurity tool powered by AI.">
-    <meta property="og:image" content="{% static 'assets/img/pages/home/smishing_detection.svg' %}">
-{% endblock %}
-
-{% block content %}
-<main class="smishing-bg-white">
+{% extends 'layouts/base.html' %} {% load static %} {% block seo %}
+<title>Smishing Detection App - Mobile Cybersecurity & SMS Phishing Protection</title>
+<meta name="description" content="Smishing Detection app uses AI to protect Android and iOS devices from SMS phishing attacks, enhancing mobile cybersecurity and user awareness.">
+<meta name="keywords" content="smishing detection, mobile cybersecurity, SMS phishing protection, cybersecurity tools, ethical hacking tools, Hardhat Enterprises">
+<meta property="og:title" content="Smishing Detection App - Mobile Cybersecurity Solution">
+<meta property="og:description" content="Protect your device from SMS phishing with the Smishing Detection app, a mobile cybersecurity tool powered by AI.">
+<meta property="og:image" content="{% static 'assets/img/pages/home/smishing_detection.svg' %}"> {% endblock %} {% block content %}
+<main>
     {% include 'includes/preloader-sd.html' %}
 
     <!-- Hero -->
@@ -37,7 +31,8 @@ <h5 class="fw-normal text-dark">Transforming Mobile Cybersecurity with AI-Driven
                 <div class="col-lg-6">
                     <h2 class="fw-bolder text-dark">Overview of Smishing Detection</h2>
                     <p class="mb-4">
-                        The Smishing Detection app is a groundbreaking mobile cybersecurity solution designed to combat SMS phishing (smishing) attacks on Android and iOS devices. Leveraging AI-driven technology, our app detects and alerts users to potential smishing attempts, safeguarding personal information and reducing fraud. We aim to enhance mobile security, promote cybersecurity awareness, and contribute to global anti-scam efforts.
+                        The Smishing Detection app is a groundbreaking mobile cybersecurity solution designed to combat SMS phishing (smishing) attacks on Android and iOS devices. Leveraging AI-driven technology, our app detects and alerts users to potential smishing attempts,
+                        safeguarding personal information and reducing fraud. We aim to enhance mobile security, promote cybersecurity awareness, and contribute to global anti-scam efforts.
                     </p>
                 </div>
                 <div class="col-lg-6">
@@ -67,32 +62,99 @@ <h2 class="fw-bolder text-dark">Objectives</h2>
                         <li>Collaborate with cybersecurity experts to stay updated on emerging threats</li>
                         <li>Continuously improve the app based on user feedback and evolving threats</li>
                     </ul>
-                </div>
-            </div>
-            <!-- End of Goals -->
-
-            <!-- Call to Action Section -->
-            <div class="bg-primary-app">
-                <div class="row justify-content-center text-center">
-                    <div class="col-lg-8">
-                        <div class="mt-4 mb-5">
-                            <h2 class="fw-bolder text-dark">Join Our Mobile Cybersecurity Mission</h2>
-                            <p class="mb-4">
-                                Join our mission to revolutionize mobile security and combat SMS phishing attacks. Whether you're a developer, cybersecurity enthusiast, or advocate for online safety, there’s a place for you in our community.
-                            </p>
-                            <a href="{% url 'smishingdetection_join_us' %}" class="btn btn-primary animate-up-2" alt="Join the Smishing Detection community">
-                                <span class="fas fa-handshake me-2"></span>Join Us
-                            </a>
+                    <a href="{% url 'smishing_skills' %}" style="text-decoration: none;">
+                        <div class="mt-4" style="
+                        background: rgba(30, 31, 63, 0.85);
+                        border-radius: 20px;
+                        padding: 1.8rem;
+                        border: 2px solid transparent;
+                        background-image: linear-gradient(135deg, rgba(30, 31, 63, 0.85), rgba(42, 44, 79, 0.85)),
+                                          linear-gradient(135deg, #ffc107, #ff5722);
+                        background-origin: border-box;
+                        background-clip: padding-box, border-box;
+                        color: white;
+                        box-shadow: 0 10px 40px rgba(0, 0, 0, 0.7);
+                        transition: transform 0.3s ease, box-shadow 0.3s ease;
+                        backdrop-filter: blur(10px);
+                        animation: glowPulse 3s infinite ease-in-out;
+                        max-width: 100%;
+                        text-align: center;
+                      " onmouseover="this.style.transform='scale(1.04)'; this.style.boxShadow='0 14px 50px rgba(255, 193, 7, 0.4)'" onmouseout="this.style.transform='scale(1)'; this.style.boxShadow='0 10px 40px rgba(0, 0, 0, 0.7)'">
+
+                            <h4 style="color: #ffc107; margin-bottom: 1.2rem; font-weight: bold; letter-spacing: 0.5px;">⚡ Core Skills</h4>
+
+                            <ul style="list-style: none; padding-left: 0; margin: 0; font-size: 1.2rem;">
+                                <li style="margin-bottom: 0.8rem;"><span style="margin-right: 0.5rem;">🧠</span>Natural Language Processing (NLP)</li>
+                                <li style="margin-bottom: 0.8rem;"><span style="margin-right: 0.5rem;">🤖</span>Machine Learning for SMS Classification</li>
+                                <li><span style="margin-right: 0.5rem;">🧹</span>Data Preprocessing</li>
+                            </ul>
                         </div>
-                    </div>
+                    </a>
+
+                </div>
+
+                <!-- Right Column: Image -->
+                <div class="col-lg-6">
+                    <img src="{% static 'assets/img/pages/home/mvp-Team goals-pana.svg' %}" alt="Teamwork illustration" class="img-fluid">
                 </div>
             </div>
-            <!-- End of Call to Action Section -->
+
+
+            <style>
+                @keyframes glowPulse {
+                    0% {
+                        box-shadow: 0 0 10px rgba(255, 193, 7, 0.3);
+                    }
+                    50% {
+                        box-shadow: 0 0 30px rgba(255, 193, 7, 0.5);
+                    }
+                    100% {
+                        box-shadow: 0 0 10px rgba(255, 193, 7, 0.3);
+                    }
+                }
+            </style>
+
+        </div>
         </div>
+        <!-- End of Goals -->
+        <!-- Class of Action Section -->
+        <div class="bg-primary-app">
+            <div class="row justify-content-center text-center">
+                <div class="col-lg-8">
+                    <div class="mt-4 mb-5">
+                        <h2 class="fw-bolder text-dark">Join Us</h2>
+                        <p class="mb-4">Join our mission to revolutionize mobile security and combat SMS phishing attacks. Whether you're a skilled developer, cybersecurity enthusiast, or passionate advocate for online safety, there are numerous ways to get involved.
+                        </p>
+                        <a href="{% url 'smishingdetection_join_us' %}" class="btn btn-primary animate-up-2" alt="Join Us"><span class="fas fa-handshake me-2"></span>
+                                Join Us</a>
+
+
+                        <!-- End of Goals -->
+
+                        <!-- Call to Action Section -->
+                        <div class="bg-primary-app">
+                            <div class="row justify-content-center text-center">
+                                <div class="col-lg-8">
+                                    <div class="mt-4 mb-5">
+                                        <h2 class="fw-bolder text-dark">Join Our Mobile Cybersecurity Mission</h2>
+                                        <p class="mb-4">
+                                            Join our mission to revolutionize mobile security and combat SMS phishing attacks. Whether you're a developer, cybersecurity enthusiast, or advocate for online safety, there’s a place for you in our community.
+                                        </p>
+                                        <a href="{% url 'smishingdetection_join_us' %}" class="btn btn-primary animate-up-2" alt="Join the Smishing Detection community">
+                                            <span class="fas fa-handshake me-2"></span>Join Us
+                                        </a>
+                                    </div>
+
+                                </div>
+
+                            </div>
+                        </div>
+                        <!-- End of Call to Action Section -->
+                    </div>
     </section>
 
     <!-- FAQ Section -->
-    <section class="section section-lg bg-white py-5">
+    <section class="section section-lg bg-secondary-app py-5">
         <div class="container">
             <h1 class="fw-bolder display-50 text-center mb-5 mt-5">Frequently Asked Questions</h1>
             <h2 class="fw-bolder display-5 text-center mb-5 mt-5">Explore Answers to Common Questions About Smishing Detection</h2>
@@ -190,11 +252,9 @@ <h2 class="accordion-header" id="panelsStayOpen-headingEight">
                                 </button>
                             </h2>
                             <div id="panelsStayOpen-collapseEight" class="accordion-collapse collapse" aria-labelledby="panelsStayOpen-headingEight">
-
                                 <div class="accordion-body">
                                     Future plans include enhancing AI models, expanding app features, and integrating user feedback to improve smishing detection, ensuring ongoing mobile cybersecurity against evolving threats.
                                 </div>
-
                             </div>
                         </div>
                     </div>
@@ -204,4 +264,4 @@ <h2 class="accordion-header" id="panelsStayOpen-headingEight">
     </section>
     <!-- End of FAQ Section -->
 </main>
-{% endblock content %}
\ No newline at end of file
+{% endblock content %}
diff --git a/home/templates/pages/smishing_detection/smishing_skills.html b/home/templates/pages/smishing_detection/smishing_skills.html
new file mode 100644
index 000000000..b326eb6d8
--- /dev/null
+++ b/home/templates/pages/smishing_detection/smishing_skills.html
@@ -0,0 +1,77 @@
+{% extends 'layouts/base.html' %} {% load static %} {% block content %}
+<main>
+    {% include 'includes/preloader-sd.html' %}
+
+    <section style="background-color: #ffc107; padding: 6rem 0 4rem;">
+        <div class="container text-center">
+            <h2 class="text-light fw-bold display-2"> Core Smishing Detection Skills</h2>
+            <div class="row justify-content-center g-4">
+
+                <!-- NLP Card -->
+                <div class="col-md-6 col-lg-4">
+                    <div style="
+                        background: #1e1f3f;
+                        color: white;
+                        padding: 2rem;
+                        border-radius: 20px;
+                        box-shadow: 0 10px 40px rgba(0,0,0,0.5);
+                        text-align: left;
+                        height: 100%;
+                    ">
+                        <h4 style="color: #ffc107;">🧠 Natural Language Processing (NLP)</h4>
+                        <p>
+                            Used natural language processing techniques to analyze SMS content and detect suspicious language patterns. This enabled the system to interpret context and flag smishing threats.
+                        </p>
+                        <p><strong>Tools Used:</strong> TextBlob, NLTK, SpaCy</p>
+                    </div>
+                </div>
+
+                <!-- ML Card -->
+                <div class="col-md-6 col-lg-4">
+                    <div style="
+                        background: #1e1f3f;
+                        color: white;
+                        padding: 2rem;
+                        border-radius: 20px;
+                        box-shadow: 0 10px 40px rgba(0,0,0,0.5);
+                        text-align: left;
+                        height: 100%;
+                    ">
+                        <h4 style="color: #ffc107;">🤖 ML for SMS Classification</h4>
+                        <p>
+                            Trained machine learning models to classify SMS messages as safe or malicious based on labeled data. This improved the system’s ability to detect and block smishing attacks in real time.
+                        </p>
+                        <p><strong>Tools Used:</strong> Scikit-learn, Pandas, Jupyter</p>
+                    </div>
+                </div>
+
+                <!-- Data Preprocessing Card -->
+                <div class="col-md-6 col-lg-4">
+                    <div style="
+                        background: #1e1f3f;
+                        color: white;
+                        padding: 2rem;
+                        border-radius: 20px;
+                        box-shadow: 0 10px 40px rgba(0,0,0,0.5);
+                        text-align: left;
+                        height: 100%;
+                    ">
+                        <h4 style="color: #ffc107;">🧹 Data Preprocessing</h4>
+                        <p>
+                            Cleaned and formatted raw SMS data by removing noise, tokenizing text, and applying vectorization techniques like TF-IDF to prepare the data for training ML models.
+                        </p>
+                        <p><strong>Deliverables:</strong> Clean Datasets, Feature Vectors</p>
+                    </div>
+                </div>
+
+            </div>
+
+            <div class="mt-5">
+                <a href="{% url 'smishing_detection_main' %}" class="btn btn-dark">
+                    ⬅️ Back to Home
+                </a>
+            </div>
+        </div>
+    </section>
+</main>
+{% endblock content %}
\ No newline at end of file
diff --git a/home/urls.py b/home/urls.py
index dfb4c0ee5..b947378ec 100644
--- a/home/urls.py
+++ b/home/urls.py
@@ -26,10 +26,13 @@
     path('profile/details/', views.profile_details, name='profile_details'),
     path('malware_viz/joinus', views.malware_joinus, name='malware_viz_joinus'),
     path('appattack/', views.appattack, name='appattack'),
+    path('skills/', views.skills_view, name='Appattack_Skills'),
     path('appattack/join', views.appattack_join, name='appattack_join'),
     path('malware_viz/products_and_services', views.products_services, name='malware_products'),
     path('malware_viz/', views.malwarehome, name='malware_viz_main'),
+    path('malware_viz/skills/', views.malware_skills, name='malware_skills'),
     path('ptgui_viz/', views.ptguihome, name='ptgui_viz_main'),
+    path('ptgui_viz/skills/', views.ptgui_skills, name='ptgui_skills'),
     path('ptgui_viz/contact-us/', views.ptgui_contact_us, name='ptgui_contact-us'),
     path('maintenance', views.http_503, name='maintenance'),
     path('ptgui_viz/faq/', views.faq, name='faq'),
@@ -42,7 +45,10 @@
     path('ptgui_viz/tools/amass/', views.amass_view, name='tool_amass'),
     path('ptgui_viz/tools/arpaname/', views.arpaname_view, name='tool_arpaname'),
     path('smishing_detection', views.smishing_detection, name='smishing_detection_main'),
-    #path('smishing_detection/join_us', views.smishing_detection_join_us, name='smishingdetection_join_us'),
+    path('smishing_detection/skills/', views.smishing_skills, name='smishing_skills'),
+
+
+     #path('smishing_detection/join_us', views.smishing_detection_join_us, name='smishingdetection_join_us'),
     path('upskilling/', UpskillingView.as_view(), name='upskilling'),
     path('upskilling/<slug:slug>/', UpskillingSkillView.as_view(), name='upskilling_skill'),
     path('update-progress/<int:progress_id>/', views.update_progress, name='update_progress'),
@@ -50,8 +56,10 @@
     path('success/', UpskillSuccessView, name='success'),
     path('smishing_detection/join_us', views.smishingdetection_join_us, name='smishingdetection_join_us'),
     path('deakinThreatmirror/', views.Deakin_Threat_mirror_main, name='Deakin_Threat_mirror_main'),
+    path('deakinThreatmirror/skills/', views.deakinthreatmirror_skills, name='deakinthreatmirror_skills'),
     path('deakinThreatmirror/join_us', views.Deakin_Threat_mirror_joinus, name='threat_mirror_join_us'),
     path('vr/', views.Vr_main, name='Vr_main'),
+    path('vr/skills/', views.cybersafe_vr_skills, name='cybersafe_vr_skills'),
     path('vr/join_us', views.vr_join_us, name='cybersafe_vr_join_us'),
     path('upskilling/complete/<slug:slug>/', MarkSkillCompletedView.as_view(), name='complete_skill'),
     # path('contact-central/', views.Contact_central, name='contact-central'),
diff --git a/home/views.py b/home/views.py
index 3060e1e18..5e43579df 100644
--- a/home/views.py
+++ b/home/views.py
@@ -239,6 +239,11 @@ def blog(request):
 def appattack(request):
     return render(request, 'pages/appattack/main.html')
 
+def skills_view(request):
+    return render(request, 'pages/appattack/appattack_skills.html')
+
+
+
 def form_success(request):
     return render(request, 'emails/form_success.html')
  
@@ -300,12 +305,20 @@ def products_services(request):
  
 def malwarehome(request):
     return render(request, 'pages/malware_visualization/main.html')
+
+def malware_skills(request):
+    return render(request, 'pages/malware_visualization/malware_skills.html')
+
  
 def malware_joinus(request):
     return render(request, 'pages/malware_visualization/malware_viz_joinus.html')
  
 def ptguihome(request):
     return render(request, 'pages/pt_gui/main.html')
+
+def ptgui_skills(request):
+    return render(request, 'pages/pt_gui/ptgui_skills.html')
+
  
 def ptgui_contact_us(request):
     return render(request, 'pages/pt_gui/contact-us.html')
@@ -353,6 +366,10 @@ def join_project(request):
  
 def smishing_detection(request):
     return render(request, 'pages/smishing_detection/main.html')
+
+def smishing_skills(request):
+    return render(request, 'pages/smishing_detection/smishing_skills.html')
+
  
 def smishingdetection_join_us(request):
  
@@ -532,9 +549,18 @@ def SearchResults(request):
 def Deakin_Threat_mirror_main(request):
     return render(request, 'pages/DeakinThreatmirror/main.html')
 
+def deakinthreatmirror_skills(request):
+    return render(request, 'pages/DeakinThreatmirror/deakinthreatmirror_skills.html')
+
+
+
 def Vr_main(request):
     return render(request, 'pages/Vr/main.html')
 
+def cybersafe_vr_skills(request):
+    return render(request, 'pages/Vr/cybersafe_vr_skills.html')
+
+
 # Authentication
 
 def client_login(request):


Reviews:
user: login: vaqwerty2
body: This PR was fine before but after solving merge conflicts it isn't.
I will suggest going back to the previous commit and properly handling merge conflicts.
state: CHANGES_REQUESTED
author_association: CONTRIBUTOR
submitted_at: 2025-05-19T15:18:35Z
user: login: vaqwerty2
body: Address the comments
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-05-22T16:27:50Z
user: login: vaqwerty2
body: Last day today, If not corrected this PR will be closed!
Please update if you can.
state: CHANGES_REQUESTED
author_association: CONTRIBUTOR
submitted_at: 2025-05-23T05:09:11Z
user: login: vaqwerty2
body: Do this change please.
Also other text changes are unnecessary and effects others work, if you can just keep the default text and only add the skills as that was the task, it would be better, but still acceptable.
state: CHANGES_REQUESTED
author_association: CONTRIBUTOR
submitted_at: 2025-05-23T06:42:27Z
user: login: vaqwerty2
body: All good
state: APPROVED
author_association: CONTRIBUTOR
submitted_at: 2025-05-23T16:14:26Z

Review comments:
diff_hunk: @@ -1,28 +1,22 @@
-{% extends 'layouts/base.html' %}
-{% load static %}
-
-{% block seo %}
-    <title>Deakin Threat Mirror - Threat Intelligence Platform & Cybersecurity Visualization</title>
-    <meta name="description" content="Deakin Threat Mirror is an open-source threat intelligence platform for SMEs, offering cybersecurity visualization and actionable threat analysis tools. Project currently paused.">
-    <meta name="keywords" content="threat intelligence platform, cybersecurity visualization, threat analysis tools, cybersecurity tools, ethical hacking tools, Hardhat Enterprises">
-    <meta property="og:title" content="Deakin Threat Mirror - Threat Intelligence Platform">
-    <meta property="og:description" content="Discover Deakin Threat Mirror, an open-source platform for cybersecurity visualization and threat analysis, designed for SMEs. Project currently paused.">
-    <meta property="og:image" content="{% static 'assets/img/pages/home/deakin_threat_mirror.svg' %}">
-{% endblock %}
-
-{% block content %}
+{% extends 'layouts/base.html' %} {% load static %} {% block seo %}
+<title>Smishing Detection App - Mobile Cybersecurity & SMS Phishing Protection</title>
path: home/templates/pages/DeakinThreatmirror/main.html
user: login: vaqwerty2
body: Smishing?
This page is for Threat mirror, they are different projects
created_at: 2025-05-19T15:11:53Z
author_association: CONTRIBUTOR
path: home/templates/pages/Vr/main.html
user: login: vaqwerty2
body: <img width="1370" alt="Screenshot 2025-05-20 at 01 13 20" src="https://github.com/user-attachments/assets/c52213af-d381-4234-99a1-9f0bd33c02b8" />
Error on loading
created_at: 2025-05-19T15:13:35Z
author_association: CONTRIBUTOR
path: home/templates/pages/pt_gui/main.html
user: login: vaqwerty2
body: <img width="1370" alt="Screenshot 2025-05-20 at 01 16 28" src="https://github.com/user-attachments/assets/79c6d85e-76b8-4789-b215-9e5d66f3dce7" />
<img width="1375" alt="Screenshot 2025-05-20 at 01 16 38" src="https://github.com/user-attachments/assets/c87dc6a8-46e6-4a98-a882-a2720772c243" />
Images are too big on this page
created_at: 2025-05-19T15:17:17Z
author_association: CONTRIBUTOR
diff_hunk: @@ -38,59 +32,60 @@ <h1 class="fw-bold display-1">Deakin Cybersafe VR</h1>
             <div class="col-lg-6 mx-auto">
                 <p class="lead mb-4">Click on one of the buttons below to explore how Cybersafe VR empowers organizations to proactively safeguard their digital assets</p>
                 <div class="d-grid gap-2 d-sm-flex justify-content-sm-center">
-                  <a href="{% url 'cyber_threat_simulation' %}" class="btn btn-primary btn-lg px-4 gap-3">Cyber Threat Simulation</a>
path: home/templates/pages/Vr/main.html
user: login: vaqwerty2
body: You are removing these URLs please put them back, it affects the functionality.
created_at: 2025-05-23T06:39:01Z
author_association: CONTRIBUTOR

PR comments:
user: login: vaqwerty2
created_at: 2025-05-07T17:14:20Z
body: Please resolve the merge conflicts.
author_association: CONTRIBUTOR
user: login: vaqwerty2
created_at: 2025-05-13T09:55:10Z
body: Please address the merge conflicts
author_association: CONTRIBUTOR
user: login: Anshpreet1907
created_at: 2025-05-22T03:22:19Z
body: everything should be done 
author_association: CONTRIBUTOR
user: login: vaqwerty2
created_at: 2025-05-22T16:27:24Z
body: Smishing Page has Threat Mirror content?
<img width="1369" alt="Screenshot 2025-05-23 at 02 24 36" src="https://github.com/user-attachments/assets/bfd358bc-4c49-49fd-9392-702daa04e20d" />
Syntax error again at VR:
<img width="1359" alt="Screenshot 2025-05-23 at 02 25 58" src="https://github.com/user-attachments/assets/703e5ca6-3036-4635-bdd3-25ce9ce5bb1d" />

If you can make a commit by today, make sure that it is correct. or will we have to close this PR, due to it not being ready and the time constraint. 

author_association: CONTRIBUTOR
user: login: Anshpreet1907
created_at: 2025-05-23T03:09:08Z
body: they should be fixed 
author_association: CONTRIBUTOR
user: login: vaqwerty2
created_at: 2025-05-23T05:03:11Z
body: This is VR Page, but has App Attack content:
<img width="1360" alt="Screenshot 2025-05-23 at 15 01 42" src="https://github.com/user-attachments/assets/12932b79-c049-455c-a2d6-3139773e003f" />
<img width="1347" alt="Screenshot 2025-05-23 at 15 02 18" src="https://github.com/user-attachments/assets/c290c113-487b-4dec-aee2-7ae848b2bb82" />

This is what it should look like:
<img width="1351" alt="Screenshot 2025-05-23 at 15 02 56" src="https://github.com/user-attachments/assets/6e9b1f43-df4a-436f-a668-836b9977d690" />

author_association: CONTRIBUTOR
user: login: vaqwerty2
created_at: 2025-05-23T05:04:41Z
body: No padding at the top for App Attack:
<img width="1351" alt="Screenshot 2025-05-23 at 15 04 22" src="https://github.com/user-attachments/assets/1633e07d-fd4f-4a6d-a49b-ccce8924436a" />

author_association: CONTRIBUTOR
user: login: Anshpreet1907
created_at: 2025-05-23T05:18:05Z
body: all done
author_association: CONTRIBUTOR
user: login: Anshpreet1907
created_at: 2025-05-23T13:53:16Z
body: Could you please try closing my pull request 
author_association: CONTRIBUTOR