t-{id} Tema Yapisi

Minimal Subheader (Hero Degil!)

{{-- MINIMAL SUBHEADER - Sadece breadcrumb + title --}}
<section class="bg-gray-50 dark:bg-gray-800 border-b border-gray-200 dark:border-gray-700">
    <div class="container mx-auto px-4 sm:px-6 md:px-8 lg:px-12 xl:px-16 2xl:px-20 py-4">
        <!-- Breadcrumb -->
        <nav class="text-sm text-gray-500 dark:text-gray-400 mb-2">
            @foreach($breadcrumbsArray as $index => $crumb)
                ...
            @endforeach
        </nav>
        <!-- Title -->
        <h1 class="text-2xl md:text-3xl font-bold font-heading text-gray-900 dark:text-white">{{ $title }}</h1>
    </div>
</section>

Iki Kolonlu Layout (show.blade.php)

{{-- 5 kolon grid: 3 icerik + 2 sidebar --}}
<div class="grid grid-cols-1 lg:grid-cols-5 gap-8 lg:gap-12">

    <!-- SOL: Ana Icerik (3 kolon) -->
    <article class="lg:col-span-3">
        <div class="prose prose-base max-w-none dark:prose-invert font-body">
            @parsewidgets($body ?? '')
        </div>
    </article>

    <!-- SAG: Gorsel + Iletisim (2 kolon) -->
    <aside class="lg:col-span-2">
        <div class="sticky top-24 space-y-6">
            <!-- Kare Gorsel -->
            <figure class="rounded-2xl overflow-hidden shadow-2xl">
                <a href="{{ $image->getUrl() }}" class="glightbox">
                    <img class="w-full aspect-square object-cover">
                </a>
            </figure>
            <!-- Iletisim Karti -->
            ...
        </div>
    </aside>

</div>

Iletisim Karti (ixtif.com Stili)

{{-- 2 kolonlu minimal tasarim --}}
<div class="bg-white dark:bg-gray-800 rounded-xl shadow-lg border border-gray-200 dark:border-gray-700 p-4">
    <div class="grid grid-cols-2 gap-2">
        @if($sitePhone)
            <a href="tel:..." class="flex items-center gap-3 bg-gray-100 dark:bg-gray-700 hover:bg-gray-200 dark:hover:bg-gray-600 rounded-lg p-3 transition-all">
                <i class="fa-solid fa-phone text-primary-600"></i>
                <div>
                    <div class="text-xs text-gray-500">Telefon</div>
                    <div class="text-sm font-semibold text-gray-900 dark:text-white">{{ $sitePhone }}</div>
                </div>
            </a>
        @endif
        @if($whatsappUrl)
            <a href="{{ $whatsappUrl }}" class="flex items-center gap-3 ...">
                <i class="fa-brands fa-whatsapp text-green-600"></i>
                <div>
                    <div class="text-xs">WhatsApp</div>
                    <div class="text-sm font-semibold">Hemen Yazin</div>
                </div>
            </a>
        @endif
    </div>
</div>

Kare Kart Pattern (index + related services)

{{-- Kare gorsel + gradient + beyaz yazi --}}
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4 md:gap-6">
    @foreach ($items as $item)
        <a href="..." class="group relative aspect-square rounded-xl overflow-hidden shadow-lg hover:shadow-xl transition-all duration-300">

            <!-- Gorsel -->
            <img class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500">

            <!-- Gradient Overlay -->
            <div class="absolute inset-0 bg-gradient-to-t from-black/70 via-black/20 to-transparent"></div>

            <!-- Baslik (Beyaz) -->
            <div class="absolute bottom-0 left-0 right-0 p-4">
                <h2 class="text-base md:text-lg font-semibold text-white font-heading drop-shadow-lg">{{ $title }}</h2>
            </div>

        </a>
    @endforeach
</div>

// DIKKAT: Kart hover'da ziplamasin!
// hover:-translate-y-2 KULLANMA!
// Sadece: hover:shadow-xl ve group-hover:scale-105 (gorsel icin)

Font Class'lari