Features Grid

<div class="space-y-8 sm:space-y-0 sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:gap-8 md:gap-10 lg:gap-12">
    <div class="feature">
        <svg class="inline-block align-middle -mt-1 stroke-current w-12 h-12 mb-2 text-teal-500" aria-hidden="true" focusable="false" role="img">
            <use xlink:href="../../icons.svg#globe" />
        </svg>

        <h4 class="text-lg md:text-xl lg:text-2xl font-medium mb-2">Competitive</h4>
        <p class="text-gray-600">Lorem ipsum dolor sit amet consectetur adipisicing elit. Quidem quisquam suscipit culpa sit vero eius voluptate? Repellendus fugit beatae eveniet!</p>
    </div>
    <div class="feature">
        <svg class="inline-block align-middle -mt-1 stroke-current w-12 h-12 mb-2 text-teal-500" aria-hidden="true" focusable="false" role="img">
            <use xlink:href="../../icons.svg#key" />
        </svg>

        <h4 class="text-lg md:text-xl lg:text-2xl font-medium mb-2">Accessible</h4>
        <p class="text-gray-600">Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellendus doloribus reprehenderit fuga. Eligendi provident ipsa dolor, consequatur soluta obcaecati? Error!</p>
    </div>
    <div class="feature">
        <svg class="inline-block align-middle -mt-1 stroke-current w-12 h-12 mb-2 text-teal-500" aria-hidden="true" focusable="false" role="img">
            <use xlink:href="../../icons.svg#user" />
        </svg>

        <h4 class="text-lg md:text-xl lg:text-2xl font-medium mb-2">Personnal</h4>
        <p class="text-gray-600">Lorem ipsum dolor sit amet consectetur adipisicing elit. Expedita sequi cumque odio perspiciatis soluta iste voluptatem eveniet magni assumenda distinctio.</p>
    </div>
    <div class="feature">
        <svg class="inline-block align-middle -mt-1 stroke-current w-12 h-12 mb-2 text-teal-500" aria-hidden="true" focusable="false" role="img">
            <use xlink:href="../../icons.svg#gift" />
        </svg>

        <h4 class="text-lg md:text-xl lg:text-2xl font-medium mb-2">Approachable</h4>
        <p class="text-gray-600">Lorem ipsum dolor sit amet consectetur adipisicing elit. Quidem quisquam suscipit culpa sit vero eius voluptate? Repellendus fugit beatae eveniet!</p>
    </div>
    <div class="feature">
        <svg class="inline-block align-middle -mt-1 stroke-current w-12 h-12 mb-2 text-teal-500" aria-hidden="true" focusable="false" role="img">
            <use xlink:href="../../icons.svg#bulb" />
        </svg>

        <h4 class="text-lg md:text-xl lg:text-2xl font-medium mb-2">Original</h4>
        <p class="text-gray-600">Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellendus doloribus reprehenderit fuga. Eligendi provident ipsa dolor, consequatur soluta obcaecati? Error!</p>
    </div>
    <div class="feature">
        <svg class="inline-block align-middle -mt-1 stroke-current w-12 h-12 mb-2 text-teal-500" aria-hidden="true" focusable="false" role="img">
            <use xlink:href="../../icons.svg#lightning" />
        </svg>

        <h4 class="text-lg md:text-xl lg:text-2xl font-medium mb-2">Fast</h4>
        <p class="text-gray-600">Lorem ipsum dolor sit amet consectetur adipisicing elit. Expedita sequi cumque odio perspiciatis soluta iste voluptatem eveniet magni assumenda distinctio.</p>
    </div>
</div>