@extends('layouts.site', ['header' => 'partials.header-yapay-zeka', 'footer' => 'partials.footer'])

@php
    $pageHero = $pageHero ?? \App\Support\PageTemplateHero::resolveForPage($page ?? null, 'services.yapay-zeka');

    $socialLinks = setting('social_links');
    $sameAs = [];
    if ($socialLinks) {
        $links = is_string($socialLinks) ? json_decode($socialLinks, true) : $socialLinks;
        if (is_array($links)) {
            foreach ($links as $platform => $url) {
                if (!empty($url)) {
                    $sameAs[] = $url;
                }
            }
        }
    }
    if (empty($sameAs)) {
        $sameAs = [
            "https://www.facebook.com/truncgil",
            "https://www.instagram.com/truncgil",
            "https://www.linkedin.com/company/truncgil-technology"
        ];
    }
@endphp

@push('head')
@if($pageHero)
    @if(!empty($pageHero['from_upload']))
    <link rel="preload" as="image" href="{{ $pageHero['image'] }}" fetchpriority="high">
    @elseif(!empty($pageHero['webp']))
    <link rel="preload" as="image" href="{{ asset($pageHero['webp']) }}" type="image/webp" fetchpriority="high">
    @endif
@endif
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@graph": [
    {
      "@type": "ProfessionalService",
      "@id": "{{ url()->current() }}#organization",
      "name": "{{ setting('site_name', 'Trunçgil Teknoloji') }}",
      "image": "{{ setting('site_logo') ? (str_starts_with(setting('site_logo'), 'http') ? setting('site_logo') : asset('storage/' . ltrim(setting('site_logo'), '/'))) : asset('assets/img/logo.png') }}",
      "url": "{{ url('/') }}",
      "telephone": "{{ setting('contact_phone', '+902244431620') }}",
      "priceRange": "$$$",
      "address": {
        "@type": "PostalAddress",
        "streetAddress": "{{ setting('contact_address', 'Ulutek Teknoloji Geliştirme Bölgesi, Görükle Kampüsü, No: 104') }}"
      },
      "sameAs": {!! json_encode($sameAs, JSON_UNESCAPED_SLASHES | JSON_UNESCAPED_UNICODE) !!}
    },
    {
      "@type": "Service",
      "@id": "{{ url()->current() }}#service",
      "serviceType": "Artificial Intelligence Development",
      "provider": {
        "@id": "{{ url()->current() }}#organization"
      },
      "name": {!! json_encode(t('Yapay Zeka ve Derin Öğrenme Geliştirme Hizmeti')) !!},
      "description": {!! json_encode(t('PyTorch ve TensorFlow ile veri modellemeden Edge AI yayınına kadar tam teşekküllü yapay zeka, LoRA fine-tuning ve makine öğrenmesi sistemleri geliştiriyoruz.')) !!},
      "areaServed": [
        {
          "@type": "AdministrativeArea",
          "name": "Bursa"
        },
        {
          "@type": "AdministrativeArea",
          "name": "Türkiye"
        },
        {
          "@type": "AdministrativeArea",
          "name": "Global"
        }
      ],
      "hasOfferCatalog": {
        "@type": "OfferCatalog",
        "name": "Yapay Zeka Hizmetleri",
        "itemListElement": [
          {
            "@type": "Offer",
            "itemOffered": {
              "@type": "Service",
              "name": "LLM Fine-Tuning (LoRA/QLoRA)"
            }
          },
          {
            "@type": "Offer",
            "itemOffered": {
              "@type": "Service",
              "name": "Computer Vision & Edge AI"
            }
          },
          {
            "@type": "Offer",
            "itemOffered": {
              "@type": "Service",
              "name": "Data Pipeline Optimization"
            }
          }
        ]
      }
    }
  ]
}
</script>
@endpush

@push('styles')
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
<style>
    .ai-dev-section .material-symbols-outlined {
        font-family: 'Material Symbols Outlined' !important;
        font-weight: normal !important;
        font-style: normal !important;
        line-height: 1 !important;
        letter-spacing: normal !important;
        text-transform: none !important;
        display: inline-block;
        white-space: nowrap;
        word-wrap: normal;
        direction: ltr;
        -webkit-font-smoothing: antialiased;
        font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    }

    .ai-dev-section .accordion-wrapper .card-header button.collapsed {
        color: #343f52 !important;
    }
    .ai-dev-section .accordion-wrapper .card-header button:hover,
    .ai-dev-section .accordion-wrapper .card-header button {
        color: #e31e24 !important;
    }

    /* Technology Card Micro-animations */
    .ai-card {
        transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.4s ease;
    }
    .ai-card:hover {
        transform: translateY(-8px) scale(1.03);
        box-shadow: 0 1.25rem 2.5rem rgba(227, 30, 36, 0.12) !important;
    }

    /* Header adjustments to overlay the gradient */
    body:has(.ai-dev-hero) > header {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 1030;
        background: transparent !important;
    }
    body:has(.ai-dev-hero) > header .navbar.transparent:not(.fixed):not(.navbar-clone) {
        background: transparent !important;
        box-shadow: none !important;
    }

    .bg-gradient-ai {
        background: linear-gradient(180deg, #f3f0ff 0%, rgba(255, 255, 255, 0) 100%) !important;
    }
    .btn-soft-ai {
        background-color: #f3f0ff !important;
        color: #6a1b9a !important;
    }

    .matrix-table {
        border-radius: 12px;
        overflow: hidden;
        box-shadow: 0 0.25rem 1.75rem rgba(30, 34, 40, 0.05);
        border: 1px solid rgba(0,0,0,0.05);
    }
    .matrix-table th {
        background-color: #f8f9fa;
        color: #343f52;
        font-weight: 700;
        text-transform: uppercase;
        font-size: 0.85rem;
    }
    .matrix-table td, .matrix-table th {
        padding: 1.25rem;
        vertical-align: middle;
    }
    .matrix-table tbody tr:not(:last-child) {
        border-bottom: 1px solid rgba(0,0,0,0.05);
    }
    .matrix-table tbody tr:hover {
        background-color: #fcfcfc;
    }
</style>
@endpush

@section('content')

@php
    $contactUrl = route('page.show', ['slug' => 'iletisim']);
@endphp

{{-- Hero Section --}}
<section class="wrapper bg-gradient-ai ai-dev-hero relative overflow-hidden">
    <div class="container pt-24 xl:pt-32 lg:pt-32 md:pt-32 pb-[4.5rem] xl:pb-32 lg:pb-32 md:pb-32">
        <div class="flex flex-wrap mx-[-15px] !text-center">
            <div class="xl:w-10/12 lg:w-10/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto ai-dev-hero-text" data-cues="zoomIn" data-group="welcome" data-interval="-200">
                <h1 class="xl:!text-[2.6rem] !text-[calc(1.375rem_+_1.5vw)] !leading-[1.15] font-bold !mb-4">
                    {!! t('Yapay Zeka ve Derin Öğrenme') !!} <br/><span class="text-gradient gradient-7">{!! t('Ekosistemine Hükmedin') !!}</span>
                </h1>
                <p class="lead !text-[1.2rem] leading-normal md:!px-5 xl:!px-20 xxl:!px-10 !mb-7">
                    {!! t('PyTorch ve TensorFlow ile ham verinin işlenmesinden modelin production ortamına alınmasına kadar olan tüm döngüyü yöneten yüksek performanslı Yapay Zeka sistemleri inşa ediyoruz.') !!}
                </p>
            </div>
        </div>
        <div class="flex justify-center" data-cues="slideInDown" data-group="join" data-delay="900">
            <span><a href="#detaylar" class="btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:!bg-[#c4191f] hover:!border-[#c4191f] hover:!text-white active:!bg-[#a61217] !rounded-[50rem] mx-2 font-semibold shadow-[0_10px_20px_-10px_rgba(227,30,36,0.5)] transition-all duration-300">{!! t('Teknolojileri İnceleyin') !!}</a></span>
            <span><a href="{{ $contactUrl }}" class="btn btn-lg btn-outline-primary !text-[#e31e24] !bg-white border-[#e31e24] hover:!text-white hover:!bg-[#e31e24] hover:!border-[#e31e24] active:!bg-[#e31e24] active:!text-white !rounded-[50rem] !border-[#e31e24] mx-2 font-semibold shadow-[0_10px_20px_-10px_rgba(30,34,40,0.15)] transition-all duration-300">{!! t('Bize Ulaşın') !!}</a></span>
        </div>
        <div class="flex flex-wrap mx-[-15px] !mt-[3.5rem]" data-cue="fadeIn" data-delay="1600" data-duration="400">
            <div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto text-center">
                <figure class="m-0 p-0 inline-block">
                    <img src="{{ asset('assets/img/gsap/yapay-zeka.webp') }}" class="max-w-full h-auto rounded-lg shadow-2xl" alt="{{ t('Trunçgil Teknoloji Yapay Zeka') }}" />
                </figure>
            </div>
        </div>
    </div>
</section>

{{-- Tech Detail Section --}}
<section id="detaylar" class="wrapper !bg-[#ffffff] ai-dev-section">
    <div class="container pt-[4.5rem] pb-[4.5rem] xl:pt-24 xl:pb-24 lg:pt-24 lg:pb-24 md:pt-24 md:pb-24">
        
        <div class="flex flex-wrap mx-[-15px] !text-center">
            <div class="lg:w-10/12 xl:w-9/12 xxl:w-8/12 flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !relative" data-cues="slideInUp" data-group="tech-header" data-duration="400">
                <h2 class="!text-[0.8rem] !leading-[1.35] !tracking-[0.02rem] uppercase !text-[#74788d] !mb-3">{!! t('Teknik Altyapı') !!}</h2>
                <h3 class="xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] font-semibold !leading-[1.2] !mb-12 lg:!px-5 xl:!px-0 xxl:!px-6">
                    {!! t('Modellemeden Üretime') !!} <span class="text-gradient gradient-7">{!! t('İki Dev Motor') !!}</span>
                </h3>
                <p class="mb-10 text-muted">{!! t('Derin öğrenme ekosisteminde PyTorch ve TensorFlow, veri hatlarından dağıtık eğitime kadar sistem mimarilerini şekillendiren en güçlü kütüphanelerdir.') !!}</p>
            </div>
        </div>

        <div class="flex flex-wrap mx-[-15px] mt-10">
            {{-- Data Pipeline --}}
            <div class="md:w-6/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full mb-8" data-cue="slideInUp">
                <div class="card h-full !border-[#e2e8f0] border-solid border shadow-sm !rounded-[1rem] p-8 ai-card">
                    <div class="flex items-center mb-4">
                        <span class="material-symbols-outlined !text-[2rem] text-[#e31e24] mr-3">schema</span>
                        <h4 class="!text-[1.25rem] font-bold mb-0">{!! t('1. Veri Modelleme ve Giriş Hattı') !!}</h4>
                    </div>
                    <p class="text-muted !text-[0.9rem] mb-4">{!! t('Derin öğrenme modellerinde performansın %70\'i verinin GPU/TPU birimlerine ne kadar efektif beslendiğiyle (throughput) ilişkilidir. Her iki kütüphane de asenkron veri işlemek için optimize edilmiştir:') !!}</p>
                    <ul class="pl-4 mb-0 text-[0.85rem]">
                        <li class="mb-2"><strong>PyTorch (<code class="bg-[#f1f5f9] px-1 rounded">torch.utils.data</code>):</strong> <code class="bg-[#f1f5f9] px-1 rounded">Dataset</code> ve <code class="bg-[#f1f5f9] px-1 rounded">DataLoader</code> soyutlamaları. Özel veri okuma için sihirli metotlar (<code class="bg-[#f1f5f9] px-1 rounded">__len__</code>, <code class="bg-[#f1f5f9] px-1 rounded">__getitem__</code>) ezilir. RAM/GPU transferi <code class="bg-[#f1f5f9] px-1 rounded">num_workers</code> ile paralelleştirilir.</li>
                        <li><strong>TensorFlow (<code class="bg-[#f1f5f9] px-1 rounded">tf.data</code>):</strong> Tamamen veri akış grafiği mantığı. Diskteki büyük veriler için <strong>TFRecord</strong> yapıları. <code class="bg-[#f1f5f9] px-1 rounded">.prefetch(tf.data.AUTOTUNE)</code> ile darboğaz önleme mekanizmaları.</li>
                    </ul>
                </div>
            </div>

            {{-- Model Architecture --}}
            <div class="md:w-6/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full mb-8" data-cue="slideInUp">
                <div class="card h-full !border-[#e2e8f0] border-solid border shadow-sm !rounded-[1rem] p-8 ai-card">
                    <div class="flex items-center mb-4">
                        <span class="material-symbols-outlined !text-[2rem] text-[#6a1b9a] mr-3">architecture</span>
                        <h4 class="!text-[1.25rem] font-bold mb-0">{!! t('2. Model Yapılandırma ve Mimari Tasarım') !!}</h4>
                    </div>
                    <p class="text-muted !text-[0.9rem] mb-4">{!! t('Modellerin katman katman örüldüğü ve fonksiyonların tanımlandığı aşamadır. İki çerçevenin felsefi ayrımı burada netleşir:') !!}</p>
                    <ul class="pl-4 mb-0 text-[0.85rem]">
                        <li class="mb-2"><strong>PyTorch (Dinamik Grafik):</strong> <strong>Eager Execution</strong> esasıyla satır satır işletilir. <code class="bg-[#f1f5f9] px-1 rounded">nn.Module</code> sınıflarında veri akışı <code class="bg-[#f1f5f9] px-1 rounded">forward</code> fonksiyonunda manuel yönetilir. Python <code class="bg-[#f1f5f9] px-1 rounded">pdb</code> ile hata ayıklama kolaylığı.</li>
                        <li><strong>TensorFlow / Keras 3 (Statik ve Esnek):</strong> Keras 3 ile backend olarak TF, PyTorch veya JAX seçilebilir. JIT derleme için <code class="bg-[#f1f5f9] px-1 rounded">@tf.function</code> dekoratörüyle C++ grafik optimizasyonu.</li>
                    </ul>
                </div>
            </div>

            {{-- Training & Gradients --}}
            <div class="md:w-6/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full mb-8" data-cue="slideInUp">
                <div class="card h-full !border-[#e2e8f0] border-solid border shadow-sm !rounded-[1rem] p-8 ai-card">
                    <div class="flex items-center mb-4">
                        <span class="material-symbols-outlined !text-[2rem] text-[#2563eb] mr-3">model_training</span>
                        <h4 class="!text-[1.25rem] font-bold mb-0">{!! t('3. Model Eğitimi & Dağıtık Öğrenme') !!}</h4>
                    </div>
                    <p class="text-muted !text-[0.9rem] mb-2"><strong>Gradiyen Hesaplama:</strong></p>
                    <ul class="pl-4 mb-4 text-[0.85rem]">
                        <li><strong>PyTorch (Autograd):</strong> <code class="bg-[#f1f5f9] px-1 rounded">loss.backward()</code> ile gradyan zinciri hesaplanır. Her döngüde <code class="bg-[#f1f5f9] px-1 rounded">optimizer.zero_grad()</code> ile gradyanların sıfırlanması kritiktir.</li>
                        <li><strong>TensorFlow:</strong> Açık bağlam yöneticisi (<code class="bg-[#f1f5f9] px-1 rounded">tf.GradientTape</code>) içinde gradyanlar hesaplanıp optimizer'a beslenir.</li>
                    </ul>
                    <p class="text-muted !text-[0.9rem] mb-2"><strong>Dağıtık Eğitim:</strong></p>
                    <p class="text-[0.85rem] mb-0">{!! t('Büyük modelleri GPU\'lara sığdırmak için PyTorch <strong>DDP/FSDP</strong> (Ring-AllReduce) kullanırken, TensorFlow <strong>MirroredStrategy</strong> mimarisi ile kod değiştirmeden eğitimi ölçeklendirir.') !!}</p>
                </div>
            </div>

            {{-- Fine-Tuning & PEFT --}}
            <div class="md:w-6/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full mb-8" data-cue="slideInUp">
                <div class="card h-full !border-[#e2e8f0] border-solid border shadow-sm !rounded-[1rem] p-8 ai-card">
                    <div class="flex items-center mb-4">
                        <span class="material-symbols-outlined !text-[2rem] text-[#059669] mr-3">tune</span>
                        <h4 class="!text-[1.25rem] font-bold mb-0">{!! t('4. İnce Ayar (PEFT) ve Tuning') !!}</h4>
                    </div>
                    <p class="text-muted !text-[0.9rem] mb-4">{!! t('Milyarlarca parametreli (LLM/Vision) modelleri devasa donanım maliyetleri olmadan özel görevlere uyarlıyoruz:') !!}</p>
                    <ul class="pl-4 mb-4 text-[0.85rem]">
                        <li class="mb-2"><strong>LoRA (Low-Rank Adaptation):</strong> Orijinal model dondurulur, değişim matrisi düşük boyutlu iki matris ($A \times B$) olarak eğitilir. Parametre sayısı %99 azalır.</li>
                        <li class="mb-2"><strong>QLoRA (Quantized LoRA):</strong> Ağırlıklar 4-bit (NF4) hassasiyete sıkıştırılıp VRAM %75 düşürülürken adaptörler 16-bit eğitilir.</li>
                    </ul>
                    <p class="text-[0.85rem] mb-0"><strong>Hiperparametre Tuning:</strong> {!! t('Ray Tune veya Optuna ile ASHA erken durdurma algoritmaları entegre edilerek optimum parametreler taranır.') !!}</p>
                </div>
            </div>
        </div>

        {{-- Deployment Matrix --}}
        <div class="flex flex-wrap mx-[-15px] mt-10">
            <div class="w-full flex-[0_0_auto] !px-[15px] max-w-full" data-cue="slideInUp">
                <div class="text-center mb-6">
                    <h4 class="!text-[1.5rem] font-bold">{!! t('5. Sistemler ve Yaygınlaştırma (Deployment) Mimarileri') !!}</h4>
                    <p class="text-muted">{!! t('Eğitim sonrası modellerin düşük gecikmeli (low latency) ve ölçeklenebilir çıkarım (inference) sunması için altyapı matrisimiz.') !!}</p>
                </div>
                <div class="table-responsive">
                    <table class="table matrix-table w-full text-left">
                        <thead>
                            <tr>
                                <th>{!! t('Aşama / İhtiyaç') !!}</th>
                                <th>PyTorch Ekosistemi</th>
                                <th>TensorFlow Ekosistemi</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td class="font-semibold">{!! t('Model Derleme & Optimizasyon') !!}</td>
                                <td><strong>TorchScript</strong> (C++ runtime çevirisi) veya <strong>PyTorch 2.x <code>torch.compile</code></strong> (Inductor compiler altyapısı).</td>
                                <td><strong>XLA (Accelerated Linear Algebra)</strong> derleyicisi grafikleri optimize eder, operasyonları birleştirir.</td>
                            </tr>
                            <tr>
                                <td class="font-semibold">{!! t('Büyük Ölçekli Sunum (Production)') !!}</td>
                                <td><strong>TorchServe</strong> veya NVIDIA Triton Inference Server.</td>
                                <td><strong>TensorFlow Serving</strong>: Dinamik versiyonlama, A/B testi, gRPC/REST desteği.</td>
                            </tr>
                            <tr>
                                <td class="font-semibold">{!! t('Mobil ve Uç Cihazlar (Edge AI)') !!}</td>
                                <td><strong>ExecuTorch</strong>: Gelişmiş gömülü sistemler ve mobil çalışma zamanı.</td>
                                <td><strong>LiteRT / TensorFlow Lite</strong>: 8-bit quantization ve pruning destekli olgun ekosistem.</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</section>

{{-- Capabilities Section --}}
<section class="wrapper bg-soft-primary ai-dev-section">
    <div class="container pt-[4.5rem] pb-[4.5rem] xl:pt-24 xl:pb-24 lg:pt-24 lg:pb-24 md:pt-24 md:pb-24">
        <div class="flex flex-wrap mx-[-15px] !text-center">
            <div class="lg:w-10/12 xl:w-9/12 xxl:w-8/12 flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !relative" data-cues="slideInUp" data-group="cap-header" data-duration="400">
                <h2 class="!text-[0.8rem] !leading-[1.35] !tracking-[0.02rem] uppercase !text-[#74788d] !mb-3">{!! t('Neler Yapıyoruz?') !!}</h2>
                <h3 class="xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] font-semibold !leading-[1.2] !mb-12 lg:!px-5 xl:!px-0 xxl:!px-6">
                    {!! t('Trunçgil Teknoloji') !!} <span class="text-gradient gradient-7">{!! t('Yapay Zeka Yetkinlikleri') !!}</span>
                </h3>
            </div>
        </div>

        <div class="flex flex-wrap mx-[-15px]" data-cues="slideInUp" data-group="cap-cards" data-interval="-150" data-duration="400">
            <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] !mt-6 max-w-full">
                <div class="card h-full !shadow-sm border-0 flex flex-col justify-between !rounded-[1.2rem] overflow-hidden ai-card">
                    <div class="card-body !p-8 flex-[1_1_auto] flex flex-col text-center items-center">
                        <div class="icon btn btn-circle btn-lg btn-soft-purple pointer-events-none !mb-4 w-12 h-12 !inline-flex !items-center !justify-center !leading-none !rounded-full">
                            <span class="material-symbols-outlined !text-[1.8rem]">smart_toy</span>
                        </div>
                        <h4 class="!text-[1.15rem] !font-bold !mb-2">{!! t('Özel LLM İnce Ayarı') !!}</h4>
                        <p class="!text-[0.85rem] !mb-0 text-muted flex-1">{!! t('Llama, Mistral ve Qwen gibi açık kaynak Büyük Dil Modellerini kurumsal bilgi tabanınıza QLoRA ile maliyet-efektif olarak eğitiyoruz.') !!}</p>
                    </div>
                </div>
            </div>
            
            <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] !mt-6 max-w-full">
                <div class="card h-full !shadow-sm border-0 flex flex-col justify-between !rounded-[1.2rem] overflow-hidden ai-card">
                    <div class="card-body !p-8 flex-[1_1_auto] flex flex-col text-center items-center">
                        <div class="icon btn btn-circle btn-lg btn-soft-purple pointer-events-none !mb-4 w-12 h-12 !inline-flex !items-center !justify-center !leading-none !rounded-full">
                            <span class="material-symbols-outlined !text-[1.8rem]">visibility</span>
                        </div>
                        <h4 class="!text-[1.15rem] !font-bold !mb-2">{!! t('Bilgisayarlı Görü (Vision)') !!}</h4>
                        <p class="!text-[0.85rem] !mb-0 text-muted flex-1">{!! t('Nesne tespiti, otonom kalite kontrol ve yüz tanıma sistemlerini yüksek performanslı edge cihazlar veya bulut GPU ağlarında koşturuyoruz.') !!}</p>
                    </div>
                </div>
            </div>

            <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] !mt-6 max-w-full">
                <div class="card h-full !shadow-sm border-0 flex flex-col justify-between !rounded-[1.2rem] overflow-hidden ai-card">
                    <div class="card-body !p-8 flex-[1_1_auto] flex flex-col text-center items-center">
                        <div class="icon btn btn-circle btn-lg btn-soft-purple pointer-events-none !mb-4 w-12 h-12 !inline-flex !items-center !justify-center !leading-none !rounded-full">
                            <span class="material-symbols-outlined !text-[1.8rem]">router</span>
                        </div>
                        <h4 class="!text-[1.15rem] !font-bold !mb-2">{!! t('Edge AI Çözümleri') !!}</h4>
                        <p class="!text-[0.85rem] !mb-0 text-muted flex-1">{!! t('LiteRT ve ExecuTorch mimarileriyle yapay zeka çıkarım gücünü mobil uygulamalara ve düşük güç tüketen uç cihazlara (IoT) taşıyoruz.') !!}</p>
                    </div>
                </div>
            </div>
            
            <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] !mt-6 max-w-full">
                <div class="card h-full !shadow-sm border-0 flex flex-col justify-between !rounded-[1.2rem] overflow-hidden ai-card">
                    <div class="card-body !p-8 flex-[1_1_auto] flex flex-col text-center items-center">
                        <div class="icon btn btn-circle btn-lg btn-soft-purple pointer-events-none !mb-4 w-12 h-12 !inline-flex !items-center !justify-center !leading-none !rounded-full">
                            <span class="material-symbols-outlined !text-[1.8rem]">hub</span>
                        </div>
                        <h4 class="!text-[1.15rem] !font-bold !mb-2">{!! t('Yüksek Hızlı Veri Hatları') !!}</h4>
                        <p class="!text-[0.85rem] !mb-0 text-muted flex-1">{!! t('Büyük verileri asenkron işleyip modellerinizi besleyecek yüksek throughput (tf.data) mimarileri ve veri ambarları kuruyoruz.') !!}</p>
                    </div>
                </div>
            </div>

            <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] !mt-6 max-w-full">
                <div class="card h-full !shadow-sm border-0 flex flex-col justify-between !rounded-[1.2rem] overflow-hidden ai-card">
                    <div class="card-body !p-8 flex-[1_1_auto] flex flex-col text-center items-center">
                        <div class="icon btn btn-circle btn-lg btn-soft-purple pointer-events-none !mb-4 w-12 h-12 !inline-flex !items-center !justify-center !leading-none !rounded-full">
                            <span class="material-symbols-outlined !text-[1.8rem]">recommend</span>
                        </div>
                        <h4 class="!text-[1.15rem] !font-bold !mb-2">{!! t('Öneri & Karar Sistemleri') !!}</h4>
                        <p class="!text-[0.85rem] !mb-0 text-muted flex-1">{!! t('Collaborative filtering ve derin öğrenme ile kullanıcı davranışlarını öngören kişiselleştirilmiş e-ticaret ve analiz motorları geliştiriyoruz.') !!}</p>
                    </div>
                </div>
            </div>

            <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] !mt-6 max-w-full">
                <div class="card h-full !shadow-sm border-0 flex flex-col justify-between !rounded-[1.2rem] overflow-hidden ai-card">
                    <div class="card-body !p-8 flex-[1_1_auto] flex flex-col text-center items-center">
                        <div class="icon btn btn-circle btn-lg btn-soft-purple pointer-events-none !mb-4 w-12 h-12 !inline-flex !items-center !justify-center !leading-none !rounded-full">
                            <span class="material-symbols-outlined !text-[1.8rem]">storage</span>
                        </div>
                        <h4 class="!text-[1.15rem] !font-bold !mb-2">{!! t('Production Mimarisi') !!}</h4>
                        <p class="!text-[0.85rem] !mb-0 text-muted flex-1">{!! t('Geliştirilen modelleri TF Serving veya Triton Server ile Kubernetes ortamında zero-downtime ve düşük gecikme ile ölçekliyoruz.') !!}</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

{{-- FAQ Section --}}
<section class="wrapper !bg-[#ffffff] ai-dev-section">
    <div class="container pt-[4.5rem] pb-[4.5rem] xl:pt-24 xl:pb-24 lg:pt-24 lg:pb-24 md:pt-24 md:pb-24">
        <div class="flex flex-wrap mx-[-15px]">
            <div class="xl:w-11/12 xxl:w-10/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
                <div class="!relative !mb-12 text-center" data-cues="slideInUp" data-group="faq-header" data-duration="400">
                    <h2 class="!text-[0.8rem] uppercase !text-[#74788d] !mb-3 !leading-[1.35]">{!! t('Sık Sorulan Sorular') !!}</h2>
                    <h3 class="!text-[calc(1.325rem_+_0.9vw)] font-bold !leading-[1.2] xl:!text-[2rem] !mb-0 lg:!px-8 xl:!px-12">
                        {!! t('Yapay Zeka Projeleri İçin') !!} <span class="text-gradient gradient-7">{!! t('Merak Edilenler') !!}</span>
                    </h3>
                </div>
                <div class="flex flex-wrap mx-[-15px]">
                    <div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mb-0" data-cues="slideInUp" data-group="faq-list-1" data-interval="-150" data-duration="400">
                        <div id="accordion-ai-1" class="accordion-wrapper">
                            
                            <div class="card accordion-item !mb-5 !shadow-sm">
                                <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !rounded-[0.4rem] !bg-inherit" id="heading-ai-1">
                                    <button class="!text-[#343f52] !text-[0.9rem] font-semibold hover:!text-[#e31e24] before:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapse-ai-1" aria-expanded="false" aria-controls="collapse-ai-1">
                                        {!! t('Özel dil modeli (LLM) eğitimi maliyetli midir?') !!}
                                    </button>
                                </div>
                                <div id="collapse-ai-1" class="collapse" aria-labelledby="heading-ai-1" data-bs-target="#accordion-ai-1">
                                    <div class="card-body p-[0_1.25rem_.25rem_2.35rem] !text-[0.85rem] text-muted">
                                        <p>{!! t('Eskiden devasa bütçeler gerektiren bu işlemler, LoRA ve QLoRA (Quantization) teknikleri sayesinde dramatik olarak ucuzlamıştır. Modeli tamamen yeniden eğitmek yerine sadece belirli parametreleri güncelleyerek maliyetleri %99 oranında düşürüyoruz.') !!}</p>
                                    </div>
                                </div>
                            </div>
                            
                            <div class="card accordion-item !mb-5 !shadow-sm">
                                <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !rounded-[0.4rem] !bg-inherit" id="heading-ai-2">
                                    <button class="!text-[#343f52] !text-[0.9rem] font-semibold hover:!text-[#e31e24] before:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapse-ai-2" aria-expanded="false" aria-controls="collapse-ai-2">
                                        {!! t('Veri gizliliğini nasıl sağlıyorsunuz?') !!}
                                    </button>
                                </div>
                                <div id="collapse-ai-2" class="collapse" aria-labelledby="heading-ai-2" data-bs-target="#accordion-ai-1">
                                    <div class="card-body p-[0_1.25rem_.25rem_2.35rem] !text-[0.85rem] text-muted">
                                        <p>{!! t('Kurumsal verilerinizi dış API\'lara göndermek yerine açık kaynaklı modelleri (Llama vb.) doğrudan kendi sunucularınızda (On-Premise) barındırarak %100 veri gizliliği garanti ediyoruz.') !!}</p>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>
                    <div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full" data-cues="slideInUp" data-group="faq-list-2" data-interval="-150" data-delay="300" data-duration="400">
                        <div id="accordion-ai-2" class="accordion-wrapper">
                            
                            <div class="card accordion-item !mb-5 !shadow-sm">
                                <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !rounded-[0.4rem] !bg-inherit" id="heading-ai-3">
                                    <button class="!text-[#343f52] !text-[0.9rem] font-semibold hover:!text-[#e31e24] before:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapse-ai-3" aria-expanded="false" aria-controls="collapse-ai-3">
                                        {!! t('Edge AI (Uç Cihazlarda Yapay Zeka) nerede kullanılır?') !!}
                                    </button>
                                </div>
                                <div id="collapse-ai-3" class="collapse" aria-labelledby="heading-ai-3" data-bs-target="#accordion-ai-2">
                                    <div class="card-body p-[0_1.25rem_.25rem_2.35rem] !text-[0.85rem] text-muted">
                                        <p>{!! t('İnternet bağlantısının olmadığı fabrikalarda (kalite kontrol), mobil uygulamalarda anlık yüz tanıma ve güvenlik sistemlerinde modellerin buluta gitmeden cihaz üzerinde koşturulması için LiteRT ve ExecuTorch mimarileri kullanılır.') !!}</p>
                                    </div>
                                </div>
                            </div>

                            <div class="card accordion-item !mb-5 !shadow-sm">
                                <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !rounded-[0.4rem] !bg-inherit" id="heading-ai-4">
                                    <button class="!text-[#343f52] !text-[0.9rem] font-semibold hover:!text-[#e31e24] before:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapse-ai-4" aria-expanded="false" aria-controls="collapse-ai-4">
                                        {!! t('PyTorch mu TensorFlow mu tercih etmeliyim?') !!}
                                    </button>
                                </div>
                                <div id="collapse-ai-4" class="collapse" aria-labelledby="heading-ai-4" data-bs-target="#accordion-ai-2">
                                    <div class="card-body p-[0_1.25rem_.25rem_2.35rem] !text-[0.85rem] text-muted">
                                        <p>{!! t('İkisi de güçlü motorlardır. Ar-Ge, LLM ve inovatif denemeler için genelde PyTorch; devasa veri hatları, statik grafik optimizasyonları ve mobil entegrasyonlar için TensorFlow tercih edilir. Projenize uygun seçimi birlikte yapıyoruz.') !!}</p>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

{{-- Footer Call to Action --}}
<section class="wrapper image-wrapper bg-full bg-image bg-overlay bg-overlay-light-500 bg-content relative z-0" data-image-src="{{ asset('assets/img/photos/bg22.png') }}" style="background-image: url('{{ asset('assets/img/photos/bg22.png') }}');">
    <div class="container py-[4.5rem] xl:py-24 lg:py-24 md:py-24 !relative" style="z-index: 2;">
        <div class="flex flex-wrap mx-[-15px] !text-center">
            <div class="xl:w-11/12 xxl:w-9/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
                <h2 class="!text-[0.8rem] !tracking-[0.02rem] !leading-[1.35] uppercase text-gradient gradient-7 !mb-3">{!! t('Geleceği Birlikte İnşa Edelim') !!}</h2>
                <h3 class="xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] font-bold !leading-[1.25] !mb-7 lg:!px-[7rem] xl:!px-[7rem]">
                    {!! t('Yapay Zeka ekosistemiyle işinizi bir adım öne taşımaya hazır mısınız?') !!}
                </h3>
                <a href="{{ $contactUrl }}" class="btn btn-lg btn-gradient gradient-7 rounded-full shadow-lg">{!! t('Projeyi Başlatın') !!}</a>
            </div>
        </div>
    </div>
</section>
@endsection