<article class="ds-page ds-page-{{ page_id }}" data-page-id="{{ page_id }}">
  <header class="ds-page-header">
    <div class="ds-container">
      <h1 class="ds-heading-xl">{{ texts[page_id ~ "-page-title"] | default(page_id) }}</h1>
      {% if texts[page_id ~ "-page-subtitle"] %}
        <p class="ds-text-lead">{{ texts[page_id ~ "-page-subtitle"] | safe }}</p>
      {% endif %}
    </div>
  </header>

  <div class="ds-page-body">
    <div class="ds-container">
      {# Each page's content is driven by its FTL translations. #}
      {# Common structure: description paragraph + sections keyed by page_id prefix. #}
      {% if texts[page_id ~ "-page-description"] %}
        <p class="ds-text-lead ds-text-muted">{{ texts[page_id ~ "-page-description"] }}</p>
      {% endif %}

      {# Product pages: show a minimal overview with a "learn more" link pattern. #}
      {% set products = ["syntaxis", "vapora", "rustelo", "provisioning", "stratumiops", "kogral", "typedialog", "ontoref", "secretumvault"] %}
      {% if page_id in products %}
        {% include "partials/product_page.j2" %}
      {% endif %}

      {# Auth pages: show the login form fragment inline. #}
      {% if page_id == "login" %}
        {% include "partials/login_form.j2" %}
      {% endif %}
    </div>
  </div>
</article>
