<section
        class="border-solid border-0 box-border leading-6 m-0 px-0 py-4 text-black lg:py-20 sm:py-6 md:py-12 max-w-[1200px]"
        id="widget"
    >
        <div
            class="border-0 leading-6 my-0 mx-auto py-0 px-6 lg:px-4 sm:px-6 md:px-6"
        >
            <div
                class="border-solid box-border m-0 p-0 text-center text-black"
            >
                <p class="border-0 leading-6 p-0 uppercase">Subheading</p>
                <h2
                    class="border-0 font-black text-4xl leading-none p-0 tracking-tight sm:text-6xl"
                >
                    Choose your plan
                </h2>
                <p
                    class="border-0 font-sans font-normal text-2xl leading-normal mx-0 mb-0 mt-4 text-center"
                >
                    Start building for free, and upgrade anytime to unlock
                    other features.
                </p>
            </div>
            <div
                class="border-solid box-border grid mx-0 mb-0 mt-4 p-0 text-black gap-4 grid-cols-1 sm:mt-6 sm:gap-6 sm:grid-cols-2 md:mt-8 md:gap-0 md:grid-cols-3"
            >
                <div
                    class="rounded-md border flex flex-col items-center leading-6 m-0 p-4 sm:my-0 sm:p-6 md:my-8 md:p-8"
                >
                    <h3
                        class="border-solid border-0 box-border font-semibold text-2xl leading-tight p-0 tracking-tight"
                    >
                        Basic
                    </h3>
                    <p
                        class="border-solid border-0 box-border items-end mx-0 mb-0 mt-6 p-0 text-black"
                    >
                        <span
                            class="border-0 font-semibold text-6xl leading-none m-0 text-black"
                            >$49</span
                        ><span class="border-0 leading-6 m-0 text-black"
                            >/ month</span
                        >
                    </p>
                    <p
                        class="border-solid border-0 box-border font-sans mx-0 mb-0 mt-6 p-0 text-center"
                    >
                        For small and medium-sized businesses
                    </p>
                    <ul
                        class="border-solid border-0 box-border flex-1 mx-0 mb-0 mt-4 p-0 text-black"
                    >
                        <li
                            class="border-0 flex items-center font-semibold leading-6 mt-0 mb-2 text-left"
                        >
                            <svg
                                fill="currentColor"
                                class="border-solid box-border h-4 my-0 ml-0 mr-2 p-0 w-4"
                            >
                                <svg
                                    xmlns="http://www.w3.org/2000/svg"
                                    viewBox="0 0 24 24"
                                    fill="none"
                                    stroke="currentColor"
                                    stroke-width="2"
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                    class="border-0 font-semibold leading-6 m-0 text-left text-blue-600"
                                >
                                    <path
                                        d="M20 6L9 17l-5-5"
                                        class="border-solid box-border leading-6 p-0 text-blue-600"
                                    ></path>
                                </svg></svg
                            >Lorem ipsum dolor sit amet
                        </li>
                        <li
                            class="border-0 flex items-center font-semibold leading-6 mt-0 mb-2 text-left"
                        >
                            <svg
                                fill="currentColor"
                                class="border-solid box-border h-4 my-0 ml-0 mr-2 p-0 w-4"
                            >
                                <svg
                                    xmlns="http://www.w3.org/2000/svg"
                                    viewBox="0 0 24 24"
                                    fill="none"
                                    stroke="currentColor"
                                    stroke-width="2"
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                    class="border-0 font-semibold leading-6 m-0 text-left text-blue-600"
                                >
                                    <path
                                        d="M20 6L9 17l-5-5"
                                        class="border-solid box-border leading-6 p-0 text-blue-600"
                                    ></path>
                                </svg></svg
                            >Consectetur adipiscing
                        </li>
                        <li
                            class="border-0 flex items-center font-semibold leading-6 mt-0 mb-2 text-left"
                        >
                            <svg
                                fill="currentColor"
                                class="border-solid box-border h-4 my-0 ml-0 mr-2 p-0 w-4"
                            >
                                <svg
                                    xmlns="http://www.w3.org/2000/svg"
                                    viewBox="0 0 24 24"
                                    fill="none"
                                    stroke="currentColor"
                                    stroke-width="2"
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                    class="border-0 font-semibold leading-6 m-0 text-left text-blue-600"
                                >
                                    <path
                                        d="M20 6L9 17l-5-5"
                                        class="border-solid box-border leading-6 p-0 text-blue-600"
                                    ></path>
                                </svg></svg
                            >Accumsan tincidunt
                        </li>
                    </ul>
                    <button
                        class="bg-transparent bg-none rounded border-solid box-border cursor-pointer inline-flex justify-center font-sans h-12 text-base leading-none mx-0 mb-0 mt-8 py-3 px-4 text-center no-underline w-full hover:shadow-xs focus:shadow-xs"
                    >
                        Select Plan
                    </button>
                </div>
                <div
                    class="rounded-md border-4 flex flex-col items-center leading-6 m-0 p-4 sm:p-6 md:px-8 md:py-16 border-blue-600"
                >
                    <h3
                        class="border-solid border-0 box-border font-semibold text-2xl leading-tight p-0 tracking-tight"
                    >
                        Plus
                    </h3>
                    <p
                        class="border-solid border-0 box-border items-end mx-0 mb-0 mt-6 p-0 text-black"
                    >
                        <span
                            class="border-0 font-semibold text-6xl leading-none m-0 text-black"
                            >$299</span
                        ><span class="border-0 leading-6 m-0 text-black"
                            >/ month</span
                        >
                    </p>
                    <p
                        class="border-solid border-0 box-border font-sans mx-0 mb-0 mt-6 p-0 text-center"
                    >
                        For larger businesses with advanced administration
                        tools
                    </p>
                    <ul
                        class="border-solid border-0 box-border flex-1 mx-0 mb-0 mt-4 p-0 text-black"
                    >
                        <li
                            class="border-0 flex items-center font-semibold leading-6 mt-0 mb-2 text-left"
                        >
                            <svg
                                fill="currentColor"
                                class="border-solid box-border h-4 my-0 ml-0 mr-2 p-0 w-4"
                            >
                                <svg
                                    xmlns="http://www.w3.org/2000/svg"
                                    viewBox="0 0 24 24"
                                    fill="none"
                                    stroke="currentColor"
                                    stroke-width="2"
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                    class="border-0 font-semibold leading-6 m-0 text-left text-blue-600"
                                >
                                    <path
                                        d="M20 6L9 17l-5-5"
                                        class="border-solid box-border leading-6 p-0 text-blue-600"
                                    ></path>
                                </svg></svg
                            >Lorem ipsum dolor sit amet
                        </li>
                        <li
                            class="border-0 flex items-center font-semibold leading-6 mt-0 mb-2 text-left"
                        >
                            <svg
                                fill="currentColor"
                                class="border-solid box-border h-4 my-0 ml-0 mr-2 p-0 w-4"
                            >
                                <svg
                                    xmlns="http://www.w3.org/2000/svg"
                                    viewBox="0 0 24 24"
                                    fill="none"
                                    stroke="currentColor"
                                    stroke-width="2"
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                    class="border-0 font-semibold leading-6 m-0 text-left text-blue-600"
                                >
                                    <path
                                        d="M20 6L9 17l-5-5"
                                        class="border-solid box-border leading-6 p-0 text-blue-600"
                                    ></path>
                                </svg></svg
                            >Consectetur adipiscing
                        </li>
                        <li
                            class="border-0 flex items-center font-semibold leading-6 mt-0 mb-2 text-left"
                        >
                            <svg
                                fill="currentColor"
                                class="border-solid box-border h-4 my-0 ml-0 mr-2 p-0 w-4"
                            >
                                <svg
                                    xmlns="http://www.w3.org/2000/svg"
                                    viewBox="0 0 24 24"
                                    fill="none"
                                    stroke="currentColor"
                                    stroke-width="2"
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                    class="border-0 font-semibold leading-6 m-0 text-left text-blue-600"
                                >
                                    <path
                                        d="M20 6L9 17l-5-5"
                                        class="border-solid box-border leading-6 p-0 text-blue-600"
                                    ></path>
                                </svg></svg
                            >Nulla porttitor
                        </li>
                        <li
                            class="border-0 flex items-center font-semibold leading-6 mt-0 mb-2 text-left"
                        >
                            <svg
                                fill="currentColor"
                                class="border-solid box-border h-4 my-0 ml-0 mr-2 p-0 w-4"
                            >
                                <svg
                                    xmlns="http://www.w3.org/2000/svg"
                                    viewBox="0 0 24 24"
                                    fill="none"
                                    stroke="currentColor"
                                    stroke-width="2"
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                    class="border-0 font-semibold leading-6 m-0 text-left text-blue-600"
                                >
                                    <path
                                        d="M20 6L9 17l-5-5"
                                        class="border-solid box-border leading-6 p-0 text-blue-600"
                                    ></path>
                                </svg></svg
                            >Accumsan tincidunt
                        </li>
                    </ul>
                    <button
                        class="bg-blue-600 bg-none rounded border-solid border box-border cursor-pointer inline-flex justify-center font-sans h-12 text-base leading-none mx-0 mb-0 mt-8 py-3 px-4 text-center text-white no-underline w-full hover:shadow-xs focus:shadow-xs"
                    >
                        Select Plan
                    </button>
                </div>
                <div
                    class="rounded-md border flex flex-col items-center leading-6 m-0 p-4 sm:my-0 sm:p-6 md:my-8 md:p-8"
                >
                    <h3
                        class="border-solid border-0 box-border font-semibold text-2xl leading-tight p-0 tracking-tight"
                    >
                        Custom
                    </h3>
                    <p
                        class="border-solid border-0 box-border items-end mx-0 mb-0 mt-6 p-0 text-black"
                    >
                        <span
                            class="border-0 font-semibold text-6xl leading-none m-0 text-black"
                            >$499</span
                        ><span class="border-0 leading-6 m-0 text-black"
                            >/ month</span
                        >
                    </p>
                    <p
                        class="border-solid border-0 box-border font-sans mx-0 mb-0 mt-6 p-0 text-center"
                    >
                        For very large businesses or those in highly
                        regulated industries
                    </p>
                    <ul
                        class="border-solid border-0 box-border flex-1 mx-0 mb-0 mt-4 p-0 text-black"
                    >
                        <li
                            class="border-0 flex items-center font-semibold leading-6 mt-0 mb-2 text-left"
                        >
                            <svg
                                fill="currentColor"
                                class="border-solid box-border h-4 my-0 ml-0 mr-2 p-0 w-4"
                            >
                                <svg
                                    xmlns="http://www.w3.org/2000/svg"
                                    viewBox="0 0 24 24"
                                    fill="none"
                                    stroke="currentColor"
                                    stroke-width="2"
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                    class="border-0 font-semibold leading-6 m-0 text-left text-blue-600"
                                >
                                    <path
                                        d="M20 6L9 17l-5-5"
                                        class="border-solid box-border leading-6 p-0 text-blue-600"
                                    ></path>
                                </svg></svg
                            >Lorem ipsum dolor sit amet
                        </li>
                        <li
                            class="border-0 flex items-center font-semibold leading-6 mt-0 mb-2 text-left"
                        >
                            <svg
                                fill="currentColor"
                                class="border-solid box-border h-4 my-0 ml-0 mr-2 p-0 w-4"
                            >
                                <svg
                                    xmlns="http://www.w3.org/2000/svg"
                                    viewBox="0 0 24 24"
                                    fill="none"
                                    stroke="currentColor"
                                    stroke-width="2"
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                    class="border-0 font-semibold leading-6 m-0 text-left text-blue-600"
                                >
                                    <path
                                        d="M20 6L9 17l-5-5"
                                        class="border-solid box-border leading-6 p-0 text-blue-600"
                                    ></path>
                                </svg></svg
                            >Consectetur adipiscing
                        </li>
                        <li
                            class="border-0 flex items-center font-semibold leading-6 mt-0 mb-2 text-left"
                        >
                            <svg
                                fill="currentColor"
                                class="border-solid box-border h-4 my-0 ml-0 mr-2 p-0 w-4"
                            >
                                <svg
                                    xmlns="http://www.w3.org/2000/svg"
                                    viewBox="0 0 24 24"
                                    fill="none"
                                    stroke="currentColor"
                                    stroke-width="2"
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                    class="border-0 font-semibold leading-6 m-0 text-left text-blue-600"
                                >
                                    <path
                                        d="M20 6L9 17l-5-5"
                                        class="border-solid box-border leading-6 p-0 text-blue-600"
                                    ></path>
                                </svg></svg
                            >Nulla porttitor
                        </li>
                        <li
                            class="border-0 flex items-center font-semibold leading-6 mt-0 mb-2 text-left"
                        >
                            <svg
                                fill="currentColor"
                                class="border-solid box-border h-4 my-0 ml-0 mr-2 p-0 w-4"
                            >
                                <svg
                                    xmlns="http://www.w3.org/2000/svg"
                                    viewBox="0 0 24 24"
                                    fill="none"
                                    stroke="currentColor"
                                    stroke-width="2"
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                    class="border-0 font-semibold leading-6 m-0 text-left text-blue-600"
                                >
                                    <path
                                        d="M20 6L9 17l-5-5"
                                        class="border-solid box-border leading-6 p-0 text-blue-600"
                                    ></path>
                                </svg></svg
                            >Accumsan tincidunt
                        </li>
                    </ul>
                    <button
                        class="bg-transparent bg-none rounded border-solid box-border cursor-pointer inline-flex justify-center font-sans h-12 text-base leading-none mx-0 mb-0 mt-8 py-3 px-4 text-center no-underline w-full hover:shadow-xs focus:shadow-xs"
                    >
                        Select Plan
                    </button>
                </div>
            </div>
        </div>
    </section>