Faq Technology Modern

                <!--
@type: FAQ
@industry: Technology
@style: Modern
@category: Content, Sale, Support
@framework: Tailwind
@license: Free
-->

<style>
  .gradient-text {
    background: linear-gradient(135deg, #f59e0b, #d97706);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
  }
  .faq-grid {
    background-image:
      linear-gradient(rgba(245, 158, 11, 0.03) 1px, transparent 1px),
      linear-gradient(90deg, rgba(245, 158, 11, 0.03) 1px, transparent 1px);
    background-size: 50px 50px;
  }
</style>

<section class="bg-neutral-900 text-white relative overflow-hidden faq-grid py-12">
  <!-- Background Elements -->
  <div class="absolute inset-0 overflow-hidden pointer-events-none">
    <div class="absolute top-20 left-10 w-96 h-96 bg-amber-500/10 rounded-full blur-3xl"></div>
    <div class="absolute bottom-20 right-10 w-96 h-96 bg-amber-400/10 rounded-full blur-3xl"></div>
  </div>

  <div class="relative max-w-7xl mx-auto px-6 lg:px-8">
    <!-- FAQ Section -->
    <div>
      <div class="text-center mb-12">
        <h3 class="text-3xl md:text-4xl font-bold gradient-text mb-4">Frequently Asked Questions</h3>
        <p class="text-neutral-400">Got questions? We've got answers</p>
      </div>

      <div class="grid md:grid-cols-2 gap-6 max-w-5xl mx-auto">
        <div
          class="bg-neutral-800/30 backdrop-blur-sm border border-neutral-700/50 rounded-2xl p-6 hover:border-amber-500/30 transition-colors duration-300">
          <h4 class="text-lg font-semibold text-amber-400 mb-3">Can I change plans later?</h4>
          <p class="text-neutral-300">Yes! You can upgrade or downgrade your plan at any time. Changes take effect
            immediately and we'll prorate the billing.</p>
        </div>

        <div
          class="bg-neutral-800/30 backdrop-blur-sm border border-neutral-700/50 rounded-2xl p-6 hover:border-amber-500/30 transition-colors duration-300">
          <h4 class="text-lg font-semibold text-amber-400 mb-3">Is there a free trial?</h4>
          <p class="text-neutral-300">Absolutely! All plans come with a 14-day free trial. No credit card required to
            start your trial period.</p>
        </div>

        <div
          class="bg-neutral-800/30 backdrop-blur-sm border border-neutral-700/50 rounded-2xl p-6 hover:border-amber-500/30 transition-colors duration-300">
          <h4 class="text-lg font-semibold text-amber-400 mb-3">What payment methods do you accept?</h4>
          <p class="text-neutral-300">We accept all major credit cards, PayPal, and bank transfers for Enterprise
            customers. All payments are secure and encrypted.</p>
        </div>

        <div
          class="bg-neutral-800/30 backdrop-blur-sm border border-neutral-700/50 rounded-2xl p-6 hover:border-amber-500/30 transition-colors duration-300">
          <h4 class="text-lg font-semibold text-amber-400 mb-3">Can I cancel anytime?</h4>
          <p class="text-neutral-300">Yes, you can cancel your subscription at any time with no cancellation fees.
            Your access continues until the end of your billing period.</p>
        </div>
      </div>
    </div>

    <!-- Trust Indicators -->
    <div class="mt-16 flex flex-wrap items-center justify-center gap-8 text-sm text-neutral-400">
      <div class="flex items-center space-x-2">
        <svg class="w-5 h-5 text-green-500" fill="currentColor" viewBox="0 0 20 20">
          <path fill-rule="evenodd"
            d="M2.166 4.999A11.954 11.954 0 0010 1.944 11.954 11.954 0 0017.834 5c.11.65.166 1.32.166 2.001 0 5.225-3.34 9.67-8 11.317C5.34 16.67 2 12.225 2 7c0-.682.057-1.35.166-2.001zm11.541 3.708a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
            clip-rule="evenodd" />
        </svg>
        <span>SSL Secured</span>
      </div>
      <div class="flex items-center space-x-2">
        <svg class="w-5 h-5 text-green-500" fill="currentColor" viewBox="0 0 20 20">
          <path fill-rule="evenodd"
            d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
            clip-rule="evenodd" />
        </svg>
        <span>Money-back Guarantee</span>
      </div>
      <div class="flex items-center space-x-2">
        <svg class="w-5 h-5 text-green-500" fill="currentColor" viewBox="0 0 20 20">
          <path fill-rule="evenodd"
            d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
            clip-rule="evenodd" />
        </svg>
        <span>24/7 Support</span>
      </div>
      <div class="flex items-center space-x-2">
        <svg class="w-5 h-5 text-green-500" fill="currentColor" viewBox="0 0 20 20">
          <path fill-rule="evenodd"
            d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
            clip-rule="evenodd" />
        </svg>
        <span>Cancel Anytime</span>
      </div>
    </div>
  </div>
</section>