Add program reduction overview illustration

Author: yqtian-se

assets/custom.scss

@@ -142,6 +142,29 @@
   margin-bottom: 1.6rem;
 }
 
+/* --- Landing illustration ---------------------------------- */
+
+.landing-illustration {
+  margin: 2.35rem 0 3rem;
+}
+
+.landing-illustration img {
+  display: block;
+  width: 100%;
+  height: auto;
+  border: 1px solid var(--bs-border-color);
+  border-radius: 8px;
+  background: #fff;
+}
+
+.landing-illustration figcaption {
+  margin-top: 0.55rem;
+  color: var(--bs-secondary-color);
+  font-size: 0.86rem;
+  line-height: 1.5;
+  text-align: center;
+}
+
 /* --- Feature grid ------------------------------------------ */
 
 .features-grid {

assets/program-reduction-overview.png

@@ -50,6 +50,18 @@ interpreters, static analyzers, theorem provers, database engines, build systems
 In each case, the goal is not only to reproduce the failure,
 but to find a small artifact that still explains it.
 
+```{=html}
+<figure class="landing-illustration">
+  <img
+    src="assets/program-reduction-overview.png"
+    alt="A large failing program flows through a reducer and a test loop to become a small failure witness, which helps debugging, bug reports, and regression tests."
+    loading="lazy">
+  <figcaption>
+    Program reduction keeps the failure while removing everything that does not help explain it.
+  </figcaption>
+</figure>
+```
+
 ```{=html}
 <hr class="landing-divider">
 <p class="landing-h">What You Will Learn</p>