Having trouble with a hierarchical WordPress sidebar menu. The script always appends the slug so you can’t navigate back up the hierarchy

The menu uses a toggle to drop down child pages. It’s then possible to navigate to a child page, but getting back to the parent page, or a different parent page is impossible, since each time, the slug is appended to the URL.

For example:
https://rogera25.sg-host.com/managing-epilepsy/women-and-epilepsy/
Within the Women and Epilepsy segment I can reach child pages like:
https://rogera25.sg-host.com/managing-epilepsy/women-and-epilepsy/pregnancy-planning/
But I can’t then go back to a different section like ‘Living With Epilepsy’ because this happens, resulting in a 404:
https://rogera25.sg-host.com/managing-epilepsy/women-and-epilepsy/pregnancy-planning/living-with-epilepsy

Can anyone help? Thanks so much for taking the time to read this!

<aside class="sub-menu col mx-auto">

    <ul class="nav flex-column mx-2 menu">

        {% set siblings = post_query({ 
        'post_type': 'page',
        'post_parent': ancestor,
        'orderby': 'menu_order',
        'order': 'ASC'
    }) %}

    <a class="nav-side-title {% if fn('is_page', ancestor.slug) %}active{% endif %}" href="{{ ancestor.link }}">
    
    <h4>{{ ancestor_name }}</h4></a>

    {% for sibling in siblings %}

        {% if sibling.children %}

            <div class="top mx-2 d-flex align-items-baseline">

                <li class="nav-item top-parent has-child collapsed" href="#{{ sibling.slug }}" data-toggle="collapse" aria-controls="{{ sibling.title }}"></li>
                <a class="nav-link {% if fn('is_page', sibling.slug) %}active{% endif %}" href="{{ sibling.slug }}">{{ sibling.title }}</a>
            </div>

            <ul id="{{ sibling.slug }}" class="collapse child-menu" aria-labelledby="{{ sibling.title }}">

                {% for subpage in sibling.children %}

                   {% if subpage.post_type == "page" %}

                    {% if subpage.children %}
                        <div class="mx-3 d-flex align-items-baseline">
                           <li class="nav-item middle-parent has-child collapsed" href="#{{ subpage.slug }}" data-toggle="collapse" aria-controls="{{ subpage.title }}"></li>
                                <a class="nav-link subpage{% if fn('is_page', subpage.slug) %} active{% endif %}" href="{{ subpage.link }}">{{ subpage.title }}</a>

                           </div>
                           <ul id="{{ subpage.slug }}" class="grandchild-menu collapse" aria-labelledby="{{ subpage.title }}">

                            {% for subpage_2 in subpage.children %}
                               {% if subpage_2.post_type == "page" %}


                                <li class="nav-item bottom">
                                    <a class="nav-link subpage{% if fn('is_page', subpage_2.slug) %} active{% endif %}" href="{{ subpage_2.link }}"> {{ subpage_2.title }}</a>
                                </li>



                                    {% endif %}
                                {% endfor %}<!--subpage_2-->
                            </ul>
                        {% else %}<!--subpage.children-->

                            <li class="nav-item middle">
                                <a class="nav-link subpage{% if fn('is_page', subpage.slug) %} active{% endif %}" href="{{ subpage.link }}">{{ subpage.title }}</a>
                            </li>

                        {% endif %} <!--subpage.children-->

                    {% else %}
                            <li class="nav-item middle">
                                <a class="nav-link subpage{% if fn('is_page', subpage.slug) %} active{% endif %}" href="{{ subpage.link }}">{{ subpage.title }}</a>
                            </li>
                        
                    {% endif %}<!--subpage.children page-->

                {% endfor %} <!--subpage-->

            </ul>



        {% else %} <!--sibling.children-->

            <li class="nav-item top">
                <a class="nav-link {% if fn('is_page', sibling.slug) %} active{% endif %}" href="{{ sibling.link }}">{{ sibling.title }}</a>
            </li>


        {% endif %}<!--sibling.children-->

    {% endfor %} <!--sibling-->

    </ul>

</aside>