scripts/templates/tailwind_hero.html

<header class="bg-white">
    <div class="container mx-auto px-4 py-12 max-w-6xl">
        <div class="flex flex-col md:flex-row items-center justify-between">
            <div class="md:w-1/2 mb-8 md:mb-0 md:pr-12">
                <h1 class="text-4xl md:text-5xl font-bold mb-4">Interactive Python Learning with <span class="text-primary">Marimo</span></h1>
                <p class="text-lg text-gray-600 mb-6">Explore our collection of interactive notebooks for Python, data science, and machine learning.</p>
                <div class="flex flex-wrap gap-4">
                    <a href="#courses" class="bg-primary hover:bg-dark-green text-white font-medium py-2 px-6 rounded-md transition duration-300">Explore Courses</a>
                    <a href="https://github.com/marimo-team/learn" target="_blank" class="bg-white border border-gray-300 hover:border-primary text-gray-700 font-medium py-2 px-6 rounded-md transition duration-300">View on GitHub</a>
                </div>
            </div>
            <div class="md:w-1/2">
                <div class="bg-light p-1 rounded-lg">
                    <img src="https://marimo.io/logo-glow.png" alt="Marimo Logo" class="w-64 h-64 mx-auto object-contain">
                </div>
            </div>
        </div>
    </div>
</header>