@f5-sales-demo/docs-theme 4.11.5 → 4.11.7

package/components/Footer.astro

@@ -1,47 +1,23 @@
 ---
 import Default from '@astrojs/starlight/components/Footer.astro';
-import Icon from './Icon.astro';
 ---
 
 <Default {...Astro.props}><slot /></Default>
 
-{process.env.DOCS_PROFILE !== 'canonical-provider' && <div class="social-links">
-  <a href="https://www.facebook.com/f5incorporated" target="_blank" rel="noopener noreferrer" aria-label="Facebook">
-    <Icon name="hashicorp-flight:facebook-color" size="1.5rem" />
-  </a>
-  <a href="https://x.com/F5" target="_blank" rel="noopener noreferrer" aria-label="X">
-    <Icon name="hashicorp-flight:twitter-x" size="1.5rem" />
-  </a>
-  <a href="https://www.linkedin.com/company/f5/" target="_blank" rel="noopener noreferrer" aria-label="LinkedIn">
-    <Icon name="hashicorp-flight:linkedin-color" size="1.5rem" />
-  </a>
-  <a href="https://www.instagram.com/f5.global/" target="_blank" rel="noopener noreferrer" aria-label="Instagram">
-    <Icon name="hashicorp-flight:instagram-color" size="1.5rem" />
-  </a>
-  <a href="https://www.youtube.com/user/f5networksinc" target="_blank" rel="noopener noreferrer" aria-label="YouTube">
-    <Icon name="hashicorp-flight:youtube-color" size="1.5rem" />
-  </a>
-</div>}
+{process.env.DOCS_PROFILE !== 'canonical-provider' && <nav class="project-links" aria-label="Project information">
+  <a href="https://f5-sales-demo.github.io/en/ecosystem/">Ecosystem directory</a>
+  <a href="https://github.com/f5-sales-demo">Project sources</a>
+  <a href="https://docs.cloud.f5.com/">Official F5 documentation</a>
+</nav>}
 
 <style>
-  .social-links {
+  .project-links {
     display: flex;
-    justify-content: flex-end;
-    align-items: center;
-    gap: 1.25rem;
-    padding: 1rem 0 0.5rem;
-  }
-
-  .social-links a {
-    display: inline-flex;
-    transition: opacity 0.2s ease;
-  }
-
-  .social-links a:hover {
-    opacity: 0.7;
-  }
-
-  .social-links :global(svg) {
-    display: block;
+    flex-wrap: wrap;
+    gap: 0.5rem 1.5rem;
+    border-top: 1px solid var(--sl-color-gray-5);
+    margin-top: 2rem;
+    padding-block: 1rem;
   }
+  .project-links a { padding-block: 0.5rem; }
 </style>

package/components/Head.astro

@@ -0,0 +1,10 @@
+---
+import { pageTitle } from '../src/utils/page-title';
+
+const route = Astro.locals.starlightRoute;
+const head = route.head.map((entry) => entry.tag === 'title'
+  ? { ...entry, content: pageTitle(route.entry.data.title, route.siteTitle, entry.content || '') }
+  : entry);
+---
+
+{head.map(({ tag: Tag, attrs, content }) => <Tag {...attrs} set:html={content} />)}

package/components/LinkCard.astro

@@ -18,7 +18,7 @@ if (attributes.href && localeSlug) {
 
 <div class:list={['sl-link-card', { 'has-icon': !!icon }]}>
   {icon && (
-    <span class="card-icon">
+    <span class="card-icon" aria-hidden="true">
       <Icon name={icon} />
     </span>
   )}
@@ -28,13 +28,13 @@ if (attributes.href && localeSlug) {
     </a>
     {description && <span class="description" set:html={description} />}
   </span>
-  <Icon name="right-arrow" size="1.333em" class="icon rtl:flip" />
+  <span aria-hidden="true"><Icon name="right-arrow" size="1.333em" class="icon rtl:flip" /></span>
 </div>
 
 <style>
   .sl-link-card {
     display: grid;
-    grid-template-columns: 1fr auto;
+    grid-template-columns: minmax(0, 1fr) auto;
     gap: 0.5rem;
     border: 1px solid var(--sl-color-gray-5);
     border-radius: 0.5rem;
@@ -46,7 +46,7 @@ if (attributes.href && localeSlug) {
   }
 
   .sl-link-card.has-icon {
-    grid-template-columns: auto 1fr auto;
+    grid-template-columns: auto minmax(0, 1fr) auto;
   }
 
   a {
@@ -62,7 +62,10 @@ if (attributes.href && localeSlug) {
   }
 
   .stack {
-    flex-direction: column;
+    min-width: 0;
+    overflow-wrap: anywhere;
+    display: grid;
+    align-content: start;
     gap: 0.5rem;
   }
 
@@ -75,6 +78,7 @@ if (attributes.href && localeSlug) {
   .description {
     color: var(--sl-color-gray-3);
     line-height: 1.5;
+    margin: 0;
   }
 
   .icon {
@@ -83,10 +87,10 @@ if (attributes.href && localeSlug) {
 
   .card-icon {
     color: var(--sl-color-white);
-    align-self: stretch;
+    align-self: start;
     position: relative;
-    aspect-ratio: 1;
-    max-height: 3rem;
+    width: 3rem;
+    height: 3rem;
   }
 
   .card-icon :global(svg) {
@@ -96,6 +100,11 @@ if (attributes.href && localeSlug) {
     height: 100%;
   }
 
+  .sl-link-card:focus-within {
+    outline: 2px solid var(--sl-color-text-accent);
+    outline-offset: 3px;
+  }
+
   /* Hover state */
   .sl-link-card:hover {
     background: var(--sl-color-gray-7, var(--sl-color-gray-6));

package/components/ProviderHeader.astro

@@ -49,6 +49,11 @@ const shouldRenderSearch = config.pagefind || config.components.Search !== '@ast
 			min-width: 0;
 		}
 
+		.right-group { display: none; }
+		@media (min-width: 90rem) {
+			.right-group { display: flex; }
+		}
+
 		.right-group,
 		.social-icons {
 			gap: 1rem;
@@ -71,7 +76,7 @@ const shouldRenderSearch = config.pagefind || config.components.Search !== '@ast
 			align-items: center;
 		}
 
-		@media (min-width: 50rem) {
+		@media (min-width: 90rem) {
 			:global(:root[data-has-sidebar]) {
 				--__sidebar-pad: calc(2 * var(--sl-nav-pad-x));
 			}
@@ -90,9 +95,9 @@ const shouldRenderSearch = config.pagefind || config.components.Search !== '@ast
 				display: grid;
 				grid-template-columns:
 					/* 1 (site title) */
-					auto
+					minmax(0, 1fr)
 					/* 2 (mega-menu nav) */
-					1fr
+					auto
 					/* 3 (search box) */
 					auto
 					/* 4 (right items) */

package/components/SharedHeader.astro

@@ -7,6 +7,7 @@ import ThemeSelect from 'virtual:starlight/components/ThemeSelect';
 import config from 'virtual:starlight/user-config';
 import MegaMenu from './SharedMegaMenu.tsx';
 import MegaMenuMobile from './SharedMegaMenuMobile.tsx';
+import { federatedSearchSites } from '../src/utils/search-sites';
 
 /**
  * Render the `Search` component if Pagefind is enabled or the default search component has been overridden.
@@ -14,7 +15,7 @@ import MegaMenuMobile from './SharedMegaMenuMobile.tsx';
 const shouldRenderSearch = config.pagefind || config.components.Search !== '@astrojs/starlight/components/Search.astro';
 ---
 
-<div class="header sl-mega-menu-header">
+<div class="header sl-mega-menu-header" data-search-sources={JSON.stringify(federatedSearchSites)}>
 	<div class="title-wrapper sl-flex">
 		<SiteTitle />
 	</div>
@@ -34,8 +35,38 @@ const shouldRenderSearch = config.pagefind || config.components.Search !== '@ast
 	<div class="smm-mobile-toggle">
 		<MegaMenuMobile client:only="react" />
 	</div>
+	<details class="compact-preferences">
+		<summary aria-label="Display and language">Aa</summary>
+		<div class="preferences-panel"><ThemeSelect /><LanguageSelect /></div>
+	</details>
 </div>
 
+<script>
+	import { searchSource } from '../src/utils/search-source';
+	const header = document.querySelector<HTMLElement>('[data-search-sources]');
+	const sources = JSON.parse(header?.dataset.searchSources || '[]');
+	const annotateResults = () => {
+		for (const link of document.querySelectorAll<HTMLAnchorElement>('.pagefind-ui__result-link')) {
+			if (link.dataset.sourceAnnotated) continue;
+			link.dataset.sourceAnnotated = 'true';
+			const label = searchSource(link.href, sources);
+			if (!label) continue;
+			const source = document.createElement('span');
+			source.className = 'search-project-source';
+			source.textContent = label;
+			link.closest('.pagefind-ui__result-title')?.append(source);
+		}
+	};
+	new MutationObserver(annotateResults).observe(document.body, { childList: true, subtree: true });
+	document.addEventListener('keydown', (event) => {
+		const preferences = document.querySelector<HTMLDetailsElement>('.compact-preferences[open]');
+		if (event.key === 'Escape' && preferences) {
+			preferences.open = false;
+			preferences.querySelector('summary')?.focus();
+		}
+	});
+</script>
+
 <style>
 	@layer starlight.core {
 		.header {
@@ -55,6 +86,37 @@ const shouldRenderSearch = config.pagefind || config.components.Search !== '@ast
 			min-width: 0;
 		}
 
+		.right-group { display: none; }
+		.compact-preferences { position: relative; flex-shrink: 0; }
+		.compact-preferences summary {
+			cursor: pointer;
+			padding: 0.75rem;
+			min-height: 44px;
+			list-style: none;
+		}
+		.preferences-panel {
+			position: absolute;
+			inset-inline-end: 0;
+			top: calc(100% + 0.5rem);
+			display: grid;
+			gap: 0.5rem;
+			padding: 0.75rem;
+			background: var(--sl-color-bg-nav);
+			border: 1px solid var(--sl-color-gray-5);
+			border-radius: 0.5rem;
+		}
+		:global(.search-project-source) {
+			display: block;
+			font-size: var(--sl-text-sm);
+			font-weight: 400;
+			color: var(--sl-color-gray-2);
+			margin-top: 0.25rem;
+		}
+		@media (min-width: 90rem) {
+			.right-group { display: flex; }
+			.compact-preferences { display: none; }
+		}
+
 		.right-group,
 		.social-icons {
 			gap: 1rem;
@@ -77,7 +139,7 @@ const shouldRenderSearch = config.pagefind || config.components.Search !== '@ast
 			align-items: center;
 		}
 
-		@media (min-width: 50rem) {
+		@media (min-width: 90rem) {
 			:global(:root[data-has-sidebar]) {
 				--__sidebar-pad: calc(2 * var(--sl-nav-pad-x));
 			}
@@ -96,9 +158,9 @@ const shouldRenderSearch = config.pagefind || config.components.Search !== '@ast
 				display: grid;
 				grid-template-columns:
 					/* 1 (site title) */
-					auto
+					minmax(0, 1fr)
 					/* 2 (mega-menu nav) */
-					1fr
+					auto
 					/* 3 (search box) */
 					auto
 					/* 4 (right items) */

package/config.ts

@@ -20,15 +20,7 @@ import starlightScrollToTop from 'starlight-scroll-to-top';
 import starlightVideosPlugin from 'starlight-videos';
 import f5xcDocsTheme from './index.ts';
 import { defaultLocale as f5xcDefaultLocale, f5xcDefaultLocales } from './src/i18n/locales.ts';
-import {
-  categoryTitles,
-  footerDescriptions,
-  footerLabels,
-  itemDescriptions,
-  itemLabels,
-  menuLabels,
-  mobileLabels,
-} from './src/i18n/mega-menu-translations.ts';
+import { mobileLabels } from './src/i18n/mega-menu-translations.ts';
 import { sidebarTranslations } from './src/i18n/translations.ts';
 import remarkMermaid from './src/plugins/remark-mermaid.mjs';
 import canonicalLlms from './src/utils/canonical-llms.mjs';
@@ -37,6 +29,7 @@ import { menuLocalizationPolicy } from './src/utils/menu-localization.ts';
 import { stagedProviderSections } from './src/utils/provider-sections.ts';
 import { publicationSidebar, repositoryPublicationProfile } from './src/utils/publication-profiles.ts';
 import { resolveMegaMenuIcon } from './src/utils/resolve-icon.ts';
+import { federatedSearchSites } from './src/utils/search-sites';
 import providerSharedAssets from './src/utils/share-provider-assets.mjs';
 import { statisticsScriptMarkdown } from './src/utils/statistics-script-markdown.mjs';
 import { buildSubcategorySidebar } from './src/utils/subcategory-sidebar.ts';
@@ -133,130 +126,79 @@ export interface F5xcDocsConfigOptions {
   };
 }
 
-const developerAutomationTranslations = Object.fromEntries(
-  Object.entries(categoryTitles.Automation).map(([locale, automation]) => [
-    locale,
-    `${categoryTitles['Developer Tools'][locale]} / ${automation}`,
-  ]),
-);
-
-const xcshActionDescriptionTranslations = Object.fromEntries(
-  Object.entries(categoryTitles.Automation).map(([locale, automation]) => [locale, `F5 XC — ${automation}`]),
-);
-
 export const defaultMegaMenuItems: MegaMenuItem[] = [
   {
-    label: 'Security',
-    translations: menuLabels.Security,
+    label: 'Demos',
     content: {
       layout: 'grid',
       columns: 2,
       categories: [
         {
-          title: 'App & API Security',
-          translations: categoryTitles['App & API Security'],
+          title: 'Security',
           items: [
             {
               label: 'Web App & API Protection',
-              description: 'Web application and API protection demonstrations',
-              href: 'https://f5-sales-demo.github.io/webapp-api-protection/',
+              description: 'Deploy an application security demo with Terraform and follow its protection walkthroughs.',
+              href: 'https://f5-sales-demo.github.io/webapp-api-protection/en/',
               icon: resolveMegaMenuIcon('f5xc:web-app-and-api-protection'),
             },
             {
-              label: 'API Security',
-              translations: itemLabels['API Security'],
-              description: 'API discovery and protection',
-              descriptionTranslations: itemDescriptions['API discovery and protection'],
-              href: 'https://f5-sales-demo.github.io/api-protection/',
+              label: 'API Protection',
+              description: 'Find guides to API discovery, schema validation, and request controls.',
+              href: 'https://f5-sales-demo.github.io/api-protection/en/',
               icon: resolveMegaMenuIcon('f5xc:application-traffic-insight'),
             },
             {
-              label: 'Client-Side Defense',
-              translations: itemLabels['Client-Side Defense'],
-              description: 'Browser-based threat protection',
-              descriptionTranslations: itemDescriptions['Browser-based threat protection'],
-              href: 'https://f5-sales-demo.github.io/csd/',
-              icon: resolveMegaMenuIcon('f5xc:client-side-defense'),
+              label: 'Bot Defense Advanced',
+              description: 'Review behavioral bot detection and mitigation scenarios.',
+              href: 'https://f5-sales-demo.github.io/bot-advanced/en/',
+              icon: resolveMegaMenuIcon('f5xc:bot-defense'),
             },
             {
-              label: 'Custom Responses',
-              description: 'Terraform response customization showcase',
-              href: 'https://f5-sales-demo.github.io/custom-responses/',
-              icon: resolveMegaMenuIcon('f5xc:web-app-and-api-protection'),
+              label: 'Bot Defense Standard',
+              description: 'Review bot classification, verified crawlers, and blocking policies.',
+              href: 'https://f5-sales-demo.github.io/bot-standard/en/',
+              icon: resolveMegaMenuIcon('f5xc:bot-defense'),
             },
             {
-              label: 'Web App Scanning',
-              translations: itemLabels['Web App Scanning'],
-              description: 'Vulnerability assessment and scanning',
-              descriptionTranslations: itemDescriptions['Vulnerability assessment and scanning'],
-              href: 'https://f5-sales-demo.github.io/was/',
-              icon: resolveMegaMenuIcon('f5xc:web-app-scanning'),
+              label: 'Client-Side Defense',
+              description: 'Deploy browser script monitoring with an API or Terraform workflow.',
+              href: 'https://f5-sales-demo.github.io/csd/en/',
+              icon: resolveMegaMenuIcon('f5xc:client-side-defense'),
             },
-          ],
-        },
-        {
-          title: 'Threat Defense',
-          translations: categoryTitles['Threat Defense'],
-          items: [
             {
-              label: 'Bot Defense Advanced',
-              translations: itemLabels['Bot Defense Advanced'],
-              description: 'Behavioral analysis and AI detection',
-              descriptionTranslations: itemDescriptions['Behavioral analysis and AI detection'],
-              href: 'https://f5-sales-demo.github.io/bot-advanced/',
-              icon: resolveMegaMenuIcon('f5xc:bot-defense'),
+              label: 'DDoS Mitigation',
+              description: 'Review distributed denial-of-service defenses and demo scenarios.',
+              href: 'https://f5-sales-demo.github.io/ddos/en/',
+              icon: resolveMegaMenuIcon('f5xc:ddos-and-transit-services'),
             },
             {
-              label: 'Bot Defense Standard',
-              translations: itemLabels['Bot Defense Standard'],
-              description: 'Signature-based bot detection',
-              descriptionTranslations: itemDescriptions['Signature-based bot detection'],
-              href: 'https://f5-sales-demo.github.io/bot-standard/',
-              icon: resolveMegaMenuIcon('f5xc:bot-defense'),
+              label: 'Web App Scanning',
+              description: 'Find web application vulnerability scanning guides.',
+              href: 'https://f5-sales-demo.github.io/was/en/',
+              icon: resolveMegaMenuIcon('f5xc:web-app-scanning'),
             },
             {
-              label: 'DDoS Protection',
-              translations: itemLabels['DDoS Protection'],
-              description: 'Distributed denial-of-service mitigation',
-              descriptionTranslations: itemDescriptions['Distributed denial-of-service mitigation'],
-              href: 'https://f5-sales-demo.github.io/ddos/',
-              icon: resolveMegaMenuIcon('f5xc:ddos-and-transit-services'),
+              label: 'Custom responses',
+              description: 'Configure application replies, redirects, and security response pages.',
+              href: 'https://f5-sales-demo.github.io/custom-responses/en/',
+              icon: resolveMegaMenuIcon('f5xc:web-app-and-api-protection'),
             },
           ],
         },
-      ],
-      footer: {
-        label: 'F5 Distributed Cloud Console',
-        translations: footerLabels['F5 Distributed Cloud Console'],
-        href: 'https://console.ves.volterra.io',
-        description: 'Open the XC management portal',
-        descriptionTranslations: footerDescriptions['Open the XC management portal'],
-      },
-    },
-  },
-  {
-    label: 'Networking',
-    translations: menuLabels.Networking,
-    content: {
-      layout: 'grid',
-      columns: 2,
-      categories: [
         {
-          title: 'Connectivity & Delivery',
-          translations: categoryTitles['Connectivity & Delivery'],
+          title: 'Networking and performance',
           items: [
             {
               label: 'Multi-Cloud Networking',
-              translations: itemLabels['Multi-Cloud Networking'],
-              description: 'Site connectivity across clouds',
-              descriptionTranslations: itemDescriptions['Site connectivity across clouds'],
-              href: 'https://f5-sales-demo.github.io/multi-cloud-networking/',
+              description: 'Find site deployment and cross-cloud connectivity guides.',
+              href: 'https://f5-sales-demo.github.io/multi-cloud-networking/en/',
               icon: resolveMegaMenuIcon('f5xc:multi-cloud-network-connect'),
             },
             {
-              label: 'Canada Topology',
-              description: 'Canadian hosting and regional access control',
-              href: 'https://f5-sales-demo.github.io/canada/',
+              label: 'Canada topology',
+              description: 'Deploy Canadian application hosting and demonstrate regional access controls.',
+              href: 'https://f5-sales-demo.github.io/canada/en/',
               icon: {
                 body: fs
                   .readFileSync(new URL('./assets/canada-flag.svg', import.meta.url), 'utf8')
@@ -267,223 +209,180 @@ export const defaultMegaMenuItems: MegaMenuItem[] = [
               },
             },
             {
-              label: 'Content Delivery',
-              translations: itemLabels['Content Delivery'],
-              description: 'Edge caching and distribution',
-              descriptionTranslations: itemDescriptions['Edge caching and distribution'],
-              href: 'https://f5-sales-demo.github.io/cdn/',
+              label: 'Content Delivery Network',
+              description: 'Review content delivery network (CDN) caching and origin configuration.',
+              href: 'https://f5-sales-demo.github.io/cdn/en/',
               icon: resolveMegaMenuIcon('f5xc:content-delivery-network'),
             },
             {
-              label: 'DNS Load Balancing',
-              translations: itemLabels['DNS Load Balancing'],
-              description: 'DNS management and zones',
-              descriptionTranslations: itemDescriptions['DNS management and zones'],
-              href: 'https://f5-sales-demo.github.io/dns/',
+              label: 'DNS Management',
+              description: 'Find Domain Name System (DNS) zone and load balancing guides.',
+              href: 'https://f5-sales-demo.github.io/dns/en/',
               icon: resolveMegaMenuIcon('f5xc:dns-management'),
             },
             {
-              label: 'NGINX Management',
-              translations: itemLabels['NGINX Management'],
-              description: 'NGINX integration and configuration',
-              descriptionTranslations: itemDescriptions['NGINX integration and configuration'],
-              href: 'https://f5-sales-demo.github.io/nginx/',
+              label: 'NGINX One',
+              description: 'Review NGINX instance visibility and configuration management.',
+              href: 'https://f5-sales-demo.github.io/nginx/en/',
               icon: resolveMegaMenuIcon('f5xc:nginx-one'),
             },
           ],
         },
+      ],
+      footer: {
+        label: 'Demo catalog',
+        href: 'https://f5-sales-demo.github.io/en/demos/',
+        description: 'All demonstration and capability guides',
+      },
+    },
+  },
+  {
+    label: 'Demo environment',
+    content: {
+      layout: 'list',
+      categories: [
         {
-          title: 'Manage & Monitor',
-          translations: categoryTitles['Manage & Monitor'],
+          title: 'Deployment resources',
           items: [
             {
-              label: 'Observability',
-              translations: itemLabels.Observability,
-              description: 'Monitoring, metrics, and insights',
-              descriptionTranslations: itemDescriptions['Monitoring, metrics, and insights'],
-              href: 'https://f5-sales-demo.github.io/observability/',
-              icon: resolveMegaMenuIcon('f5xc:observability'),
+              label: 'Origin server',
+              description: 'Compare the Azure full-origin stack with the separate AWS Juice Shop deployment.',
+              href: 'https://f5-sales-demo.github.io/origin-server/en/',
+              icon: resolveMegaMenuIcon('f5xc:distributed-apps'),
             },
             {
-              label: 'Statistics',
-              description: 'API metrics, access logs, and security events',
-              href: 'https://f5-sales-demo.github.io/statistics/en/',
-              icon: resolveMegaMenuIcon('f5xc:data-intelligence'),
+              label: 'Traffic generator',
+              description:
+                'Choose Azure or AWS deployment guides for controlled security traffic and browser scenarios.',
+              href: 'https://f5-sales-demo.github.io/traffic-generator/en/',
+              icon: resolveMegaMenuIcon('f5xc:application-traffic-insight'),
             },
             {
-              label: 'Administration',
-              translations: itemLabels.Administration,
-              description: 'Tenant management and RBAC',
-              descriptionTranslations: itemDescriptions['Tenant management and RBAC'],
-              href: 'https://f5-sales-demo.github.io/administration/',
-              icon: resolveMegaMenuIcon('f5xc:administration'),
+              label: 'CDN simulator',
+              description: 'Deploy an Azure proxy that adds CDN headers to origin requests.',
+              href: 'https://f5-sales-demo.github.io/cdn-simulator/en/',
+              icon: resolveMegaMenuIcon('f5xc:content-delivery-network'),
             },
           ],
         },
       ],
       footer: {
-        label: 'F5 Cloud Documentation',
-        translations: footerLabels['F5 Cloud Documentation'],
-        href: 'https://docs.cloud.f5.com',
-        description: 'Official product documentation',
-        descriptionTranslations: footerDescriptions['Official product documentation'],
+        label: 'Demo resource catalog',
+        href: 'https://f5-sales-demo.github.io/demo-resources/en/',
+        description: 'Azure and AWS offerings vary by component',
       },
     },
   },
   {
-    label: 'Platform',
-    translations: menuLabels.Platform,
+    label: 'Operations',
     content: {
       layout: 'list',
       categories: [
         {
-          title: 'Documentation Tools',
-          translations: categoryTitles['Documentation Tools'],
+          title: 'Queries and administration',
           items: [
             {
-              label: 'F5 XC Docs',
-              description: 'Organization documentation portal',
-              href: 'https://f5-sales-demo.github.io/',
-              icon: resolveMegaMenuIcon('f5xc:doc'),
-            },
-            {
-              label: 'Docs Builder',
-              translations: itemLabels['Docs Builder'],
-              description: 'Containerized Astro build system',
-              descriptionTranslations: itemDescriptions['Containerized Astro build system'],
-              href: 'https://f5-sales-demo.github.io/docs-builder/',
-              icon: resolveMegaMenuIcon('f5xc:doc'),
-            },
-            {
-              label: 'F5 Docs Corpus',
-              translations: itemLabels['F5 Docs Corpus'],
-              description: 'Machine-readable F5 product documentation',
-              descriptionTranslations: itemDescriptions['Machine-readable F5 product documentation'],
-              href: 'https://f5-sales-demo.github.io/html-to-markdown/',
+              label: 'Statistics',
+              description: 'Query access logs, application metrics, and security telemetry through the API.',
+              href: 'https://f5-sales-demo.github.io/statistics/en/',
               icon: resolveMegaMenuIcon('f5xc:doc'),
             },
             {
-              label: 'Docs Theme',
-              translations: itemLabels['Docs Theme'],
-              description: 'Shared branding and styling',
-              descriptionTranslations: itemDescriptions['Shared branding and styling'],
-              href: 'https://f5-sales-demo.github.io/docs-theme/',
-              icon: resolveMegaMenuIcon('f5xc:shared-configuration'),
+              label: 'Observability',
+              description: 'Find monitoring, metrics, tracing, and alerting guides.',
+              href: 'https://f5-sales-demo.github.io/observability/en/',
+              icon: resolveMegaMenuIcon('f5xc:observability'),
             },
             {
-              label: 'Icon Packages',
-              translations: itemLabels['Icon Packages'],
-              description: 'NPM icon component library',
-              descriptionTranslations: itemDescriptions['NPM icon component library'],
-              href: 'https://f5-sales-demo.github.io/docs-icons/',
-              icon: resolveMegaMenuIcon('f5xc:distributed-apps'),
+              label: 'Administration',
+              description: 'Find tenant, namespace, and role management guides.',
+              href: 'https://f5-sales-demo.github.io/administration/en/',
+              icon: resolveMegaMenuIcon('f5xc:administration'),
             },
           ],
         },
+      ],
+    },
+  },
+  {
+    label: 'Developer tools',
+    content: {
+      layout: 'grid',
+      columns: 2,
+      categories: [
         {
-          title: 'Developer Automation',
-          translations: developerAutomationTranslations,
+          title: 'Tools and automation',
           items: [
             {
-              label: 'Terraform Provider',
-              translations: itemLabels['Terraform Provider'],
-              description: 'F5 XC Terraform provider',
-              descriptionTranslations: itemDescriptions['F5 XC Terraform provider'],
-              href: 'https://f5-sales-demo.github.io/terraform-provider-xcsh/',
-              icon: resolveMegaMenuIcon('hashicorp-flight:terraform-color'),
-            },
-            {
-              label: 'API Specs',
-              translations: itemLabels['API Specs'],
-              description: 'OpenAPI spec validation and reconciliation',
-              descriptionTranslations: itemDescriptions['OpenAPI spec validation and reconciliation'],
-              href: 'https://f5-sales-demo.github.io/api-specs/',
-              icon: resolveMegaMenuIcon('f5xc:data-intelligence'),
+              label: 'xcsh',
+              description:
+                'Install the independent terminal assistant for engineering and F5 Distributed Cloud workflows.',
+              href: 'https://f5-sales-demo.github.io/xcsh/en/',
+              icon: resolveMegaMenuIcon('carbon:terminal'),
             },
             {
-              label: 'API Specs Enriched',
-              translations: itemLabels['API Specs Enriched'],
-              description: 'Enriched OpenAPI specifications',
-              descriptionTranslations: itemDescriptions['Enriched OpenAPI specifications'],
-              href: 'https://f5-sales-demo.github.io/api-specs-enriched/',
-              icon: resolveMegaMenuIcon('f5xc:data-intelligence'),
+              label: 'Terraform provider',
+              description: 'Configure F5 Distributed Cloud resources with Terraform.',
+              href: 'https://f5-sales-demo.github.io/terraform-provider-xcsh/',
+              icon: resolveMegaMenuIcon('f5xc:doc'),
             },
             {
-              label: 'xcsh Manifest Automation',
-              description: 'Deterministic F5 XC manifest operations in GitHub Actions',
-              descriptionTranslations: xcshActionDescriptionTranslations,
-              href: 'https://f5-sales-demo.github.io/xcsh-action/',
+              label: 'xcsh GitHub Action',
+              description: 'Run pinned xcsh manifest operations in GitHub Actions.',
+              href: 'https://f5-sales-demo.github.io/xcsh-action/en/',
               icon: resolveMegaMenuIcon('carbon:workflow-automation'),
             },
             {
-              label: 'VS Code Extension',
-              translations: itemLabels['VS Code Extension'],
-              description: 'Manage F5 XC resources from VS Code',
-              descriptionTranslations: itemDescriptions['Manage F5 XC resources from VS Code'],
-              href: 'https://f5-sales-demo.github.io/vscode-xcsh/',
+              label: 'VS Code extension',
+              description: 'Author manifests and manage F5 Distributed Cloud resources in Visual Studio Code.',
+              href: 'https://f5-sales-demo.github.io/vscode-xcsh/en/',
               icon: resolveMegaMenuIcon('carbon:code'),
             },
             {
-              label: 'xcsh CLI',
-              translations: itemLabels['xcsh CLI'],
-              description: 'AI-powered CLI for F5 XC',
-              descriptionTranslations: itemDescriptions['AI-powered CLI for F5 XC'],
-              href: 'https://f5-sales-demo.github.io/xcsh/',
-              icon: resolveMegaMenuIcon('carbon:terminal'),
+              label: 'xcsh Chrome extension',
+              description: 'Connect xcsh to the F5 Distributed Cloud console through a local browser bridge.',
+              href: 'https://f5-sales-demo.github.io/xcsh-chrome-extension/en/',
+              icon: resolveMegaMenuIcon('carbon:application-web'),
             },
             {
-              label: 'xcsh Chrome Extension',
-              translations: itemLabels['xcsh Chrome Extension'],
-              description: 'Drive the F5 XC console with xcsh',
-              descriptionTranslations: itemDescriptions['Drive the F5 XC console with xcsh'],
-              href: 'https://f5-sales-demo.github.io/xcsh-chrome-extension/',
-              icon: resolveMegaMenuIcon('carbon:application-web'),
+              label: 'APT repository',
+              description: 'Install signed Debian and Ubuntu packages for xcsh and supporting tools.',
+              href: 'https://f5-sales-demo.github.io/apt-repo/en/',
+              icon: resolveMegaMenuIcon('f5xc:doc'),
             },
           ],
         },
-      ],
-      footer: {
-        label: 'GitHub Organization',
-        translations: footerLabels['GitHub Organization'],
-        href: 'https://github.com/f5-sales-demo',
-        description: 'View all repositories',
-        descriptionTranslations: footerDescriptions['View all repositories'],
-      },
-    },
-  },
-  {
-    label: 'AI',
-    translations: menuLabels.AI,
-    content: {
-      layout: 'list',
-      categories: [
         {
-          title: 'AI Tools',
-          translations: categoryTitles['AI Tools'],
+          title: 'Specifications and plugins',
           items: [
             {
-              label: 'Marketplace',
-              translations: itemLabels.Marketplace,
-              description: 'AI-powered marketplace for F5 XC',
-              descriptionTranslations: itemDescriptions['AI-powered marketplace for F5 XC'],
-              href: 'https://f5-sales-demo.github.io/marketplace/',
-              icon: resolveMegaMenuIcon('f5xc:ai_assistant_logo'),
+              label: 'API specifications',
+              description: 'Find validated OpenAPI specifications and the specification update pipeline.',
+              href: 'https://f5-sales-demo.github.io/api-specs/en/',
+              icon: resolveMegaMenuIcon('f5xc:data-intelligence'),
             },
             {
-              label: 'xcsh',
-              translations: itemLabels.xcsh,
-              description: 'AI-powered development CLI with persistent sessions and native Rust tooling',
-              descriptionTranslations:
-                itemDescriptions['AI-powered development CLI with persistent sessions and native Rust tooling'],
-              href: 'https://f5-sales-demo.github.io/xcsh/',
+              label: 'Enriched API specifications',
+              description: 'Browse OpenAPI schemas with additional constraints and examples.',
+              href: 'https://f5-sales-demo.github.io/api-specs-enriched/en/',
+              icon: resolveMegaMenuIcon('f5xc:data-intelligence'),
+            },
+            {
+              label: 'xcsh marketplace',
+              description: 'Find xcsh plugins for documentation, sales, cloud, security, and desktop work.',
+              href: 'https://f5-sales-demo.github.io/marketplace/en/',
               icon: resolveMegaMenuIcon('f5xc:ai_assistant_logo'),
             },
             {
-              label: 'Console Catalog',
-              translations: itemLabels['Console Catalog'],
-              description: 'AI-driven browser automation for F5 XC UI',
-              descriptionTranslations: itemDescriptions['AI-driven browser automation for F5 XC UI'],
-              href: 'https://f5-sales-demo.github.io/console/',
+              label: 'Marketplace for Claude Code',
+              description: 'Find Language Server Protocol integrations and developer tools for Claude Code.',
+              href: 'https://f5-sales-demo.github.io/marketplace-claude-code/en/',
+              icon: resolveMegaMenuIcon('f5xc:doc'),
+            },
+            {
+              label: 'Console catalog',
+              description: 'Browse documented console routes and browser automation workflows.',
+              href: 'https://f5-sales-demo.github.io/console/en/',
               icon: resolveMegaMenuIcon('f5xc:ai_assistant_logo'),
             },
           ],
@@ -492,82 +391,58 @@ export const defaultMegaMenuItems: MegaMenuItem[] = [
     },
   },
   {
-    label: 'Demo Resources',
-    translations: menuLabels['Demo Resources'],
+    label: 'Ecosystem',
     content: {
       layout: 'list',
       categories: [
         {
-          title: 'Components',
-          translations: categoryTitles.Components,
+          title: 'Public projects',
           items: [
             {
-              label: 'Origin Server',
-              translations: itemLabels['Origin Server'],
-              description: 'Vulnerable web applications for WAF and API testing',
-              descriptionTranslations: itemDescriptions['Vulnerable web applications for WAF and API testing'],
-              href: 'https://f5-sales-demo.github.io/origin-server/',
-              icon: resolveMegaMenuIcon('f5xc:distributed-apps'),
-            },
-            {
-              label: 'Traffic Generator',
-              translations: itemLabels['Traffic Generator'],
-              description: 'Security tools and attack suites for traffic generation',
-              descriptionTranslations: itemDescriptions['Security tools and attack suites for traffic generation'],
-              href: 'https://f5-sales-demo.github.io/traffic-generator/',
-              icon: resolveMegaMenuIcon('f5xc:application-traffic-insight'),
+              label: 'F5 documentation corpus',
+              description: 'Browse curated F5 documentation and its Markdown sources.',
+              href: 'https://f5-sales-demo.github.io/html-to-markdown/',
+              icon: resolveMegaMenuIcon('f5xc:doc'),
             },
             {
-              label: 'CDN Simulator',
-              translations: itemLabels['CDN Simulator'],
-              description: 'NGINX-based CDN edge node simulator',
-              descriptionTranslations: itemDescriptions['NGINX-based CDN edge node simulator'],
-              href: 'https://f5-sales-demo.github.io/cdn-simulator/',
-              icon: resolveMegaMenuIcon('f5xc:content-delivery-network'),
+              label: 'Ecosystem directory',
+              description: 'Documentation, tools, and public project sources',
+              href: 'https://f5-sales-demo.github.io/en/ecosystem/',
+              icon: resolveMegaMenuIcon('f5xc:doc'),
             },
           ],
         },
       ],
       footer: {
-        label: 'View All Components',
-        translations: footerLabels['View All Components'],
-        href: 'https://f5-sales-demo.github.io/demo-resources/',
-        description: 'Browse the full demo resource catalog',
-        descriptionTranslations: footerDescriptions['Browse the full demo resource catalog'],
+        label: 'Project sources',
+        href: 'https://github.com/f5-sales-demo',
+        description: 'Public repositories in the community organization',
       },
     },
   },
   {
-    label: 'Resources',
-    translations: menuLabels.Resources,
+    label: 'F5 services',
     content: {
       layout: 'list',
       categories: [
         {
-          title: 'F5 Ecosystem',
-          translations: categoryTitles['F5 Ecosystem'],
+          title: 'Official documentation and services',
           items: [
             {
-              label: 'F5 XC Console',
-              translations: itemLabels['F5 XC Console'],
-              description: 'Distributed Cloud management portal',
-              descriptionTranslations: itemDescriptions['Distributed Cloud management portal'],
+              label: 'F5 Distributed Cloud console',
+              description: 'Management service; sign-in required',
               href: 'https://console.ves.volterra.io',
               icon: resolveMegaMenuIcon('f5xc:platform'),
             },
             {
-              label: 'F5 Cloud Docs',
-              translations: itemLabels['F5 Cloud Docs'],
-              description: 'Official product documentation',
-              descriptionTranslations: itemDescriptions['Official product documentation'],
+              label: 'F5 Distributed Cloud documentation',
+              description: 'Official public product documentation',
               href: 'https://docs.cloud.f5.com',
               icon: resolveMegaMenuIcon('f5xc:doc'),
             },
             {
-              label: 'MyF5 Support',
-              translations: itemLabels['MyF5 Support'],
-              description: 'Technical support portal',
-              descriptionTranslations: itemDescriptions['Technical support portal'],
+              label: 'MyF5 support',
+              description: 'Support portal; sign-in required for account services',
               href: 'https://my.f5.com/manage/s/',
               icon: resolveMegaMenuIcon('f5xc:support'),
             },
@@ -630,38 +505,7 @@ export function federatedSearchBundlePaths(site: string, base: string): string[]
     );
 }
 
-export const federatedSearchSites = [
-  { repo: 'docs-builder', label: 'Docs Builder' },
-  { repo: 'docs-theme', label: 'Docs Theme' },
-  { repo: 'f5-sales-demo.github.io', label: 'F5 XC Docs' },
-  { repo: 'administration', label: 'Administration' },
-  { repo: 'nginx', label: 'NGINX' },
-  { repo: 'observability', label: 'Observability' },
-  { repo: 'statistics', label: 'Statistics' },
-  { repo: 'was', label: 'Web App Scanning' },
-  { repo: 'multi-cloud-networking', label: 'Multi-Cloud Networking' },
-  { repo: 'canada', label: 'Canada Topology' },
-  { repo: 'dns', label: 'DNS' },
-  { repo: 'cdn', label: 'CDN' },
-  { repo: 'bot-standard', label: 'Bot Standard' },
-  { repo: 'bot-advanced', label: 'Bot Advanced' },
-  { repo: 'ddos', label: 'DDoS' },
-  { repo: 'webapp-api-protection', label: 'Web App & API Protection' },
-  { repo: 'api-protection', label: 'API Security' },
-  { repo: 'xcsh', label: 'xcsh' },
-  { repo: 'xcsh-action', label: 'xcsh Manifest Automation' },
-  { repo: 'csd', label: 'Client-Side Defense' },
-  { repo: 'docs-icons', label: 'Docs Icons' },
-  { repo: 'marketplace', label: 'Marketplace' },
-  { repo: 'api-specs', label: 'API Specs' },
-  { repo: 'api-specs-enriched', label: 'API Specs Enriched' },
-  { repo: 'cdn-simulator', label: 'CDN Simulator' },
-  { repo: 'origin-server', label: 'Origin Server' },
-  { repo: 'traffic-generator', label: 'Traffic Generator' },
-  { repo: 'demo-resources', label: 'Demo Resources' },
-  { repo: 'xcsh-chrome-extension', label: 'xcsh Chrome Extension' },
-  { repo: 'console', label: 'Console Catalog' },
-];
+export { federatedSearchSites } from './src/utils/search-sites';
 
 export function createF5xcDocsConfig(options: F5xcDocsConfigOptions = {}) {
   const canonicalProvider =
@@ -729,7 +573,9 @@ export function createF5xcDocsConfig(options: F5xcDocsConfigOptions = {}) {
     (canonicalProvider
       ? [...defaultMegaMenuItems, ...providerMegaMenu(base, stagedProviderSections(canonicalProvider.manifest))]
       : defaultMegaMenuItems);
-  const head = options.head || (canonicalProvider ? [] : defaultHead);
+  const head =
+    options.head ||
+    (canonicalProvider || githubRepository === 'f5-sales-demo/f5-sales-demo.github.io' ? [] : defaultHead);
   const logo = options.logo || { src: '@f5-sales-demo/docs-theme/assets/f5-distributed-cloud.svg' };
   const additionalRemarkPlugins = options.additionalRemarkPlugins || [];
   const additionalIntegrations = options.additionalIntegrations || [];

package/index.ts

@@ -25,6 +25,7 @@ export default function f5xcDocsTheme(repository = process.env.GITHUB_REPOSITORY
           components: {
             ...config.components,
             Header: '@f5-sales-demo/docs-theme/components/SharedHeader.astro',
+            Head: '@f5-sales-demo/docs-theme/components/Head.astro',
             ...(process.env.DOCS_PROFILE === 'canonical-provider'
               ? {
                   Sidebar: '@f5-sales-demo/docs-theme/components/ProviderSidebar.astro',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@f5-sales-demo/docs-theme",
-  "version": "4.11.5",
+  "version": "4.11.7",
   "description": "F5 Distributed Cloud branded Starlight documentation theme",
   "type": "module",
   "engines": {
@@ -46,6 +46,7 @@
     "./components/CanadaSidebar.astro": "./components/CanadaSidebar.astro",
     "./components/ProviderHeader.astro": "./components/ProviderHeader.astro",
     "./components/SharedHeader.astro": "./components/SharedHeader.astro",
+    "./components/Head.astro": "./components/Head.astro",
     "./assets/canada-flag.svg": "./assets/canada-flag.svg",
     "./assets/canada-favicon.svg": "./assets/canada-favicon.svg"
   },

package/src/utils/localize-ecosystem-href.ts

@@ -29,6 +29,10 @@ export function localizeEcosystemHref(
   const segments = url.pathname.split('/').filter(Boolean);
   if (segments.length === 0) return href;
 
+  // Organization-root routes begin with a locale, not a project slug.
+  // Explicit catalog locale links must never become /en/fr/demos/.
+  if (VALID_SLUGS.has(segments[0])) return href;
+
   if (NON_LOCALIZED_ECOSYSTEM_SLUGS.has(segments[0])) return href;
 
   if (segments.length >= 2 && VALID_SLUGS.has(segments[1])) {

package/src/utils/page-title.test.ts

@@ -0,0 +1,7 @@
+import { expect, it } from 'vitest';
+import { pageTitle } from './page-title';
+
+it('omits a duplicate site suffix while retaining distinct page titles', () => {
+  expect(pageTitle('Sales demos', 'Sales demos', 'Sales demos | Sales demos')).toBe('Sales demos');
+  expect(pageTitle('Demo catalog', 'Sales demos', 'Demo catalog | Sales demos')).toBe('Demo catalog | Sales demos');
+});

package/src/utils/page-title.ts

@@ -0,0 +1,4 @@
+/** Keep the framework title format except when its site suffix repeats the page. */
+export function pageTitle(title: string, siteTitle: string, formattedTitle: string): string {
+  return title === siteTitle ? title : formattedTitle;
+}

package/src/utils/search-sites.ts

@@ -0,0 +1,32 @@
+export const federatedSearchSites = [
+  { repo: 'docs-builder', label: 'Documentation builder' },
+  { repo: 'docs-theme', label: 'Shared documentation theme' },
+  { repo: 'f5-sales-demo.github.io', label: 'Sales demo portal' },
+  { repo: 'administration', label: 'Administration' },
+  { repo: 'nginx', label: 'NGINX One' },
+  { repo: 'observability', label: 'Observability' },
+  { repo: 'statistics', label: 'Statistics' },
+  { repo: 'was', label: 'Web App Scanning' },
+  { repo: 'multi-cloud-networking', label: 'Multi-Cloud Networking' },
+  { repo: 'canada', label: 'Canada topology' },
+  { repo: 'dns', label: 'DNS Management' },
+  { repo: 'cdn', label: 'Content Delivery Network' },
+  { repo: 'bot-standard', label: 'Bot Defense Standard' },
+  { repo: 'bot-advanced', label: 'Bot Defense Advanced' },
+  { repo: 'ddos', label: 'DDoS Mitigation' },
+  { repo: 'webapp-api-protection', label: 'Web App & API Protection' },
+  { repo: 'api-protection', label: 'API Protection' },
+  { repo: 'xcsh', label: 'xcsh' },
+  { repo: 'xcsh-action', label: 'xcsh GitHub Action' },
+  { repo: 'csd', label: 'Client-Side Defense' },
+  { repo: 'docs-icons', label: 'Icon packages' },
+  { repo: 'marketplace', label: 'xcsh marketplace' },
+  { repo: 'api-specs', label: 'API specifications' },
+  { repo: 'api-specs-enriched', label: 'Enriched API specifications' },
+  { repo: 'cdn-simulator', label: 'CDN simulator' },
+  { repo: 'origin-server', label: 'Origin server' },
+  { repo: 'traffic-generator', label: 'Traffic generator' },
+  { repo: 'demo-resources', label: 'Demo resource catalog' },
+  { repo: 'xcsh-chrome-extension', label: 'xcsh Chrome extension' },
+  { repo: 'console', label: 'Console catalog' },
+];

package/src/utils/search-source.test.ts

@@ -0,0 +1,9 @@
+import { expect, it } from 'vitest';
+import { searchSource } from './search-source';
+
+it('identifies the source project of federated results and root catalog pages', () => {
+  const sources = [{ repo: 'origin-server', label: 'Origin server' }];
+  expect(searchSource('https://f5-sales-demo.github.io/origin-server/en/03-deploy/', sources)).toBe('Origin server');
+  expect(searchSource('https://f5-sales-demo.github.io/en/demos/', sources)).toBe('Sales demo portal');
+  expect(searchSource('https://example.com/docs/', sources)).toBeUndefined();
+});

package/src/utils/search-source.ts

@@ -0,0 +1,11 @@
+export function searchSource(href: string, sources: Array<{ repo: string; label: string }>): string | undefined {
+  let url: URL;
+  try {
+    url = new URL(href);
+  } catch {
+    return undefined;
+  }
+  if (url.hostname !== 'f5-sales-demo.github.io') return undefined;
+  const project = url.pathname.split('/').filter(Boolean)[0];
+  return sources.find((source) => source.repo === project)?.label ?? 'Sales demo portal';
+}

package/src/utils/showcase-navigation.test.ts

@@ -0,0 +1,34 @@
+import { describe, expect, it } from 'vitest';
+import { defaultMegaMenuItems } from '../../config';
+import { localizeEcosystemHref } from './localize-ecosystem-href';
+
+describe('showcase navigation', () => {
+  it('uses the audience taxonomy without duplicate project destinations', () => {
+    expect(defaultMegaMenuItems.map((item) => item.label)).toEqual([
+      'Demos',
+      'Demo environment',
+      'Operations',
+      'Developer tools',
+      'Ecosystem',
+      'F5 services',
+    ]);
+    const links = defaultMegaMenuItems.flatMap((item) => item.content?.categories?.flatMap((c) => c.items) ?? []);
+    const urls = links.map((item) => item.href);
+    expect(new Set(urls).size).toBe(urls.length);
+    expect(urls).not.toContain('https://f5-sales-demo.github.io/');
+    expect(links.find((l) => l.href.includes('/api-protection/'))?.label).toBe('API Protection');
+    expect(links.find((l) => l.href.includes('/ddos/'))?.label).toBe('DDoS Mitigation');
+    expect(defaultMegaMenuItems[1].content?.footer?.label).toBe('Demo resource catalog');
+  });
+
+  it('keeps explicit English catalog destinations valid across locale selection', () => {
+    for (const locale of ['en', 'fr', 'ar']) {
+      expect(localizeEcosystemHref('https://f5-sales-demo.github.io/en/demos/', locale)).toBe(
+        'https://f5-sales-demo.github.io/en/demos/',
+      );
+      expect(localizeEcosystemHref('https://f5-sales-demo.github.io/en/ecosystem/', locale)).toBe(
+        'https://f5-sales-demo.github.io/en/ecosystem/',
+      );
+    }
+  });
+});

package/src/utils/statistics-navigation.test.ts

@@ -4,15 +4,15 @@ import { localizeEcosystemHref } from './localize-ecosystem-href';
 
 describe('Statistics discovery', () => {
   it('lists Statistics beside monitoring tools exactly once', () => {
-    const networking = defaultMegaMenuItems.find((item) => item.label === 'Networking');
-    const category = networking?.content?.categories?.find((item) => item.title === 'Manage & Monitor');
+    const networking = defaultMegaMenuItems.find((item) => item.label === 'Operations');
+    const category = networking?.content?.categories?.find((item) => item.title === 'Queries and administration');
     const statistics = category?.items?.filter((item) => item.label === 'Statistics');
     expect(statistics).toHaveLength(1);
     expect(statistics?.[0]).toMatchObject({
       href: 'https://f5-sales-demo.github.io/statistics/en/',
-      description: 'API metrics, access logs, and security events',
+      description: 'Query access logs, application metrics, and security telemetry through the API.',
     });
-    expect(category?.items?.map((item) => item.label)).toEqual(['Observability', 'Statistics', 'Administration']);
+    expect(category?.items?.map((item) => item.label)).toEqual(['Statistics', 'Observability', 'Administration']);
   });
   it('adds Statistics to federated search and avoids self-index duplication', () => {
     expect(federatedSearchSites.filter((item) => item.repo === 'statistics')).toHaveLength(1);

package/styles/custom.css

@@ -873,3 +873,33 @@ summary:focus-visible {
   }
 }
 
+
+/* The sales showcase prioritizes destinations over decorative hero space. */
+body:has(.sales-showcase) .hero {
+  padding-block: 1rem;
+  grid-template-columns: 1fr;
+  gap: 1rem;
+}
+body:has(.sales-showcase) .hero h1 {
+  font-size: clamp(1.75rem, 5vw, 3rem);
+}
+body:has(.sales-showcase) .hero .tagline {
+  max-width: 48rem;
+  font-size: var(--sl-text-lg);
+}
+body:has(.sales-showcase) .hero > .stack { gap: 1rem; }
+body:has(.sales-showcase) .hero .actions { gap: 0.75rem; }
+.sales-showcase { --showcase-gap: 1rem; }
+.sales-showcase .card-grid { gap: var(--showcase-gap); }
+.sales-showcase .sl-link-card { background: var(--sl-color-gray-7, var(--sl-color-gray-6)); }
+.sales-showcase h2 { margin-block-start: 2rem; }
+.sales-showcase h3 { margin-block-start: 1rem; }
+@media (max-width: 49.99rem) {
+  body:has(.sales-showcase) .hero { padding-block: 0.5rem; }
+  body:has(.sales-showcase) .hero .actions { flex-wrap: wrap; }
+}
+@media (prefers-reduced-motion: reduce) {
+  *, *::before, *::after { scroll-behavior: auto !important; }
+  .sl-link-card, .smm-viewport, .smm-content { transition: none !important; animation: none !important; }
+  .sl-link-card:hover { transform: none; }
+}