> ## Documentation Index
> Fetch the complete documentation index at: https://developer.quicko.com/llms.txt
> Use this file to discover all available pages before exploring further.

export const HeroCard = ({imageUri, darkImageUri, title, description, href}) => {
  return <a className="group cursor-pointer pb-8" href={href}>
      <img src={imageUri} className="block dark:hidden w-full pointer-events-none group-hover:scale-105 transition-all duration-100" />
      <img src={darkImageUri} className="w-full pointer-events-none group-hover:scale-105 transition-all duration-100 hidden dark:block" />
      <h3 className="mt-5 text-gray-900 dark:text-zinc-50 font-medium">
        {title}
      </h3>
      <span className="mt-1.5">{description}</span>
    </a>;
};

<div className="relative">
  <div className="relative z-10 py-16 lg:py-32 lg:pb-24 w-full mx-auto px-4 lg:px-[110px]">
    <h1 className="block text-4xl font-medium text-center text-gray-900 dark:text-zinc-50 tracking-tight">
      Documentation
    </h1>

    <div className="max-w-xl mx-auto px-4 mt-4 text-lg text-center text-gray-500 dark:text-zinc-500">
      Explore our references, guides and recipes to integrate Quicko APIs and SDKs.
    </div>

    <div className="md:px-6 lg:px-0 gap-x-2 my-12 grid sm:grid-cols-2">
      <Card title="Quickstart" icon="rocket" href="/projects/connect/guides/getting-started/index" cta="Get Started">
        Make your first Quicko API call by following our step-by-step guide.
      </Card>

      <Card title="API Reference" icon="code-xml" href="/projects/connect/api-reference/authentication/authentication" cta="View Reference">
        Explore our API contracts, reusable code samples, and test scenarios.
      </Card>
    </div>

    <h2 className="text-xl font-medium text-gray-900 dark:text-zinc-50 mb-4">Products</h2>

    <div className="md:px-6 lg:px-0 gap-x-4 gap-y-4 grid sm:grid-cols-3 mb-12">
      <HeroCard imageUri="/static/images/landing/connect_light.svg" darkImageUri="/static/images/landing/connect_dark.svg" title="Connect" description="Integrate complete tax workflows into your app with Quicko Connect’s modular APIs and SDKs." href="/projects/connect/guides/getting-started/index" />

      <HeroCard imageUri="/static/images/landing/integration_light.svg" darkImageUri="/static/images/landing/integration_dark.svg" title="Integration" description="Integrate with Quicko to enhance your platform's tax capabilities" href="/projects/integration/index" />

      <HeroCard imageUri="/static/images/landing/tools_light.svg" darkImageUri="/static/images/landing/tools_dark.svg" title="Tools" description="Embed themeable, plug & play tax tools into your website or mobile app." href="/projects/tools/index" />
    </div>

    <h2 className="text-xl font-medium text-gray-900 dark:text-zinc-50 mb-4">Resources</h2>

    <div className="md:px-6 lg:px-0 gap-x-6 gap-y-4">
      <Card horizontal title="Collections" icon="book-marked" href="https://postman.com/com-quicko/quicko-connect" arrow="true">
        Test Quicko APIs with public Postman collections.
      </Card>

      <Card horizontal title="Help Centre" icon="book-open-text" href="https://help.quicko.com" arrow="true">
        Support for integration, billing, accounts, and more.
      </Card>
    </div>
  </div>
</div>