---
// src/components/SubpageGewerbe.astro
---
<!-- Subpage: Gewerbe -->
<div x-show="currentPage === 'page-gewerbe'" x-cloak x-transition:enter="transition ease-out duration-500" x-transition:enter-start="opacity-0 translate-y-4" x-transition:enter-end="opacity-100 translate-y-0" class="min-h-screen pt-28 pb-24 px-6 lg:px-8">
    <div class="max-w-6xl mx-auto space-y-12">
        <button @click="currentPage = 'main'" class="text-stone-400 hover:text-white transition-colors font-semibold text-xs uppercase tracking-wider flex items-center gap-2 bg-stone-900 px-5 py-2.5 rounded-lg border border-stone-800 hover:border-stone-700">
            <i class="fa-solid fa-arrow-left"></i> Zurück zur Übersicht
        </button>
        <div class="border-b border-stone-800 pb-6">
            <span class="text-xs text-amber-500 font-mono uppercase tracking-widest block mb-2">Projekt-Analyse // ID: RT-2026-03</span>
            <h1 class="text-4xl sm:text-5xl font-luxury font-bold text-white mb-4">Das blühende Schwammstadt-Biotop</h1>
            <p class="text-stone-400 text-lg font-light leading-relaxed max-w-3xl">
                In einem Neubaugebiet staute sich das Regenwasser. Statt es einfach in die Kanalisation zu leiten, bauten wir ein unterirdisches Rigolensystem und tarnten es an der Oberfläche als wunderschönes Sumpfbiotop. Bei Starkregen saugt der Garten das Wasser auf wie ein Schwamm.
            </p>
        </div>
        <div class="glass p-8 rounded-2xl"><div class="relative w-full h-[320px]"><canvas id="subChartGantt"></canvas></div></div>
    </div>
</div>