<?php
/*
 * This file is part of the CLIENTXCMS project.
 * It is the property of the CLIENTXCMS association.
 *
 * Personal and non-commercial use of this source code is permitted.
 * However, any use in a project that generates profit (directly or indirectly),
 * or any reuse for commercial purposes, requires prior authorization from CLIENTXCMS.
 *
 * To request permission or for more information, please contact our support:
 * https://clientxcms.com/client/support
 *
 * Learn more about CLIENTXCMS License at:
 * https://clientxcms.com/eula
 *
 * Year: 2025
 */
?>
<div class="max-w-5xl px-4 py-10 sm:px-6 lg:px-8 lg:py-14 mx-auto">
    <div class="grid sm:grid-cols-2 lg:grid-cols-2 gap-3 sm:gap-6">
        <a class="group flex flex-col bg-white border shadow-sm rounded-xl hover:shadow-md focus:outline-none focus:shadow-md transition dark:bg-neutral-900 dark:border-neutral-800" href="#">
            <div class="p-4 md:p-5">
                <div class="flex gap-x-5">
                    <i class="mt-1 shrink-0 size-5 text-gray-800 dark:text-neutral-200 bi bi-hdd-stack icon-width"></i>
                    <div class="grow">
                        <h3 class="group-hover:text-blue-600 font-semibold text-gray-800 dark:group-hover:text-neutral-400 dark:text-neutral-200">
                            Lorem ipsum dolor
                        </h3>
                        <p class="text-sm text-gray-500 dark:text-neutral-500">
                            Lorem ipsum dolor sit amet, consectetur adipiscing elit
                        </p>
                    </div>
                </div>
            </div>
        </a>
        <a class="group flex flex-col bg-white border shadow-sm rounded-xl hover:shadow-md focus:outline-none focus:shadow-md transition dark:bg-neutral-900 dark:border-neutral-800" href="#">
            <div class="p-4 md:p-5">
                <div class="flex gap-x-5">
                    <i class="mt-1 shrink-0 size-5 text-gray-800 dark:text-neutral-200 bi bi-hdd-stack icon-width"></i>
                    <div class="grow">
                        <h3 class="group-hover:text-blue-600 font-semibold text-gray-800 dark:group-hover:text-neutral-400 dark:text-neutral-200">
                            Lorem ipsum dolor
                        </h3>
                        <p class="text-sm text-gray-500 dark:text-neutral-500">
                            Lorem ipsum dolor sit amet, consectetur adipiscing elit
                        </p>
                    </div>
                </div>
            </div>
        </a>
    </div>
</div>
