{% macro offer(image_filename, name, description) %}
    <div class="row pb-5 pt-3">
        <div class="col d-flex align-content-center flex-wrap" style="min-width: 300px;">
            {% set dir = page.path | trim_start_matches(pat="/") %}
            {% set image_path = dir ~ image_filename %}
            {% set image = resize_image(path=image_path, width=400, height=400, op="fill") %}

            <img
                src="{{ image.url }}"
                class="rounded d-block mx-auto img-fluid shadow"
            />
        </div>
        <div class="col d-flex align-content-center flex-wrap ms-5 me-5 mt-3" style="min-width: 300px;">
            <div>
                <h3>{{ name }}</h3>
                <p>{{ description | safe }}</p>
            </div>
        </div>
    </div>
{% endmacro %}

{% macro prices_table(caption, names, prices) %}
    <div class="text-center pb-5">
        <h3 class="h2">{{ caption }}</h3>

        <div class="d-inline-flex">
            <table class="table table-sm">
                <tbody>
                    {% for name in names %}
                        <tr>
                            <th class="pe-3" scope="row">{{ name }}</th>
                            <td class="ps-3">{{ prices | nth(n=loop.index0) }}</td>
                        </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>

    <hr>
{% endmacro %}