<nav class="sc-navbar {{ class }}" aria-label="Primary"><a class="sc-brand" href="/"><span class="sc-mark sc-mark-square" aria-hidden="true"></span>{% if logoType == "image" and logo %}{% img logo alt=alt|default:"Home" class="sc-brand-logo" %}{% else %}<span>{{ logoText.text|default:logoText|default:context.site.title|default:"Studio" }}</span>{% endif %}</a><div class="sc-nav-links">{% for item in menu.items %}<a class="sc-nav-link" href="{{ item.url }}"{% if item.open_in_new_tab %} target="_blank" rel="noopener"{% endif %}>{{ item.label|default:item.title }}</a>{% endfor %}{% if cta.text and cta.url %}<a class="sc-btn-primary sc-btn-sm" href="{{ cta.url }}">{{ cta.text }}</a>{% endif %}</div><input type="checkbox" id="sc-nav-toggle-cb" class="sc-nav-cb" style="display:none;"><label for="sc-nav-toggle-cb" class="sc-nav-toggle sc-btn-outline sc-btn-sm" aria-label="Toggle menu">::lucide:menu:sm::</label><div class="sc-nav-drawer">{% for item in menu.items %}<a href="{{ item.url }}"{% if item.open_in_new_tab %} target="_blank" rel="noopener"{% endif %}>{{ item.label|default:item.title }}</a>{% endfor %}{% if cta.text and cta.url %}<a href="{{ cta.url }}" class="sc-btn-primary sc-btn-sm" style="margin-top:0.75rem;">{{ cta.text }}</a>{% endif %}</div><style>.sc-nav-cb:checked ~ .sc-nav-drawer{display:flex;}</style></nav>
