@php
    use App\Support\Marketing\SecurityTopics;

    $breadcrumbs = [
        ['label' => 'خانه', 'url' => url('/')],
        ['label' => 'امنیت اطلاعات', 'url' => route('marketing.security')],
    ];

    $seoTitle = 'امنیت اطلاعات در لیموسی | جداسازی داده، سطح دسترسی و خروجی اطلاعات';
    $seoDescription = 'اطلاعات هر فضای کاری چطور جدا نگهداری می‌شود، سطح دسترسی اعضا و مشتریان چگونه کنترل می‌شود و چطور می‌توانید از اطلاعات خود خروجی بگیرید.';

@endphp

<x-marketing.layout
    :title="$seoTitle"
    :description="$seoDescription"
    :breadcrumbs="$breadcrumbs"
>
    <x-marketing.section>
        <x-marketing.breadcrumbs :items="$breadcrumbs" class="mb-8" />

        <x-marketing.section-title
            align="right"
            as="h1"
            eyebrow="امنیت و اعتماد"
            title="اطلاعات شما در لیموسی چطور نگهداری می‌شود"
            lead="هر موردی که در این صفحه آمده، در خود نرم‌افزار پیاده‌سازی شده است. اینجا ادعای کلی و بدون پشتوانه نمی‌نویسیم."
        />

        <div class="mt-12 grid gap-4 lg:grid-cols-2">
            @foreach (SecurityTopics::verified() as $topic)
                <article data-fade class="flex h-full flex-col rounded-xl border border-limoc-border bg-white p-6">
                    <div class="flex items-start gap-3">
                        <span class="mt-0.5 flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-limoc-honey/60 text-limoc-green" aria-hidden="true">
                            <svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5" d="M5 13l4 4L19 7"/></svg>
                        </span>
                        <div class="min-w-0">
                            <h2 class="font-bold text-limoc-ink">{{ $topic['title'] }}</h2>
                            <p class="mt-2 text-sm leading-7 text-limoc-muted">{{ $topic['body'] }}</p>
                        </div>
                    </div>

                    @if ($topic['points'])
                        <ul class="mt-4 space-y-2 border-t border-limoc-border pt-4">
                            @foreach ($topic['points'] as $point)
                                <li class="flex items-start gap-2 text-sm leading-7 text-limoc-muted">
                                    <span class="mt-2.5 h-1.5 w-1.5 shrink-0 rounded-full bg-limoc-lime" aria-hidden="true"></span>
                                    <span>{{ $point }}</span>
                                </li>
                            @endforeach
                        </ul>
                    @endif
                </article>
            @endforeach
        </div>
    </x-marketing.section>

    <x-marketing.section>
        <x-marketing.cta-section
            source="security"
            title="لیموسی را ۶۰ روز رایگان امتحان کنید"
            lead="بدون نیاز به نصب و بدون ثبت اطلاعات پرداخت."
            :primary-href="url('/').'#trial-form'"
            secondary-label="مشاهده امکانات"
            :secondary-href="url('/').'#features'"
        />
    </x-marketing.section>
</x-marketing.layout>