<section data-component-type="Team" class="w-full bg-black" data-component-slug="mobile-launch-template-team">
  <div class="w-full px-[16px] sm:px-[24px] lg:px-[96px] py-24">
    <div class="max-w-[1728px] mx-auto">
      <div class="text-center mb-16">
        <h2 class="font-['DM Sans'] font-bold text-[32px] sm:text-[40px] md:text-[48px] lg:text-[56px] leading-[100%] text-white mb-4" data-node="team_title" data-node-type="text" data-node-default="The Minds Behind the Device">
          {{team_title}}
        </h2>

        <p class="font-['DM Sans'] font-normal text-[16px] sm:text-[18px] md:text-[20px] leading-[100%] text-[#7E7E7E] max-w-[720px] mx-auto" data-node="team_desc" data-node-type="text" data-node-default="Engineers, designers, and strategists shaping the future of mobile technology.">
          {{team_desc}}
        </p>
      </div>

      <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-8 lg:gap-12">
        <div class="flex flex-col items-start text-center">
          <img src="{{member_1_image}}" data-node="member_1_image" data-node-type="file" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767163081/seltrix/templates/mobile-launch-template/Alex.webp" class="w-full rounded-[12px] object-cover mb-6" alt>

          <h3 class="font-['DM Sans'] font-medium text-[20px] md:text-[24px] leading-[100%] text-white mb-2" data-node="member_1_name" data-node-type="text" data-node-default="Alex Morgan">
            {{member_1_name}}
          </h3>

          <p class="font-['DM Sans'] font-normal text-[14px] md:text-[16px] leading-[100%] text-[#7E7E7E]" data-node="member_1_role" data-node-type="text" data-node-default="Head of Product Engineering">
            {{member_1_role}}
          </p>
        </div>

        <div class="flex flex-col items-start text-center">
          <img src="{{member_2_image}}" data-node="member_2_image" data-node-type="file" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767163100/seltrix/templates/mobile-launch-template/Riyas.webp" class="w-full rounded-[12px] object-cover mb-6" alt>

          <h3 class="font-['DM Sans'] font-medium text-[20px] md:text-[24px] leading-[100%] text-white mb-2" data-node="member_2_name" data-node-type="text" data-node-default="Riyas Patel">
            {{member_2_name}}
          </h3>

          <p class="font-['DM Sans'] font-normal text-[14px] md:text-[16px] leading-[100%] text-[#7E7E7E]" data-node="member_2_role" data-node-type="text" data-node-default="Director of Design & User Experience">
            {{member_2_role}}
          </p>
        </div>

        <div class="flex flex-col items-start text-center">
          <img src="{{member_3_image}}" data-node="member_3_image" data-node-type="file" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767163085/seltrix/templates/mobile-launch-template/Daniel.webp" class="w-full rounded-[12px] object-cover mb-6" alt>

          <h3 class="font-['DM Sans'] font-medium text-[20px] md:text-[24px] leading-[100%] text-white mb-2" data-node="member_3_name" data-node-type="text" data-node-default="Daniel Cho">
            {{member_3_name}}
          </h3>

          <p class="font-['DM Sans'] font-normal text-[14px] md:text-[16px] leading-[100%] text-[#7E7E7E]" data-node="member_3_role" data-node-type="text" data-node-default="Lead Software Architect">
            {{member_3_role}}
          </p>
        </div>

        <div class="flex flex-col items-start text-center">
          <img src="{{member_4_image}}" data-node="member_4_image" data-node-type="file" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767163094/seltrix/templates/mobile-launch-template/Marian.webp" class="w-full rounded-[12px] object-cover mb-6" alt>

          <h3 class="font-['DM Sans'] font-medium text-[20px] md:text-[24px] leading-[100%] text-white mb-2" data-node="member_4_name" data-node-type="text" data-node-default="Marian Gonzalez">
            {{member_4_name}}
          </h3>

          <p class="font-['DM Sans'] font-normal text-[14px] md:text-[16px] leading-[100%] text-[#7E7E7E]" data-node="member_4_role" data-node-type="text" data-node-default="Head of Quality & Testing">
            {{member_4_role}}
          </p>
        </div>
      </div>
    </div>
  </div>
</section>