JSFiddle - React, Tailwind, and code Playground

HTML

<nav>
    <ul>
        <li id="nav_capabilities">
            <a href="#">
                <details>
                    <summary>Capability</summary>
                    <span class="nav_subText">A rundown of our services</span>
                </details>
            </a>
        </li>
        <li id="nav_capacity">
            <a href="#">
                <details>
                    <summary>Capacity</summary>
                    <span class="nav_subText">How much can we handle</span>
                </details>
            </a>
        </li>
        <li id="nav_credibility">
            <a href="#">
                <details>
                    <summary>Credibility</summary>
                    <span class="nav_subText">The quality of being trustworthy</span>
                </details>
            </a>
        </li>
    </ul>
</nav>

CSS

summary {
 color: red;   
}