FAQ Section

 <section class="bg-slate-50 py-24 border-t border-slate-100" id="faq">
      <div class="max-w-3xl mx-auto px-6">
        <div class="text-center mb-16">
          <h2 class="text-3xl md:text-4xl font-semibold tracking-tight text-slate-900 mb-4 font-manrope">
            Frequently Asked Questions
          </h2>
          <p class="text-slate-500 font-manrope">
            Everything you need to know before you start.
          </p>
        </div>
        <div class="space-y-4">
          <details class="group bg-white rounded-2xl border border-slate-200 open:ring-2 open:ring-blue-100 transition-all duration-300">
            <summary class="flex items-center justify-between p-6 cursor-pointer list-none">
              <span class="font-semibold text-slate-900 font-manrope">
                Do I need to install software?
              </span>
              <span class="transition group-open:rotate-180">
                <svg fill="none" height="24" shape-rendering="geometricPrecision" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" viewBox="0 0 24 24" width="24">
                  <path d="M6 9l6 6 6-6"></path>
                </svg>
              </span>
            </summary>
            <div class="text-slate-500 px-6 pb-6 font-manrope">
              No! We provide a simulated in-browser experience for the
              exercises. However, having Microsoft Office installed on your
              computer is recommended for applying what you learn to your own
              work.
            </div>
          </details>
          <details class="group bg-white rounded-2xl border border-slate-200 open:ring-2 open:ring-blue-100 transition-all duration-300">
            <summary class="flex items-center justify-between p-6 cursor-pointer list-none">
              <span class="font-semibold text-slate-900 font-manrope">
                Is the certificate recognized?
              </span>
              <span class="transition group-open:rotate-180">
                <svg fill="none" height="24" shape-rendering="geometricPrecision" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" viewBox="0 0 24 24" width="24">
                  <path d="M6 9l6 6 6-6"></path>
                </svg>
              </span>
            </summary>
            <div class="text-slate-500 px-6 pb-6 font-manrope">
              Yes, our certificates are verifiable and can be added directly to
              your LinkedIn profile. We are trusted by managers at top companies
              like Deloitte and Microsoft.
            </div>
          </details>
          <details class="group bg-white rounded-2xl border border-slate-200 open:ring-2 open:ring-blue-100 transition-all duration-300">
            <summary class="flex items-center justify-between p-6 cursor-pointer list-none">
              <span class="font-semibold text-slate-900 font-manrope">
                Can I cancel anytime?
              </span>
              <span class="transition group-open:rotate-180">
                <svg fill="none" height="24" shape-rendering="geometricPrecision" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" viewBox="0 0 24 24" width="24">
                  <path d="M6 9l6 6 6-6"></path>
                </svg>
              </span>
            </summary>
            <div class="text-slate-500 px-6 pb-6 font-manrope">
              Absolutely. There are no long-term contracts. You can cancel your
              subscription from your account settings with one click.
            </div>
          </details>
        </div>
      </div>
    </section>