<section data-component-type="Content" data-component-slug="ss-technology-template-Faq">
<section class="flex justify-center relative bg-white py-[40px]">
  <section class="lg:max-w-[80%] max-w-[90%]">

  


    <h2 class="lg:text-[50px] text-[25px] text-center font-bold text-[#003D33] py-[20px] lg:max-w-[70%] max-w-[100%] mx-auto" data-node="Faq" data-node-type="text" data-node-default="Frequently Asked Questions">
      {{Faq}}
    </h2>
    <p class="lg:text-[20px] text-[16px] text-center font-bold text-[#4A736D]" data-node="Faqans" data-node-type="text" data-node-default="Answers to common concerns, no hidden conditions.">
      {{Faqans}}
    </p>
    <section class="px-6 lg:px-10 py-10  items-center">

      <div class="accordion-group">

        <!-- ITEM -->
        <div class="accordion border p-4 my-5 rounded-[20px] bg-[#F5F8F4]">
          <button class="accordion-toggle flex justify-between gap-[30px] items-center w-full py-2">
            <h5 class="lg:text-[22px] md:text-[18px] text-start text-[16px]  text-18px font-bold text-[#003D33]" data-node="Question1" data-node-type="text" data-node-default=" How does automation help my agency?">
             {{Question1}}
            </h5>
            <img src="https://res.cloudinary.com/duukclzsd/image/upload/v1767956627/seltrix/templates/ss-technology-template/arrow-down.png" class="accordion-arrow w-5 h-5 transition-transform duration-300">
            </button>
           <div class="accordion-content max-h-0 overflow-hidden transition-all duration-300 text-[#4A736D]">
            <span data-node="Answer1" data-node-type="text" data-node-default="Automation eliminates repetitive work, reduces errors, and helps your team deliver faster.">
           {{Answer1}}
           </span>
          </div>
        </div>

        <!-- ITEM -->
        <div class="accordion border p-4 my-5 rounded-[20px]  bg-[#F5F8F4]">
          <button class="accordion-toggle flex justify-between items-center gap-[30px] w-full py-2">
             <h5 class="lg:text-[22px] md:text-[18px] text-[16px] text-start  text-18px font-bold text-[#003D33]" data-node="Question2" data-node-type="text" data-node-default="What is a CRM Platform?">
             {{Question2}}
            </h5>
            <img src="https://res.cloudinary.com/duukclzsd/image/upload/v1767956627/seltrix/templates/ss-technology-template/arrow-down.png" class="accordion-arrow w-5 h-5 transition-transform duration-300">
            </button>
           <div class="accordion-content max-h-0 overflow-hidden transition-all duration-300 text-[#4A736D]">
            <span data-node="Answer2" data-node-type="text" data-node-default="We ensure transparency with secure & user-friendly content management.">   
           {{Answer2}}  
           </span>
          </div>
        </div>

        <!-- ITEM -->
        <div class="accordion border p-4 my-5 rounded-[20px]  bg-[#F5F8F4]">
          <button class="accordion-toggle flex justify-between w-full gap-[30px]  items-center py-2">
             <h5 class="lg:text-[22px] md:text-[18px] text-[16px] text-start text-18px font-bold text-[#003D33]" data-node="Question3" data-node-type="text" data-node-default="Is this tool suitable for small agencies?">
             {{Question3}}
            </h5>
            <img src="https://res.cloudinary.com/duukclzsd/image/upload/v1767956627/seltrix/templates/ss-technology-template/arrow-down.png" class="accordion-arrow w-5 h-5 transition-transform duration-300">
          </button>
          <div class="accordion-content max-h-0 overflow-hidden transition-all duration-300 text-[#4A736D]">
            <span data-node="Answer3" data-node-type="text" data-node-default=" Yes, it is suitable for agencies of all sizes.">{{Answer3}}
            </span>
          </div>
        </div>

        <!-- ITEM -->
        <div class="accordion border p-4 my-5 rounded-[20px]  bg-[#F5F8F4]">
          <button class="accordion-toggle flex justify-between items-center gap-[30px] w-full py-2">
            <h5 class="lg:text-[22px] md:text-[18px] text-[16px] font-bold text-[#003D33] text-start" data-node="Question4" data-node-type="text" data-node-default="Do you offer onboarding support?">
             {{Question4}}
            </h5>
            <img src="https://res.cloudinary.com/duukclzsd/image/upload/v1767956627/seltrix/templates/ss-technology-template/arrow-down.png" class="accordion-arrow w-5 h-5 transition-transform duration-300">
          </button>
          <div class="accordion-content max-h-0 overflow-hidden transition-all duration-300 text-[#4A736D]">
            <span data-node="Answer4" data-node-type="text" data-node-default="  Yes! We provide live onboarding and training sessions.">
            {{Answer4}}
            </span>
          </div>
        </div>

        <!-- ITEM -->
        <div class="accordion border p-4 my-5 rounded-[20px]  bg-[#F5F8F4]">
          <button class="accordion-toggle flex justify-between  items-center gap-[30px] w-full py-2">
             <h5 class="lg:text-[22px] md:text-[18px] text-[16px] text-start font-bold text-[#003D33]" data-node="Question5" data-node-type="text" data-node-default="Can I integrate it with my existing tools?">
             {{Question5}}
            </h5>
            <img src="https://res.cloudinary.com/duukclzsd/image/upload/v1767956627/seltrix/templates/ss-technology-template/arrow-down.png" class="accordion-arrow w-5 h-5 transition-transform duration-300">
          </button>
           <div class="accordion-content max-h-0 overflow-hidden transition-all duration-300 text-[#4A736D]">
            <span data-node="Answer5" data-node-type="text" data-node-default="Yes — supports CRM, automation tools & third-party apps.">
            {{Answer5}}
            </span>
          </div>
        </div>

      </div>
    </section>
  </section>
</section>
</section>