<section class="bg-gray-900 text-white py-20">
  <div class="container mx-auto text-center">
    <h1 class="text-4xl md:text-6xl font-bold mb-4">
      Welcome to Your Dream Platform
    </h1>
    <p class="text-lg md:text-xl mb-8">
      Experience the next generation of innovation and creativity.
    </p>
    <a href="#get-started" class="bg-blue-500 text-white px-8 py-3 rounded-full text-lg font-medium hover:bg-blue-600 transition duration-300">
      Get Started
    </a>
  </div>
</section>

<section class="bg-gradient-to-r from-purple-500 to-blue-500 text-white py-24">
  <div class="container mx-auto text-center">
    <h1 class="text-4xl md:text-5xl font-bold mb-4">
      Supercharge Your Workflow
    </h1>
    <p class="text-lg md:text-xl mb-8">
      A powerful suite of tools to help you achieve more.
    </p>
    <div class="flex justify-center space-x-6 mb-8">
      <div class="bg-white text-purple-600 p-4 rounded-full shadow-lg">
        <svg class="h-12 w-12" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"></path>
        </svg>
      </div>
      <div class="bg-white text-purple-600 p-4 rounded-full shadow-lg">
        <svg class="h-12 w-12" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h8m-8 6h16"></path>
        </svg>
      </div>
      <div class="bg-white text-purple-600 p-4 rounded-full shadow-lg">
        <svg class="h-12 w-12" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4h16v16H4V4z"></path>
        </svg>
      </div>
    </div>
    <a href="#features" class="bg-white text-purple-600 px-8 py-3 rounded-full text-lg font-medium hover:bg-gray-200 transition">
      Get Started
    </a>
  </div>
</section>

<section class="relative bg-cover bg-center h-screen" style="background-image: url('/ui/images/bald-eagle.jpg');">
  <div class="absolute inset-0 bg-black bg-opacity-50"></div>
  <div class="container mx-auto h-full flex flex-col justify-center items-center relative z-10">
    <h1 class="text-4xl md:text-5xl lg:text-7xl font-bold text-white text-center">
      Elevate Your Business
    </h1>
    <p class="text-lg md:text-xl text-white text-center mt-4 mb-8">
      Discover the path to innovation and growth.
    </p>
    <a href="#services" class="bg-white text-black px-8 py-3 rounded-full font-medium text-lg hover:bg-gray-300 transition">
      Learn More
    </a>
  </div>
</section>

<section class="bg-gray-100 py-16 px-4 md:px-8">
  <div class="container mx-auto flex flex-col md:flex-row items-center">
    <div class="w-full md:w-1/2">
      <img src="/ui/images/product-square.jpg" alt="Product Image" class="w-full rounded-lg shadow-lg">
    </div>
    <div class="w-full md:w-1/2 md:pl-10 mt-10 md:mt-0">
      <h1 class="text-4xl md:text-5xl font-bold">
        The Ultimate Solution for Your Needs
      </h1>
      <p class="text-lg mt-4 mb-6">
        Discover the most powerful and easy-to-use solution designed to help you excel in your business.
      </p>
      <a href="#about" class="bg-blue-500 text-white px-6 py-3 rounded-full text-lg font-medium hover:bg-blue-600 transition">
        Explore More
      </a>
    </div>
  </div>
</section>

<section class="relative h-screen overflow-hidden">
  <video autoplay muted loop class="absolute inset-0 w-full h-full object-cover">
    <source src="/ui/video/flight-acrobatics.mp4" type="video/mp4">
  </video>
  <div class="absolute inset-0 bg-black bg-opacity-40"></div>
  <div class="relative z-10 h-full flex flex-col justify-center items-center text-center">
    <h1 class="text-white text-4xl md:text-6xl font-bold">
      Welcome to the Future of Technology
    </h1>
    <p class="text-white text-lg md:text-xl mt-4 mb-8">
      Where innovation meets inspiration.
    </p>
    <a href="#discover" class="bg-red-500 text-white px-8 py-3 rounded-full text-lg font-medium hover:bg-red-600 transition">
      Discover More
    </a>
  </div>
</section>