<header class="w-100 pa3 ph4-ns bg-white">
  <div class="db dt-ns mw9 center w-100">
    <div class="db dtc-ns v-mid tl w-50">
      <a href="/" class="dib f5 f4-ns mt0 mb1 link black-70" title="Home">
        {{ site.title }}
      </a>
    </div>

    {% set links = [
        { title: 'About', href: '/' },
        { title: 'Experience', href: '/experience' },
        { title: 'Testimonials', href: '/testimonials' },
        { title: 'Talks', href: '/talks' },
        { title: 'Blog', href: '/blog' },
        { title: 'Contact', href: '/contact' }
    ] %}

    <nav class="db dtc-ns v-mid w-100 tl tr-ns mt2 mt0-ns">
        {% for link in links %}
            {% set pattern = '#^' ~ link.href ~ '(.|/)?#' %}
            <a href="{{ link.href }}" class="f6 hover-blue link ml2 ml-m ml4-l dib {{ page.url matches pattern ? 'black' : 'black-70' }}">
                {{- link.title -}}
            </a>
        {% endfor %}
    </nav>
  </div>
</header>