Announce Pilot Cloud in the homepage bar

src/pages/index.astro

@@ -59,11 +59,19 @@ const featuredBlurbs: Record<string, string> = {
 
 <!-- ANNOUNCEMENT BAR -->
 <div class="announce-bar">
-  <a class="announce-headline" href="https://shell.online/" target="_blank" rel="noopener"
-     data-track="announce_click" data-track-target="shell-online">
+  <a class="announce-headline" href="https://cloud.pilotprotocol.network/" target="_blank" rel="noopener"
+     data-track="announce_click" data-track-target="pilot-cloud">
     <span class="announce-badge">New</span>
-    <img class="announce-logo" src="/img/shell-online.svg" alt="" width="21" height="21" decoding="async" aria-hidden="true" />
-    <span class="announce-text">Try <strong>shell.online</strong>, a live browser link for any terminal</span>
+    <img class="announce-logo" src="/img/pilot-48.webp" alt="" width="21" height="21" decoding="async" aria-hidden="true" />
+    <span class="announce-text">Try <strong>Pilot Cloud</strong>, add Pilot to any Agent or Chatbot</span>
+    <span class="announce-ais" role="img" aria-label="ChatGPT, Claude, Grok, Gemini, Grok Bot and Muse">
+      <span class="announce-ai" style="--logo:url(/brand/harness/openai.svg);--logo-color:#10A37F"></span>
+      <span class="announce-ai" style="--logo:url(/brand/harness/claude.svg);--logo-color:#D97757"></span>
+      <span class="announce-ai" style="--logo:url(/brand/harness/grok.svg)"></span>
+      <span class="announce-ai" style="--logo:url(/brand/harness/gemini.svg);--logo-color:#4285F4"></span>
+      <span class="announce-ai" style="--logo:url(/brand/harness/grokbot.svg)"></span>
+      <span class="announce-ai" style="--logo:url(/brand/harness/muse.svg);--logo-color:#0082FB"></span>
+    </span>
     <span class="announce-arrow" aria-hidden="true">→</span>
   </a>
 </div>
@@ -156,6 +164,20 @@ const featuredBlurbs: Record<string, string> = {
   }
   .announce-text { color: var(--ink); }
   .announce-text strong { color: var(--accent-text); font-weight: 650; }
+  .announce-ais {
+    flex: none;
+    display: inline-flex;
+    align-items: center;
+    gap: 0.45rem;
+  }
+  /* Brand logos as masks, tinted like the MCP section's harness chips. */
+  .announce-ai {
+    width: 18px;
+    height: 18px;
+    background: var(--logo-color, currentColor);
+    -webkit-mask: var(--logo) center / contain no-repeat;
+    mask: var(--logo) center / contain no-repeat;
+  }
   .announce-arrow {
     flex: none;
     color: var(--ann-line);
@@ -171,6 +193,9 @@ const featuredBlurbs: Record<string, string> = {
     .announce-bar { font-size: 0.88rem; padding: 0.7rem 1rem; }
     .announce-headline { gap: 0.5rem; }
     .announce-badge { display: none; }
+    .announce-logo { display: none; }
+    .announce-ais { gap: 0.3rem; }
+    .announce-ai { width: 15px; height: 15px; }
   }
 </style>