{% extends "base_page.html" %}
{% load wagtailcore_tags static %}

{#{% block body_class %}template-homepage{% endblock %}#}
{#{% block extra_css %}#}
{#{% endblock extra_css %}#}

{% block content %}
    {% include_block page.header %}
    {% include_block page.body %}
    <section class="px-3 py-10 bg-base-200">
        <div class="container mx-auto px-3">
            <h2 class="text-3xl font-bold text-center mb-8">Latest News & Events</h2>
            <div class="max-w-4xl mx-auto text-center">
                <p class="text-lg text-gray-600 mb-8">Welcome to the Wagtail Feathers Demo! Explore our articles to see the full range of features.</p>
                <a href="/articles/" class="inline-block bg-primary text-white px-6 py-3 rounded-lg hover:bg-primary-focus transition-colors">
                    View All Articles
                </a>
            </div>
        </div>
    </section>
    <section class="px-3 flex gap-3 py-10 bg-base-200 h-64">
        <div class="container mx-auto px-3 flex gap-3 pb-10 text-center">
            <h3 class="w-full">Our Impact in Numbers</h3>
        </div>
    </section>
    <section class="px-3 flex gap-3 py-10 bg-base-300 h-64">
        <div class="container mx-auto px-3 flex gap-3 pb-10 text-center">
            <h3 class="w-full">Resources</h3>
        </div>
    </section>
    <section class="px-3 flex gap-3 py-10 bg-base-100 h-64">
        <div class="container mx-auto px-3 flex gap-3 pb-10 text-center">
            <h3 class="w-full">Our Services</h3>
        </div>
    </section>
    <section class="px-3 flex gap-3 py-10 bg-base-200 h-64">
        <div class="container mx-auto px-3 flex gap-3 pb-10 text-center">
            <h3 class="w-full">A positive impact!</h3>
        </div>
    </section>
    <section class="px-3 flex gap-3 py-10 bg-base-300 h-64">
        <div class="container mx-auto px-3 flex gap-3 pb-10 text-center">
            <h3 class="w-full">Certifications</h3>
        </div>
    </section>
{% endblock content %}