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,6 +2,7 @@
 const { siteTitleHref } = Astro.locals.starlightRoute;
 ---
 
+<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"
@@ -20,7 +21,18 @@ const { siteTitleHref } = Astro.locals.starlightRoute;
     <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>
+</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>