feat(nav): top-bar Hosting + Client Portal links

Adds external links to anhonesthost.com (Hosting) and
secure.anhonesthost.com (Client Portal) in both the Starlight header
(via the SiteTitle override) and the custom hub page header. Hidden
on narrow viewports so the search box, hamburger, and theme toggle
keep room.

src/components/SiteTitle.astro

@@ -2,7 +2,8 @@
 const { siteTitleHref } = Astro.locals.starlightRoute;
 ---
 
-<a href={siteTitleHref} class="site-title sl-flex" translate="no" aria-label="AnHonestHost Knowledge Base">
+<div class="site-title-row sl-flex">
+  <a href={siteTitleHref} class="site-title sl-flex" translate="no" aria-label="AnHonestHost Knowledge Base">
     <svg
       class="brand-logo"
       xmlns="http://www.w3.org/2000/svg"
@@ -18,9 +19,20 @@ const { siteTitleHref } = Astro.locals.starlightRoute;
       <text x="44" y="21" font-family="Inter, system-ui, -apple-system, sans-serif" font-size="18" font-weight="800" fill="currentColor" letter-spacing="-0.5">AnHonest<tspan fill="#00d4aa">Host</tspan></text>
     </svg>
     <span class="kb-label">Knowledge Base</span>
-</a>
+  </a>
+
+  <nav class="ext-nav" aria-label="AnHonestHost links">
+    <a href="https://anhonesthost.com/" class="ext-link">Hosting</a>
+    <a href="https://secure.anhonesthost.com/clientarea.php" class="ext-link">Client Portal</a>
+  </nav>
+</div>
 
 <style>
+  .site-title-row {
+    align-items: center;
+    gap: 1.5rem;
+    min-width: 0;
+  }
   .site-title {
     align-items: center;
     gap: 0.75rem;
@@ -41,9 +53,32 @@ const { siteTitleHref } = Astro.locals.starlightRoute;
     border-left: 1px solid var(--anhh-border-color, #334155);
     line-height: 1;
   }
-  @media (max-width: 50em) {
+  .ext-nav {
+    display: flex;
+    align-items: center;
+    gap: 1.25rem;
+  }
+  .ext-link {
+    font-size: 0.875rem;
+    font-weight: 500;
+    color: var(--anhh-text-secondary, #94a3b8);
+    text-decoration: none;
+    white-space: nowrap;
+    transition: color 120ms ease;
+  }
+  .ext-link:hover,
+  .ext-link:focus {
+    color: var(--anhh-accent, #00d4aa);
+    outline: none;
+  }
+  /* Hide kb-label and external nav on narrow viewports — search + hamburger
+     get tight on mobile. */
+  @media (max-width: 60em) {
     .kb-label {
       display: none;
     }
+    .ext-nav {
+      display: none;
+    }
   }
 </style>

src/pages/index.astro

@@ -79,6 +79,11 @@ const visibleProducts: Product[] = Array.from(byProduct.entries())
       }
       header {
         border-bottom: 1px solid var(--anhh-border-color, #334155);
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 1.5rem;
+        flex-wrap: wrap;
       }
       a.brand {
         display: inline-flex;
@@ -87,6 +92,28 @@ const visibleProducts: Product[] = Array.from(byProduct.entries())
         color: inherit;
         text-decoration: none;
       }
+      .ext-nav {
+        display: flex;
+        align-items: center;
+        gap: 1.25rem;
+      }
+      .ext-link {
+        font-size: 0.875rem;
+        font-weight: 500;
+        color: var(--anhh-text-secondary, #94a3b8);
+        text-decoration: none;
+        white-space: nowrap;
+      }
+      .ext-link:hover,
+      .ext-link:focus {
+        color: var(--anhh-accent, #00d4aa);
+        outline: none;
+      }
+      @media (max-width: 40em) {
+        .ext-nav {
+          display: none;
+        }
+      }
       .kb-label {
         font-size: 0.875rem;
         font-weight: 500;
@@ -177,6 +204,10 @@ const visibleProducts: Product[] = Array.from(byProduct.entries())
         </svg>
         <span class="kb-label">Knowledge Base</span>
       </a>
+      <nav class="ext-nav" aria-label="AnHonestHost links">
+        <a href="https://anhonesthost.com/" class="ext-link">Hosting</a>
+        <a href="https://secure.anhonesthost.com/clientarea.php" class="ext-link">Client Portal</a>
+      </nav>
     </header>
     <main>
       <h1>Knowledge Base</h1>