<div>
    <section class="flex justify-center mb-10 text-white bg-contain bg-principal lg:p-10 xl:items-center "
        style="background-image: url({{ asset('storage/plecas/bg_patron_verde_02.svg') }});">
        <img class="h-32 md:h-64 lg:h-80" src="{{ asset('storage/cafe/escuela_cafeconcausa.jpg') }}" alt="">
    </section>

    <section class="xl:mx-36">
        <h1 class="text-3xl font-semibold text-center md:text-5xl font-aleo">NUESTRO COMPROMISO</h1>
        <div class="grid grid-cols-1 m-5 md:grid-cols-2 md:gap-5">
            <img class="place-self-center" src="{{ asset('storage/cafe/escuela2.jpg') }}" alt="imagen parrafo">
            <p class="row-start-1 text-xl font-normal md:col-start-2 lg:text-3xl place-self-center ">
                Uno de nuestros objetivos primordiales es brindar el apoyo a nuestra gente. Nos dimos a la tarea de
                abrir una
                escuelita
                para los hijos de nuestros
                colaboradores, asi como las comunidades cercanas a las fincas. <br><br><br>
                Saber que pueden seguir estudiando mientras sus padres trabajan tranquilos.
            </p>
        </div>
        <div class="grid grid-cols-1 m-5 md:grid-cols-2 ">
            <p class="text-xl font-normal lg:text-3xl place-self-center ">
                En la finca contamos con una UMA (Unidad de Manejo Ambiental) donde reproducimos especies en peligro de
                extinción como
                el venado cola blanca, el hocofaisán y la pava.
            </p>
            <img class="place-self-center" src="{{ asset('storage/cafe/venado.jpg') }}" alt="imagen parrafo">
        </div>
    </section>

    <section class="text-center lg:p-10 bg-principal">
        <h2 class="md:text-4xl place-self-center font-bold text-white lg:w-[60%]">NUESTRO CAFÉ NACE DE UN ENTORNO SANO Y
            UN EQUIPO HUMANO COMPROMETIDOS.</h2>
    </section>
</div>
