From d5b5943a70dc6163c0095659f55a95cdf9d6a381 Mon Sep 17 00:00:00 2001
From: Louisa Chu <louisa@ensemble.com>
Date: Wed, 25 Mar 2026 16:08:20 -0700
Subject: [PATCH 1/3] update width to max-content

---
 hlx_statics/blocks/header/header.css | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/hlx_statics/blocks/header/header.css b/hlx_statics/blocks/header/header.css
index acc9654a..3530667e 100644
--- a/hlx_statics/blocks/header/header.css
+++ b/hlx_statics/blocks/header/header.css
@@ -325,6 +325,7 @@ header.global-nav-header > ul#navigation-links > li > button.is-open .spectrum-P
     margin-top: -6px;
     margin-left: -1px;
     max-height: 75vh;
+    overflow-x: hidden;
     overflow-y: auto;
   }
 
@@ -346,7 +347,7 @@ header.global-nav-header > ul#navigation-links > li {
 }
 
 header.global-nav-header ul.nav-sub-menu {
-  max-width: 230px;
+  max-width: max-content;
 }
 
 header.global-nav-header li .nav-dropdown-item{

From 1ad2169485babda4d51d7992a46b77554756f57b Mon Sep 17 00:00:00 2001
From: Louisa Chu <louisa@ensemble.com>
Date: Wed, 25 Mar 2026 16:45:53 -0700
Subject: [PATCH 2/3] adding a selector

---
 hlx_statics/blocks/header/header.css | 25 +++++++++++++++++++++++++
 hlx_statics/scripts/lib-adobeio.js   |  8 ++++++++
 2 files changed, 33 insertions(+)

diff --git a/hlx_statics/blocks/header/header.css b/hlx_statics/blocks/header/header.css
index 3530667e..a66fe464 100644
--- a/hlx_statics/blocks/header/header.css
+++ b/hlx_statics/blocks/header/header.css
@@ -350,6 +350,31 @@ header.global-nav-header ul.nav-sub-menu {
   max-width: max-content;
 }
 
+header.global-nav-header .nav-sub-menu .spectrum-Menu-item {
+  position: relative;
+  padding-left: 28px !important;
+}
+
+header.global-nav-header .nav-sub-menu .spectrum-Menu-item.is-selected a {
+  margin-left: 0px;
+}
+
+header.global-nav-header .nav-sub-menu .spectrum-Menu-item a:hover {
+  background-color: rgba(0, 0, 0, .001);
+}
+
+header.global-nav-header .nav-sub-menu .spectrum-Menu-item.is-selected .spectrum-Menu-checkmark {
+  position: absolute;
+  left: 4px;
+  top: 50%;
+  transform: translateY(-50%);
+  display: block;
+  width: 18px !important;
+  height: 18px !important;
+  color: var(--spectrum-global-color-blue-500, #1473e6);
+  fill: currentColor;
+}
+
 header.global-nav-header li .nav-dropdown-item{
   display: flex;
   flex-direction: column;
diff --git a/hlx_statics/scripts/lib-adobeio.js b/hlx_statics/scripts/lib-adobeio.js
index 58a73b29..51fbc8a9 100644
--- a/hlx_statics/scripts/lib-adobeio.js
+++ b/hlx_statics/scripts/lib-adobeio.js
@@ -555,6 +555,14 @@ function activateTab(tabItem, isMainPage) {
   if (tabItem.closest('.nav-dropdown-popover')){
     // if the item is within a dropdown, it needs to find the parent item to be underlined.
     underlineItem = tabItem.closest('.nav-dropdown-popover');
+    const menuItem = tabItem.closest('.spectrum-Menu-item');
+    if (menuItem) {
+      menuItem.classList.add('is-selected');
+      const checkmark = `<svg role="img" class="spectrum-Icon spectrum-UIIcon-Checkmark100 spectrum-Menu-checkmark" aria-hidden="true">
+        <path d="M3.5 9.5a.999.999 0 01-.774-.368l-2.45-3a1 1 0 111.548-1.264l1.657 2.028 4.68-6.01A1 1 0 019.74 2.114l-5.45 7a1 1 0 01-.777.386z" class="spectrum-UIIcon--medium"></path>
+      </svg>`;
+      menuItem.insertAdjacentHTML('afterbegin', checkmark);
+    }
   }
   underlineItem.parentElement.classList.add("activeTab");
 }

From ca61f413a023d1f6bf7e1ee59594ff9cce6b51f3 Mon Sep 17 00:00:00 2001
From: Louisa Chu <louisa@ensemble.com>
Date: Thu, 26 Mar 2026 11:22:15 -0700
Subject: [PATCH 3/3] change the max width of description

---
 hlx_statics/blocks/header/header.css | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/hlx_statics/blocks/header/header.css b/hlx_statics/blocks/header/header.css
index a66fe464..1b1c2f12 100644
--- a/hlx_statics/blocks/header/header.css
+++ b/hlx_statics/blocks/header/header.css
@@ -347,12 +347,12 @@ header.global-nav-header > ul#navigation-links > li {
 }
 
 header.global-nav-header ul.nav-sub-menu {
-  max-width: max-content;
+  width: max-content;
 }
 
 header.global-nav-header .nav-sub-menu .spectrum-Menu-item {
   position: relative;
-  padding-left: 28px !important;
+  padding-left: 24px !important;
 }
 
 header.global-nav-header .nav-sub-menu .spectrum-Menu-item.is-selected a {
@@ -365,7 +365,7 @@ header.global-nav-header .nav-sub-menu .spectrum-Menu-item a:hover {
 
 header.global-nav-header .nav-sub-menu .spectrum-Menu-item.is-selected .spectrum-Menu-checkmark {
   position: absolute;
-  left: 4px;
+  left: 0px;
   top: 50%;
   transform: translateY(-50%);
   display: block;
@@ -375,14 +375,20 @@ header.global-nav-header .nav-sub-menu .spectrum-Menu-item.is-selected .spectrum
   fill: currentColor;
 }
 
-header.global-nav-header li .nav-dropdown-item{
+header.global-nav-header li .nav-dropdown-item {
   display: flex;
   flex-direction: column;
 }
 
+header.global-nav-header li .nav-dropdown-item .nav-dropdown-name {
+  white-space: nowrap;
+}
+
 header.global-nav-header li .nav-dropdown-item .nav-dropdown-description {
   font-size: 12px;
+  max-width: 200px;
   text-wrap: initial;
+
 }
 
 header.global-nav-header a.nav-dropdown-links {