diff --git a/resources/views/front/products/finance.blade.php b/resources/views/front/products/finance.blade.php
index 7d9e3c1..24aa3c0 100644
--- a/resources/views/front/products/finance.blade.php
+++ b/resources/views/front/products/finance.blade.php
@@ -1,472 +1,584 @@
 @extends('layouts.site')
 
-@php
-use Illuminate\Support\Facades\Storage;
-$header = 'front.products.finance_header';
-@endphp
-
 @section('title', $product->translate('title') ?? 'Trunçgil Finance')
 
 @php
     $landingData = $product->landing_page_data ?? [];
     $hero = $landingData['hero'] ?? [];
-    $features = $landingData['features'] ?? [];
-    $howItWorks = $landingData['how_it_works'] ?? [];
-    $steps = $howItWorks['steps'] ?? [];
-    $faqs = $landingData['faqs'] ?? [];
     $currentLang = app()->getLocale();
-    
-    // Helper function for translations
-    $getTranslated = function($item, $key, $default = '') use ($currentLang) {
-        if (isset($item["{$key}_{$currentLang}"])) {
-            return $item["{$key}_{$currentLang}"];
-        }
-        return $item[$key] ?? $default;
-    };
 @endphp
 
 @push('styles')
 <style>
-    /* Green-Tuned Premium Dark Theme Core Styles */
-    :root {
-        --primary: #00e676 !important;
-        --primary-rgb: 0, 230, 118 !important;
-    }
-    
-    body {
-        background-color: #0b0f0d !important;
-        color: #e2e8f0 !important;
-        font-family: 'Space Grotesk', 'Urbanist', sans-serif !important;
-    }
-    
-    .btn-primary {
-        background-color: #00e676 !important;
-        border-color: #00e676 !important;
-        color: #0b0f0d !important;
-        font-weight: 600 !important;
-    }
-    .btn-primary:hover {
-        background-color: #00b359 !important;
-        border-color: #00b359 !important;
-        color: #0b0f0d !important;
-    }
-    
-    .finance-dark-page {
-        background: radial-gradient(circle at 50% 0%, rgba(0, 230, 118, 0.08) 0%, rgba(11, 15, 13, 0) 50%),
-                    radial-gradient(circle at 100% 50%, rgba(0, 230, 118, 0.04) 0%, rgba(11, 15, 13, 0) 40%),
-                    #0b0f0d;
-        overflow-x: hidden;
-    }
-
-    /* Glow Gradients matching Emerald/Green */
-    .text-glow-gradient {
-        background: linear-gradient(135deg, #ffffff 0%, #a7f3d0 50%, #34d399 100%);
-        -webkit-background-clip: text;
-        -webkit-text-fill-color: transparent;
-    }
-    
-    .text-green-glow {
-        color: #00e676 !important;
-        text-shadow: 0 0 12px rgba(0, 230, 118, 0.35);
-    }
-    
-    /* Elegant Glassmorphism Cards */
-    .glass-card {
-        background: rgba(18, 26, 22, 0.55);
-        backdrop-filter: blur(16px);
-        border: 1px solid rgba(0, 230, 118, 0.08) !important;
-        border-radius: 1rem;
-        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
-    }
-    
-    .glass-card:hover {
-        transform: translateY(-4px);
-        border-color: rgba(0, 230, 118, 0.25) !important;
-        box-shadow: 0 12px 35px rgba(0, 230, 118, 0.1);
-    }
-
-    /* Active dynamic pulse */
-    .pulse-dot-green {
-        width: 8px;
-        height: 8px;
-        background-color: #00e676;
-        border-radius: 50%;
-        display: inline-block;
-        box-shadow: 0 0 0 0 rgba(0, 230, 118, 0.7);
-        animation: pulse-green 1.8s infinite;
-    }
-
-    @keyframes pulse-green {
-        0% {
-            transform: scale(0.95);
-            box-shadow: 0 0 0 0 rgba(0, 230, 118, 0.7);
-        }
-        70% {
-            transform: scale(1);
-            box-shadow: 0 0 0 8px rgba(0, 230, 118, 0);
-        }
-        100% {
-            transform: scale(0.95);
-            box-shadow: 0 0 0 0 rgba(0, 230, 118, 0);
-        }
-    }
-
-    /* Code editor tab styles matching Green Theme */
-    .code-editor-header {
-        background: #0f1411;
-        border-top-left-radius: 0.75rem;
-        border-top-right-radius: 0.75rem;
-        padding: 0.75rem 1.25rem;
-        border-bottom: 1px solid rgba(0, 230, 118, 0.08);
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-    }
-    .code-editor-body {
-        background: #050807;
-        border-bottom-left-radius: 0.75rem;
-        border-bottom-right-radius: 0.75rem;
-        padding: 1.5rem;
-        font-family: 'Fira Code', 'Courier New', Courier, monospace;
-        font-size: 0.85rem;
-        color: #cbd5e1;
-        overflow-x: auto;
-    }
-
-    .nav-tabs-code .nav-link {
-        color: #8892b0;
-        border: none;
-        padding: 0.4rem 1rem;
-        border-radius: 0.375rem;
-        font-weight: 500;
-        font-size: 0.85rem;
-        transition: all 0.2s ease;
-    }
-    .nav-tabs-code .nav-link.active {
-        color: #00e676 !important;
-        background: rgba(0, 230, 118, 0.1) !important;
-    }
-
-    /* Accordions inside dark theme */
-    .accordion-dark .accordion-item {
-        background: rgba(18, 26, 22, 0.3) !important;
-        border: 1px solid rgba(0, 230, 118, 0.05) !important;
-        border-radius: 0.75rem !important;
-        overflow: hidden;
-        margin-bottom: 1rem;
-    }
-    .accordion-dark .accordion-button {
-        background: transparent !important;
-        color: #e2e8f0 !important;
-        box-shadow: none !important;
-        font-weight: 600;
-    }
-    .accordion-dark .accordion-button:not(.collapsed) {
-        color: #00e676 !important;
-    }
-    .accordion-dark .accordion-button::after {
-        filter: brightness(0) invert(1);
-    }
-    .accordion-dark .accordion-body {
-        color: #94a3b8 !important;
-        border-top: 1px solid rgba(0, 230, 118, 0.05);
+    /* Premium visual helpers matching theme */
+    .typer-custom {
+        color: #54a8c7 !important;
     }
 </style>
 @endpush
 
 @section('content')
-<div class="finance-dark-page">
+<div class="grow shrink-0">
     
-    {{-- Hero Section designed exactly like demo3.html --}}
-    <section class="wrapper bg-[#0c120f] opacity-100 angled lower-start relative border-0 
-                   before:content-[''] before:block before:absolute before:z-0 before:border-y-transparent before:border-[#0c120f] before:border-0 before:border-solid before:right-0 
-                   after:bottom-[-4rem] after:content-[''] after:block after:absolute after:z-0 after:border-l-[100vw] after:border-r-transparent after:border-b-[4rem] after:border-y-transparent after:border-[#0c120f] after:border-0 after:border-solid after:right-0">
+    {{-- Section 1: Hero --}}
+    <section class="wrapper bg-[#262b32] opacity-100 angled lower-start relative border-0 
+                    before:content-[''] before:block before:absolute before:z-0 before:border-y-transparent before:border-[#262b32] before:border-0 before:border-solid before:right-0 
+                    after:bottom-[-4rem] after:content-[''] after:block after:absolute after:z-0 after:border-l-[100vw] after:border-r-transparent after:border-b-[4rem] after:border-y-transparent after:border-[#262b32] after:border-0 after:border-solid after:right-0">
         <div class="container pt-7 xl:pt-12 lg:pt-12 md:pt-12 pb-8 relative z-10">
             <div class="flex flex-wrap mx-0 !mt-[-50px] items-center">
-                
-                {{-- LEFT COLUMN: Title & Rates (Döviz, Altın, Kripto tek yerde şeklinde) --}}
                 <div class="lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] max-w-full px-0 !mt-[50px]">
-                    <div class="d-flex align-items-center gap-2 mb-3">
-                        <span class="pulse-dot-green" aria-hidden="true"></span>
-                        <span class="text-green-glow fs-13 font-bold uppercase tracking-wider">{!! t('Canlı Finansal Veri Servisi') !!}</span>
-                    </div>
-                    <h1 class="display-3 font-bold !leading-[1.15] text-white !mb-4 text-glow-gradient">
-                        {!! t('Altın, Döviz ve Kripto Paralar') !!} <br>
-                        <span class="text-green-glow">{!! t('Tek Bir API Uç Noktasında!') !!}</span>
+                    <h1 class="!text-[calc(1.375rem_+_1.5vw)] font-bold !leading-[1.15] xl:!text-[2.5rem] !text-white !mb-4">
+                        {!! t('Trunçgil Finance ile') !!} <br>
+                        <span class="typer !text-[#54a8c7] whitespace-nowrap" data-delay="100" data-words="{{ t('anlık döviz kurlarına,canlı altın fiyatlarına,kripto para verilerine') }}"></span>
+                        <span class="cursor !text-[#54a8c7]" data-owner="typer"></span>
                     </h1>
-                    <p class="lead !text-[1.15rem] !leading-[1.5] text-slate-300 !mb-6 pr-lg-12">
-                        {!! t('Trunçgil Finance ile gecikmesiz, anlık ve yüksek frekanslı tüm altın fiyatlarını, serbest piyasa döviz kurlarını ve popüler kripto para birimlerini tek bir noktadan entegre edin.') !!}
+                    <p class="lead !text-[1.2rem] !leading-[1.5] !text-white !mb-7 md:!pr-32 xl:!pr-0 lg:!pr-0 xxl:!pr-20">
+                        {!! t('Gecikmesiz, anlık ve yüksek frekanslı tüm finansal piyasa verilerini tek bir JSON/RESTful API uç noktasından saniyeler içinde sistemlerinize entegre edin.') !!}
                     </p>
                     
-                    {{-- Rates Showcase (Tek Yerde) --}}
-                    <div class="glass-card p-5 !mb-7" style="background: rgba(12, 18, 15, 0.7); max-width: 490px;">
-                        <div class="row g-4">
-                            <div class="col-6">
-                                <div class="d-flex align-items-center gap-2">
-                                    <span class="w-2.5 h-2.5 rounded-circle bg-warning d-inline-block"></span>
-                                    <div>
-                                        <div class="text-slate-400 fs-11 uppercase font-bold">{!! t('Gram Altın') !!}</div>
-                                        <div class="text-white font-bold fs-15 font-mono" id="gold-try">₺3.142,45</div>
-                                    </div>
+                    {{-- Live Rates Widget (Wow Factor Integration inside Hero) --}}
+                    <div class="bg-[rgba(255,255,255,0.04)] border border-[rgba(255,255,255,0.1)] rounded-lg p-5 !mb-7" style="max-width: 480px; backdrop-filter: blur(10px);">
+                        <div class="flex items-center gap-2 mb-3">
+                            <span class="w-2 h-2 rounded-full bg-[#00e676] animate-pulse"></span>
+                            <span class="text-[#cacaca] text-[0.75rem] font-bold tracking-wider uppercase">{!! t('Canlı Piyasalar (Simüle)') !!}</span>
+                        </div>
+                        <div class="grid grid-cols-2 gap-4">
+                            <div class="flex items-center gap-3">
+                                <div class="w-2.5 h-2.5 rounded-full bg-warning"></div>
+                                <div>
+                                    <div class="text-[#cacaca] text-[0.65rem] uppercase font-bold">{!! t('Gram Altın') !!}</div>
+                                    <div class="text-white font-bold text-[0.9rem] font-mono" id="gold-try">₺3,142.45</div>
                                 </div>
                             </div>
-                            <div class="col-6">
-                                <div class="d-flex align-items-center gap-2">
-                                    <span class="w-2.5 h-2.5 rounded-circle bg-info d-inline-block"></span>
-                                    <div>
-                                        <div class="text-slate-400 fs-11 uppercase font-bold">USD / TRY</div>
-                                        <div class="text-white font-bold fs-15 font-mono" id="usd-try">₺34.8250</div>
-                                    </div>
+                            <div class="flex items-center gap-3">
+                                <div class="w-2.5 h-2.5 rounded-full bg-info"></div>
+                                <div>
+                                    <div class="text-[#cacaca] text-[0.65rem] uppercase font-bold">USD / TRY</div>
+                                    <div class="text-white font-bold text-[0.9rem] font-mono" id="usd-try">₺34.8250</div>
                                 </div>
                             </div>
-                            <div class="col-6">
-                                <div class="d-flex align-items-center gap-2">
-                                    <span class="w-2.5 h-2.5 rounded-circle bg-primary d-inline-block"></span>
-                                    <div>
-                                        <div class="text-slate-400 fs-11 uppercase font-bold">EUR / TRY</div>
-                                        <div class="text-white font-bold fs-15 font-mono" id="eur-try">₺37.2480</div>
-                                    </div>
+                            <div class="flex items-center gap-3">
+                                <div class="w-2.5 h-2.5 rounded-full bg-success"></div>
+                                <div>
+                                    <div class="text-[#cacaca] text-[0.65rem] uppercase font-bold">EUR / TRY</div>
+                                    <div class="text-white font-bold text-[0.9rem] font-mono" id="eur-try">₺37.2480</div>
                                 </div>
                             </div>
-                            <div class="col-6">
-                                <div class="d-flex align-items-center gap-2">
-                                    <span class="w-2.5 h-2.5 rounded-circle d-inline-block" style="background-color: #00e676;"></span>
-                                    <div>
-                                        <div class="text-slate-400 fs-11 uppercase font-bold">BTC / USD</div>
-                                        <div class="text-white font-bold fs-15 font-mono" id="btc-usd">$98,425.00</div>
-                                    </div>
+                            <div class="flex items-center gap-3">
+                                <div class="w-2.5 h-2.5 rounded-full bg-primary"></div>
+                                <div>
+                                    <div class="text-[#cacaca] text-[0.65rem] uppercase font-bold">BTC / USD</div>
+                                    <div class="text-white font-bold text-[0.9rem] font-mono" id="btc-usd">$98,425.00</div>
                                 </div>
                             </div>
                         </div>
                     </div>
 
-                    <div class="d-flex flex-wrap gap-3">
-                        <a href="https://finance.truncgil.com/docs" target="_blank" class="btn btn-primary px-6 py-3 rounded">
-                            <i class="uil uil-code-branch me-1"></i> {!! t('API Entegrasyonu') !!}
+                    <div>
+                        <a href="https://finance.truncgil.com/docs" target="_blank" class="btn btn-lg btn-aqua !text-white !bg-[#54a8c7] border-[#54a8c7] hover:text-white hover:bg-[#54a8c7] hover:!border-[#54a8c7] focus:shadow-[rgba(79,152,181,1)] active:!text-[#343f52] active:bg-[#54a8c7] active:border-[#54a8c7] disabled:!text-[#343f52] disabled:bg-[#54a8c7] disabled:border-[#54a8c7] rounded mr-3">
+                            {!! t('Dokümantasyon') !!}
                         </a>
-                        <a href="{{ route('page.show', ['slug' => 'iletisim']) }}" class="btn btn-outline-glow px-6 py-3 rounded">
-                            {!! t('Özel Teklif Alın') !!}
+                        <a href="{{ route('page.show', ['slug' => 'iletisim']) }}" class="btn btn-lg btn-outline-white text-white border-white hover:bg-white hover:text-[#262b32] rounded">
+                            {!! t('Teklif Alın') !!}
                         </a>
                     </div>
                 </div>
                 
-                {{-- RIGHT COLUMN: Floating Fetched Logo --}}
                 <div class="lg:w-5/12 xl:w-5/12 w-full flex-[0_0_auto] max-w-full px-0 !mt-[50px] lg:!ml-[8.33333333%] xl:!ml-[8.33333333%] !mb-[-8rem] relative z-[3]">
                     <div class="!relative">
-                        <figure class="!rounded-[1rem] !shadow-[0_0.25rem_2.5rem_rgba(0,230,118,0.15)] overflow-hidden" style="background: rgba(18, 26, 22, 0.6); border: 1px solid rgba(0, 230, 118, 0.15);">
-                            <div class="p-12 text-center">
-                                @if(!empty($hero['featured_image']))
-                                    <img class="img-fluid drop-shadow-lg mx-auto" src="{{ Storage::url($hero['featured_image']) }}" alt="Trunçgil Finance Logo" style="max-height: 140px;">
-                                @else
-                                    <img class="img-fluid drop-shadow-lg mx-auto" src="https://finance.truncgil.com/img/logo.svg" alt="Trunçgil Finance Logo" style="max-height: 140px;">
-                                @endif
-                                <div class="mt-8 text-center">
-                                    <span class="badge bg-soft-success text-success rounded-pill px-4 py-2 fs-12 border border-success-20">API v4 STABLE</span>
-                                </div>
-                            </div>
+                        <a href="https://finance.truncgil.com/" target="_blank"
+                            class="btn btn-circle btn-aqua !text-white !bg-[#54a8c7] border-[#54a8c7] hover:text-white hover:bg-[#54a8c7] hover:!border-[#54a8c7] focus:shadow-[rgba(79,152,181,1)] active:!text-[#343f52] active:bg-[#54a8c7] active:border-[#54a8c7] disabled:!text-[#343f52] disabled:bg-[#54a8c7] disabled:border-[#54a8c7] btn-play ripple !mx-auto !mb-6 !absolute !text-[calc(1.355rem_+_1.26vw)] xl:!text-[2.3rem] !w-[3.5rem] !h-[3.5rem] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%] before:!bg-[#54a8c7] after:!bg-[#54a8c7] before:content-[''] before:block before:absolute before:opacity-80 before:animate-[ripple-1_2s_infinite_ease-in-out] before:z-[-1] before:rounded-[50%] before:inset-0 after:opacity-60 after:animate-[ripple-2_2s_infinite_ease-in-out] after:content-[''] after:block after:absolute after:z-[-1] after:rounded-[50%] after:inset-0 after:[animation-delay:.5s]"
+                            style="top:50%; left: 50%; transform: translate(-50%,-50%); z-index:3;"><i
+                            class="icn-caret-right !ml-[0.15rem] !relative z-[2] before:content-['\e900'] !text-[calc(1.355rem_+_1.26vw)]"></i></a>
+                        <figure class="!rounded-[.4rem] !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]">
+                            <img class="!rounded-[.4rem]" src="{{ asset('assets/img/photos/about13.jpg') }}" alt="Trunçgil Finance Preview">
                         </figure>
                     </div>
                 </div>
-
             </div>
         </div>
     </section>
 
-    {{-- Advantages and API Benefits Section --}}
-    <section class="wrapper bg-[#0b0f0d] pt-36 pb-24 xl:pb-32 lg:pb-32 md:pb-32 relative z-10">
-        <div class="container">
+    {{-- Section 2: What We Do? --}}
+    <section class="wrapper !bg-[#ffffff]">
+        <div class="container pt-36 xl:pt-[12.5rem] lg:pt-[12.5rem] md:pt-[12.5rem] pb-24 xl:pb-32 lg:pb-32 md:pb-32">
+            <div class="flex flex-wrap mx-[-15px]">
+                <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full">
+                    <h2 class="!text-[0.8rem] uppercase inline-flex !leading-[1.35] text-line relative align-top !pl-[1.4rem] !tracking-[0.02rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#54a8c7] !text-[#54a8c7] !mb-3">
+                        {!! t('Ne Yapıyoruz?') !!}
+                    </h2>
+                    <h3 class="!text-[calc(1.315rem_+_0.78vw)] font-bold xl:!text-[1.9rem] !leading-[1.25] !mb-9">
+                        {!! t('İhtiyaçlarınıza özel olarak tasarlanmış yüksek hızlı finansal veri çözümleri.') !!}
+                    </h3>
+                </div>
+            </div>
             
-            <div class="row text-center mb-16">
-                <div class="col-lg-8 mx-auto">
-                    <h2 class="text-green-glow uppercase tracking-wider fs-13 font-bold mb-3">{!! t('API Avantajları & Sıfır Kesinti') !!}</h2>
-                    <h3 class="display-4 font-bold text-glow-gradient">{!! t('Geliştiriciler İçin Sınırsız Özgürlük') !!}</h3>
+            <div class="flex flex-wrap mx-[-15px] xl:mx-[-20px] lg:mx-[-20px] md:mx-[-20px] !mt-[-40px] !mb-[4.5rem] xl:!mb-[8rem] lg:!mb-[8rem] md:!mb-[8rem]">
+                <div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[20px] lg:!px-[20px] md:!px-[20px] !mt-[40px] max-w-full">
+                    <div class="icon btn btn-block btn-lg btn-soft-aqua pointer-events-none !mb-6"> 
+                        <i class="uil uil-wind-moon"></i> 
+                    </div>
+                    <h4 class="!text-[1rem] !leading-[1.45]">{!! t('7/24 Kesintisiz Destek') !!}</h4>
+                    <p class="!mb-3">{!! t('Canlı veri hatlarımız ve uzman teknik ekibimiz, sistemlerinizin kesintisiz çalışması için her an hazır durumdadır.') !!}</p>
+                    <a href="https://finance.truncgil.com/docs" target="_blank" class="more hover !text-[#54a8c7] focus:!text-[#54a8c7] hover:!text-[#54a8c7]">{!! t('Detaylar') !!}</a>
+                </div>
+                <div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[20px] lg:!px-[20px] md:!px-[20px] !mt-[40px] max-w-full">
+                    <div class="icon btn btn-block btn-lg btn-soft-aqua pointer-events-none !mb-6"> 
+                        <i class="uil uil-shield-exclamation before:content-['\ecb3']"></i> 
+                    </div>
+                    <h4 class="!text-[1rem] !leading-[1.45]">{!! t('Güvenli Entegrasyon') !!}</h4>
+                    <p class="!mb-3">{!! t('SSL/TLS korumalı, son derece güvenli RESTful API uç noktalarımız ile verilerinizi projelerinize güvenle çekin.') !!}</p>
+                    <a href="https://finance.truncgil.com/docs" target="_blank" class="more hover !text-[#54a8c7] focus:!text-[#54a8c7] hover:!text-[#54a8c7]">{!! t('Detaylar') !!}</a>
+                </div>
+                <div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[20px] lg:!px-[20px] md:!px-[20px] !mt-[40px] max-w-full">
+                    <div class="icon btn btn-block btn-lg btn-soft-aqua pointer-events-none !mb-6"> 
+                        <i class="uil uil-laptop-cloud before:content-['\ebb2']"></i> 
+                    </div>
+                    <h4 class="!text-[1rem] !leading-[1.45]">{!! t('Anlık Güncellemeler') !!}</h4>
+                    <p class="!mb-3">{!! t('Altın fiyatları, serbest piyasa döviz kurları ve kripto paralar milisaniyeler bazında sürekli güncellenir.') !!}</p>
+                    <a href="https://finance.truncgil.com/docs" target="_blank" class="more hover !text-[#54a8c7] focus:!text-[#54a8c7] hover:!text-[#54a8c7]">{!! t('Detaylar') !!}</a>
+                </div>
+                <div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[20px] lg:!px-[20px] md:!px-[20px] !mt-[40px] max-w-full">
+                    <div class="icon btn btn-block btn-lg btn-soft-aqua pointer-events-none !mb-6"> 
+                        <i class="uil uil-phone-volume before:content-['\ec50']"></i> 
+                    </div>
+                    <h4 class="!text-[1rem] !leading-[1.45]">{!! t('Piyasa Analizleri') !!}</h4>
+                    <p class="!mb-3">{!! t('Gelişmiş geçmiş veri havuzumuzla piyasa trendlerini kolayca analiz edin, raporlayın ve tahminler üretin.') !!}</p>
+                    <a href="https://finance.truncgil.com/docs" target="_blank" class="more hover !text-[#54a8c7] focus:!text-[#54a8c7] hover:!text-[#54a8c7]">{!! t('Detaylar') !!}</a>
                 </div>
             </div>
 
-            <div class="row g-6 text-center">
-                {{-- Advantage 1: No Auth Required --}}
-                <div class="col-md-4">
-                    <div class="glass-card p-8 h-100 flex flex-col justify-between">
+            {{-- Section 3: How It Works? --}}
+            <div class="flex flex-wrap mx-[-15px] max-sm:!mt-[-50px] !mt-[-80px] xl:mx-[-7.5px] lg:mx-[-7.5px] !mb-24 md:!mb-[8rem] items-center">
+                <div class="md:w-8/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] xl:!px-[7.5px] lg:!px-[7.5px] !px-[15px] max-w-full !relative !mt-[80px]">
+                    <div class="shape bg-dot rellax !w-[7rem] !h-[12.5rem] absolute z-[1] opacity-50 !bg-[radial-gradient(#54a8c7_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: -2rem; left: -1.9rem;"></div>
+                    <div class="shape !rounded-[.4rem] !bg-[#edf2fc] rellax xl:block lg:block md:block !absolute z-[1]" data-rellax-speed="0" style="bottom: -1.8rem; right: -1.5rem; width: 85%; height: 90%;"></div>
+                    <figure class="!rounded-[.4rem] relative z-[2]">
+                        <img class="!rounded-[.4rem]" src="{{ asset('assets/img/photos/about7.jpg') }}" alt="How Trunçgil Finance Works">
+                    </figure>
+                </div>
+                
+                <div class="lg:w-5/12 xl:w-4/12 xl:!ml-[8.33333333%] lg:!ml-[8.33333333%] w-full flex-[0_0_auto] xl:!px-[7.5px] lg:!px-[7.5px] !px-[15px] max-w-full !mt-[80px]">
+                    <h2 class="!text-[0.8rem] uppercase inline-flex !leading-[1.35] text-line relative align-top !pl-[1.4rem] !tracking-[0.02rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#54a8c7] !text-[#54a8c7] !mb-3">
+                        {!! t('Nasıl Çalışır?') !!}
+                    </h2>
+                    <h3 class="!text-[calc(1.315rem_+_0.78vw)] font-bold xl:!text-[1.9rem] !leading-[1.25] !mb-7">
+                        {!! t('3 Kolay Adımda Entegrasyon Başarısı') !!}
+                    </h3>
+                    <div class="flex flex-row !mb-6">
                         <div>
-                            <div class="w-12 h-12 rounded-circle bg-success-soft flex items-center justify-center mx-auto mb-5 text-success fs-24">
-                                <i class="uil uil-unlock"></i>
-                            </div>
-                            <h4 class="fs-18 font-bold text-white mb-3">{!! t('No Auth Required (Sıfır Kurulum)') !!}</h4>
-                            <p class="text-slate-400 fs-14 mb-0">
-                                {!! t('Başlamak için karmaşık kayıt süreçlerine, token/key yönetimlerine gerek yok. Standart JSON uç noktalarımıza doğrudan istek atarak saniyeler içinde çalışın.') !!}
-                            </p>
+                            <span class="icon btn btn-block btn-soft-aqua pointer-events-none !mr-5"><span class="number !text-[0.9rem]">1</span></span>
+                        </div>
+                        <div>
+                            <h4 class="!mb-1 !text-[1rem] !leading-[1.45]">{!! t('Uç Noktayı Seçin') !!}</h4>
+                            <p class="!mb-0">{!! t('Projenizin ihtiyaç duyduğu veriyi (Döviz, Altın veya Kripto) sağlayan JSON uç noktasını seçin.') !!}</p>
                         </div>
                     </div>
-                </div>
-
-                {{-- Advantage 2: Totally Free --}}
-                <div class="col-md-4">
-                    <div class="glass-card p-8 h-100 flex flex-col justify-between">
+                    <div class="flex flex-row !mb-6">
                         <div>
-                            <div class="w-12 h-12 rounded-circle bg-success-soft flex items-center justify-center mx-auto mb-5 text-success fs-24">
-                                <i class="uil uil-gift"></i>
-                            </div>
-                            <h4 class="fs-18 font-bold text-white mb-3">{!! t('%100 Ücretsiz Kullanım') !!}</h4>
-                            <p class="text-slate-400 fs-14 mb-0">
-                                {!! t('Geliştirici dostu yapımız gereği, tüm kişisel ve prototip projelerinizde altın döviz verilerimizi hiçbir kullanım ücreti ödemeden özgürce çekebilirsiniz.') !!}
-                            </p>
+                            <span class="icon btn btn-block btn-soft-aqua pointer-events-none !mr-5"><span class="number !text-[0.9rem]">2</span></span>
+                        </div>
+                        <div>
+                            <h4 class="!mb-1 !text-[1rem] !leading-[1.45]">{!! t('Kodunuza Ekleyin') !!}</h4>
+                            <p class="!mb-0">{!! t('No-Auth özelliğimiz sayesinde herhangi bir key yönetimi gerekmeden doğrudan API çağrısını başlatın.') !!}</p>
                         </div>
                     </div>
-                </div>
-
-                {{-- Advantage 3: Dockerized Private Deployments --}}
-                <div class="col-md-4">
-                    <div class="glass-card p-8 h-100 flex flex-col justify-between">
+                    <div class="flex flex-row">
                         <div>
-                            <div class="w-12 h-12 rounded-circle bg-success-soft flex items-center justify-center mx-auto mb-5 text-success fs-24">
-                                <i class="uil uil-layer-group"></i>
-                            </div>
-                            <h4 class="fs-18 font-bold text-white mb-3">{!! t('Özel Dockerize Kurulum') !!}</h4>
-                            <p class="text-slate-400 fs-14 mb-0">
-                                {!! t('Kurumsal işletmeniz için yüksek hacimli istek, sıfır ağ gecikmesi ve izole veri akışı gerekiyorsa, size özel Docker paketimizle sistemi kendi sunucularınıza kurabiliriz.') !!}
-                            </p>
+                            <span class="icon btn btn-block btn-soft-aqua pointer-events-none !mr-5"><span class="number !text-[0.9rem]">3</span></span>
+                        </div>
+                        <div>
+                            <h4 class="!mb-1 !text-[1rem] !leading-[1.45]">{!! t('Canlı Veriyi İşleyin') !!}</h4>
+                            <p class="!mb-0">{!! t('Milisaniyeler içinde gelen temiz ve yapılandırılmış çıktıyı uygulamanızda hemen kullanın.') !!}</p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            {{-- Section 4: Why Choose Us? --}}
+            <div class="flex flex-wrap mx-[-15px] max-sm:!mt-[-50px] !mt-[-80px] xl:mx-[-7.5px] lg:mx-[-7.5px] items-center">
+                <div class="md:w-8/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[50px] xl:!mt-[80px] lg:!mt-[80px] md:!mt-[80px] sm:!mt-[80px] xl:!px-[7.5px] lg:!px-[7.5px] max-w-full xl:!ml-[8.33333333%] lg:!ml-[8.33333333%] xl:!order-2 !relative">
+                    <div class="shape !rounded-[50%] bg-line aqua rellax !w-[8rem] !h-[8rem] !absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -2rem; right: -1.9rem;"></div>
+                    <div class="shape rounded !bg-[#edf2fc] rellax xl:block lg:block md:block absolute z-[1]" data-rellax-speed="0" style="bottom: -1.8rem; left: -1.5rem; width: 85%; height: 90%;"></div>
+                    <figure class="rounded-[0.4rem] relative z-[2]">
+                        <img class="rounded-[.4rem]" src="{{ asset('assets/img/photos/about9.jpg') }}" alt="Why Choose Trunçgil Finance">
+                    </figure>
+                </div>
+                
+                <div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] !px-[15px] !mt-[50px] xl:!mt-[80px] lg:!mt-[80px] md:!mt-[80px] sm:!mt-[80px] xl:!px-[7.5px] lg:!px-[7.5px] max-w-full">
+                    <h2 class="!text-[0.8rem] uppercase inline-flex !leading-[1.35] text-line relative align-top !pl-[1.4rem] !tracking-[0.02rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#54a8c7] !text-[#54a8c7] !mb-3">
+                        {!! t('Neden Biz?') !!}
+                    </h2>
+                    <h3 class="!text-[calc(1.315rem_+_0.78vw)] font-bold xl:!text-[1.9rem] !leading-[1.25] !mb-7">
+                        {!! t('Değerli geliştiricilerimizin bizi tercih etmesinin birkaç önemli nedeni.') !!}
+                    </h3>
+                    <div class="accordion accordion-wrapper" id="accordionExample">
+                        <div class="card plain accordion-item">
+                            <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingOne">
+                                <button class="before:!text-[#54a8c7] hover:!text-[#54a8c7] !p-[0_0_0_1.1rem] !text-[.9rem] accordion-button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
+                                    {!! t('Sıfır Kurulum Maliyeti (No-Auth)') !!}
+                                </button>
+                            </div>
+                            <div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
+                                <div class="card-body flex-[1_1_auto] pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]">
+                                    <p>{!! t('API anahtarları almakla, üyelik adımlarıyla uğraşmayın. Doğrudan açık API endpointlerimize bağlanıp saniyeler içinde geliştirme yapmaya başlayın.') !!}</p>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="card plain accordion-item">
+                            <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingTwo">
+                                <button class="before:!text-[#54a8c7] hover:!text-[#54a8c7] !p-[0_0_0_1.1rem] !text-[.9rem] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
+                                    {!! t('Milisaniyeler Hızında JSON Yanıtları') !!}
+                                </button>
+                            </div>
+                            <div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
+                                <div class="card-body flex-[1_1_auto] pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]">
+                                    <p>{!! t('Ultra hızlı sunucu altyapımız ve optimize edilmiş önbellek katmanlarımız sayesinde isteklerinize anında ve sıfır gecikmeyle cevap alın.') !!}</p>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="card plain accordion-item">
+                            <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingThree">
+                                <button class="before:!text-[#54a8c7] hover:!text-[#54a8c7] !p-[0_0_0_1.1rem] !text-[.9rem] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
+                                    {!! t('Dockerize Bağımsız Altyapı İmkanı') !!}
+                                </button>
+                            </div>
+                            <div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
+                                <div class="card-body flex-[1_1_auto] pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]">
+                                    <p>{!! t('Kurumsal işletmeler için geliştirdiğimiz özel Docker paketiyle, sistemi kendi iç ağınıza kurup bağımsız olarak anlık veri çekebilirsiniz.') !!}</p>
+                                </div>
+                            </div>
                         </div>
                     </div>
                 </div>
             </div>
-            
         </div>
     </section>
 
-    {{-- Interactive Code Playground --}}
-    <section class="wrapper bg-[#0c120f] py-20 relative z-10 border-top border-white-5">
-        <div class="container">
-            <div class="row align-items-center g-10">
-                <div class="col-lg-5">
-                    <h2 class="text-green-glow uppercase tracking-wider fs-13 font-bold mb-3">{!! t('Geliştirici Dostu Yapı') !!}</h2>
-                    <h3 class="display-4 font-bold text-glow-gradient mb-5">{!! t('Kodunuza Saniyeler İçinde Bağlayın') !!}</h3>
-                    <p class="text-slate-300 fs-16 mb-6">
-                        {!! t('Modern RESTful JSON standartlarında sunulan temiz çıktı modelimiz sayesinde, en sevdiğiniz programlama dilinde anında istek atın ve verileri işleyin.') !!}
-                    </p>
-                    <ul class="list-unstyled space-y-3 mb-8">
-                        <li class="d-flex align-items-center gap-3">
-                            <i class="uil uil-check-circle text-green-glow fs-18"></i>
-                            <span>{!! t('Kimlik Doğrulama Gerekmez (No-Auth)') !!}</span>
-                        </li>
-                        <li class="d-flex align-items-center gap-3">
-                            <i class="uil uil-check-circle text-green-glow fs-18"></i>
-                            <span>{!! t('Milisaniyeler Hızında JSON Çıktısı') !!}</span>
-                        </li>
-                    </ul>
-                    <a href="https://finance.truncgil.com/docs" target="_blank" class="btn btn-primary px-6 py-3 rounded">
-                        {!! t('API Dokümantasyonunu İncele') !!} <i class="uil uil-arrow-right ms-1"></i>
+    {{-- Section 5: Join Our Community Banner --}}
+    <section class="wrapper image-wrapper bg-image bg-overlay !bg-fixed bg-no-repeat bg-[center_center] bg-cover relative z-0 before:content-[''] before:block before:absolute before:z-[1] before:w-full before:h-full before:left-0 before:top-0 before:bg-[rgba(30,34,40,.5)]" style="background-image: url('{{ asset('assets/img/photos/bg1.jpg') }}');">
+        <div class="container py-[8rem]">
+            <div class="flex flex-wrap mx-[-15px]">
+                <div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full relative z-[2]">
+                    <h2 class="!text-[0.8rem] uppercase inline-flex !leading-[1.35] text-line relative align-top !pl-[1.4rem] !tracking-[0.02rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#ffffff] !text-white !mb-3">
+                        {!! t('Topluluğumuza Katılın') !!}
+                    </h2>
+                    <h3 class="!text-[calc(1.315rem_+_0.78vw)] font-bold xl:!text-[1.9rem] !leading-[1.25] !mb-6 !text-white xxl:!pr-32">
+                        {!! t("5000'den fazla aktif geliştirici ve kurum tarafından tercih ediliyoruz. Siz de projenizi hemen güçlendirin.") !!}
+                    </h3>
+                    <a href="https://finance.truncgil.com/" target="_blank" class="btn btn-white !rounded-[.4rem] !text-[.85rem] !mb-0 whitespace-nowrap">{!! t('Şimdi Başlayın') !!}</a>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    {{-- Section 6: Case Studies (Kullanım Alanları) --}}
+    <section class="wrapper !bg-[#ffffff] angled upper-end relative border-0
+                    before:top-[-4rem] before:content-[''] before:block before:absolute before:z-0 before:border-l-transparent before:border-r-[100vw] before:border-t-[4rem] before:border-y-transparent before:border-[#fefefe] before:border-0 before:border-solid before:right-0 after:content-[''] after:block after:absolute after:z-0 after:border-y-transparent after:border-[#fefefe] after:border-0 after:border-solid after:right-0">
+        <div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
+            <div class="flex flex-wrap mx-[-15px]">
+                <div class="lg:w-9/12 xl:w-8/12 xxl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full">
+                    <h2 class="!text-[0.8rem] uppercase inline-flex !leading-[1.35] text-line relative align-top !pl-[1.4rem] !tracking-[0.02rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#54a8c7] !text-[#54a8c7] !mb-3">
+                        {!! t('Uygulama Alanları') !!}
+                    </h2>
+                    <h3 class="!text-[calc(1.315rem_+_0.78vw)] font-bold xl:!text-[1.9rem] !leading-[1.25] !mb-9">
+                        {!! t('Piyasa verilerimizle zenginleştirilmiş bazı mükemmel kullanım senaryoları.') !!}
+                    </h3>
+                </div>
+            </div>
+            
+            <div class="swiper-container blog grid-view !mb-10 relative z-10" data-margin="30" data-dots="true" data-items-xl="3" data-items-md="2" data-items-xs="1">
+                <div class="swiper">
+                    <div class="swiper-wrapper">
+                        <div class="swiper-slide">
+                            <article>
+                                <figure class="overlay overlay-1 hover-scale rounded !mb-6 group">
+                                    <a href="#">
+                                        <img class="!transition-all !duration-[0.35s] !ease-in-out group-hover:scale-105" src="{{ asset('assets/img/photos/b4.jpg') }}" alt="Use Case 1">
+                                    </a>
+                                </figure>
+                                <div class="post-header">
+                                    <h2 class="post-title h3 !mb-3 !text-[1.15rem] !leading-[1.4]"><a class='!text-[#343f52] hover:!text-[#54a8c7]' href='#'>{!! t('E-Ticaret & Otomatik Döviz Dönüşümleri') !!}</a></h2>
+                                </div>
+                                <div class="post-footer">
+                                    <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
+                                        <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>{!! t('Canlı Kur') !!}</span></li>
+                                    </ul>
+                                </div>
+                            </article>
+                        </div>
+                        <div class="swiper-slide">
+                            <article>
+                                <figure class="overlay overlay-1 hover-scale rounded !mb-6 group">
+                                    <a href="#">
+                                        <img class="!transition-all !duration-[0.35s] !ease-in-out group-hover:scale-105" src="{{ asset('assets/img/photos/b5.jpg') }}" alt="Use Case 2">
+                                    </a>
+                                </figure>
+                                <div class="post-header">
+                                    <h2 class="post-title h3 !mb-3 !text-[1.15rem] !leading-[1.4]"><a class='!text-[#343f52] hover:!text-[#54a8c7]' href='#'>{!! t('ERP & Otomatik Şirket İçi Kur Değerlemeleri') !!}</a></h2>
+                                </div>
+                                <div class="post-footer">
+                                    <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
+                                        <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>{!! t('Kurumsal ERP') !!}</span></li>
+                                    </ul>
+                                </div>
+                            </article>
+                        </div>
+                        <div class="swiper-slide">
+                            <article>
+                                <figure class="overlay overlay-1 hover-scale rounded !mb-6 group">
+                                    <a href="#">
+                                        <img class="!transition-all !duration-[0.35s] !ease-in-out group-hover:scale-105" src="{{ asset('assets/img/photos/b6.jpg') }}" alt="Use Case 3">
+                                    </a>
+                                </figure>
+                                <div class="post-header">
+                                    <h2 class="post-title h3 !mb-3 !text-[1.15rem] !leading-[1.4]"><a class='!text-[#343f52] hover:!text-[#54a8c7]' href='#'>{!! t('Mobil Finans & Canlı Altın Takip Portalları') !!}</a></h2>
+                                </div>
+                                <div class="post-footer">
+                                    <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
+                                        <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>{!! t('Mobil Entegrasyon') !!}</span></li>
+                                    </ul>
+                                </div>
+                            </article>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    {{-- Section 7: Company Facts (Counters) --}}
+    <section class="wrapper !bg-[#edf2fc]">
+        <div class="container py-[4.5rem] xl:pt-28 lg:pt-28 md:pt-28 xl:pb-[12.5rem] lg:pb-[12.5rem] md:pb-[12.5rem]">
+            <div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] xl:!mt-0 lg:!mt-0 !mb-2 items-end">
+                <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[50px] xl:!mt-0 lg:!mt-0 max-w-full">
+                    <h2 class="!text-[0.8rem] uppercase inline-flex !leading-[1.35] text-line relative align-top !pl-[1.4rem] !tracking-[0.02rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#54a8c7] !text-[#54a8c7] !mb-3">
+                        {!! t('Şirket Rakamlarımız') !!}
+                    </h2>
+                    <h3 class="!text-[calc(1.315rem_+_0.78vw)] font-bold xl:!text-[1.9rem] !leading-[1.25] !mb-0 xxl:!pr-20">
+                        {!! t('Altyapımızın gücünü gösteren bazı önemli rakamlar.') !!}
+                    </h3>
+                </div>
+                <div class="lg:w-8/12 xl:w-8/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[50px] max-w-full xl:!mt-2 lg:!mt-2">
+                    <div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-30px] !text-center">
+                        <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] !mt-[30px] max-w-full">
+                            <h3 class="counter counter-lg !text-[calc(1.35rem_+_1.2vw)] !tracking-[normal] !leading-none !mb-[.5rem] xl:!text-[2.25rem]">10M+</h3>
+                            <p class="font-medium !mb-0">{!! t('Günlük API İstek Hacmi') !!}</p>
+                        </div>
+                        <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] !mt-[30px] max-w-full">
+                            <h3 class="counter counter-lg !text-[calc(1.35rem_+_1.2vw)] !tracking-[normal] !leading-none !mb-[.5rem] xl:!text-[2.25rem]">5000+</h3>
+                            <p class="font-medium !mb-0">{!! t('Aktif Geliştirici ve Kurum') !!}</p>
+                        </div>
+                        <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] !mt-[30px] max-w-full">
+                            <h3 class="counter counter-lg !text-[calc(1.35rem_+_1.2vw)] !tracking-[normal] !leading-none !mb-[.5rem] xl:!text-[2.25rem]">%99.99</h3>
+                            <p class="font-medium !mb-0">{!! t('Sunucu Uptime Garantisi') !!}</p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    {{-- Section 8: Testimonial & Pricing Plan Integration --}}
+    <section class="wrapper !bg-[#ffffff] angled upper-end lower-start relative border-0
+                    before:top-[-4rem] before:content-[''] before:block before:absolute before:z-0 before:border-l-transparent before:border-r-[100vw] before:border-t-[4rem] before:border-y-transparent before:border-[#fefefe] before:border-0 before:border-solid before:right-0 after:bottom-[-4rem] after:content-[''] after:block after:absolute after:z-0 after:border-l-[100vw] after:border-r-transparent after:border-b-[4rem] after:border-y-transparent after:border-[#fefefe] after:border-0 after:border-solid after:right-0">
+        <div class="container py-24 xl:!py-[8rem] lg:!py-[8rem] md:!py-[8rem] !relative">
+            
+            {{-- Testimonial Slider --}}
+            <div class="relative !mt-[-8rem] xl:!mt-[-17.5rem] lg:!mt-[-17.5rem] md:!mt-[-17.5rem] !mb-24 xl:!mb-[8rem] lg:!mb-[8rem] md:!mb-[8rem]">
+                <div class="shape !rounded-[50%] bg-line aqua rellax !w-[8rem] !h-[8rem] absolute opacity-50" data-rellax-speed="1" style="top: -2rem; right: -2.7rem; z-index:0;"></div>
+                <div class="shape !rounded-[50%] !bg-[#eff7fa] rellax !w-[8rem] !h-[8rem] absolute" data-rellax-speed="1" style="bottom: -1rem; left: -3rem; z-index:0;"></div>
+                <div class="card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]">
+                    <div class="flex flex-wrap mx-0">
+                        <div class="lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] max-w-full image-wrapper bg-image rounded-t-[0.4rem] rounded-lg-start bg-cover bg-[center_center] bg-no-repeat bg-scroll relative z-0 xl:rounded-tl-[0.4rem] xl:rounded-tr-none xl:rounded-br-none xl:rounded-bl-[0.4rem] lg:rounded-tl-[0.4rem] lg:rounded-tr-none lg:rounded-br-none lg:rounded-bl-[0.4rem] md:min-h-[25rem] max-md:min-h-[25rem]" style="background-image: url('{{ asset('assets/img/photos/tm1.jpg') }}');"></div>
+                        <div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] max-w-full">
+                            <div class="!p-10 xl:!p-[4rem] lg:!p-[4rem] md:!p-12">
+                                <div class="swiper-container dots-closer !mb-4 relative z-10" data-margin="30" data-dots="true">
+                                    <div class="swiper">
+                                        <div class="swiper-wrapper">
+                                            <div class="swiper-slide">
+                                                <blockquote class="icon icon-top !text-[1.05rem] !text-center relative pt-[3.75rem] p-0 border-0 !leading-[1.7] font-medium m-[0_0_1rem] before:translate-x-[-52%] before:left-2/4 before:content-['\201c'] before:!text-[#aab0bc] before:opacity-30 before:text-[6.5rem] before:font-normal before:absolute before:leading-none before:z-[1] before:top-0">
+                                                    <p>“{!! t('Trunçgil Finance API altyapısını mobil cüzdan projemizde kullanıyoruz. Aylardır bir kere bile kesinti yaşamadık, performansı gerçekten harika!') !!}”</p>
+                                                    <div class="flex items-center justify-center !text-center">
+                                                        <div class="info !pl-0">
+                                                            <h5 class="!mb-1 !text-[.95rem] !leading-[1.5]">{!! t('Can Özkan') !!}</h5>
+                                                            <p class="!mb-0 !text-[.85rem]">{!! t('Kıdemli Mobil Geliştirici') !!}</p>
+                                                        </div>
+                                                    </div>
+                                                </blockquote>
+                                            </div>
+                                            <div class="swiper-slide">
+                                                <blockquote class="icon icon-top !text-[1.05rem] !text-center relative pt-[3.75rem] p-0 border-0 !leading-[1.7] font-medium m-[0_0_1rem] before:translate-x-[-52%] before:left-2/4 before:content-['\201c'] before:!text-[#aab0bc] before:opacity-30 before:text-[6.5rem] before:font-normal before:absolute before:leading-none before:z-[1] before:top-0">
+                                                    <p>“{!! t('Sıfır kurulum (No-Auth) olması sayesinde entegrasyonu tam 5 dakikada tamamladık. Hız ve kullanım kolaylığı mükemmel.') !!}”</p>
+                                                    <div class="flex items-center justify-center !text-center">
+                                                        <div class="info !pl-0">
+                                                            <h5 class="!mb-1 !text-[.95rem] !leading-[1.5]">{!! t('Elif Yılmaz') !!}</h5>
+                                                            <p class="!mb-0 !text-[.85rem]">{!! t('Fullstack Yazılım Uzmanı') !!}</p>
+                                                        </div>
+                                                    </div>
+                                                </blockquote>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            {{-- Pricing and Plans --}}
+            <div class="flex flex-wrap mx-[-15px] !mt-[-30px] !mb-24 xl:!mb-[8rem] lg:!mb-[8rem] md:!mb-[8rem]">
+                <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full">
+                    <h2 class="!text-[0.8rem] uppercase inline-flex !leading-[1.35] text-line relative align-top !pl-[1.4rem] !tracking-[0.02rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#54a8c7] !text-[#54a8c7] lg:!mt-32 xl:!mt-32 !mb-3">
+                        {!! t('Fiyatlandırma') !!}
+                    </h2>
+                    <h3 class="!text-[calc(1.315rem_+_0.78vw)] font-bold xl:!text-[1.9rem] !leading-[1.25] !mb-3">
+                        {!! t('Geliştirici dostu ve son derece adil planlar.') !!}
+                    </h3>
+                    <p>{!! t('Hemen ücretsiz deneme planıyla başlayın ve API gücünü kendiniz deneyimleyin. Kredi kartı gerekmez!') !!}</p>
+                    <a href="https://finance.truncgil.com/" target="_blank" class="btn btn-aqua !text-white !bg-[#54a8c7] border-[#54a8c7] hover:text-white hover:bg-[#54a8c7] hover:!border-[#54a8c7] focus:shadow-[rgba(79,152,181,1)] focus:text-white active:text-white active:bg-[#54a8c7] active:border-[#54a8c7] disabled:text-white disabled:bg-[#54a8c7] disabled:border-[#54a8c7] !text-[.85rem] rounded !mt-2">
+                        {!! t('Tüm Planları Gör') !!}
                     </a>
                 </div>
-
-                {{-- Interactive Tabs and Code Code Editor --}}
-                <div class="col-lg-7">
-                    <div class="nav nav-tabs nav-tabs-code mb-4 gap-2" id="code-tabs" role="tablist">
-                        <button class="nav-link active" id="tab-js-btn" data-bs-toggle="tab" data-bs-target="#tab-js" type="button" role="tab" aria-selected="true">JavaScript</button>
-                        <button class="nav-link" id="tab-php-btn" data-bs-toggle="tab" data-bs-target="#tab-php" type="button" role="tab" aria-selected="false">PHP (cURL)</button>
-                        <button class="nav-link" id="tab-python-btn" data-bs-toggle="tab" data-bs-target="#tab-python" type="button" role="tab" aria-selected="false">Python</button>
+                
+                <div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-[8.33333333%] lg:!ml-[8.33333333%] pricing-wrapper !mt-[30px]">
+                    <div class="flex flex-wrap items-center switcher xl:!justify-end lg:!justify-end">
+                        <p class="!mb-0 !pr-[.75rem]">{!! t('Aylık') !!}</p>
+                        <div class="pricing-switchers w-8 h-4 clear-both !text-center !relative bg-[rgba(30,34,40,0.07)] !box-content rounded-3xl border-[0.2rem] border-solid border-transparent">
+                            <div class="pricing-switcher pricing-switcher-active cursor-pointer w-full float-left h-4 leading-4 !relative z-[888] transition-[0.3s] duration-[ease-in-out] uppercase !text-white"></div>
+                            <div class="pricing-switcher cursor-pointer w-full float-left h-4 leading-4 !relative z-[888] transition-[0.3s] duration-[ease-in-out] uppercase"></div>
+                            <div class="h-4 w-4 block absolute z-[555] transition-[0.3s] duration-[ease-in-out] m-0 rounded-[100%] border-[none] left-0 top-0 !bg-[rgba(84,168,199)] opacity-100 switcher-button"></div>
+                        </div>
+                        <p class="!mb-0 !pl-3 !relative">{!! t('Yıllık') !!} <span class="!text-[#e2626b]">({!! t('%30 Tasarruf') !!})</span></p>
                     </div>
-
-                    <div class="tab-content">
-                        {{-- JavaScript --}}
-                        <div class="tab-pane fade show active" id="tab-js" role="tabpanel" aria-labelledby="tab-js-btn">
-                            <div class="code-editor-header">
-                                <div>
-                                    <span class="code-dot code-dot-red" aria-hidden="true"></span>
-                                    <span class="code-dot code-dot-yellow" aria-hidden="true"></span>
-                                    <span class="code-dot code-dot-green" aria-hidden="true"></span>
-                                    <span class="text-slate-400 fs-12">finance.js</span>
+                    
+                    <div class="flex flex-wrap mx-[-15px] !mt-[25px] !relative">
+                        <div class="shape bg-dot aqua rellax !w-[6rem] !h-[8rem] absolute z-[1] opacity-50" data-rellax-speed="1" style="bottom: -0.5rem; right: -1.6rem;"></div>
+                        <div class="shape !rounded-[50%] !bg-[#edf2fc] rellax !w-[8rem] !h-[8rem] absolute z-[1]" data-rellax-speed="1" style="top: -1rem; left: -2rem;"></div>
+                        
+                        <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
+                            <div class="pricing card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]">
+                                <div class="card-body pb-14">
+                                    <div class="prices !text-[#343f52]">
+                                        <div class="price price-show !justify-start"><span class="price-currency">$</span><span class="price-value">0</span> <span class="price-duration">/{!! t('ay') !!}</span></div>
+                                        <div class="price price-hide price-hidden !justify-start"><span class="price-currency">$</span><span class="price-value">0</span> <span class="price-duration">/{!! t('yıl') !!}</span></div>
+                                    </div>
+                                    <h4 class="card-title !mt-2 text-[1rem] !leading-[1.45]">{!! t('Geliştirici Planı') !!}</h4>
+                                    <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8">
+                                        <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#e0eff5] !text-[#54a8c7] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> {!! t('API İstek / Ay') !!}</span></li>
+                                        <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#e0eff5] !text-[#54a8c7] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span>{!! t('Kimlik Doğrulama Gerekmez (No-Auth)') !!}</span></li>
+                                        <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#e0eff5] !text-[#54a8c7] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span>{!! t('Standart HTTP Önbellekleme') !!}</span></li>
+                                        <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span>{!! t('Özel Docker Kurulum Desteği') !!}</span></li>
+                                    </ul>
+                                    <a href="https://finance.truncgil.com/" target="_blank" class="btn btn-aqua !text-white !bg-[#54a8c7] border-[#54a8c7] hover:text-white hover:bg-[#54a8c7] hover:!border-[#54a8c7] focus:shadow-[rgba(79,152,181,1)] focus:text-white active:text-white active:bg-[#54a8c7] active:border-[#54a8c7] disabled:text-white disabled:bg-[#54a8c7] disabled:border-[#54a8c7] !rounded-[.4rem] !text-[.85rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">{!! t('Ücretsiz Başla') !!}</a>
                                 </div>
-                                <button class="btn btn-sm btn-outline-glow rounded px-3 py-1 fs-12" onclick="navigator.clipboard.writeText(document.getElementById('code-js').innerText); alert('Copied!');">
-                                    <i class="uil uil-copy me-1"></i> {!! t('Kopyala') !!}
-                                </button>
                             </div>
-                            <pre class="code-editor-body m-0" id="code-js"><code><span class="text-warning">fetch</span>(<span class="text-success">'https://finance.truncgil.com/v4/today.json'</span>)
-  .<span class="text-warning">then</span>(response => response.<span class="text-warning">json</span>())
-  .<span class="text-warning">then</span>(data => {
-    <span class="text-info">console</span>.<span class="text-warning">log</span>(<span class="text-success">'Dolar/TRY:'</span>, data.USD.Buying);
-    <span class="text-info">console</span>.<span class="text-warning">log</span>(<span class="text-success">'Gram Altın:'</span>, data.Gold_Gram.Selling);
-  })
-  .<span class="text-warning">catch</span>(error => <span class="text-info">console</span>.<span class="text-warning">error</span>(<span class="text-success">'Hata:'</span>, error));</code></pre>
                         </div>
-
-                        {{-- PHP --}}
-                        <div class="tab-pane fade" id="tab-php" role="tabpanel" aria-labelledby="tab-php-btn">
-                            <div class="code-editor-header">
-                                <div>
-                                    <span class="code-dot code-dot-red" aria-hidden="true"></span>
-                                    <span class="code-dot code-dot-yellow" aria-hidden="true"></span>
-                                    <span class="code-dot code-dot-green" aria-hidden="true"></span>
-                                    <span class="text-slate-400 fs-12">finance.php</span>
+                        
+                        <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full popular !mt-[30px]">
+                            <div class="pricing card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]">
+                                <div class="card-body pb-14">
+                                    <div class="prices !text-[#343f52]">
+                                        <div class="price price-show !justify-start"><span class="price-value">{!! t('Özel') !!}</span></div>
+                                    </div>
+                                    <h4 class="card-title !mt-2 text-[1rem] !leading-[1.45]">{!! t('Kurumsal Plan') !!}</h4>
+                                    <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8">
+                                        <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#e0eff5] !text-[#54a8c7] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>{!! t('Sınırsız') !!}</strong> {!! t('API İstek Hacmi') !!}</span></li>
+                                        <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#e0eff5] !text-[#54a8c7] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>{!! t('Özel Sunucu & Docker') !!}</strong> {!! t('Kurulumları') !!}</span></li>
+                                        <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#e0eff5] !text-[#54a8c7] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span>{!! t('Yüksek Öncelikli Özel Destek Hattı') !!}</span></li>
+                                        <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#e0eff5] !text-[#54a8c7] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span>{!! t('Milisaniyelik Ultra Düşük Gecikme') !!}</span></li>
+                                    </ul>
+                                    <a href="{{ route('page.show', ['slug' => 'iletisim']) }}" class="btn btn-aqua !text-white !bg-[#54a8c7] border-[#54a8c7] hover:text-white hover:bg-[#54a8c7] hover:!border-[#54a8c7] focus:shadow-[rgba(79,152,181,1)] focus:text-white active:text-white active:bg-[#54a8c7] active:border-[#54a8c7] disabled:text-white disabled:bg-[#54a8c7] disabled:border-[#54a8c7] !rounded-[.4rem] !text-[.85rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">{!! t('Bizimle İletişime Geçin') !!}</a>
                                 </div>
-                                <button class="btn btn-sm btn-outline-glow rounded px-3 py-1 fs-12" onclick="navigator.clipboard.writeText(document.getElementById('code-php').innerText); alert('Copied!');">
-                                    <i class="uil uil-copy me-1"></i> {!! t('Kopyala') !!}
-                                </button>
                             </div>
-                            <pre class="code-editor-body m-0" id="code-php"><code><span class="text-info">&lt;?php</span>
-<span class="text-warning">$ch</span> = <span class="text-warning">curl_init</span>(<span class="text-success">'https://finance.truncgil.com/v4/today.json'</span>);
-<span class="text-warning">curl_setopt</span>(<span class="text-warning">$ch</span>, CURLOPT_RETURNTRANSFER, <span class="text-info">true</span>);
-<span class="text-warning">$response</span> = <span class="text-warning">curl_exec</span>(<span class="text-warning">$ch</span>);
-<span class="text-warning">$data</span> = <span class="text-warning">json_decode</span>(<span class="text-warning">$response</span>, <span class="text-info">true</span>);
-
-<span class="text-info">echo</span> <span class="text-success">"Altın Satış: "</span> . <span class="text-warning">$data</span>[<span class="text-success">'Gold_Gram'</span>][<span class="text-success">'Selling'</span>];
-<span class="text-warning">curl_close</span>(<span class="text-warning">$ch</span>);</code></pre>
-                        </div>
-
-                        {{-- Python --}}
-                        <div class="tab-pane fade" id="tab-python" role="tabpanel" aria-labelledby="tab-python-btn">
-                            <div class="code-editor-header">
-                                <div>
-                                    <span class="code-dot code-dot-red" aria-hidden="true"></span>
-                                    <span class="code-dot code-dot-yellow" aria-hidden="true"></span>
-                                    <span class="code-dot code-dot-green" aria-hidden="true"></span>
-                                    <span class="text-slate-400 fs-12">finance.py</span>
-                                </div>
-                                <button class="btn btn-sm btn-outline-glow rounded px-3 py-1 fs-12" onclick="navigator.clipboard.writeText(document.getElementById('code-python').innerText); alert('Copied!');">
-                                    <i class="uil uil-copy me-1"></i> {!! t('Kopyala') !!}
-                                </button>
-                            </div>
-                            <pre class="code-editor-body m-0" id="code-python"><code><span class="text-warning">import</span> requests
-
-response = requests.<span class="text-warning">get</span>(<span class="text-success">'https://finance.truncgil.com/v4/today.json'</span>)
-data = response.<span class="text-warning">json</span>()
-
-<span class="text-warning">print</span>(<span class="text-success">f"Dolar Alış: {data['USD']['Buying']}"</span>)
-<span class="text-warning">print</span>(<span class="text-success">f"Gram Altın Satış: {data['Gold_Gram']['Selling']}"</span>)</code></pre>
                         </div>
                     </div>
                 </div>
             </div>
-        </div>
-    </section>
 
-    {{-- Bottom CTA Section targeting Docker deployments --}}
-    <section class="wrapper bg-[#0b0f0d] py-20 relative z-10 border-top border-white-5 text-center">
-        <div class="container">
-            <div class="row">
-                <div class="col-lg-8 mx-auto">
-                    <h2 class="display-3 font-bold text-white mb-4">{!! t('Özel & Dockerize Çözümler') !!}</h2>
-                    <p class="lead fs-18 text-slate-300 mb-8 max-w-xl mx-auto">
-                        {!! t('Yüksek performanslı veri havuzu, sınırsız sorgulama hacmi ve sıfır dış sunucu bağımlılığı için Trunçgil Finance altyapısını Dockerize olarak kendi yerel mimarinize kuralım.') !!}
-                    </p>
-                    <div class="d-flex justify-content-center gap-3 flex-wrap">
-                        <a href="{{ route('page.show', ['slug' => 'iletisim']) }}" class="btn btn-primary px-8 py-3 rounded">
-                            {!! t('Docker Kurulumu İçin İletişime Geçin') !!} <i class="uil uil-comment-alt-dots ms-1"></i>
-                        </a>
-                        <a href="https://finance.truncgil.com/" target="_blank" class="btn btn-outline-glow px-8 py-3 rounded">
-                            {!! t('Detayları Gör') !!}
-                        </a>
+            {{-- Section 9: Get In Touch (Contact Info) --}}
+            <div class="flex flex-wrap mx-[-15px] !mt-[-80px] xl:mx-[-7.5px] lg:mx-[-7.5px] items-center">
+                <div class="md:w-8/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] !mt-[80px] xl:!px-[7.5px] lg:!px-[7.5px] !px-[15px] max-w-full !relative">
+                    <div class="shape bg-dot primary rellax !w-[7rem] !h-[12.5rem] absolute z-[1] opacity-50 bg-[radial-gradient(#e31e24_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: -2rem; left: -1.9rem;"></div>
+                    <div class="shape !rounded-[.4rem] !bg-[#edf2fc] rellax xl:block lg:block md:block !absolute z-[1]" data-rellax-speed="0" style="bottom: -1.8rem; right: -1.5rem; width: 85%; height: 90%;"></div>
+                    <figure class="rounded-[0.4rem] relative z-[2]">
+                        <img class="rounded-[.4rem]" src="{{ asset('assets/img/photos/about14.jpg') }}" alt="Contact Trunçgil Finance">
+                    </figure>
+                </div>
+                
+                <div class="lg:w-5/12 xl:w-4/12 xl:!ml-[8.33333333%] lg:!ml-[8.33333333%] w-full flex-[0_0_auto] !mt-[80px] xl:!px-[7.5px] lg:!px-[7.5px] !px-[15px] max-w-full">
+                    <h2 class="!text-[0.8rem] uppercase inline-flex !leading-[1.35] text-line relative align-top !pl-[1.4rem] !tracking-[0.02rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#54a8c7] !text-[#54a8c7] !mb-3">
+                        {!! t('Bize Ulaşın') !!}
+                    </h2>
+                    <h2 class="!text-[calc(1.315rem_+_0.78vw)] font-bold xl:!text-[1.9rem] !leading-[1.25] !mb-8">
+                        {!! t('Hala ikna olmadınız mı? Gelin birlikte harika bir entegrasyon yapalım.') !!}
+                    </h2>
+                    <div class="flex flex-row">
+                        <div>
+                            <div class="icon !text-[#54a8c7] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> 
+                                <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> 
+                            </div>
+                        </div>
+                        <div>
+                            <h5 class="!mb-1 !text-[0.95rem] !leading-[1.5]">{!! t('Adres') !!}</h5>
+                            <address class="not-italic !leading-[inherit] !mb-4">{!! t('Merkez Ofis, Teknoloji Vadisi, İstanbul, Türkiye') !!}</address>
+                        </div>
+                    </div>
+                    <div class="flex flex-row">
+                        <div>
+                            <div class="icon !text-[#54a8c7] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> 
+                                <i class="uil uil-phone-volume before:content-['\ec50']"></i> 
+                            </div>
+                        </div>
+                        <div>
+                            <h5 class="!mb-1 !text-[0.95rem] !leading-[1.5]">{!! t('Telefon') !!}</h5>
+                            <p>+90 (212) 123 45 67</p>
+                        </div>
+                    </div>
+                    <div class="flex flex-row">
+                        <div>
+                            <div class="icon !text-[#54a8c7] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> 
+                                <i class="uil uil-envelope before:content-['\eac8']"></i> 
+                            </div>
+                        </div>
+                        <div>
+                            <h5 class="!mb-1 !text-[0.95rem] !leading-[1.5]">{!! t('E-posta') !!}</h5>
+                            <p class="!mb-0"><a href="mailto:info@truncgil.com" class="!text-[#60697b]">info@truncgil.com</a></p>
+                        </div>
                     </div>
                 </div>
             </div>
+            
         </div>
     </section>
-    
 </div>
+@endsection
 
 @push('scripts')
 <script>
     document.addEventListener('DOMContentLoaded', function() {
-        // Live rates simulation matching green vibes
+        // Switcher logic for Pricing Table
+        const switcherWrapper = document.querySelector('.pricing-switchers');
+        if (switcherWrapper) {
+            switcherWrapper.addEventListener('click', function() {
+                const button = this.querySelector('.switcher-button');
+                const pricesShow = document.querySelectorAll('.price-show');
+                const pricesHide = document.querySelectorAll('.price-hide');
+                
+                if (button.style.left === '16px') {
+                    button.style.left = '0px';
+                    pricesShow.forEach(el => el.classList.remove('price-hidden'));
+                    pricesHide.forEach(el => el.classList.add('price-hidden'));
+                } else {
+                    button.style.left = '16px';
+                    pricesShow.forEach(el => el.classList.add('price-hidden'));
+                    pricesHide.forEach(el => el.classList.remove('price-hidden'));
+                }
+            });
+        }
+
+        // Live rates dynamic simulator
         function startRateDynamics() {
             const goldTryEl = document.getElementById('gold-try');
             const usdTryEl = document.getElementById('usd-try');
@@ -475,7 +587,7 @@ data = response.<span class="text-warning">json</span>()
 
             setInterval(() => {
                 if (goldTryEl) {
-                    const current = parseFloat(goldTryEl.innerText.replace('₺', '').replace('.', '').replace(',', '.'));
+                    const current = parseFloat(goldTryEl.innerText.replace('₺', '').replace(',', '').replace('.', '').replace(',', '.'));
                     const osc = (Math.random() - 0.48) * 0.75;
                     const next = current + osc;
                     goldTryEl.innerText = '₺' + next.toLocaleString('tr-TR', { minimumFractionDigits: 2, maximumFractionDigits: 2 });
@@ -505,5 +617,3 @@ data = response.<span class="text-warning">json</span>()
     });
 </script>
 @endpush
-
-@endsection