Professional Landing Page

<!-- Navbar -->
<nav class="flex items-center justify-between px-8 py-6 bg-white shadow-sm">
    <div class="text-2xl font-bold text-blue-600">MyBrand</div>
    <div class="hidden md:flex space-x-8 text-gray-600 font-medium">
        <a href="#" class="hover:text-blue-600 transition">Features</a>
        <a href="#" class="hover:text-blue-600 transition">Pricing</a>
        <a href="#" class="hover:text-blue-600 transition">Contact</a>
    </div>
    <button class="bg-blue-600 text-white px-6 py-2 rounded-full font-semibold hover:bg-blue-700 transition">Get Started</button>
</nav>

<!-- Hero Section -->
<section class="max-w-7xl mx-auto px-8 py-20 flex flex-col md:flex-row items-center">
    <!-- Text Content -->
    <div class="md:w-1/2 space-y-6 text-center md:text-left">
        <h1 class="text-5xl md:text-6xl font-extrabold text-gray-900 leading-tight">
            अपने बिजनेस को <span class="text-blue-600">डिजिटल पहचान</span> दें
        </h1>
        <p class="text-lg text-gray-600 max-w-lg">
            हम आपकी मदद करते हैं एक ऐसा प्रोफेशनल लैंडिंग पेज बनाने में जो न सिर्फ अच्छा दिखता है, बल्कि आपके बिजनेस को सेल और लीड्स लाने में मदद करता है।
        </p>
        <div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4 justify-center md:justify-start">
            <button class="bg-blue-600 text-white px-8 py-4 rounded-lg font-bold text-lg hover:shadow-lg transition">अभी शुरू करें</button>
            <button class="border-2 border-gray-300 text-gray-700 px-8 py-4 rounded-lg font-bold text-lg hover:bg-gray-100 transition">डेमो देखें</button>
        </div>
        <p class="text-sm text-gray-500">✓ No credit card required. ✓ 14-day free trial.</p>
    </div>

    <!-- Image/Illustration -->
    <div class="md:w-1/2 mt-12 md:mt-0 flex justify-center">
        <img src="https://illustrations.popsy.co/blue/remote-work.svg" alt="Landing Page Illustration" class="w-full max-w-md">
    </div>
</section>

<!-- Trust Markers -->
<section class="bg-white py-12 border-t border-b border-gray-100">
    <div class="max-w-7xl mx-auto px-8 text-center">
        <p class="text-gray-400 font-medium uppercase tracking-widest text-sm mb-8">Trusted by 500+ Companies</p>
        <div class="flex flex-wrap justify-center gap-12 grayscale opacity-50">
            <span class="text-2xl font-bold">GOOGLE</span>
            <span class="text-2xl font-bold">AMAZON</span>
            <span class="text-2xl font-bold">SLACK</span>
            <span class="text-2xl font-bold">SPOTIFY</span>
        </div>
    </div>
</section>