export function AlternateFaqStyleWithArrow() {
  return (
    <section className="py-24">
      <div className="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
        <div className="mb-16">
          <h2 className="font-manrope text-center text-4xl leading-[3.25rem] font-bold text-gray-900 capitalize">
            Frequently asked questions
          </h2>
        </div>
        <div
          className="accordion-group columns-1 gap-8 max-lg:mx-auto max-lg:max-w-2xl lg:columns-2"
          data-accordion="default-accordion"
        >
          <div
            className="group accordion accordion-active:bg-indigo-50 mb-8 rounded-xl bg-gray-50 px-6 py-4 transition-all duration-500 hover:bg-indigo-50"
            id="basic-heading-one-with-arrow"
          >
            <button
              className="accordion-toggle group accordion-active:text-indigo-600 inline-flex w-full items-center justify-between text-left text-lg leading-8 text-gray-900 transition duration-500 group-hover:text-indigo-600"
              aria-controls="basic-collapse-one-with-arrow"
            >
              <h5>How can I reset my password?</h5>
              {/* SVG removed */}
            </button>
            <div
              id="basic-collapse-one-with-arrow"
              className="accordion-content w-full overflow-hidden px-0"
              aria-labelledby="basic-heading-one-with-arrow"
            >
              <p className="leading-6 text-gray-900">
                To create an account, find the "Sign up" or "Create account"
                button, fill out the registration form with your personal
                information, and click "Create account" or "Sign up." Verify
                your email address if needed, and then log in to start using the
                platform.
              </p>
            </div>
          </div>
          <div
            className="group accordion accordion-active:bg-indigo-50 mb-8 rounded-xl bg-gray-50 px-6 py-4 transition-all duration-500 hover:bg-indigo-50"
            id="basic-heading-two-with-arrow"
          >
            <button
              className="accordion-toggle group accordion-active:text-indigo-600 inline-flex w-full items-center justify-between text-left text-lg leading-8 text-gray-900 transition duration-500 group-hover:text-indigo-600"
              aria-controls="basic-collapse-two-with-arrow"
            >
              <h5>How do I update my billing information?</h5>
              {/* SVG removed */}
            </button>
            <div
              id="basic-collapse-two-with-arrow"
              className="accordion-content w-full overflow-hidden px-0"
              aria-labelledby="basic-heading-two-with-arrow"
            >
              <p className="leading-6 text-gray-900">
                To create an account, find the 'Sign up' or 'Create account'
                button, fill out the registration form with your personal
                information, and click 'Create account' or 'Sign up.' Verify
                your email address if needed, and then log in to start using the
                platform.
              </p>
            </div>
          </div>
          <div
            className="group accordion accordion-active:bg-indigo-50 mb-8 rounded-xl bg-gray-50 px-6 py-4 transition-all duration-500 hover:bg-indigo-50"
            id="basic-heading-three-with-arrow"
          >
            <button
              className="accordion-toggle group accordion-active:text-indigo-600 inline-flex w-full items-center justify-between text-left text-lg leading-8 text-gray-900 transition duration-500 group-hover:text-indigo-600"
              aria-controls="basic-collapse-three-with-arrow"
            >
              <h5>How do I delete my account?</h5>
              {/* SVG removed */}
            </button>
            <div
              id="basic-collapse-three-with-arrow"
              className="accordion-content w-full overflow-hidden px-0"
              aria-labelledby="basic-heading-three-with-arrow"
            >
              <p className="leading-6 text-gray-900">
                To create an account, find the 'Sign up' or 'Create account'
                button, fill out the registration form with your personal
                information, and click 'Create account' or 'Sign up.' Verify
                your email address if needed, and then log in to start using the
                platform.
              </p>
            </div>
          </div>
          <div
            className="group accordion accordion-active:bg-indigo-50 mb-8 rounded-xl bg-gray-50 px-6 py-4 transition-all duration-500 hover:bg-indigo-50"
            id="basic-heading-four-with-arrow"
          >
            <button
              className="accordion-toggle group accordion-active:text-indigo-600 inline-flex w-full items-center justify-between text-left text-lg leading-8 text-gray-900 transition duration-500 group-hover:text-indigo-600"
              aria-controls="basic-collapse-four-with-arrow"
            >
              <h5>How can I contact customer support?</h5>
              {/* SVG removed */}
            </button>
            <div
              id="basic-collapse-four-with-arrow"
              className="accordion-content w-full overflow-hidden px-0"
              aria-labelledby="basic-heading-four-with-arrow"
            >
              <p className="leading-6 text-gray-900">
                To create an account, find the 'Sign up' or 'Create account'
                button, fill out the registration form with your personal
                information, and click 'Create account' or 'Sign up.' Verify
                your email address if needed, and then log in to start using the
                platform.
              </p>
            </div>
          </div>
          <div
            className="group accordion accordion-active:bg-indigo-50 mb-8 rounded-xl bg-gray-50 px-6 py-4 transition-all duration-500 hover:bg-indigo-50"
            id="basic-heading-five-with-arrow"
          >
            <button
              className="accordion-toggle group accordion-active:text-indigo-600 inline-flex w-full items-center justify-between text-left text-lg leading-8 text-gray-900 transition duration-500 group-hover:text-indigo-600"
              aria-controls="basic-collapse-five-with-arrow"
            >
              <h5>How do I update my profile information?</h5>
              {/* SVG removed */}
            </button>
            <div
              id="basic-collapse-five-with-arrow"
              className="accordion-content w-full overflow-hidden px-0"
              aria-labelledby="basic-heading-five-with-arrow"
            >
              <p className="leading-6 text-gray-900">
                To create an account, find the 'Sign up' or 'Create account'
                button, fill out the registration form with your personal
                information, and click 'Create account' or 'Sign up.' Verify
                your email address if needed, and then log in to start using the
                platform.
              </p>
            </div>
          </div>
          <div
            className="group accordion accordion-active:bg-indigo-50 mb-8 rounded-xl bg-gray-50 px-6 py-4 transition-all duration-500 hover:bg-indigo-50"
            id="basic-heading-six-with-arrow"
          >
            <button
              className="accordion-toggle group accordion-active:text-indigo-600 inline-flex w-full items-center justify-between text-left text-lg leading-8 text-gray-900 transition duration-500 group-hover:text-indigo-600"
              aria-controls="basic-collapse-six-with-arrow"
            >
              <h5>How do I upload a file or document?</h5>
              {/* SVG removed */}
            </button>
            <div
              id="basic-collapse-six-with-arrow"
              className="accordion-content w-full overflow-hidden px-0"
              aria-labelledby="basic-heading-six-with-arrow"
            >
              <p className="leading-6 text-gray-900">
                To create an account, find the 'Sign up' or 'Create account'
                button, fill out the registration form with your personal
                information, and click 'Create account' or 'Sign up.' Verify
                your email address if needed, and then log in to start using the
                platform.
              </p>
            </div>
          </div>
          <div
            className="group accordion accordion-active:bg-indigo-50 mb-8 rounded-xl bg-gray-50 px-6 py-4 transition-all duration-500 hover:bg-indigo-50"
            id="basic-heading-seven-with-arrow"
          >
            <button
              className="accordion-toggle group accordion-active:text-indigo-600 inline-flex w-full items-center justify-between text-left text-lg leading-8 text-gray-900 transition duration-500 group-hover:text-indigo-600"
              aria-controls="basic-collapse-seven-with-arrow"
            >
              <h5>How do I change my email address?</h5>
              {/* SVG removed */}
            </button>
            <div
              id="basic-collapse-seven-with-arrow"
              className="accordion-content w-full overflow-hidden px-0"
              aria-labelledby="basic-heading-seven-with-arrow"
            >
              <p className="leading-6 text-gray-900">
                To create an account, find the 'Sign up' or 'Create account'
                button, fill out the registration form with your personal
                information, and click 'Create account' or 'Sign up.' Verify
                your email address if needed, and then log in to start using the
                platform.
              </p>
            </div>
          </div>
          <div
            className="group accordion accordion-active:bg-indigo-50 mb-8 rounded-xl bg-gray-50 px-6 py-4 transition-all duration-500 hover:bg-indigo-50"
            id="basic-heading-eight-with-arrow"
          >
            <button
              className="accordion-toggle group accordion-active:text-indigo-600 inline-flex w-full items-center justify-between text-left text-lg leading-8 text-gray-900 transition duration-500 group-hover:text-indigo-600"
              aria-controls="basic-collapse-eight-with-arrow"
            >
              <h5>How do I join a group or community?</h5>
              {/* SVG removed */}
            </button>
            <div
              id="basic-collapse-eight-with-arrow"
              className="accordion-content w-full overflow-hidden px-0"
              aria-labelledby="basic-heading-eight-with-arrow"
            >
              <p className="leading-6 text-gray-900">
                To create an account, find the 'Sign up' or 'Create account'
                button, fill out the registration form with your personal
                information, and click 'Create account' or 'Sign up.' Verify
                your email address if needed, and then log in to start using the
                platform.
              </p>
            </div>
          </div>
        </div>
      </div>
    </section>
  )
}