I am trying to create a three tier navigation walker on wordpress, want the submenus to be side by side

Question

This is what I am trying to achieve with a custom walker:

I am trying to get the following layout:

    <nav id="nav-primary" class="mobile-menu">
    <div id="menu-test-menu" class="menu genesis-nav-menu menu-primary js-superfish">
        <div id="menu-item-25937"
            class="menu-item menu-item-type-post_type menu-item-object-page current-menu-ancestor current-menu-parent current_page_parent current_page_ancestor menu-item-has-children menu-item-25937"> //this is the first tier
            <a href="https://example.com/">Products</a>
        </div>
        <div class="sub-menu"> // this is the second tier 
            <div id="menu-item-25932"
                class="menu-item menu-item-type-post_type menu-item-object-page menu-item-25932"><a
                    href="https://example.com/test-page/">phone system overview</a></div>
            <div id="menu-item-25931"
                class="menu-item menu-item-type-post_type menu-item-object-page menu-item-25931"><a
                    href="https://example.com/test-page/">phone system features</a></div>
            <div id="menu-item-26230"
                class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home current-menu-item page_item page-item-25 current_page_item current-menu-ancestor current-menu-parent current_page_parent current_page_ancestor menu-item-26230">
                <a href="https://example.com/" aria-current="page">dedivvery options</a>
            </div>
            <div class="sub-menu"> // this is the third tier
                <div id="menu-item-26234"
                    class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home current-menu-item page_item page-item-25 current_page_item menu-item-26234">
                    <a href="https://example.com/" aria-current="page">CLOUD PHONE SYSTEM</a>
                </div>
                <div id="menu-item-26235"
                    class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home current-menu-item page_item page-item-25 current_page_item menu-item-26235">
                    <a href="https://example.com/" aria-current="page">MANAGED SIP TRUNKING</a>
                </div>
            </div>

        </div>
</nav>

PHP

function register_additional_menu() {


register_nav_menu( 'third-menu' ,__( 'Third Navigation Menu' ));
     
}
add_action( 'init', 'register_additional_menu' );

add_action( 'genesis_header', 'add_third_nav_genesis' ); 

function add_third_nav_genesis() {

wp_nav_menu( array( 
    'theme_location' => 'third-menu',

     'menu'                 => '',
     'container'            => 'nav',
     'container_id'         => 'nav-primary',
     'container_class'      => 'mobile-menu',
     'items_wrap'           => '<div id="menu-test-menu" class="menu genesis-nav-menu menu-primary js-superfish">%3$s</div>',
     'item_spacing'         => 'discard',
     'depth'                => 3,
     'walker' => new My_Custom_Nav_Walker 

      ) );

}

I am basically trying to have a three tier menu like

menu item >> sub menu item >> sub sub menu item 
             sub menu item    sub sub menu item
             sub menu item    sub sub menu item

And I need to have the third sub menu be aligned side by side with the first sub menu

Any help with this would be greatly appreciated.