Contact Components in Filytreck library

<section class="py-24 md:py-36" style="background: url('fily-assets/gradients/gradient-contact.jpg'); background-size: cover;">
    <div class="container mx-auto px-4">
        <div class="flex flex-wrap -m-8">
            <div class="w-full md:w-1/2 p-8">
                <div class="pt-18">
                    <h2 class="mb-9 font-heading text-4xl md:text-5xl font-bold text-white">Let us know how we can help you</h2>
                    <p class="text-xl text-white font-light leading-normal">Nullam dignissim diam sed velit molestie, at auctor lectus finibus. Phasellus risus nisl, cursus dictum orci fermentum</p>
                </div>
            </div>
            <div class="w-full md:w-1/2 p-8">
                <form action="#" class="pt-24 pb-28 px-16 max-w-2xl mx-auto bg-white bg-opacity-5 w-full rounded-3xl">
                    <div class="flex flex-wrap -m-2.5 mb-4">
                        <div class="w-full md:w-1/2 p-2.5">
                            <label for="contact-input-01-1" class="mb-2 inline-block text-sm text-gray-500 font-medium">First name</label>
                            <input id="contact-input-01-1" type="text" placeholder="Type here" class="w-full bg-transparent px-6 h-14 font-semibold text-white placeholder-gray-500 outline-none focus:border-white border border-gray-500 focus:ring focus:ring-blue-200 rounded-full transition duration-200">
                        </div>
                        <div class="w-full md:w-1/2 p-2.5">
                            <label for="contact-input-01-2" class="mb-2 inline-block text-sm text-gray-500 font-medium">Last name</label>
                            <input id="contact-input-01-2" type="text" placeholder="Type here" class="w-full bg-transparent px-6 h-14 font-semibold text-white placeholder-gray-500 outline-none focus:border-white border border-gray-500 focus:ring focus:ring-blue-200 rounded-full transition duration-200">
                        </div>
                    </div>
                    <div class="flex flex-wrap -m-3 mb-11">
                        <div class="w-full p-3">
                            <label for="contact-input-01-3" class="mb-2 inline-block text-sm text-gray-500 font-medium">Address email</label>
                            <input id="contact-input-01-3" type="text" placeholder="Type here" class="w-full bg-transparent px-6 h-14 font-semibold text-white placeholder-gray-500 outline-none focus:border-white border border-gray-500 focus:ring focus:ring-blue-200 rounded-full transition duration-200">
                        </div>
                        <div class="w-full p-3">
                            <label for="contact-input-01-4" class="mb-2 inline-block text-sm text-gray-500 font-medium">Subject</label>
                            <input id="contact-input-01-4" type="text" placeholder="Type here" class="w-full bg-transparent px-6 h-14 font-semibold text-white placeholder-gray-500 outline-none focus:border-white border border-gray-500 focus:ring focus:ring-blue-200 rounded-full transition duration-200">
                        </div>
                        <div class="w-full p-3">
                            <label for="contact-textarea-01-1" class="mb-2 inline-block text-sm text-gray-500 font-medium">Message</label>
                            <textarea id="contact-textarea-01-1" placeholder="Type message here" class="w-full bg-transparent p-6 h-28 overflow-hidden font-semibold text-white placeholder-gray-500 outline-none focus:border-white border border-gray-500 focus:ring focus:ring-blue-200 rounded-3xl resize-none transition duration-200"></textarea>
                        </div>
                    </div>
                    <button type="submit" class="inline-flex justify-center items-center text-center h-14 py-6 px-10 font-semibold text-white hover:text-white focus:text-white bg-blue-500 hover:bg-blue-600 focus:bg-blue-600 rounded-full focus:ring-4 focus:ring-blue-200 transition duration-200">Send message</button>
                </form>  
            </div>
        </div>
    </div>
</section>

<section class="position-relative py-12 py-lg-24 py-xl-32 overflow-hidden"><img class="position-absolute top-0 start-0 w-100 h-100" style="object-fit: cover;" src="fily-assets/gradients/gradient-contact.jpg" alt="">
  <div class="container position-relative">
    <div class="mw-xl mx-auto mw-lg-none">
      <div class="row">
        <div class="col-lg-6 mb-16 mb-lg-0">
          <div class="mw-xl pt-lg-20">
            <h2 class="font-heading text-white mb-10">Let us know how we can help you</h2>
            <p class="mw-md mw-xl-lg fs-6 text-white fw-light">Nullam dignissim diam sed velit molestie, at auctor lectus finibus. Phasellus risus nisl, cursus dictum orci fermentum</p>
          </div>
        </div>
        <div class="col-lg-6">
          <div class="bg-light-dark bg-opacity-10 pt-24 pb-28 px-8 px-sm-14 rounded-3">
            <form action="">
              <div class="row">
                <div class="col-md-6 mb-6">
                  <label class="mb-1 fs-9 fw-medium text-light-dark" for="">First name</label>
                  <input class="form-control fs-8 text-white bg-transparent border border-secondary" type="text">
                </div>
                <div class="col-md-6 mb-6">
                  <label class="mb-1 fs-9 fw-medium text-light-dark" for="">Last name</label>
                  <input class="form-control fs-8 text-white bg-transparent border border-secondary" type="text">
                </div>
                <div class="col-12 mb-6">
                  <label class="mb-1 fs-9 fw-medium text-light-dark" for="">Address email</label>
                  <input class="form-control fs-8 text-white bg-transparent border border-secondary" type="email">
                </div>
                <div class="col-12 mb-6">
                  <label class="mb-1 fs-9 fw-medium text-light-dark" for="">Subject</label>
                  <input class="form-control fs-8 text-white bg-transparent border border-secondary" type="text">
                </div>
                <div class="col-12 mb-16">
                  <label class="mb-1 fs-9 fw-medium text-light-dark" for="">Message</label>
                  <textarea class="form-control fs-8 text-white bg-transparent rounded-3 border border-secondary" name="" id="" style="height: 124px; resize: none;"></textarea>
                </div>
                <div class="col-12">
                  <button class="btn px-10 py-5 btn-primary" type="submit">Send message</button>
                </div>
              </div>
            </form>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>