<section class="app-hero card-soft">
    <h2 class="app-title">O que deseja informar?</h2>
    <p class="app-subtitle">Toque em uma opção para abrir o registro já com a categoria selecionada.</p>
</section>

<section class="grid-opcoes">
    <a href="<?= base_url('/app/registrar?cat=1') ?>" class="opcao vermelho tap-animate">
        <strong>🕳️</strong>
        <span>Buraco</span>
    </a>

    <a href="<?= base_url('/app/registrar?cat=2') ?>" class="opcao amarelo tap-animate">
        <strong>💡</strong>
        <span>Iluminação</span>
    </a>

    <a href="<?= base_url('/app/registrar?cat=3') ?>" class="opcao cinza tap-animate">
        <strong>♻️</strong>
        <span>Entulho</span>
    </a>

    <a href="<?= base_url('/app/registrar?cat=4') ?>" class="opcao verde tap-animate">
        <strong>🌿</strong>
        <span>Mato alto</span>
    </a>

    <a href="<?= base_url('/app/registrar?cat=5') ?>" class="opcao azul tap-animate">
        <strong>💧</strong>
        <span>Bueiro</span>
    </a>

    <a href="<?= base_url('/app/registrar?cat=6') ?>" class="opcao roxo tap-animate">
        <strong>📍</strong>
        <span>Outros</span>
    </a>
</section>

<section class="quick-card card-soft">
    <a href="<?= base_url('/app/consultar') ?>" class="quick-link tap-animate">
        <span class="quick-link__icon">📄</span>
        <span class="quick-link__text">
            <strong>Consultar protocolo</strong>
            <small>Acompanhe o andamento da sua solicitação</small>
        </span>
    </a>
</section>
