HTML menú elástico

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css"/>
<div class="ov-wrapper">
 <nav>
    <input type="radio" name="tab" id="menu-01" checked>
    <input type="radio" name="tab" id="menu-02">
    <input type="radio" name="tab" id="menu-03">
    <input type="radio" name="tab" id="menu-04">
    <input type="radio" name="tab" id="menu-05">
    <input type="radio" name="tab" id="menu-06">

    <label for="menu-01" class="menu-01">
      <a href="#home"><i class="fa-solid fa-house"></i><span>Home</span></a>
    </label>

    <label for="menu-02" class="menu-02">
      <a href="#teams"><i class="fa-solid fa-user-group"></i></i><span>Teams</span></a>
    </label>

    <label for="menu-03" class="menu-03">
      <a href="#pricing"><i class="fa-solid fa-file-invoice-dollar"></i></i><span>Pricing</span></a>
    </label>

    <label for="menu-04" class="menu-04">
      <a href="#features"><i class="fa-solid fa-heart"></i><span>Features</span></a>
    </label>

    <label for="menu-05" class="menu-05">
      <a href="#blog"><i class="fa-solid fa-file-lines"></i><span>Blog</span></a>
    </label>

    <div class="tab"></div>
 </nav>
</div>