feat(showcase): add click-to-expand modal for screenshot

public/styles/global.css

@@ -462,6 +462,11 @@ section {
   overflow: hidden;
 }
 
+.showcase-image-box {
+  cursor: pointer;
+  position: relative;
+}
+
 .showcase-image-box img {
   width: 100%;
   height: auto;
@@ -471,6 +476,106 @@ section {
   object-position: top;
 }
 
+.showcase-overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.6);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  opacity: 0;
+  transition: opacity 0.3s ease;
+}
+
+.showcase-overlay span {
+  font-family: var(--font-mono);
+  font-size: 0.8rem;
+  color: var(--color-text);
+  padding: 0.75rem 1.5rem;
+  border: 2px solid var(--color-accent-blue);
+  background: rgba(0, 212, 255, 0.1);
+  text-transform: uppercase;
+  letter-spacing: 0.1em;
+  font-weight: 700;
+}
+
+.showcase-image-box:hover .showcase-overlay {
+  opacity: 1;
+}
+
+/* Modal Styles */
+.modal {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.95);
+  backdrop-filter: blur(10px);
+  z-index: 10000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  opacity: 0;
+  visibility: hidden;
+  transition: all 0.3s ease;
+  padding: var(--space-lg);
+}
+
+.modal.active {
+  opacity: 1;
+  visibility: visible;
+}
+
+.modal-content {
+  position: relative;
+  max-width: 1400px;
+  max-height: 90vh;
+  display: flex;
+  flex-direction: column;
+}
+
+.modal-content img {
+  max-width: 100%;
+  max-height: 85vh;
+  object-fit: contain;
+  border: 2px solid var(--color-border);
+  box-shadow: 0 0 60px rgba(0, 212, 255, 0.2);
+}
+
+.modal-close {
+  position: absolute;
+  top: -50px;
+  right: 0;
+  font-size: 2.5rem;
+  color: var(--color-text);
+  cursor: pointer;
+  line-height: 1;
+  transition: color 0.3s ease;
+}
+
+.modal-close:hover {
+  color: var(--color-accent-blue);
+}
+
+@media (max-width: 768px) {
+  .modal {
+    padding: var(--space-md);
+  }
+  
+  .modal-close {
+    top: -40px;
+    font-size: 2rem;
+  }
+  
+  .modal-content img {
+    max-height: 80vh;
+  }
+}
+
 .showcase-image-box::after {
   content: '';
   position: absolute;