feat(ui): replace Header tabs with nav-based grouped navigation

Replace the RA Tabs/TabList/Tab rendering in the Header component
with a nav-based approach that supports grouped dropdown items via
BUI Menu. Active state is consumer-controlled via a new activeTabId
prop. The indicator system follows the TabsIndicators CSS custom
property pattern for animated active/hover/focus states.

Signed-off-by: Johan Persson <johanopersson@gmail.com>

.changeset/chatty-cups-create.md

@@ -0,0 +1,24 @@
+---
+'@backstage/ui': minor
+---
+
+**BREAKING**: The `Header` component's `tabs` prop now uses `HeaderNavTabItem[]` instead of `HeaderTab[]`. Tabs render as a `<nav>` element with links and optional dropdown menus instead of `role="tablist"`. A new `activeTabId` prop controls which tab is highlighted.
+
+**Migration:**
+
+```diff
+- import { Header, type HeaderTab } from '@backstage/ui';
++ import { Header, type HeaderNavTabItem } from '@backstage/ui';
+
+  // Tabs no longer support matchStrategy — active state is controlled via activeTabId
+- const tabs: HeaderTab[] = [
+-   { id: 'overview', label: 'Overview', href: '/overview', matchStrategy: 'prefix' },
++ const tabs: HeaderNavTabItem[] = [
++   { id: 'overview', label: 'Overview', href: '/overview' },
+  ];
+
+- <Header title="My Page" tabs={tabs} />
++ <Header title="My Page" tabs={tabs} activeTabId="overview" />
+```
+
+**Affected components:** Header