{% extends "modules/marketplace/templates/marketplace/public_base.html" %}
{% block public_content %}
<section class="bg-gradient-to-br from-slate-950 via-slate-900 to-brand-900 text-white">
  <div class="mx-auto grid max-w-7xl gap-10 px-4 py-16 sm:px-6 lg:grid-cols-[1.15fr_0.85fr] lg:px-8 lg:py-24">
    <div>
      <div class="inline-flex rounded-full border border-white/15 bg-white/10 px-4 py-1 text-xs font-semibold uppercase tracking-[0.24em] text-brand-100">FilingABC Marketplace</div>
      <h1 class="mt-6 max-w-3xl text-4xl font-bold tracking-tight sm:text-5xl">Find audit, GST, income tax, ROC and accounting support from trusted professionals.</h1>
      <p class="mt-5 max-w-2xl text-base leading-8 text-slate-200">Clients can request services, consultants can generate leads, and the platform team can route work to the right audit firm or partner.</p>
      <div class="mt-8 flex flex-wrap gap-3">
        <a href="/request-service" class="rounded-2xl bg-white px-5 py-3 text-sm font-bold text-slate-900 shadow-soft">Request Professional Service</a>
        <a href="/audit-firms" class="rounded-2xl border border-white/20 px-5 py-3 text-sm font-bold text-white hover:bg-white/10">Browse Audit Firms</a>
      </div>
    </div>
    <div class="rounded-3xl border border-white/10 bg-white/10 p-6 shadow-2xl backdrop-blur">
      <div class="grid gap-4 sm:grid-cols-3 lg:grid-cols-1">
        <div class="rounded-2xl bg-white/10 p-5"><div class="text-3xl font-bold">{{ marketplace_counts.audit_firms }}</div><div class="mt-1 text-sm text-slate-200">Audit firms</div></div>
        <div class="rounded-2xl bg-white/10 p-5"><div class="text-3xl font-bold">{{ marketplace_counts.consultants }}</div><div class="mt-1 text-sm text-slate-200">Consultants</div></div>
        <div class="rounded-2xl bg-white/10 p-5"><div class="text-3xl font-bold">{{ marketplace_counts.service_requests }}</div><div class="mt-1 text-sm text-slate-200">Service requests</div></div>
      </div>
    </div>
  </div>
</section>

<section class="mx-auto max-w-7xl px-4 py-12 sm:px-6 lg:px-8">
  <div class="grid gap-6 md:grid-cols-3">
    {% for item in [
      ('GST & Tax Compliance', 'GSTR filing, notices, reconciliation, tax return support and advisory.'),
      ('Audit & Assurance', 'Statutory audit, internal audit, tax audit and engagement tracking.'),
      ('ROC & Business Services', 'Company filings, registrations, payroll, accounting and compliance calendars.')
    ] %}
    <div class="rounded-3xl border border-slate-200 bg-white p-6 shadow-soft">
      <h2 class="text-lg font-bold text-slate-900">{{ item[0] }}</h2>
      <p class="mt-3 text-sm leading-6 text-slate-600">{{ item[1] }}</p>
    </div>
    {% endfor %}
  </div>
</section>

<section class="mx-auto grid max-w-7xl gap-8 px-4 pb-16 sm:px-6 lg:grid-cols-2 lg:px-8">
  <div class="rounded-3xl border border-slate-200 bg-white p-6 shadow-soft">
    <div class="flex items-center justify-between"><h2 class="text-xl font-bold">Featured Audit Firms</h2><a href="/audit-firms" class="text-sm font-semibold text-brand-700">View all</a></div>
    <div class="mt-5 space-y-3">
      {% for firm in public_audit_firms %}
      <div class="rounded-2xl border border-slate-100 bg-slate-50 p-4"><div class="font-semibold">{{ firm.name }}</div><div class="text-xs text-slate-500">{{ firm.firm_type|replace('_',' ')|title if firm.firm_type else 'Audit Firm' }}</div></div>
      {% else %}
      <div class="rounded-2xl border border-dashed border-slate-300 p-4 text-sm text-slate-500">Audit firm listings will appear here after activation.</div>
      {% endfor %}
    </div>
  </div>
  <div class="rounded-3xl border border-slate-200 bg-white p-6 shadow-soft">
    <div class="flex items-center justify-between"><h2 class="text-xl font-bold">Consultant Network</h2><a href="/consultants" class="text-sm font-semibold text-brand-700">View all</a></div>
    <div class="mt-5 space-y-3">
      {% for consultant in public_consultants %}
      <div class="rounded-2xl border border-slate-100 bg-slate-50 p-4"><div class="font-semibold">{{ consultant.firm_name or consultant.contact_person }}</div><div class="text-xs text-slate-500">{{ consultant.specialisation or consultant.consultant_type|replace('_',' ')|title }}</div></div>
      {% else %}
      <div class="rounded-2xl border border-dashed border-slate-300 p-4 text-sm text-slate-500">Consultant listings will appear here after activation.</div>
      {% endfor %}
    </div>
  </div>
</section>
{% endblock %}