<div>
    <section class="flex justify-center mb-10 text-white bg-contain lg:p-10 xl:items-center "
        style="background-image: url({{asset('storage/index/marco5.jpg')}});">
        <img class="h-32 md:h-64 lg:h-80" src="{{asset('storage/cafe/escuela.jpg')}}" alt="">
    </section>
    
    <section class="xl:mx-36" >
        <h1 class="text-3xl font-semibold text-center md:text-5xl">NUESTO 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-semibold 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-semibold 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>
