diff --git a/docs/images/bluetooth.png b/docs/images/bluetooth.png
new file mode 100644
index 0000000..1784a25
Binary files /dev/null and b/docs/images/bluetooth.png differ
diff --git a/docs/images/dashboard.png b/docs/images/dashboard.png
new file mode 100644
index 0000000..e24c503
Binary files /dev/null and b/docs/images/dashboard.png differ
diff --git a/docs/images/scanner.png b/docs/images/scanner.png
new file mode 100644
index 0000000..7e207cb
Binary files /dev/null and b/docs/images/scanner.png differ
diff --git a/docs/images/sensors.png b/docs/images/sensors.png
new file mode 100644
index 0000000..e422010
Binary files /dev/null and b/docs/images/sensors.png differ
diff --git a/docs/images/tscm-detail.png b/docs/images/tscm-detail.png
new file mode 100644
index 0000000..042397b
Binary files /dev/null and b/docs/images/tscm-detail.png differ
diff --git a/docs/images/tscm.png b/docs/images/tscm.png
new file mode 100644
index 0000000..6908e43
Binary files /dev/null and b/docs/images/tscm.png differ
diff --git a/docs/index.html b/docs/index.html
index cd6b0fd..23bd905 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -48,7 +48,7 @@
             </div>
         </div>
         <div class="hero-image">
-            <img src="images/intercept-main.png" alt="INTERCEPT Dashboard">
+            <img src="images/dashboard.png" alt="INTERCEPT Dashboard">
         </div>
     </header>
 
@@ -114,18 +114,30 @@
             <h2>See It In Action</h2>
             <p class="section-subtitle">A clean, modern interface for complex RF operations</p>
 
-            <div class="screenshot-grid">
-                <div class="screenshot-card main">
-                    <img src="images/intercept-main.png" alt="Main Dashboard">
+            <div class="screenshot-gallery">
+                <div class="screenshot-item">
+                    <img src="images/dashboard.png" alt="Main Dashboard">
                     <span class="screenshot-label">Dashboard</span>
                 </div>
-                <div class="screenshot-card">
-                    <img src="images/screenshot_radar.png" alt="Aircraft Radar">
-                    <span class="screenshot-label">Aircraft Radar</span>
+                <div class="screenshot-item">
+                    <img src="images/tscm.png" alt="TSCM Counter-Surveillance">
+                    <span class="screenshot-label">TSCM Counter-Surveillance</span>
                 </div>
-                <div class="screenshot-card">
-                    <img src="images/screenshot_sat.png" alt="Satellite Tracking">
-                    <span class="screenshot-label">Satellite Tracking</span>
+                <div class="screenshot-item">
+                    <img src="images/bluetooth.png" alt="Bluetooth Scanner">
+                    <span class="screenshot-label">Bluetooth Scanner</span>
+                </div>
+                <div class="screenshot-item">
+                    <img src="images/scanner.png" alt="Listening Post">
+                    <span class="screenshot-label">Listening Post</span>
+                </div>
+                <div class="screenshot-item">
+                    <img src="images/sensors.png" alt="433MHz Sensor Monitor">
+                    <span class="screenshot-label">433MHz Sensors</span>
+                </div>
+                <div class="screenshot-item">
+                    <img src="images/tscm-detail.png" alt="Device Detail Dialog">
+                    <span class="screenshot-label">Device Analysis</span>
                 </div>
             </div>
         </div>
diff --git a/docs/style.css b/docs/style.css
index c45e156..f1705dc 100644
--- a/docs/style.css
+++ b/docs/style.css
@@ -284,33 +284,30 @@ section h2 {
 }
 
 /* Screenshots */
-.screenshot-grid {
+.screenshot-gallery {
     display: grid;
-    grid-template-columns: 2fr 1fr 1fr;
+    grid-template-columns: repeat(3, 1fr);
     gap: 24px;
 }
 
-.screenshot-card {
+.screenshot-item {
     position: relative;
     border-radius: 12px;
     overflow: hidden;
     border: 1px solid var(--border);
     transition: all 0.3s;
+    cursor: pointer;
 }
 
-.screenshot-card:hover {
+.screenshot-item:hover {
     border-color: var(--accent);
-    transform: scale(1.02);
+    transform: translateY(-4px);
+    box-shadow: 0 12px 40px rgba(0, 212, 170, 0.15);
 }
 
-.screenshot-card.main {
-    grid-row: span 2;
-}
-
-.screenshot-card img {
+.screenshot-item img {
     width: 100%;
-    height: 100%;
-    object-fit: cover;
+    height: auto;
     display: block;
 }
 
@@ -319,9 +316,9 @@ section h2 {
     bottom: 0;
     left: 0;
     right: 0;
-    padding: 12px 16px;
-    background: linear-gradient(transparent, rgba(0, 0, 0, 0.8));
-    font-size: 0.85rem;
+    padding: 16px;
+    background: linear-gradient(transparent, rgba(0, 0, 0, 0.9));
+    font-size: 0.9rem;
     color: var(--text-primary);
     font-weight: 500;
 }
@@ -580,12 +577,8 @@ section h2 {
         grid-template-columns: repeat(2, 1fr);
     }
 
-    .screenshot-grid {
-        grid-template-columns: 1fr;
-    }
-
-    .screenshot-card.main {
-        grid-row: auto;
+    .screenshot-gallery {
+        grid-template-columns: repeat(2, 1fr);
     }
 
     .install-options {
@@ -612,6 +605,10 @@ section h2 {
         grid-template-columns: 1fr;
     }
 
+    .screenshot-gallery {
+        grid-template-columns: 1fr;
+    }
+
     .nav-links {
         display: none;
     }