دانیا

<!-- Layout Container -->
<div class="flex flex-col min-h-screen w-full">
    <!-- Main Content Area -->
    <main class="flex-1"></main>
    <!-- end Main Content Area -->

    <!-- Footer -->
    <footer class="p-2.5 mt-28">
        <div
            class="bg-surface dark:bg-surface-2 dark:inset-shadow-xs inset-shadow-surface-content/10 rounded-3xl overflow-hidden">
            <div class="w-full max-w-7xl space-y-3 px-4 mx-auto">
                <div class="flex flex-col items-center justify-center text-center gap-y-5 py-8">
                    <a href="#" class="flex items-center gap-x-2">
                        <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 16 16"
                            fill="currentColor" class="size-8">
                            <path
                                d="M7.25 3.688a8.035 8.035 0 0 0-4.872-.523A.48.48 0 0 0 2 3.64v7.994c0 .345.342.588.679.512a6.02 6.02 0 0 1 4.571.81V3.688ZM8.75 12.956a6.02 6.02 0 0 1 4.571-.81c.337.075.679-.167.679-.512V3.64a.48.48 0 0 0-.378-.475 8.034 8.034 0 0 0-4.872.523v9.268Z" />
                        </svg>
                        <span class="font-bold text-xl">دانیا</span>
                    </a>

                    <p class="text-sm max-sm:text-xs leading-normal text-surface-2-content">
                        با دوره‌های هدفمند، تمرین‌های واقعی و پشتیبانی مستمر
                        کمکت می‌کنیم زبان رو وارد زندگی روزمره‌ات کنی.
                    </p>
                </div>
            </div>
            <div
                class="bg-surface dark:bg-surface-1/50 rounded-t-2xl inset-shadow-2xs inset-shadow-surface-2-content/10 py-5">
                <div class="w-full max-w-7xl space-y-3 px-4 mx-auto">
                    <div class="grid grid-cols-4 lg:gap-5 gap-10">
                        <div class="lg:col-span-1 col-span-full">
                            <div class="flex items-center gap-x-5">
                                <a href="#" class="flex flex-col items-start gap-y-1">
                                    <span class="flex items-center gap-x-1">
                                        <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"
                                            viewBox="0 0 16 16" fill="currentColor" class="size-6">
                                            <path
                                                d="M7.25 3.688a8.035 8.035 0 0 0-4.872-.523A.48.48 0 0 0 2 3.64v7.994c0 .345.342.588.679.512a6.02 6.02 0 0 1 4.571.81V3.688ZM8.75 12.956a6.02 6.02 0 0 1 4.571-.81c.337.075.679-.167.679-.512V3.64a.48.48 0 0 0-.378-.475 8.034 8.034 0 0 0-4.872.523v9.268Z" />
                                        </svg>
                                        <span class="font-bold text-lg">دانیا</span>
                                    </span>
                                    <span class="font-semibold text-2xs text-surface-2-content">مسیر درست
                                        یادگیری</span>
                                </a>
                                <span class="inline-block w-px h-4 bg-border"></span>
                                <div class="flex items-center gap-x-2">
                                    <a href="#" class="inline-flex text-surface-2-content hover:text-surface-content">
                                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"
                                            viewBox="0 0 24 24" class="size-4">
                                            <g fill="none" stroke="currentColor" stroke-linecap="round"
                                                stroke-linejoin="round" stroke-width="2">
                                                <path
                                                    d="M4 8a4 4 0 0 1 4-4h8a4 4 0 0 1 4 4v8a4 4 0 0 1-4 4H8a4 4 0 0 1-4-4z" />
                                                <path d="M9 12a3 3 0 1 0 6 0a3 3 0 0 0-6 0m7.5-4.5v.01" />
                                            </g>
                                        </svg>
                                    </a>
                                    <a href="#" class="inline-flex text-surface-2-content hover:text-surface-content">
                                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"
                                            viewBox="0 0 24 24" class="size-4">
                                            <path fill="none" stroke="currentColor" stroke-linecap="round"
                                                stroke-linejoin="round" stroke-width="2"
                                                d="m15 10l-4 4l6 6l4-16l-18 7l4 2l2 6l3-4" />
                                        </svg>
                                    </a>
                                    <a href="#" class="inline-flex text-surface-2-content hover:text-surface-content">
                                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"
                                            viewBox="0 0 24 24" class="size-4">
                                            <g fill="none" stroke="currentColor" stroke-linecap="round"
                                                stroke-linejoin="round" stroke-width="2">
                                                <path d="M8 11v5m0-8v.01M12 16v-5m4 5v-3a2 2 0 1 0-4 0" />
                                                <path
                                                    d="M3 7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4v10a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4z" />
                                            </g>
                                        </svg>
                                    </a>
                                </div>
                            </div>
                            <div class="block w-full h-px bg-border my-4"></div>
                            <p class="font-semibold text-xs text-surface-2-content">
                                ما در این آموزشگاه با بهره‌گیری از مدرس‌های مجرب و متدهای به‌روز، یادگیری زبان را به
                                تجربه‌ای کاربردی و هدفمند تبدیل کرده‌ایم. تمرکز ما بر مکالمه، درک واقعی زبان و
                                پیشرفت مستمر زبان‌آموزان است.
                            </p>
                        </div>
                        <div class="lg:col-span-1 sm:col-span-2 col-span-full flex flex-col gap-y-3.5">
                            <div class="flex items-center gap-x-3">
                                <span
                                    class="inline-flex items-center gap-x-1.5 before:shrink-0 before:inline-block before:size-1 before:bg-surface-content before:rounded-full before:ring-2 before:ring-surface-content/40 after:inline-block after:w-5 after:h-px after:bg-surface-2-content/35 ps-1.5">
                                </span>
                                <h3 class="font-bold text-sm">دوره‌های محبوب</h3>
                            </div>

                            <ul class="flex flex-col items-start gap-y-1.5">
                                <li>
                                    <a href="#"
                                        class="inline-flex font-semibold text-xs text-surface-2-content hover:text-surface-content">
                                        مکالمه روان (Speaking) (انگلیسی)
                                    </a>
                                </li>
                                <li>
                                    <a href="#"
                                        class="inline-flex font-semibold text-xs text-surface-2-content hover:text-surface-content">
                                        گرامر عملی (Grammar) (انگلیسی)
                                    </a>
                                </li>
                                <li>
                                    <a href="#"
                                        class="inline-flex font-semibold text-xs text-surface-2-content hover:text-surface-content">
                                        درک شنیداری (Listening) (آلمانی)
                                    </a>
                                </li>
                                <li>
                                    <a href="#"
                                        class="inline-flex font-semibold text-xs text-surface-2-content hover:text-surface-content">
                                        گرامر عملی (Grammar) (آلمانی)
                                    </a>
                                </li>
                            </ul>
                        </div>
                        <div class="lg:col-span-1 sm:col-span-2 col-span-full flex flex-col gap-y-3.5">
                            <div class="flex items-center gap-x-3">
                                <span
                                    class="inline-flex items-center gap-x-1.5 before:shrink-0 before:inline-block before:size-1 before:bg-surface-content before:rounded-full before:ring-2 before:ring-surface-content/40 after:inline-block after:w-5 after:h-px after:bg-surface-2-content/35 ps-1.5">
                                </span>
                                <h3 class="font-bold text-sm">لینک‌های مفید</h3>
                            </div>

                            <ul class="flex flex-col items-start gap-y-1.5">
                                <li>
                                    <a href="#"
                                        class="inline-flex font-semibold text-xs text-surface-2-content hover:text-surface-content">
                                        درباره آموزشگاه
                                    </a>
                                </li>
                                <li>
                                    <a href="#"
                                        class="inline-flex font-semibold text-xs text-surface-2-content hover:text-surface-content">
                                        تماس با ما
                                    </a>
                                </li>
                                <li>
                                    <a href="#"
                                        class="inline-flex font-semibold text-xs text-surface-2-content hover:text-surface-content">
                                        پرسش‌های متداول
                                    </a>
                                </li>
                                <li>
                                    <a href="#"
                                        class="inline-flex font-semibold text-xs text-surface-2-content hover:text-surface-content">
                                        قوانین و شرایط استفاده
                                    </a>
                                </li>
                                <li>
                                    <a href="#"
                                        class="inline-flex font-semibold text-xs text-surface-2-content hover:text-surface-content">
                                        حریم خصوصی
                                    </a>
                                </li>
                            </ul>
                        </div>
                        <div class="lg:col-span-1 col-span-full flex flex-col gap-y-3.5">
                            <div class="flex items-center gap-x-3">
                                <span
                                    class="inline-flex items-center gap-x-1.5 before:shrink-0 before:inline-block before:size-1 before:bg-surface-content before:rounded-full before:ring-2 before:ring-surface-content/40 after:inline-block after:w-5 after:h-px after:bg-surface-2-content/35 ps-1.5">
                                </span>
                                <h3 class="font-bold text-sm">راه‌های ارتباط با ما</h3>
                            </div>

                            <div class="grid gap-y-3.5">
                                <div class="flex items-start gap-x-2">
                                    <span
                                        class="shrink-0 inline-flex items-center justify-center size-9 bg-neutral-500 border border-neutral-500 rounded-lg inset-shadow-xs inset-shadow-white/50 text-zinc-100">
                                        <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"
                                            viewBox="0 0 16 16" fill="currentColor" class="size-4">
                                            <path fill-rule="evenodd"
                                                d="m3.855 7.286 1.067-.534a1 1 0 0 0 .542-1.046l-.44-2.858A1 1 0 0 0 4.036 2H3a1 1 0 0 0-1 1v2c0 .709.082 1.4.238 2.062a9.012 9.012 0 0 0 6.7 6.7A9.024 9.024 0 0 0 11 14h2a1 1 0 0 0 1-1v-1.036a1 1 0 0 0-.848-.988l-2.858-.44a1 1 0 0 0-1.046.542l-.534 1.067a7.52 7.52 0 0 1-4.86-4.859Z"
                                                clip-rule="evenodd" />
                                        </svg>
                                    </span>
                                    <span class="flex flex-col gap-y-1">
                                        <span class="font-semibold text-2xs text-surface-2-content">
                                            تلفن پشتیبانی:
                                        </span>
                                        <a href="tel:+982112345678" class="font-bold text-xs" dir="ltr">
                                            021-12345678
                                        </a>
                                    </span>
                                </div>
                                <div class="flex items-start gap-x-2">
                                    <span
                                        class="shrink-0 inline-flex items-center justify-center size-9 bg-neutral-500 border border-neutral-500 rounded-lg inset-shadow-xs inset-shadow-white/50 text-zinc-100">
                                        <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"
                                            viewBox="0 0 16 16" fill="currentColor" class="size-4">
                                            <path
                                                d="M2.5 3A1.5 1.5 0 0 0 1 4.5v.793c.026.009.051.02.076.032L7.674 8.51c.206.1.446.1.652 0l6.598-3.185A.755.755 0 0 1 15 5.293V4.5A1.5 1.5 0 0 0 13.5 3h-11Z" />
                                            <path
                                                d="M15 6.954 8.978 9.86a2.25 2.25 0 0 1-1.956 0L1 6.954V11.5A1.5 1.5 0 0 0 2.5 13h11a1.5 1.5 0 0 0 1.5-1.5V6.954Z" />
                                        </svg>
                                    </span>
                                    <span class="flex flex-col gap-y-1">
                                        <span class="font-semibold text-2xs text-surface-2-content">
                                            ایمیل:
                                        </span>
                                        <a href="mailto:support@example.example" class="font-bold font-sans text-xs"
                                            dir="ltr">
                                            support@example.example
                                        </a>
                                    </span>
                                </div>
                                <div class="flex items-start gap-x-2">
                                    <span
                                        class="shrink-0 inline-flex items-center justify-center size-9 bg-neutral-500 border border-neutral-500 rounded-lg inset-shadow-xs inset-shadow-white/50 text-zinc-100">
                                        <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"
                                            viewBox="0 0 16 16" fill="currentColor" class="size-4">
                                            <path fill-rule="evenodd"
                                                d="m7.539 14.841.003.003.002.002a.755.755 0 0 0 .912 0l.002-.002.003-.003.012-.009a5.57 5.57 0 0 0 .19-.153 15.588 15.588 0 0 0 2.046-2.082c1.101-1.362 2.291-3.342 2.291-5.597A5 5 0 0 0 3 7c0 2.255 1.19 4.235 2.292 5.597a15.591 15.591 0 0 0 2.046 2.082 8.916 8.916 0 0 0 .189.153l.012.01ZM8 8.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"
                                                clip-rule="evenodd" />
                                        </svg>
                                    </span>
                                    <span class="flex flex-col gap-y-1">
                                        <span class="font-semibold text-2xs text-surface-2-content">
                                            آدرس:
                                        </span>
                                        <span class="font-bold text-xs">
                                            تهران، خیابان ولیعصر، بالاتر از یه پارک :)
                                        </span>
                                    </span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div
                        class="font-semibold text-2xs text-center text-surface-2-content border-t select-none pt-5 mt-5">
                        تمامی حقوق این وب‌سایت محفوظ است — آموزشگاه دانیا
                    </div>
                </div>
            </div>
        </div>
    </footer>
    <!-- end Footer -->
</div>
<!-- end Layout Container -->