Replace project sections with live Services list

- Add services.json: hand-maintained source of truth with 20 public
  homelab services across 7 categories (edge, observability, media,
  downloads, ethereum, ai, dev), each with name/url/desc/icon.
- Rewrite index.html: Services section rendered client-side from
  services.json with a tiny up/down status probe (green dot = up,
  grey = down/unreachable; graceful fallback on CORS/offline).
  Keep a small Projects section linking the GitHub orgs so the old
  content is not lost.
- Add services grid + status dot styles to styles.css.
- Dockerfile: COPY services.json into the nginx html root.

styles.css

@@ -113,7 +113,7 @@ body {
   line-height: 1.65;
 }
 
-/* Tags — small, muted detail */
+/* Tags — small, muted detail (kept for any legacy use) */
 .tags {
   list-style: none;
   margin: 0;
@@ -134,6 +134,113 @@ body {
   color: var(--border);
 }
 
+/* Services — grouped grid of homelab services */
+.services-root { margin-top: 0.5rem; }
+.services-loading, .services-error {
+  color: var(--muted);
+  font-style: italic;
+}
+.service-group { margin: 0 0 2rem; }
+.group-title {
+  font-size: 1.05rem;
+  font-weight: 700;
+  margin: 0 0 0.75rem;
+  letter-spacing: -0.01em;
+  border-bottom: 1px solid var(--border);
+  padding-bottom: 0.35rem;
+}
+.group-icon { margin-right: 0.4rem; }
+.service-list {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
+  gap: 0.75rem;
+}
+.service {
+  border: 1px solid var(--border);
+  border-radius: 8px;
+  background: transparent;
+  transition: border-color 0.15s ease, background 0.15s ease;
+}
+.service:hover { border-color: var(--accent); }
+.service-link {
+  display: flex;
+  align-items: center;
+  gap: 0.6rem;
+  padding: 0.7rem 0.85rem;
+  text-decoration: none;
+  color: var(--fg);
+  height: 100%;
+}
+.service-icon {
+  font-size: 1.4rem;
+  line-height: 1;
+  flex-shrink: 0;
+  width: 1.6rem;
+  text-align: center;
+}
+.service-body {
+  display: flex;
+  flex-direction: column;
+  flex: 1 1 auto;
+  min-width: 0;
+}
+.service-name {
+  font-weight: 700;
+  font-size: 0.98rem;
+  letter-spacing: -0.01em;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.service-desc {
+  font-size: 0.82rem;
+  color: var(--muted);
+  line-height: 1.4;
+  margin-top: 0.1rem;
+}
+
+/* Status dot — green up, grey down/pending */
+.status-dot {
+  width: 0.6rem;
+  height: 0.6rem;
+  border-radius: 50%;
+  flex-shrink: 0;
+  border: 1px solid var(--border);
+  background: var(--muted);
+  opacity: 0.5;
+  transition: background 0.3s ease, opacity 0.3s ease, border-color 0.3s ease;
+}
+.status-pending { background: var(--muted); opacity: 0.4; }
+.status-up {
+  background: #2ea043;
+  border-color: #2ea043;
+  opacity: 1;
+}
+.status-down { background: #d73a49; border-color: #d73a49; opacity: 0.85; }
+
+/* Orgs list (Projects section) */
+.orgs {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  max-width: 42rem;
+}
+.orgs li {
+  padding: 0.7rem 0;
+  border-bottom: 1px solid var(--border);
+  font-size: 0.98rem;
+}
+.orgs li:last-child { border-bottom: none; }
+.orgs a {
+  color: var(--accent);
+  text-decoration: none;
+  font-weight: 700;
+}
+.orgs a:hover { text-decoration: underline; }
+
 /* Footer */
 .site-footer {
   margin-top: 3rem;