{% extends "base.html" %}

{% block content %}
<div class="hero">
    <h1>WetGit</h1>
    <p class="subtitle">Nederlandse wetgeving als code.<br>
    Elke wet een Markdown-bestand. Elke wijziging een Git-commit.</p>

    <blockquote>In de geest van Dirk Volkertzoon Coornhert (1522-1590) — humanist,
    graveur en voorvechter van een transparant rechtssysteem.</blockquote>
</div>

<form class="search-box" action="/zoeken" method="get">
    <input type="text" name="q" placeholder="Zoek in de wetgeving... bijv. 'privacy' of 'mag mijn baas mijn e-mail lezen?'" autofocus>
    <select name="mode">
        <option value="keyword">Keyword</option>
        <option value="semantic">Semantisch</option>
    </select>
    <button type="submit">Zoek</button>
</form>

<div class="stats">
    <div class="stat">
        <div class="stat-number">{{ stats.regelingen }}</div>
        <div class="stat-label">regelingen</div>
    </div>
    <div class="stat">
        <div class="stat-number">{{ stats.artikelen }}</div>
        <div class="stat-label">artikelen in de Grondwet</div>
    </div>
    <div class="stat">
        <div class="stat-number">{{ stats.versies }}</div>
        <div class="stat-label">historische versies</div>
    </div>
</div>

<h2>Aan de slag</h2>

<div style="display: flex; flex-direction: column; gap: 1rem; margin: 1.5rem 0;">
    <a href="/grondwet" style="display: block; padding: 1.2rem; border: 2px solid var(--color-accent); border-radius: 8px; text-decoration: none;">
        <strong style="font-size: 1.1rem;">Lees de Grondwet</strong><br>
        <span style="color: var(--color-muted);">De volledige tekst, doorzoekbaar en met versiehistorie</span>
    </a>
    <a href="/grondwet/samenvatting" style="display: block; padding: 1.2rem; border: 2px solid var(--color-accent-light); border-radius: 8px; text-decoration: none;">
        <strong style="font-size: 1.1rem;">Samenvatting in begrijpelijk Nederlands</strong><br>
        <span style="color: var(--color-muted);">AI-gegenereerde samenvatting per hoofdstuk (B1-niveau)</span>
    </a>
    <a href="/historie" style="display: block; padding: 1.2rem; border: 2px solid var(--color-accent-light); border-radius: 8px; text-decoration: none;">
        <strong style="font-size: 1.1rem;">Bekijk de wijzigingshistorie</strong><br>
        <span style="color: var(--color-muted);">Zie precies wat er veranderde bij elke grondwetswijziging</span>
    </a>
</div>

<div class="disclaimer">
    WetGit is geen officiele bron van wetgeving. Raadpleeg altijd
    <a href="https://wetten.overheid.nl">wetten.overheid.nl</a> voor de authentieke tekst.
</div>
{% endblock %}