ハンバーガーメニューをページ内リンクでとじるようにしたい

実現したいこと

ハンバーガーメニューをページ内リンクしたら閉じるようにしたいのですが、
こちらでいろいろ検索してjsもアレンジしてもよく分からず・・・
申し訳ございませんが、ご教授いただけないでしょうか？

cssのコードは本みながら少しずつ変えながらから引用してます

該当のソースコード

html
1
2<header class="header">
3    <div class="header-container">
4        <div class="global-container">
5            <button class="navbtn"
6                        onClick="document.querySelector('html').classList.toggle('open')">
7                <i class="fa-solid fa-bars"></i>
8                <i class="fa-solid fa-xmark"></i>
9                <span class="sr-only">menu</span>
10            </button>
11            <div class="site">
12                <span class="title">テスト</span>
13            </div>
14            <nav class="nav">
15                <ul class="navmenu">
16                      <li><a href="#test2">テスト１</a></li>
17                      <li><a href="#test1">テスト2</a></ii>
18               </ul>
19           </nav>
20        </div>
21    </div>
22</header>

css
1.navmenu{
2    list-style: none;
3}
4a{
5    text-decoration: none;
6    color: blue;
7}
8.navbtn{
9    outline: none;
10    border: none;
11    background: transparent;
12    cursor: pointer;
13    color: black;
14    font-size: 40px
15}
16.open .navbtn{
17    z-index: 110;
18    color: black;
19}
20.navbtn .fa-bars{
21    display: revert;
22}
23.open .navbtn .fa-bars{
24    display: none;
25}
26.navbtn .fa-xmark{
27    display: none;
28}
29.open .navbtn .fa-xmark{
30    display: revert;
31}
32
33@media(min-width:768px){
34    .navbtn{
35        display:none;
36    }
37}
38@media(max-width: 767px){
39    .nav{
40        position: fixed;
41        inset: -100% 0 100% 0 ;
42        z-index: 100;
43        background-color: white;
44        transition: transform 0.3s;
45    }
46    .open .nav{
47        transform: translate(0,100%);
48    }
49    .open body{
50        position: fixed;
51        overflow: hidden;
52    }
53   .nav ul{
54        display: flex;
55        flex-direction: column;
56        justify-content: center;
57        text-align: center;
58    }
59}
60
61@media(min-width:768px){
62    .nav ul{
63        display: flex;
64        gap: 20px;
65        color: black;
66    }
67}