<section class="py-24 lg:py-32 bg-white overflow-hidden">
<div class="container px-4 mx-auto">
<div class="flex flex-wrap -m-8">
<div class="w-full md:w-1/2 p-8">
<span class="inline-block max-w-max mb-6 px-3 py-1.5 text-sm text-white uppercase tracking-tight font-semibold bg-gray-600 rounded-full" style="background: url('basko-assets/images/gradient.png'); background-repeat: no-repeat; background-size: cover;">Try some freebie</span>
<h2 class="font-heading text-6xl tracking-tighter">Provide some additional information with this FAQ Accordion.</h2>
</div>
<div class="w-full md:w-1/2 p-8">
<div class="flex flex-wrap -m-1.5">
<div class="w-full p-1.5">
<a class="block p-6 border border-gray-200 hover:border-gray-300 rounded-lg transition duration-200" href="#">
<div class="flex flex-wrap items-center justify-between -m-2">
<div class="w-auto p-2">
<h3 class="font-semibold tracking-tight">How many items are there in this list?</h3>
</div>
<div class="w-auto p-2">
<svg width="9" height="14" viewbox="0 0 9 14" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.5 1.16683L7.33333 7.00016L1.5 12.8335" stroke="#171A1F" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</div>
</div>
<p class="hidden mt-6 tracking-tight">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.</p>
</a>
</div>
<div class="w-full p-1.5">
<a class="block p-6 border border-gray-200 hover:border-gray-300 rounded-lg transition duration-200" href="#">
<div class="flex flex-wrap items-center justify-between -m-2">
<div class="w-auto p-2">
<h3 class="font-semibold tracking-tight">Can you describe Newleaf in just one sentence?</h3>
</div>
<div class="w-auto p-2">
<svg width="9" height="14" viewbox="0 0 9 14" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.5 1.16683L7.33333 7.00016L1.5 12.8335" stroke="#171A1F" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</div>
</div>
<p class="hidden mt-6 tracking-tight">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.</p>
</a>
</div>
<div class="w-full p-1.5">
<a class="block p-6 border border-gray-200 hover:border-gray-300 rounded-lg transition duration-200" href="#">
<div class="flex flex-wrap items-center justify-between -m-2">
<div class="w-auto p-2">
<h3 class="font-semibold tracking-tight">Can I use this template for my client?</h3>
</div>
<div class="w-auto p-2">
<svg width="9" height="14" viewbox="0 0 9 14" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.5 1.16683L7.33333 7.00016L1.5 12.8335" stroke="#171A1F" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</div>
</div>
<p class="hidden mt-6 tracking-tight">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.</p>
</a>
</div>
<div class="w-full p-1.5">
<a class="block p-6 border border-gray-200 hover:border-gray-300 rounded-lg transition duration-200" href="#">
<div class="flex flex-wrap items-center justify-between -m-2">
<div class="w-auto p-2">
<h3 class="font-semibold tracking-tight">Do you offer templates in other categories?</h3>
</div>
<div class="w-auto p-2">
<svg width="9" height="14" viewbox="0 0 9 14" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.5 1.16683L7.33333 7.00016L1.5 12.8335" stroke="#171A1F" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</div>
</div>
<p class="hidden mt-6 tracking-tight">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.</p>
</a>
</div>
<div class="w-full p-1.5">
<a class="block p-6 border border-gray-200 hover:border-gray-300 rounded-lg transition duration-200" href="#">
<div class="flex flex-wrap items-center justify-between -m-2">
<div class="w-auto p-2">
<h3 class="font-semibold tracking-tight">Do I need to credit you when I use this template?</h3>
</div>
<div class="w-auto p-2">
<svg width="9" height="14" viewbox="0 0 9 14" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.5 1.16683L7.33333 7.00016L1.5 12.8335" stroke="#171A1F" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</div>
</div>
<p class="hidden mt-6 tracking-tight">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.</p>
</a>
</div>
</div>
</div>
</div>
</div>
</section>