<?php
/** Expects (optionally) $activeNav = 'home' | 'pricing' in scope. */
$activeNav = $activeNav ?? '';
?>
<header class="hx-nav" id="hxNav">
    <div class="hx-container hx-nav-inner">
        <a href="<?= APP_URL ?>/" class="hx-nav-logo" aria-label="Helmyx home">
            <img src="<?= APP_URL ?>/assets/brand/logo/helmyx-horizontal-notag.svg" alt="Helmyx">
        </a>
        <nav class="hx-nav-links">
            <a href="<?= APP_URL ?>/#features">Features</a>
            <a href="<?= APP_URL ?>/#how-it-works">How it works</a>
            <a href="<?= APP_URL ?>/pricing"><?= $activeNav === 'pricing' ? '<strong>Pricing</strong>' : 'Pricing' ?></a>
        </nav>
        <div class="hx-nav-actions">
            <a href="<?= APP_URL ?>/login" class="hx-nav-login">Log in</a>
            <a href="<?= APP_URL ?>/signup" class="hx-btn hx-btn-primary hx-btn-sm">Start free trial</a>
            <button type="button" class="hx-nav-toggle" id="hxNavToggle" aria-label="Toggle menu" aria-expanded="false">
                <span style="width:22px;height:22px;display:block;color:var(--hx-navy-900);"><?= hxIcon('menu') ?></span>
            </button>
        </div>
    </div>
    <div class="hx-nav-mobile" id="hxNavMobile">
        <a href="<?= APP_URL ?>/#features">Features</a>
        <a href="<?= APP_URL ?>/#how-it-works">How it works</a>
        <a href="<?= APP_URL ?>/pricing">Pricing</a>
        <div class="hx-nav-mobile-ctas">
            <a href="<?= APP_URL ?>/login" class="hx-btn hx-btn-outline hx-btn-sm hx-btn-block">Log in</a>
            <a href="<?= APP_URL ?>/signup" class="hx-btn hx-btn-primary hx-btn-sm hx-btn-block">Start free trial</a>
        </div>
    </div>
</header>
