@extends('layouts.app')
@section('title', ($globalSettings['about_title'] ?? 'Tentang OneDesign').' - OneDesignSpot, OneDesign')
@section('meta_description', $globalSettings['about_description'] ?? 'OneDesign - Partner kreatif untuk digital printing & web design. Sejak 2018 melayani cetak banner, brosur, kartu nama, website, landing page, e-commerce.')
@section('canonical_url', route('about'))
@section('og_type', 'website')
@section('og_title', ($globalSettings['about_title'] ?? 'Tentang OneDesign').' - OneDesignSpot, OneDesign')
@section('og_description', $globalSettings['about_description'] ?? 'OneDesign - Partner kreatif untuk digital printing & web design. Sejak 2018 melayani cetak banner, brosur, kartu nama, website, landing page, e-commerce.')
@section('og_image', $globalSettings['about_image_url'] ?? asset('images/og-about.jpg'))
@section('twitter_card', 'summary_large_image')
@section('twitter_title', ($globalSettings['about_title'] ?? 'Tentang OneDesign').' - OneDesignSpot, OneDesign')
@section('twitter_description', $globalSettings['about_description'] ?? 'OneDesign - Partner kreatif untuk digital printing & web design.')
@section('twitter_image', asset('images/twitter-about.jpg'))
@section('content')
<div class="bg-light py-5">
  <div class="container">
    <div class="row g-4 align-items-center">
      <div class="col-lg-6">
        <h1 class="fw-bold">{{ $globalSettings['about_title'] ?? 'Tentang OneDesign' }}</h1>
        <p class="lead text-muted">{{ $globalSettings['about_subtitle'] ?? 'Kami adalah partner kreatif untuk kebutuhan cetak & digital Anda sejak 2018.' }}</p>
        <p>{{ $globalSettings['about_description'] ?? 'Kami menggabungkan teknologi printing terkini dengan desain web modern berbasis Bootstrap grid untuk hasil yang rapi, responsif, dan profesional.' }}</p>
        <div class="row g-3 mt-3">
          @foreach(($globalSettings['about_stats'] ?? [['value'=>'1200+','label'=>'Proyek Selesai'],['value'=>'850+','label'=>'Klien Puas'],['value'=>'15','label'=>'Tim Profesional']]) as $stat)
          <div class="col-4 text-center"><h3 class="fw-bold text-primary mb-0">{{ $stat['value'] }}</h3><small class="text-muted">{{ $stat['label'] }}</small></div>
          @endforeach
        </div>
      </div>
      <div class="col-lg-6"><div class="overflow-hidden rounded-4 shadow about-img-wrap"><img src="{{ $globalSettings['about_image_url'] ?? asset('images/placeholder-600x400.svg') }}" class="img-fluid w-100 about-img" alt="Tentang"></div></div>
    </div>
  </div>
</div>
<div class="container py-5" id="about-cards">
  <div class="row g-4">
    <div class="col-md-4"><div class="card border-0 shadow-sm p-4 h-100 about-card"><i class="bi bi-bullseye fs-2 text-primary mb-2"></i><h5 class="fw-bold">Visi</h5><p class="text-muted small">{{ $globalSettings['about_visi'] ?? 'Menjadi solusi satu atap terbaik untuk digital printing & web design di Indonesia.' }}</p></div></div>
    <div class="col-md-4"><div class="card border-0 shadow-sm p-4 h-100 about-card"><i class="bi bi-rocket fs-2 text-primary mb-2"></i><h5 class="fw-bold">Misi</h5><p class="text-muted small">{{ $globalSettings['about_misi'] ?? 'Memberikan kualitas terbaik, pelayanan cepat, dan harga transparan untuk setiap klien.' }}</p></div></div>
    <div class="col-md-4"><div class="card border-0 shadow-sm p-4 h-100 about-card"><i class="bi bi-heart fs-2 text-primary mb-2"></i><h5 class="fw-bold">Nilai</h5><p class="text-muted small">{{ $globalSettings['about_nilai'] ?? 'Profesional, kreatif, tepat waktu, dan berorientasi pada kepuasan pelanggan.' }}</p></div></div>
  </div>
</div>
@endsection