first level mobile menu items are bold

src/components/navigation/menu-item/menu-item.scss

@@ -74,6 +74,10 @@
       color: var(--link-blue);
       padding: 14px 12px 14px 20px;
 
+      &.first {
+        @include font-weight($bold);
+      }
+
       &.is-active {
         @include font-weight($semibold);
         color: var(--grayscale-black);

src/components/navigation/menu-item/menu-item.tsx

@@ -176,6 +176,7 @@ export class MenuItem {
                 'is-heading': this.isHeading,
                 'hy-menu-item--mobile': true,
                 'is-demo': this.isDemo,
+                first: this.depth == 1,
               }}
             >
               <span class={'hy-menu-item__label'}>{this.label}</span>