add mcp project marks to the home page

layouts/index.html

@@ -111,7 +111,10 @@ <h2 class="section__title">
             {{/* feature card */}}
             <article class="mcp__card mcp__card--feature">
                 <div class="mcp__feature__bg" aria-hidden="true"></div>
-                <p class="mcp__id">platform</p>
+                <header class="mcp__head">
+                    <img class="mcp__symbol mcp__symbol--feature" src="{{ "images/logos/mcp-data-platform.svg" | absURL }}" alt="" aria-hidden="true" loading="lazy" width="64" height="64">
+                    <p class="mcp__id">platform</p>
+                </header>
                 <h3 class="mcp__name mcp__name--big"><em class="serif">mcp-data-platform</em></h3>
                 <p class="mcp__tag">An AI assistant can run SQL, but it doesn't know that <code>cust_id</code> is PII, that the table was deprecated last month, or who to ask when something breaks. <strong>mcp-data-platform fixes that.</strong> It connects assistants to your data infrastructure and adds business context from your semantic layer. Query a Trino table and get its meaning, owners, quality scores, and deprecation warnings in the same response.</p>
                 <ul class="mcp__list">
@@ -149,7 +152,10 @@ <h3 class="mcp__name mcp__name--big"><em class="serif">mcp-data-platform</em></h
             </article>
 
             <article class="mcp__card">
-                <p class="mcp__id">obj · 01</p>
+                <header class="mcp__head">
+                    <img class="mcp__symbol" src="{{ "images/logos/mcp-s3.svg" | absURL }}" alt="" aria-hidden="true" loading="lazy" width="48" height="48">
+                    <p class="mcp__id">obj · 01</p>
+                </header>
                 <h3 class="mcp__name">mcp-s3</h3>
                 <p class="mcp__tag">Connects S3-compatible storage to MCP clients with read-only mode, size limits, prefix-based ACLs, and audit logging. Works with AWS S3, SeaweedFS, LocalStack, MinIO, or anything that speaks S3. Multi-account from a single installation.</p>
                 <div class="mcp__links">
@@ -159,7 +165,10 @@ <h3 class="mcp__name">mcp-s3</h3>
             </article>
 
             <article class="mcp__card">
-                <p class="mcp__id">sql · 02</p>
+                <header class="mcp__head">
+                    <img class="mcp__symbol" src="{{ "images/logos/mcp-trino.svg" | absURL }}" alt="" aria-hidden="true" loading="lazy" width="48" height="48">
+                    <p class="mcp__id">sql · 02</p>
+                </header>
                 <h3 class="mcp__name">mcp-trino</h3>
                 <p class="mcp__tag">Connects Trino to MCP clients with an optional semantic layer. Surfaces business descriptions, ownership, and quality scores from metadata catalogs alongside query results, and marks sensitive columns so an AI assistant knows what not to read. Multi-cluster from one install.</p>
                 <div class="mcp__links">
@@ -169,7 +178,10 @@ <h3 class="mcp__name">mcp-trino</h3>
             </article>
 
             <article class="mcp__card">
-                <p class="mcp__id">meta · 03</p>
+                <header class="mcp__head">
+                    <img class="mcp__symbol" src="{{ "images/logos/mcp-datahub.svg" | absURL }}" alt="" aria-hidden="true" loading="lazy" width="48" height="48">
+                    <p class="mcp__id">meta · 03</p>
+                </header>
                 <h3 class="mcp__name">mcp-datahub</h3>
                 <p class="mcp__tag">MCP server and Go library for DataHub. Search datasets, explore schemas, trace lineage, and read glossary terms, domains, and ownership. Ships as a standalone binary, a one-click Claude Desktop <code>.mcpb</code> bundle, or a composable library.</p>
                 <div class="mcp__links">

static/css/site.css

@@ -656,6 +656,43 @@ em.serif { font-family: var(--serif); font-style: italic; font-weight: 400; }
     padding-bottom: 14px;
     border-bottom: 1px dashed var(--rule);
 }
+
+/* Project brand marks inside MCP cards */
+.mcp__head {
+    display: flex;
+    align-items: center;
+    gap: 14px;
+    margin-bottom: 18px;
+    padding-bottom: 14px;
+    border-bottom: 1px dashed var(--rule);
+}
+.mcp__head .mcp__id {
+    /* the id stamp sits next to the symbol; reset its own margin/border */
+    margin: 0;
+    padding: 0;
+    border: none;
+}
+.mcp__symbol {
+    width: 40px;
+    height: 40px;
+    display: block;
+    flex: 0 0 auto;
+    transition: transform .35s cubic-bezier(.2,.8,.2,1);
+}
+.mcp__card:hover .mcp__symbol {
+    transform: rotate(-6deg) scale(1.06);
+}
+.mcp__symbol--feature {
+    /* feature card mark is a touch larger to match the visual weight of the big italic name */
+    width: 64px;
+    height: 64px;
+}
+.mcp__card--feature .mcp__head {
+    /* feature card has more breathing room */
+    gap: 20px;
+    margin-bottom: 0;
+    padding-bottom: 18px;
+}
 .mcp__name {
     font-family: var(--mono);
     font-weight: 700;
@@ -741,6 +778,7 @@ em.serif { font-family: var(--serif); font-style: italic; font-weight: 400; }
         "schema";
     gap: 18px;
 }
+.mcp__card--feature .mcp__head { grid-area: id; margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
 .mcp__card--feature .mcp__id { grid-area: id; margin-bottom: 0; }
 .mcp__card--feature .mcp__name--big { grid-area: name; margin: 0; }
 .mcp__card--feature .mcp__tag { grid-area: tag; max-width: 60ch; font-size: 17px; margin: 0; }