<nav class="items-center gap-0.5 hidden lg:flex">
    {% for section in nav|selectattr("is_section") %}
    {% set first_page = section|first_page %}
    {% if first_page %}
    <a class="inline-flex items-center justify-center whitespace-nowrap text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&amp;_svg]:pointer-events-none [&amp;_svg:not([class*='size-'])]:size-4 shrink-0 [&amp;_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50 h-8 rounded-md gap-1.5 px-3 has-[&gt;svg]:px-2.5"
        data-slot="button" href="{{ first_page.url | url }}">
        {{ section.title }}
    </a>
    {% endif %}
    {% endfor %}
</nav>