minor enhancements

Author: kisinga

README.md

@@ -31,7 +31,7 @@ A working system gives you one dashboard with three things:
 
 ## Two parts, one system
 
-MajiFlow is not just software sitting on a server. It is the bridge between the design on your screen and the physical hardware in the field.
+MajiFlow bridges the design on your screen and the hardware in the field.
 
 **The software** is the desktop design app and the monitoring dashboard. You draw your system, validate it, and generate controller firmware from your laptop.
 
@@ -85,7 +85,7 @@ packages/core/   # Shared types, topology logic, and quotation engine
 test/            # Integration and scaling tests
 defaults/        # Bundled board definitions and example configs
 docs/            # Documentation and development journal
-quote/           # Static site (homepage + quick quote) for GitHub Pages
+homepage/           # Static site (homepage + quick quote) for GitHub Pages
 ```
 
 ## Desktop app

homepage/index.html

@@ -31,6 +31,19 @@ <h1>Metrics and automation for water-critical installations.</h1>
   </header>
 
   <main class="container">
+    <section class="screenshots">
+      <div class="screenshot-grid">
+        <figure>
+          <img src="screenshots/metrics.png" alt="Dashboard showing water usage metrics and tank levels">
+          <figcaption>Live dashboard — tank levels, flow rates, and usage history.</figcaption>
+        </figure>
+        <figure>
+          <img src="screenshots/automations.png" alt="Automation rules for scheduled pump and valve control">
+          <figcaption>Automation — schedule refills, set triggers, toggle on and off.</figcaption>
+        </figure>
+      </div>
+    </section>
+
     <section class="system-split">
       <h2>Software and hardware, designed together</h2>
       <div class="split-grid">
@@ -99,7 +112,7 @@ <h2>What you can do with it</h2>
     </section>
 
     <section class="use-cases">
-      <h2>Built for real places</h2>
+      <h2>Works in</h2>
       <div class="use-case-grid">
         <div class="use-case">
           <strong>Farms</strong>

homepage/screenshots/automations.png

@@ -606,6 +606,43 @@ footer a { color: var(--primary); text-decoration: none; }
 
 .site-footer a { color: var(--primary); text-decoration: none; }
 
+/* Screenshots */
+.screenshots {
+  margin-bottom: 48px;
+}
+
+.screenshot-grid {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 16px;
+}
+
+.screenshot-grid figure {
+  margin: 0;
+  background: var(--card);
+  border-radius: var(--radius);
+  box-shadow: var(--shadow);
+  border: 1px solid var(--border);
+  overflow: hidden;
+}
+
+.screenshot-grid img {
+  display: block;
+  width: 100%;
+  height: auto;
+}
+
+.screenshot-grid figcaption {
+  padding: 12px 16px;
+  font-size: 13px;
+  color: var(--text-secondary);
+  line-height: 1.45;
+}
+
+@media (max-width: 720px) {
+  .screenshot-grid { grid-template-columns: 1fr; }
+}
+
 /* Responsive */
 @media (max-width: 720px) {
   .features { grid-template-columns: 1fr; }