{% set levelClasses = {
  '1': 'text-5xl text-transparent bg-clip-text bg-gradient-to-b from-primary-400 to-primary-600 mb-12',
  '2': 'text-4xl text-transparent bg-clip-text bg-gradient-to-b from-primary-400 to-primary-600 mb-12',
  '3': 'text-lg md:text-2xl font-light'
} %}

{% set levelLinkClasses = {
  '1': 'border-transparent hover:border-primary-600',
  '2': 'border-transparent hover:border-primary-600',
  '3': 'border-transparent hover:border-current'
} %}

{% macro render(node) %}
  <h{{ node.level }}
    id="{{ node.slug }}"
    {% if levelClasses[node.level] %}
      class="
        {{ levelClasses[node.level] }}
        {{ node.class }}
      "
    {% endif %}
  >
    {% if node.href %}
      <a href="{{ node.href }}" class="border-b-2 {{ levelLinkClasses[node.level] }}">{{ node.text | safe }}</a>
    {% else %}
      <a href="#{{ node.slug }}">{{ node.text | safe }}</a>
    {% endif %}
  </h{{ node.level }}>
{% endmacro %}