@extends('front.layouts.master')
@section('content')
    <main class="flex-grow bg-gray-100 pb-14 pt-36 dark:bg-black xs:pt-36">
        <div class="container rounded-lg bg-white p-5 dark:bg-zinc-900">
            <!-- Head -->
            <div class="mb-5 flex">
                <h1 class="relative select-none pb-2 text-lg text-zinc-700 dark:text-white md:text-xl">
                    درباره ما
                    <span
                        class="absolute bottom-0 right-0 h-0.5 w-full rounded-full bg-emerald-500 dark:bg-emerald-400"></span>
                </h1>
            </div>
            <!-- Sub Head -->
            <div class="mb-2 flex">
                <h2 class="mb-4 text-lg font-semibold text-zinc-700 dark:text-white">
                    {{ option('title') }}
                </h2>
            </div>
            <!-- Content -->
            <div class="space-y-4">
                <p class="leading-loose text-zinc-600 dark:text-zinc-300">
                    {{ option('aboute-info') }}
                </p>
            </div>
        </div>
    </main>
@endsection

@section('js-page')
    <script defer src="/front/scripts/custom.js"></script>
@endsection