Files
citrus/resources/views/front/products/dijital-donusum.blade.php
T

387 lines
31 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
@extends('layouts.site')
@section('title', 'Dijital Dönüşüm (Yazılım Danışmanlığı) | Trunçgil')
@section('meta_description', 'İşletmenizin dijital dönüşüm yolculuğunda uzman kadromuzla stratejik danışmanlık, süreç otomasyonu, yapay zeka entegrasyonu ve bulut çözümleri sunuyoruz.')
@push('styles')
<style>
.typer-custom, .typer, .cursor {
color: #e31e24 !important;
}
.hero-gradient-bg {
background: linear-gradient(135deg, #edf2fc 0%, #f4f7fd 100%) !important;
}
.hover-lift {
transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}
.hover-lift:hover {
transform: translateY(-5px) !important;
box-shadow: 0 1rem 3rem rgba(30, 34, 40, 0.075) !important;
}
.nav-tabs.nav-tabs-bg .nav-link.active {
background-color: #ffffff !important;
box-shadow: 0 0.25rem 1.75rem rgba(30,34,40,.07) !important;
border-color: transparent !important;
}
.bullet-soft-red i {
background-color: #fdebee !important;
color: #e31e24 !important;
}
.bullet-soft-green i {
background-color: #e6f5ec !important;
color: #45c4a0 !important;
}
.bullet-soft-yellow i {
background-color: #feeed9 !important;
color: #fab758 !important;
}
.btn-premium-red {
background-color: #e31e24 !important;
color: #ffffff !important;
border-color: #e31e24 !important;
transition: all 0.3s ease;
}
.btn-premium-red:hover {
background-color: #c1161b !important;
border-color: #c1161b !important;
box-shadow: 0 0.5rem 1.5rem rgba(227, 30, 36, 0.25) !important;
transform: translateY(-2px);
}
.btn-premium-teal {
background-color: #45c4a0 !important;
color: #ffffff !important;
border-color: #45c4a0 !important;
transition: all 0.3s ease;
}
.btn-premium-teal:hover {
background-color: #34a383 !important;
border-color: #34a383 !important;
box-shadow: 0 0.5rem 1.5rem rgba(69, 196, 160, 0.25) !important;
transform: translateY(-2px);
}
</style>
@endpush
@section('content')
<div class="grow shrink-0">
{{-- Section 1: Hero --}}
<section class="wrapper hero-gradient-bg">
<div class="container pt-10 pb-16 xl:pt-[5rem] lg:pt-[5rem] md:pt-[5rem] xl:pb-28 lg:pb-28 md:pb-28">
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] items-center">
{{-- Left Column: Copywriting --}}
<div class="md:w-10/12 md:!ml-[8.33333333%] lg:!ml-0 lg:w-5/12 xl:!ml-0 xl:w-5/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[50px] max-w-full lg:!mt-[-.5rem] xl:!mt-[-.5rem] text-center lg:text-left xl:text-left order-2 lg:!order-none xl:!order-none">
<h1 class="xl:!text-[2.6rem] !text-[calc(1.385rem_+_1.62vw)] !leading-[1.1] !font-bold !tracking-normal [word-spacing:normal!important] !mb-5 md:mx-10 lg:mx-0">
Geleceğin Teknolojisi ile<br>
<span class="typer !text-[#e31e24] whitespace-nowrap" data-delay="100" data-words="Dijital Dönüşüm,Stratejik Danışmanlık,Akıllı Otomasyon,Bulut Çözümleri"></span>
<span class="cursor !text-[#e31e24]" data-owner="typer"></span>
</h1>
<p class="lead !text-[1.05rem] !leading-[1.6] font-medium !mb-7 text-muted">
İşletmenizin dijital olgunluk seviyesini artırıyor; ölçeklenebilir yazılımlar, yapay zeka modelleri ve yeni nesil entegrasyonlar ile pazar liderliğinizi pekiştiriyoruz.
</p>
<div class="flex justify-center lg:!justify-start xl:!justify-start">
<span><a href="{{ route('page.show', ['slug' => 'iletisim']) }}" class="btn btn-lg btn-premium-red rounded !mr-3">Teklif Alın</a></span>
<span><a href="#neler-apiyoruz" class="btn btn-lg btn-premium-teal rounded">Hizmetlerimiz</a></span>
</div>
</div>
{{-- Right Column: Dynamic Image Grid --}}
<div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[50px] max-w-full">
<div class="flex flex-wrap mx-[-15px]">
<div class="w-3/12 !ml-[8.33333333%] lg:!ml-0 lg:w-4/12 xl:!ml-0 xl:w-4/12 flex-[0_0_auto] !px-[15px] max-w-full flex flex-col">
<div class="ml-auto !mt-auto"><img class="!max-w-full h-auto rounded-[.6rem] !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]" src="{{ asset('assets/img/photos/sa20.jpg') }}" alt="Yazılım Geliştirme"></div>
<div class="ml-auto !mt-5 !mb-10"><img class="!max-w-full h-auto rounded-[.6rem] !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]" src="{{ asset('assets/img/photos/sa18.jpg') }}" alt="Bulut Dönüşümü"></div>
</div>
<div class="w-4/12 lg:w-5/12 xl:w-5/12 flex-[0_0_auto] !px-[15px] max-w-full">
<div><img class="w-full max-w-full h-auto rounded-[.6rem] !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]" src="{{ asset('assets/img/photos/sa16.jpg') }}" alt="Süreç Analizi"></div>
</div>
<div class="w-3/12 flex-[0_0_auto] !px-[15px] max-w-full flex flex-col">
<div class="!mt-auto"><img class="!max-w-full h-auto rounded-[.6rem] !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]" src="{{ asset('assets/img/photos/sa21.jpg') }}" alt="AI Entegrasyonu"></div>
<div class="!mt-5"><img class="!max-w-full h-auto rounded-[.6rem] !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]" src="{{ asset('assets/img/photos/sa19.jpg') }}" alt="Yazılım Mimarisi"></div>
<div class="!mt-5 !mb-10"><img class="!max-w-full h-auto rounded-[.6rem] !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]" src="{{ asset('assets/img/photos/sa17.jpg') }}" alt="Siber Güvenlik"></div>
</div>
</div>
</div>
</div>
</div>
</section>
{{-- Section 2: Clients --}}
@php
$partnersPage = \App\Models\Page::where('slug', 'cozum-ortaklari')->first();
$partners = [];
if ($partnersPage && !empty($partnersPage->data['partners'])) {
$partners = array_slice($partnersPage->data['partners'], 0, 5);
}
@endphp
@if(!empty($partners))
<section class="wrapper !bg-[#ffffff]">
<div class="container py-8 border-b">
<h2 class="!text-[.75rem] !leading-[1.35] font-bold [word-spacing:0.1rem] !tracking-[0.02rem] uppercase !text-[#aab0bc] !text-center !mb-6">{!! t('GÜVENİLİR ÇÖZÜM ORTAKLARIMIZLA BİRLİKTE BAŞARDIK') !!}</h2>
<div class="flex flex-wrap mx-0 md:mx-[-20px] lg:mx-[-20px] xl:mx-[-35px] !mt-[-20px] justify-center items-center opacity-70">
@foreach($partners as $partner)
<div class="w-4/12 xl:w-2/12 lg:w-2/12 md:w-2/12 flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !mt-[20px] max-w-full text-center">
<a href="{{ $partner['url'] ?? '#' }}" target="_blank" title="{{ $partner['name'] ?? '' }}">
<figure class="px-5 md:!px-0 lg:!px-2 xl:!px-3 xxl:!px-4" style="height: 75px; display: flex; align-items: center; justify-content: center;">
<img src="{{ asset('storage/' . $partner['logo']) }}" alt="{{ $partner['name'] ?? '' }}" style="max-height: 68px; width: auto; object-fit: contain;">
</figure>
</a>
</div>
@endforeach
</div>
</div>
</section>
@endif
{{-- Section 3: Value Pillars & Interactive Tabs --}}
<section class="wrapper !bg-[#ffffff]" id="neler-apiyoruz">
<div class="container py-20 xl:py-28 lg:py-28 md:py-28">
<div class="flex flex-wrap mx-[-15px]">
<div class="md:w-10/12 md:!ml-[8.33333333%] lg:w-8/12 lg:!ml-[16.66666667%] xl:w-8/12 xl:!ml-[16.66666667%] w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
<h2 class="!text-[.75rem] uppercase !text-[#aab0bc] !mb-3 !tracking-[0.02rem] !leading-[1.35]">HİZMET ALANLARIMIZ</h2>
<h3 class="xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !leading-[1.2] !font-bold !tracking-normal [word-spacing:normal!important] !mb-10 xl:!px-10 xxl:!px-20">Uçtan Uca Dijital Dönüşüm Stratejileri</h3>
</div>
</div>
{{-- Nav Tabs --}}
<ul class="nav nav-tabs nav-tabs-bg flex justify-between nav-justified xl:!flex-row lg:!flex-row flex-col !mb-8">
<li class="nav-item !mb-[20px]">
<a class="nav-link !flex flex-row hover-lift active" data-bs-toggle="tab" href="#tab-strateji">
<div class="icon btn btn-block btn-lg btn-soft-red pointer-events-none !mr-4 !p-3">
<i class="uil uil-presentation-play text-[1.4rem]"></i>
</div>
<div>
<h4 class="!mb-[.25rem] !text-[0.95rem]">Stratejik Planlama</h4>
<p class="text-muted !text-[0.75rem]">Yol haritası & mimari tasarım</p>
</div>
</a>
</li>
<li class="nav-item !mb-[20px]">
<a class="nav-link !flex flex-row hover-lift" data-bs-toggle="tab" href="#tab-otomasyon">
<div class="icon btn btn-block btn-lg btn-soft-green pointer-events-none !mr-4 !p-3">
<i class="uil uil-processor text-[1.4rem]"></i>
</div>
<div>
<h4 class="!mb-[.25rem] !text-[0.95rem]">Akıllı Otomasyon</h4>
<p class="text-muted !text-[0.75rem]">Hızlı, hatasız ve optimize süreçler</p>
</div>
</a>
</li>
<li class="nav-item !mb-[20px]">
<a class="nav-link !flex flex-row hover-lift" data-bs-toggle="tab" href="#tab-guvenlik">
<div class="icon btn btn-block btn-lg btn-soft-yellow pointer-events-none !mr-4 !p-3">
<i class="uil uil-shield-check text-[1.4rem]"></i>
</div>
<div>
<h4 class="!mb-[.25rem] !text-[0.95rem]">Siber Güvenlik & Bulut</h4>
<p class="text-muted !text-[0.75rem]">Yüksek performans & güvenli altyapı</p>
</div>
</a>
</li>
</ul>
{{-- Tab Contents --}}
<div class="tab-content !mt-10">
{{-- Tab 1: Strategy --}}
<div class="tab-pane fade show active" id="tab-strateji">
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] items-center">
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[50px]">
<div class="flex flex-wrap mx-[-12.5px] !mt-[-25px] items-center">
<div class="w-6/12 flex-[0_0_auto] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !px-[15px] max-w-full !mt-[25px]">
<img class="max-w-full h-auto rounded !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] flex !ml-auto" src="{{ asset('assets/img/photos/sa13.jpg') }}" alt="Analiz">
</div>
<div class="w-6/12 flex-[0_0_auto] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !px-[15px] max-w-full !mt-[25px]">
<img class="max-w-full h-auto rounded !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] !mb-5" src="{{ asset('assets/img/photos/sa14.jpg') }}" alt="Toplantı">
<img class="max-w-full h-auto rounded !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] flex !w-10/12 flex-[0_0_auto]" src="{{ asset('assets/img/photos/sa15.jpg') }}" alt="Karar">
</div>
</div>
</div>
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[50px]">
<h2 class="!mb-3 !leading-[1.35]">Teknolojik Yol Haritanızı Çiziyoruz</h2>
<p class="!mb-6">İşletmenizin mevcut dijital yapısını derinlemesine inceliyor, darboğazları belirliyor ve büyüme hedeflerinize en uygun teknoloji yığınını seçiyoruz.</p>
<ul class="pl-0 list-none bullet-bg bullet-soft-red !mb-6">
<li class="relative !pl-6 !mb-2"><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 rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle"></i>Dijital Olgunluk Seviyesi Analizi</li>
<li class="relative !pl-6 !mb-2"><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 rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle"></i>Doğru Teknoloji Seçimi & Mimari Tasarım</li>
<li class="relative !pl-6"><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 rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle"></i>Geleceğe Hazır, Ölçeklenebilir Yol Haritası</li>
</ul>
<a href="{{ route('page.show', ['slug' => 'iletisim']) }}" class="btn btn-premium-red rounded">Danışmanlık Alın</a>
</div>
</div>
</div>
{{-- Tab 2: Automation --}}
<div class="tab-pane fade" id="tab-otomasyon">
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] items-center">
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[50px] xl:!order-2 lg:!order-2">
<div class="flex flex-wrap mx-[-15px] xl:mx-[-12.5px] lg:mx-[-12.5px] md:mx-[-12.5px] !mt-[-25px]">
<div class="w-5/12 flex-[0_0_auto] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !px-[15px] max-w-full !mt-[25px]">
<img class="max-w-full h-auto rounded !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] my-5 flex !ml-auto" src="{{ asset('assets/img/photos/sa9.jpg') }}" alt="Kodlama">
<img class="max-w-full h-auto rounded !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] flex !w-10/12 flex-[0_0_auto] !ml-auto" src="{{ asset('assets/img/photos/sa10.jpg') }}" alt="Kontrol">
</div>
<div class="w-7/12 flex-[0_0_auto] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !px-[15px] max-w-full !mt-[25px]">
<img class="max-w-full h-auto rounded !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] !mb-5" src="{{ asset('assets/img/photos/sa11.jpg') }}" alt="Entegrasyon">
<img class="max-w-full h-auto rounded !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] flex w-11/12 flex-[0_0_auto]" src="{{ asset('assets/img/photos/sa12.jpg') }}" alt="Başarı">
</div>
</div>
</div>
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[50px]">
<h2 class="!mb-3 !leading-[1.35]">Manuel Süreçlerinizi Otomatikleştirin</h2>
<p class="!mb-6">Hata oranlarını sıfıra indirmek ve operasyonel hızı katlamak için akışlarınızı dijital sistemler ile uçtan uca otomatik hale getiriyoruz.</p>
<ul class="pl-0 list-none bullet-bg bullet-soft-green !mb-6">
<li class="relative !pl-6 !mb-2"><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 rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle"></i>Yapay Zeka Destekli Süreç Yönetimi (RPA)</li>
<li class="relative !pl-6 !mb-2"><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 rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle"></i>Kusursuz ve Hızlı Veri Akışı Entegrasyonları</li>
<li class="relative !pl-6"><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 rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle"></i>Özel Geliştirilmiş Web ve Mobil ERP/CRM Arayüzleri</li>
</ul>
<a href="{{ route('page.show', ['slug' => 'iletisim']) }}" class="btn btn-premium-teal rounded">Hemen Başlayın</a>
</div>
</div>
</div>
{{-- Tab 3: Security & Cloud --}}
<div class="tab-pane fade" id="tab-guvenlik">
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] items-center">
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[50px]">
<div class="flex flex-wrap mx-[-15px] xl:mx-[-12.5px] lg:mx-[-12.5px] md:mx-[-12.5px] !mt-[-25px]">
<div class="w-6/12 flex-[0_0_auto] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !px-[15px] max-w-full !mt-[25px]">
<img class="max-w-full h-auto rounded !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] !mb-5" src="{{ asset('assets/img/photos/sa5.jpg') }}" alt="Siber Güvenlik">
<img class="max-w-full h-auto rounded !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] flex !w-10/12 flex-[0_0_auto] !ml-auto" src="{{ asset('assets/img/photos/sa6.jpg') }}" alt="Gözlem">
</div>
<div class="w-6/12 flex-[0_0_auto] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !px-[15px] max-w-full !mt-[25px]">
<img class="max-w-full h-auto rounded !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] my-5" src="{{ asset('assets/img/photos/sa7.jpg') }}" alt="Cloud">
<img class="max-w-full h-auto rounded !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] flex !w-10/12 flex-[0_0_auto]" src="{{ asset('assets/img/photos/sa8.jpg') }}" alt="Tasarım">
</div>
</div>
</div>
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[50px]">
<h2 class="!mb-3 !leading-[1.35]">Verilerinizi Buluta Güvenle Taşıyın</h2>
<p class="!mb-6">Güvenli, yedekli ve yüksek performanslı bulut native altyapılar tasarlıyor, ISO27001 standartlarında siber güvenlik denetimleri yapıyoruz.</p>
<ul class="pl-0 list-none bullet-bg bullet-soft-yellow !mb-6">
<li class="relative !pl-6 !mb-2"><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 rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle"></i>Cloud Native Mimariler (AWS, Azure, GCP)</li>
<li class="relative !pl-6 !mb-2"><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 rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle"></i>Sızma Testleri & Güvenlik Duvarı Entegrasyonları</li>
<li class="relative !pl-6"><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 rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle"></i>Uptime & Performans Optimizasyonları</li>
</ul>
<a href="{{ route('page.show', ['slug' => 'iletisim']) }}" class="btn btn-premium-teal rounded">Hemen İletişime Geçin</a>
</div>
</div>
</div>
</div>
</div>
</section>
{{-- Section 4: Success Statistics / Fact Counters --}}
<section class="wrapper !bg-[#edf2fc]">
<div class="container py-16 xl:py-24 lg:py-24 md:py-24">
<div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] xl:!mt-0 lg:!mt-0 items-center">
<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-[#e31e24] !text-[#e31e24] !mb-3">Başarı Karnemiz</h2>
<h3 class="!text-[calc(1.315rem_+_0.78vw)] font-bold xl:!text-[1.9rem] !leading-[1.25] !mb-0 xxl:!pr-10">Rakamlarla Dijital Dönüşüm Gücü</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]">%40+</h3>
<p class="font-medium !mb-0">Operasyonel Maliyet Düşüşü</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]">3 Kat</h3>
<p class="font-medium !mb-0">Hız ve Verimlilik Artışı</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.9</h3>
<p class="font-medium !mb-0">Sistem Ayakta Kalma Oranı</p>
</div>
</div>
</div>
</div>
</div>
</section>
{{-- Section 5: Happy Customers / Testimonials --}}
<section class="wrapper !bg-[#ffffff]">
<div class="container py-20 xl:py-28 lg:py-28 md:py-28">
<div class="flex flex-wrap mx-[-15px]">
<div class="md:w-10/12 md:!ml-[8.33333333%] lg:w-8/12 lg:!ml-[16.66666667%] xl:w-8/12 xl:!ml-[16.66666667%] w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
<h2 class="!text-[.75rem] uppercase !text-[#aab0bc] !mb-3 !tracking-[0.02rem] !leading-[1.35]">MÜŞTERİ YORUMLARI</h2>
<h3 class="xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !leading-[1.2] !font-bold !tracking-normal [word-spacing:normal!important] !mb-10">İş Ortaklarımızın Başarı Hikayeleri</h3>
</div>
</div>
<div class="flex flex-wrap mx-[-15px] !mt-[-30px]">
{{-- Testimonial 1 --}}
<div class="md:w-6/12 lg:w-6/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
<div class="card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] hover-lift">
<div class="card-body flex-[1_1_auto] p-[40px]">
<span class="ratings inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 five !mb-3"></span>
<blockquote class="!text-[0.85rem] !leading-[1.7] font-medium !pl-0 relative border-0">
<p class="!mb-6">“Trunçgil ekibi sayesinde tüm üretim ve sipariş süreçlerimizi tek bir ERP sisteminde topladık. Manuel hatalarımız sıfıra indi ve verimliliğimiz inanılmaz arttı!</p>
<div class="flex items-center text-left">
<div class="info !pl-0">
<h5 class="!mb-1 text-[.95rem] !leading-[1.5]">Mustafa Şen</h5>
<p class="!mb-0 !text-[.8rem] text-muted">Üretim Direktörü</p>
</div>
</div>
</blockquote>
</div>
</div>
</div>
{{-- Testimonial 2 --}}
<div class="md:w-6/12 lg:w-6/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
<div class="card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] hover-lift">
<div class="card-body flex-[1_1_auto] p-[40px]">
<span class="ratings inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 five !mb-3"></span>
<blockquote class="!text-[0.85rem] !leading-[1.7] font-medium !pl-0 relative border-0">
<p class="!mb-6">“Altyapımızı bulut mimarisine geçirirken sundukları stratejik danışmanlık hizmeti mükemmeldi. Sıfır kesintiyle tüm geçişi tamamladık. Kesinlikle tavsiye ediyoruz.</p>
<div class="flex items-center text-left">
<div class="info !pl-0">
<h5 class="!mb-1 text-[.95rem] !leading-[1.5]">Ayşe Yurt</h5>
<p class="!mb-0 !text-[.8rem] text-muted">CTO, FinTech Startup</p>
</div>
</div>
</blockquote>
</div>
</div>
</div>
{{-- Testimonial 3 --}}
<div class="md:w-6/12 lg:w-6/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px] max-md:hidden">
<div class="card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] hover-lift">
<div class="card-body flex-[1_1_auto] p-[40px]">
<span class="ratings inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 five !mb-3"></span>
<blockquote class="!text-[0.85rem] !leading-[1.7] font-medium !pl-0 relative border-0">
<p class="!mb-6">“Yapay zeka modellerinin entegrasyonu aşamasındaki bilgileri ve profesyonel yaklaşımları takdire şayandı. Müşteri analizlerimizde büyük yol kat ettik.</p>
<div class="flex items-center text-left">
<div class="info !pl-0">
<h5 class="!mb-1 text-[.95rem] !leading-[1.5]">Hakan Yıldız</h5>
<p class="!mb-0 !text-[.8rem] text-muted">Dijital Pazarlama Müdürü</p>
</div>
</div>
</blockquote>
</div>
</div>
</div>
</div>
</div>
</section>
{{-- Section 6: Action Banner --}}
<section class="wrapper !bg-[#e31e24] text-white">
<div class="container py-14 text-center">
<div class="flex flex-wrap mx-[-15px] justify-center">
<div class="xl:w-10/12 w-full px-[15px]">
<h3 class="!text-[calc(1.3rem_+_0.6vw)] xl:!text-[1.75rem] font-bold !leading-[1.3] text-white !mb-4">İşletmenizi Geleceğe Birlikte Taşıyalım</h3>
<p class="lead !text-[1.05rem] !leading-[1.6] !mb-6 text-white-50">Dijital dönüşüm stratejinizi oluşturmak ve size özel yazılım çözümleri üretmek için hazırız.</p>
<a href="{{ route('page.show', ['slug' => 'iletisim']) }}" class="btn btn-white !rounded-[50rem] !mb-0">Hemen Başvurun</a>
</div>
</div>
</div>
</section>
</div>
@endsection