Preserve admin order of metaboxes in the frontend of the website

Hi,

I have the following code:

function hero_slides_metaboxes( $meta_boxes ) {

    $meta_boxes[] = array(
        'title'      => 'Page Hero Selector',
        'post_types' => array('page'),
        'include'       => array(
            'template' => array('front-page.php'),
        ),
        'fields'     => array(
            array(
                'id'=> 'section_control',
                'type' => 'group',
                'desc' => 'Add section to page.',
                'group_title'   => array('field' => '{section_type_selector}'),
                'collapsible'   => true,
                'save_state'    => true,
                'clone'         => true,
                'sort_clone'    => true,
                'max_clone'     => 10,
                'add_button' => '+ Add Section',
                'fields'        => array(
                    array(
                        'name'  => 'Hero Selected',
                        'id'=> 'section_type_selector',
                        'type' => 'select',
                        'options' => array(
                            'company_section' => 'Company Section',
                            'video_section' => 'Video Section',
                            'cta_section'   => 'CTA Section'
                        ),
                        'placeholder'     => 'Select Hero',
                    ),
                    array(
                        'id'            => 'company_section',
                        'type'          => 'group',
                        'group_title'   => 'Company Slide {#}',
                        'clone'         => true,
                        'sort_clone'    => true,
                        'collapsible'   => true,
                        'max_clone'     => 10,
                        'visible'       => array('section_control', '=', 'company_section' ),
                        'save_state'    => true,
                        'fields' => array(
                            array(
                                ...
                            ),
                            array(
                                ...
                            ),
                            
                            array(
                                ...
                            ),        
                        ),
                    ),
                    array(
                        'id'            => 'vieo_section',
                        'type'          => 'group',
                        'group_title'   => 'Video Section',
                        'collapsible'   => true,
                        'visible'       => array('section_control', '=', 'video_section' ),
                        'save_state'    => true,
                        'fields'        => array(
                            array(
                                ...
                            ),
                            array(
                                ...
                            ),
                            array(
                                'type' => 'group',
                                'id'   => 'video_content_slides',
                                'group_title'   => 'Video Slide {#}',
                                'clone'         => true,
                                'sort_clone'    => true,
                                'collapsible'   => true,
                                'max_clone'     => 10,
                                'save_state'    => true,
                                'fields'        => array(
                                    array(
                                       ...
                                    ),
                                    array(
                                        ...
                                    ),
                                    array(
                                        ...
                                
                                )
                            )
                        )
                    ),
                    array(
                        'id'            => 'cta_section',
                        'type'          => 'group',
                        'group_title'   => 'CTA Settings',
                        'collapsible'   => true,
                        'visible'       => array('section_control', '=', 'cta_section' ),
                        'save_state'    => true,
                        'fields' => array(
                            array(
                                ...                            ),
                            array(
                                ...
                            ),
                            array(
                              ...
                            ),
                            array(
                               ...
                            ),
                            array(      
                                ..
                            ),
                        )
                    )
                ),
            ),
            
            
        ),
    );

    return $meta_boxes;
}

My goal is to have multiple nested groups within the main metabox, which allows me to select one from the dropdown and hide the rest. I have noticed however, that when I select a seciton from the dropdown and it appears (correctly), I can inspect the dom and see that the other metaboxes are also present. They do not contain values but still exist int the dom and count against my max input fields set by wordpress.

So basically if i have 7 options In my dropdown. (each presenting a potential metabox gorup with its own input fields), the selected option reveals the corresponding metabox and hides the rest, but I am afraid that the other 6 metaboxes and their fields are also saved even though they have no values to save. As a result, when enough of these boxes are selected, some of the values would not be saved because they are over the max inputs that WP allows. To get around this in the past I had to increase max_input_vars in the nginx config.

This is only an issue because I have many of these dropdown options. So I would like to flatten out this array and have a separate metabox for each page section and remove the dropdown selector. But I like the ability to save the order of the metaboxes and carry that forward to the frontend. Is this doable?