<div class="hero min-h-[95vh] relative overflow-hidden">
  <!-- Video Background -->
  <video 
    autoplay 
    muted 
    loop 
    playsinline
    class="absolute top-0 left-0 w-full h-full object-cover z-0"
  >
    <source src="https://videos.pexels.com/video-files/7513671/7513671-uhd_2560_1440_24fps.mp4" type="video/mp4">
    Your browser does not support the video tag.
  </video>

  <div class="hero-overlay bg-opacity-60 z-10"></div>
  <div class="hero-content text-center text-neutral-content w-full z-20">
    <div class="max-w-full">
      <h1 class="mb-8 text-7xl md:text-8xl lg:text-9xl font-display font-bold tracking-tight">Standard Marine GCC</h1>
      <p class="mb-8 text-xl md:text-2xl font-body font-normal tracking-normal opacity-60">Your Premier Maritime Solutions Partner in the Gulf Cooperation Council</p>
      <button class="btn btn-secondary btn-lg font-display normal-case text-lg">Contact Us</button>
    </div>
  </div>
</div>

<!-- Overlapping card for transition -->
<div class="relative -mt-20 mx-auto max-w-7xl px-4 z-30">
  <div class="card bg-base-100 shadow-xl">
    <div class="card-body text-center py-12">
      <h2 class="text-2xl font-display font-bold mb-4">Excellence in Maritime Services</h2>
      <p class="text-lg opacity-80 max-w-3xl mx-auto">With decades of experience in the maritime industry, we provide comprehensive solutions tailored to your needs.</p>
    </div>
  </div>
</div> 