@php
    $brand = $site->brand_name ?? 'Astroloji Danışmanlığı';
@endphp
<header x-data="{ open: false, scrolled: false }" x-init="window.addEventListener('scroll', () => scrolled = window.scrollY > 12)"
    {{-- bg-ink-950 statik: Alpine yüklenmese/gecikse bile koyu zemin garanti (beyaz üstüne beyaz yazı bug'ı) --}}
    class="sticky top-0 z-50 bg-ink-950 transition-colors"
    :class="scrolled ? 'bg-ink-950/95 backdrop-blur border-b border-white/10 shadow-lg' : ''">
    <div class="mx-auto flex max-w-7xl items-center justify-between px-6 py-4 lg:px-8">
        <a href="{{ route('sitebuilder.home') }}" class="flex items-center gap-2 font-display text-xl font-semibold text-white">
            <span class="flex h-9 w-9 items-center justify-center rounded-full bg-gradient-to-br from-brand-400 to-gold-500 text-ink-950">✦</span>
            {{ $brand }}
        </a>

        <nav class="hidden items-center gap-8 text-sm font-medium text-white/80 lg:flex">
            <a href="{{ route('sitebuilder.services.index') }}" class="hover:text-gold-400 {{ request()->routeIs('sitebuilder.services.*') ? 'text-gold-400' : '' }}">Hizmetler</a>
            <a href="{{ route('sitebuilder.about') }}" class="hover:text-gold-400 {{ request()->routeIs('sitebuilder.about') ? 'text-gold-400' : '' }}">Hakkımda</a>
            <a href="{{ route('sitebuilder.pricing') }}" class="hover:text-gold-400 {{ request()->routeIs('sitebuilder.pricing') ? 'text-gold-400' : '' }}">Paketler</a>
            <a href="{{ route('sitebuilder.blog.index') }}" class="hover:text-gold-400 {{ request()->routeIs('sitebuilder.blog.*') ? 'text-gold-400' : '' }}">Blog</a>
            <a href="{{ route('sitebuilder.faq') }}" class="hover:text-gold-400 {{ request()->routeIs('sitebuilder.faq') ? 'text-gold-400' : '' }}">SSS</a>
        </nav>

        <div class="hidden items-center gap-3 lg:flex">
            <a href="{{ route('sitebuilder.astro-bilge-yorum') }}" class="text-sm font-semibold text-white/80 hover:text-gold-400">Astro Bilge'den Yorum Al</a>

            <a href="{{ route('sitebuilder.randevu') }}" class="rounded-full bg-gradient-to-r from-brand-500 to-brand-600 px-5 py-2.5 text-sm font-semibold text-white shadow-glow transition hover:opacity-90">
                Randevu Al
            </a>
        </div>

        <button @click="open = !open" class="text-white lg:hidden" aria-label="Menü">
            <svg xmlns="http://www.w3.org/2000/svg" class="h-7 w-7" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                <path x-show="!open" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8" d="M4 6h16M4 12h16M4 18h16" />
                <path x-show="open" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8" d="M6 18L18 6M6 6l12 12" />
            </svg>
        </button>
    </div>

    <div x-show="open" x-collapse x-cloak class="border-t border-white/10 bg-ink-950 px-6 py-4 lg:hidden">
        <div class="flex flex-col gap-4 text-white/85">
            <a href="{{ route('sitebuilder.services.index') }}">Hizmetler</a>
            <a href="{{ route('sitebuilder.about') }}">Hakkımda</a>
            <a href="{{ route('sitebuilder.pricing') }}">Paketler</a>
            <a href="{{ route('sitebuilder.blog.index') }}">Blog</a>
            <a href="{{ route('sitebuilder.faq') }}">SSS</a>
            <a href="{{ route('sitebuilder.astro-bilge-yorum') }}">Astro Bilge'den Yorum Al</a>

            <a href="{{ route('sitebuilder.randevu') }}" class="mt-2 rounded-full bg-gradient-to-r from-brand-500 to-brand-600 px-5 py-2.5 text-center text-sm font-semibold text-white">
                Randevu Al
            </a>
        </div>
    </div>
</header>