@extends('layouts.layout')
@section('title', 'Inicio')
@section('body')

    <div class="bg-gradient-to-r from-purple-200 to-purple-900 relative">
        <h3 style="color: #fff;" class="max-w-[1184px] mx-auto p-6 my-4o text-xl md:text-2xl font-bold mb-4 text-start">
            Blog
        </h3>
    </div>



    <div class="max-w-7xl mx-auto md:mt-5 z-50 px-4">
        <div class="w-full">
            <div class="grid grid-cols-1 lg:grid-cols-12 gap-4 lg:gap-4 ">
                <!-- Left -->
                <div class="col-span-full lg:col-span-9 overflow-hidden md:p-6 lg:p-8">
                    <div>
                        <div class="flex items-center ms-2 mb-3 hover:cursor-pointer">
                            <img src="storage/icons/arrow_back.svg" alt="Volver">
                            <a href="/blog">
                                <p class="text-grey-600">Volver</p>
                            </a>
                        </div>

                        <span class="text-grey-400">Blog /</span>
                        <span class="text-grey-400"> Prensa /</span>
                        <span class="text-purple-200"> Cómo disfrutar al máximo de tu próximo concierto</span>


                        <div class="flex items-center mt-4">
                            <div class="inline-flex border-grey-100 border-2 rounded-lg">
                                <span class="text-grey-400 text-xs px-1 py-1 mr-1">Prensa</span>
                            </div>
                        </div>

                        <div>
                            <h2 class="text-lg md:text-2xl font-bold text-grey-500 leading-8 mt-4">
                                Cómo disfrutar al máximo de tu próximo concierto
                            </h2>
                            <p class="py-1 text-sm md:text-base">
                                Publicado el 20 de noviembre | 7:30 p.m.
                            </p>
                        </div>

                        <div class="mx-auto my-4">
                            <img src="storage/blog/photo-1.png" class="w-full rounded-[20px] lg:rounded-[32px]">
                        </div>

                        <div class="py-4">
                            <p class="text-sm md:text-base py-1">
                                <strong>1. Compra tus boletos con anticipación</strong>
                            </p>
                            <p class="text-sm md:text-base">
                                Uno de los pasos más importantes es asegurar tus entradas. Los boletos para conciertos
                                suelen agotarse rápido, especialmente cuando se trata de artistas populares. Asegúrate de
                                comprarlos tan pronto como sea posible. Además, revisa la ubicación de tu asiento o zona
                                para saber qué tan cerca estarás del escenario y si necesitas algún equipo adicional, como
                                binoculares o una batería extra para tu teléfono.
                            </p>
                        </div>
                        <div class="py-4">
                            <p class="text-sm md:text-base py-1">
                                <strong>2. Investiga la ubicación del evento</strong>
                            </p>
                            <p class="text-sm md:text-base">
                                Conoce bien el lugar del concierto. Revisa la dirección, opciones de estacionamiento,
                                transporte público y accesos disponibles. Esto te ayudará a planificar tu llegada y salida
                                sin problemas. Además, verifica si el lugar tiene restricciones en cuanto a los objetos que
                                puedes llevar, como mochilas, alimentos, o cámaras.
                            </p>
                        </div>
                        <div class="py-4">
                            <p class="text-sm md:text-base py-1">
                                <strong>3. Planifica qué llevar</strong>
                            </p>
                            <p class="text-sm md:text-base">
                                Para que tu experiencia sea cómoda, lleva solo lo esencial:
                            </p>
                        </div>
                        <div class="py-4">
                            <p class="text-sm md:text-base">
                                Identificación oficial
                            </p>
                            <p class="text-sm md:text-base">
                                Teléfono móvil y batería extra
                            </p>
                            <p class="text-sm md:text-base">
                                Dinero en efectivo y tarjetas de crédito
                            </p>
                            <p class="text-sm md:text-base">
                                Botella de agua reutilizable (si está permitido)
                            </p>
                            <p class="text-sm md:text-base">
                                Tapones para oídos (especialmente si es un concierto en interiores con altos niveles de
                                sonido)
                            </p>
                            <p class="text-sm md:text-base">
                                Además, viste ropa cómoda y adecuada al clima, y si el evento es al aire libre, lleva una
                                chaqueta o bloqueador solar, según la temporada.
                            </p>
                        </div>
                        <div class="py-4">
                            <p class="text-sm md:text-base py-1">
                                <strong>4. Llega con tiempo de anticipación</strong>
                            </p>
                            <p class="text-sm md:text-base">
                                El día del concierto es mejor llegar con tiempo. Las filas suelen ser largas, y llegar
                                temprano te permite familiarizarte con el lugar, buscar tu asiento o ubicación y comprar
                                cualquier recuerdo o alimento que desees sin la presión del tiempo.
                            </p>
                        </div>
                        <div class="py-4">
                            <p class="text-sm md:text-base py-1">
                                <strong>5. Disfruta del ambiente previo al show</strong>
                            </p>
                            <p class="text-sm md:text-base">
                                La emoción de estar rodeado de otros fans crea una energía especial. Si estás en la fila o
                                ya en tu lugar, aprovecha para conversar con otros asistentes, conocer sus canciones
                                favoritas y compartir tu emoción. Esto hace que la experiencia sea aún más divertida y
                                emocionante.
                            </p>
                        </div>
                        <div class="py-4">
                            <p class="text-sm md:text-base py-1">
                                <strong>6. Guarda tu teléfono en los mejores momentos</strong>
                            </p>
                            <p class="text-sm md:text-base">
                                Si bien es tentador grabar todo el concierto, recuerda que disfrutar el momento en persona
                                es irremplazable. Graba algunos clips cortos, toma unas fotos, pero luego guarda tu teléfono
                                y deja que el ambiente, la música en vivo y las luces te envuelvan. ¡La experiencia será
                                mucho más memorable si realmente te sumerges en ella!
                            </p>
                        </div>
                        <div class="py-4">
                            <p class="text-sm md:text-base py-1">
                                <strong>7. Cuida tu salud auditiva y física</strong>
                            </p>
                            <p class="text-sm md:text-base">
                                Los conciertos pueden ser ruidosos, por lo que unos tapones para oídos pueden ayudarte a
                                disfrutar de la música sin afectar tu audición. Además, mantente hidratado y toma descansos
                                si sientes que necesitas un momento para relajarte.
                            </p>
                        </div>
                        <div class="py-4">
                            <p class="text-sm md:text-base py-1">
                                <strong>8. Vive el momento y disfruta cada canción</strong>
                            </p>
                            <p class="text-sm md:text-base">
                                Finalmente, recuerda por qué estás ahí: para disfrutar. Baila, canta, aplaude y déjate
                                llevar por la música. Es una oportunidad única para estar cerca de tu artista favorito y
                                disfrutar junto a otros fans.
                            </p>
                        </div>

                        <div class="grid grid-cols-1 lg:grid-cols-2">
                            <div style="flex flex-col">
                                <h3 style="color: #504D4D;" class="my-4 text-lg md:text-xl mb-4 text-start">
                                    Que te pareció el articulo
                                </h3>
                                <div>
                                    <div class="flex flex-row  gap-4">
                                        <a href="#"><img src="storage/blog/like.svg" alt=""></a>
                                        <a href="#"><img src="storage/blog/thumb_down.svg" alt=""></a>
                                    </div>
                                </div>
                            </div>
                            <div style="flex flex-col">
                                <h3 style="color: #504D4D;" class="my-4 text-lg md:text-xl mb-4 text-start">
                                    Comparte el articulo:
                                </h3>
                                <div>
                                    <div class="flex flex-row  gap-4">
                                        <a href="#"><img src="storage/blog/Vector.svg" alt=""></a>
                                        <a href="#"><img src="storage/blog/Vector-1.svg" alt=""></a>
                                        <a href="#"><img src="storage/blog/Vector-2.svg" alt=""></a>
                                        <a href="#"><img src="storage/blog/path14.svg" alt=""></a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Right -->
                <div class="col-span-full lg:col-span-3">
                    <div class="py-4 sticky top-5">
                        <h3 style="color: #262626;" class="text-lg md:text-xl font-bold mb-6">
                            Artículos similares
                        </h3>
                        <div class="pt-4">
                            <div class="grid grid-cols-1 gap-4">
                                <x-card2>
                                    <img class="w-full" src="storage/blog/photo.png" alt="Event Image">

                                    <div class="md:px-1 md:pt-4">
                                        <div class="flex items-center sm:items-center gap-y-2 gap-x-2 pt-2">
                                            <div class="inline-flex gap-x-2 px-2 py-1 bg-yellow-100 rounded-md">
                                                <img src="storage/blog/calendar_today.svg" />
                                                <span class="text-yellow-600 text-xs md:text-clip-sm">31 de Octubre</span>
                                            </div>
                                            <div class="inline-flex border-grey-100 border-2 rounded-lg">
                                                <span class="text-grey-400 text-xs px-1 py-1 mr-1">Prensa</span>
                                            </div>
                                            <div class="inline-flex border-grey-100 border-2 rounded-lg">
                                                <span class="text-grey-400 text-xs px-1 py-1 mr-1">Tips</span>
                                            </div>
                                            <div class="inline-flex border-grey-100 border-2 rounded-lg">
                                                <span class="text-grey-400 text-xs px-1 py-1 mr-1">Consulta</span>
                                            </div>
                                        </div>
                                        <div class="font-bold my-2 text-sm text-grey-500 truncate">DGTL LIMA - evento tour
                                            FANS 2024 evento de luces</div>
                                        <p class="text-grey-300 text-sm mb-2">
                                            Un análisis de las obras de teatro actuales más recomendadas, con detalles sobre
                                            la trama, los actores y las críticas.
                                        </p>
                                    </div>
                                    <div
                                        class="absolute inset-0 flex items-center justify-center opacity-0 hover:opacity-100 transition-opacity duration-500 bg-white bg-opacity-75">
                                        <a href="#">
                                            <button class="btn-sm btn-primary text-white flex items-center gap-x-2">
                                                <svg width="17" height="15" viewBox="0 0 17 15" fill="none"
                                                    xmlns="http://www.w3.org/2000/svg">
                                                    <path
                                                        d="M1.83334 14.0152C1.37501 14.0152 0.982644 13.8521 0.656255 13.5257C0.329866 13.1993 0.166672 12.8069 0.166672 12.3486V9.53608C0.166672 9.3833 0.215283 9.25136 0.312505 9.14025C0.409727 9.02914 0.534727 8.95969 0.687505 8.93192C1.02084 8.8208 1.29514 8.61942 1.51042 8.32775C1.7257 8.03608 1.83334 7.70969 1.83334 7.34858C1.83334 6.98747 1.7257 6.66108 1.51042 6.36942C1.29514 6.07775 1.02084 5.87636 0.687505 5.76525C0.534727 5.73747 0.409727 5.66803 0.312505 5.55692C0.215283 5.4458 0.166672 5.31386 0.166672 5.16108V2.34858C0.166672 1.89025 0.329866 1.49789 0.656255 1.1715C0.982644 0.84511 1.37501 0.681915 1.83334 0.681915H15.1667C15.625 0.681915 16.0174 0.84511 16.3438 1.1715C16.6701 1.49789 16.8333 1.89025 16.8333 2.34858V5.16108C16.8333 5.31386 16.7847 5.4458 16.6875 5.55692C16.5903 5.66803 16.4653 5.73747 16.3125 5.76525C15.9792 5.87636 15.7049 6.07775 15.4896 6.36942C15.2743 6.66108 15.1667 6.98747 15.1667 7.34858C15.1667 7.70969 15.2743 8.03608 15.4896 8.32775C15.7049 8.61942 15.9792 8.8208 16.3125 8.93192C16.4653 8.95969 16.5903 9.02914 16.6875 9.14025C16.7847 9.25136 16.8333 9.3833 16.8333 9.53608V12.3486C16.8333 12.8069 16.6701 13.1993 16.3438 13.5257C16.0174 13.8521 15.625 14.0152 15.1667 14.0152H1.83334ZM1.83334 12.3486H15.1667V10.2236C14.6528 9.91803 14.2465 9.51178 13.9479 9.00483C13.6493 8.49789 13.5 7.9458 13.5 7.34858C13.5 6.75136 13.6493 6.19928 13.9479 5.69233C14.2465 5.18539 14.6528 4.77914 15.1667 4.47358V2.34858H1.83334V4.47358C2.34723 4.77914 2.75348 5.18539 3.05209 5.69233C3.3507 6.19928 3.50001 6.75136 3.50001 7.34858C3.50001 7.9458 3.3507 8.49789 3.05209 9.00483C2.75348 9.51178 2.34723 9.91803 1.83334 10.2236V12.3486ZM8.50001 11.5152C8.73612 11.5152 8.93403 11.4354 9.09376 11.2757C9.25348 11.1159 9.33334 10.918 9.33334 10.6819C9.33334 10.4458 9.25348 10.2479 9.09376 10.0882C8.93403 9.92844 8.73612 9.84858 8.50001 9.84858C8.26389 9.84858 8.06598 9.92844 7.90626 10.0882C7.74653 10.2479 7.66667 10.4458 7.66667 10.6819C7.66667 10.918 7.74653 11.1159 7.90626 11.2757C8.06598 11.4354 8.26389 11.5152 8.50001 11.5152ZM8.50001 8.18192C8.73612 8.18192 8.93403 8.10205 9.09376 7.94233C9.25348 7.78261 9.33334 7.58469 9.33334 7.34858C9.33334 7.11247 9.25348 6.91455 9.09376 6.75483C8.93403 6.59511 8.73612 6.51525 8.50001 6.51525C8.26389 6.51525 8.06598 6.59511 7.90626 6.75483C7.74653 6.91455 7.66667 7.11247 7.66667 7.34858C7.66667 7.58469 7.74653 7.78261 7.90626 7.94233C8.06598 8.10205 8.26389 8.18192 8.50001 8.18192ZM8.50001 4.84858C8.73612 4.84858 8.93403 4.76872 9.09376 4.609C9.25348 4.44928 9.33334 4.25136 9.33334 4.01525C9.33334 3.77914 9.25348 3.58122 9.09376 3.4215C8.93403 3.26178 8.73612 3.18192 8.50001 3.18192C8.26389 3.18192 8.06598 3.26178 7.90626 3.4215C7.74653 3.58122 7.66667 3.77914 7.66667 4.01525C7.66667 4.25136 7.74653 4.44928 7.90626 4.609C8.06598 4.76872 8.26389 4.84858 8.50001 4.84858Z"
                                                        fill="#262626" />
                                                </svg>
                                                Comprar
                                            </button>
                                        </a>
                                    </div>
                                </x-card2>
                                <x-card2>
                                    <img class="w-full" src="storage/blog/photo-1.png" alt="Event Image">

                                    <div class="md:px-1 md:pt-4">
                                        <div class="flex items-center sm:items-center gap-y-2 gap-x-2 pt-2">
                                            <div class="inline-flex gap-x-2 px-2 py-1 bg-yellow-100 rounded-md">
                                                <img src="storage/blog/calendar_today.svg" />
                                                <span class="text-yellow-600 text-xs md:text-clip-sm">31 de Octubre</span>
                                            </div>
                                            <div class="inline-flex border-grey-100 border-2 rounded-lg">
                                                <span class="text-grey-400 text-xs px-1 py-1 mr-1">Prensa</span>
                                            </div>
                                            <div class="inline-flex border-grey-100 border-2 rounded-lg">
                                                <span class="text-grey-400 text-xs px-1 py-1 mr-1">Tips</span>
                                            </div>
                                            <div class="inline-flex border-grey-100 border-2 rounded-lg">
                                                <span class="text-grey-400 text-xs px-1 py-1 mr-1">Consulta</span>
                                            </div>
                                        </div>
                                        <div class="font-bold my-2 text-sm text-grey-500 truncate">Cómo disfrutar al máximo
                                            de tu próximo concierto</div>
                                        <p class="text-grey-300 text-sm mb-2">
                                            Consejos para prepararte antes de un concierto, qué llevar, y cómo asegurar una
                                            experiencia inolvidable.
                                        </p>
                                    </div>
                                    <div
                                        class="absolute inset-0 flex items-center justify-center opacity-0 hover:opacity-100 transition-opacity duration-500 bg-white bg-opacity-75">
                                        <a href="/detalle-blog">
                                            <button class="btn-sm btn-primary text-white flex items-center gap-x-2">
                                                <svg width="17" height="15" viewBox="0 0 17 15" fill="none"
                                                    xmlns="http://www.w3.org/2000/svg">
                                                    <path
                                                        d="M1.83334 14.0152C1.37501 14.0152 0.982644 13.8521 0.656255 13.5257C0.329866 13.1993 0.166672 12.8069 0.166672 12.3486V9.53608C0.166672 9.3833 0.215283 9.25136 0.312505 9.14025C0.409727 9.02914 0.534727 8.95969 0.687505 8.93192C1.02084 8.8208 1.29514 8.61942 1.51042 8.32775C1.7257 8.03608 1.83334 7.70969 1.83334 7.34858C1.83334 6.98747 1.7257 6.66108 1.51042 6.36942C1.29514 6.07775 1.02084 5.87636 0.687505 5.76525C0.534727 5.73747 0.409727 5.66803 0.312505 5.55692C0.215283 5.4458 0.166672 5.31386 0.166672 5.16108V2.34858C0.166672 1.89025 0.329866 1.49789 0.656255 1.1715C0.982644 0.84511 1.37501 0.681915 1.83334 0.681915H15.1667C15.625 0.681915 16.0174 0.84511 16.3438 1.1715C16.6701 1.49789 16.8333 1.89025 16.8333 2.34858V5.16108C16.8333 5.31386 16.7847 5.4458 16.6875 5.55692C16.5903 5.66803 16.4653 5.73747 16.3125 5.76525C15.9792 5.87636 15.7049 6.07775 15.4896 6.36942C15.2743 6.66108 15.1667 6.98747 15.1667 7.34858C15.1667 7.70969 15.2743 8.03608 15.4896 8.32775C15.7049 8.61942 15.9792 8.8208 16.3125 8.93192C16.4653 8.95969 16.5903 9.02914 16.6875 9.14025C16.7847 9.25136 16.8333 9.3833 16.8333 9.53608V12.3486C16.8333 12.8069 16.6701 13.1993 16.3438 13.5257C16.0174 13.8521 15.625 14.0152 15.1667 14.0152H1.83334ZM1.83334 12.3486H15.1667V10.2236C14.6528 9.91803 14.2465 9.51178 13.9479 9.00483C13.6493 8.49789 13.5 7.9458 13.5 7.34858C13.5 6.75136 13.6493 6.19928 13.9479 5.69233C14.2465 5.18539 14.6528 4.77914 15.1667 4.47358V2.34858H1.83334V4.47358C2.34723 4.77914 2.75348 5.18539 3.05209 5.69233C3.3507 6.19928 3.50001 6.75136 3.50001 7.34858C3.50001 7.9458 3.3507 8.49789 3.05209 9.00483C2.75348 9.51178 2.34723 9.91803 1.83334 10.2236V12.3486ZM8.50001 11.5152C8.73612 11.5152 8.93403 11.4354 9.09376 11.2757C9.25348 11.1159 9.33334 10.918 9.33334 10.6819C9.33334 10.4458 9.25348 10.2479 9.09376 10.0882C8.93403 9.92844 8.73612 9.84858 8.50001 9.84858C8.26389 9.84858 8.06598 9.92844 7.90626 10.0882C7.74653 10.2479 7.66667 10.4458 7.66667 10.6819C7.66667 10.918 7.74653 11.1159 7.90626 11.2757C8.06598 11.4354 8.26389 11.5152 8.50001 11.5152ZM8.50001 8.18192C8.73612 8.18192 8.93403 8.10205 9.09376 7.94233C9.25348 7.78261 9.33334 7.58469 9.33334 7.34858C9.33334 7.11247 9.25348 6.91455 9.09376 6.75483C8.93403 6.59511 8.73612 6.51525 8.50001 6.51525C8.26389 6.51525 8.06598 6.59511 7.90626 6.75483C7.74653 6.91455 7.66667 7.11247 7.66667 7.34858C7.66667 7.58469 7.74653 7.78261 7.90626 7.94233C8.06598 8.10205 8.26389 8.18192 8.50001 8.18192ZM8.50001 4.84858C8.73612 4.84858 8.93403 4.76872 9.09376 4.609C9.25348 4.44928 9.33334 4.25136 9.33334 4.01525C9.33334 3.77914 9.25348 3.58122 9.09376 3.4215C8.93403 3.26178 8.73612 3.18192 8.50001 3.18192C8.26389 3.18192 8.06598 3.26178 7.90626 3.4215C7.74653 3.58122 7.66667 3.77914 7.66667 4.01525C7.66667 4.25136 7.74653 4.44928 7.90626 4.609C8.06598 4.76872 8.26389 4.84858 8.50001 4.84858Z"
                                                        fill="#262626" />
                                                </svg>
                                                Comprar
                                            </button>
                                        </a>
                                    </div>
                                </x-card2>
                                <x-card2>
                                    <img class="w-full" src="storage/blog/photo-2.png" alt="Event Image">

                                    <div class="md:px-1 md:pt-4">
                                        <div class="flex items-center sm:items-center gap-y-2 gap-x-2 pt-2">
                                            <div class="inline-flex gap-x-2 px-2 py-1 bg-yellow-100 rounded-md">
                                                <img src="storage/blog/calendar_today.svg" />
                                                <span class="text-yellow-600 text-xs md:text-clip-sm">31 de Octubre</span>
                                            </div>
                                            <div class="inline-flex border-grey-100 border-2 rounded-lg">
                                                <span class="text-grey-400 text-xs px-1 py-1 mr-1">Prensa</span>
                                            </div>
                                            <div class="inline-flex border-grey-100 border-2 rounded-lg">
                                                <span class="text-grey-400 text-xs px-1 py-1 mr-1">Tips</span>
                                            </div>
                                            <div class="inline-flex border-grey-100 border-2 rounded-lg">
                                                <span class="text-grey-400 text-xs px-1 py-1 mr-1">Consulta</span>
                                            </div>
                                        </div>
                                        <div class="font-bold my-2 text-sm text-grey-500 truncate">Top 10 Conciertos
                                            Memorables en Perú: Momentos que Hicieron Historia</div>
                                        <p class="text-grey-300 text-sm mb-2">
                                            Una recopilación de los conciertos más icónicos que han pasado por el país,
                                            desde artistas nacionales hasta internacionales.
                                        </p>
                                    </div>
                                    <div
                                        class="absolute inset-0 flex items-center justify-center opacity-0 hover:opacity-100 transition-opacity duration-500 bg-white bg-opacity-75">
                                        <a href="#">
                                            <button class="btn-sm btn-primary text-white flex items-center gap-x-2">
                                                <svg width="17" height="15" viewBox="0 0 17 15" fill="none"
                                                    xmlns="http://www.w3.org/2000/svg">
                                                    <path
                                                        d="M1.83334 14.0152C1.37501 14.0152 0.982644 13.8521 0.656255 13.5257C0.329866 13.1993 0.166672 12.8069 0.166672 12.3486V9.53608C0.166672 9.3833 0.215283 9.25136 0.312505 9.14025C0.409727 9.02914 0.534727 8.95969 0.687505 8.93192C1.02084 8.8208 1.29514 8.61942 1.51042 8.32775C1.7257 8.03608 1.83334 7.70969 1.83334 7.34858C1.83334 6.98747 1.7257 6.66108 1.51042 6.36942C1.29514 6.07775 1.02084 5.87636 0.687505 5.76525C0.534727 5.73747 0.409727 5.66803 0.312505 5.55692C0.215283 5.4458 0.166672 5.31386 0.166672 5.16108V2.34858C0.166672 1.89025 0.329866 1.49789 0.656255 1.1715C0.982644 0.84511 1.37501 0.681915 1.83334 0.681915H15.1667C15.625 0.681915 16.0174 0.84511 16.3438 1.1715C16.6701 1.49789 16.8333 1.89025 16.8333 2.34858V5.16108C16.8333 5.31386 16.7847 5.4458 16.6875 5.55692C16.5903 5.66803 16.4653 5.73747 16.3125 5.76525C15.9792 5.87636 15.7049 6.07775 15.4896 6.36942C15.2743 6.66108 15.1667 6.98747 15.1667 7.34858C15.1667 7.70969 15.2743 8.03608 15.4896 8.32775C15.7049 8.61942 15.9792 8.8208 16.3125 8.93192C16.4653 8.95969 16.5903 9.02914 16.6875 9.14025C16.7847 9.25136 16.8333 9.3833 16.8333 9.53608V12.3486C16.8333 12.8069 16.6701 13.1993 16.3438 13.5257C16.0174 13.8521 15.625 14.0152 15.1667 14.0152H1.83334ZM1.83334 12.3486H15.1667V10.2236C14.6528 9.91803 14.2465 9.51178 13.9479 9.00483C13.6493 8.49789 13.5 7.9458 13.5 7.34858C13.5 6.75136 13.6493 6.19928 13.9479 5.69233C14.2465 5.18539 14.6528 4.77914 15.1667 4.47358V2.34858H1.83334V4.47358C2.34723 4.77914 2.75348 5.18539 3.05209 5.69233C3.3507 6.19928 3.50001 6.75136 3.50001 7.34858C3.50001 7.9458 3.3507 8.49789 3.05209 9.00483C2.75348 9.51178 2.34723 9.91803 1.83334 10.2236V12.3486ZM8.50001 11.5152C8.73612 11.5152 8.93403 11.4354 9.09376 11.2757C9.25348 11.1159 9.33334 10.918 9.33334 10.6819C9.33334 10.4458 9.25348 10.2479 9.09376 10.0882C8.93403 9.92844 8.73612 9.84858 8.50001 9.84858C8.26389 9.84858 8.06598 9.92844 7.90626 10.0882C7.74653 10.2479 7.66667 10.4458 7.66667 10.6819C7.66667 10.918 7.74653 11.1159 7.90626 11.2757C8.06598 11.4354 8.26389 11.5152 8.50001 11.5152ZM8.50001 8.18192C8.73612 8.18192 8.93403 8.10205 9.09376 7.94233C9.25348 7.78261 9.33334 7.58469 9.33334 7.34858C9.33334 7.11247 9.25348 6.91455 9.09376 6.75483C8.93403 6.59511 8.73612 6.51525 8.50001 6.51525C8.26389 6.51525 8.06598 6.59511 7.90626 6.75483C7.74653 6.91455 7.66667 7.11247 7.66667 7.34858C7.66667 7.58469 7.74653 7.78261 7.90626 7.94233C8.06598 8.10205 8.26389 8.18192 8.50001 8.18192ZM8.50001 4.84858C8.73612 4.84858 8.93403 4.76872 9.09376 4.609C9.25348 4.44928 9.33334 4.25136 9.33334 4.01525C9.33334 3.77914 9.25348 3.58122 9.09376 3.4215C8.93403 3.26178 8.73612 3.18192 8.50001 3.18192C8.26389 3.18192 8.06598 3.26178 7.90626 3.4215C7.74653 3.58122 7.66667 3.77914 7.66667 4.01525C7.66667 4.25136 7.74653 4.44928 7.90626 4.609C8.06598 4.76872 8.26389 4.84858 8.50001 4.84858Z"
                                                        fill="#262626" />
                                                </svg>
                                                Comprar
                                            </button>
                                        </a>
                                    </div>
                                </x-card2>
                                <x-card2>
                                    <img class="w-full" src="storage/blog/photo-3.png" alt="Event Image">

                                    <div class="md:px-1 md:pt-4">
                                        <div class="flex items-center sm:items-center gap-y-2 gap-x-2 pt-2">
                                            <div class="inline-flex gap-x-2 px-2 py-1 bg-yellow-100 rounded-md">
                                                <img src="storage/blog/calendar_today.svg" />
                                                <span class="text-yellow-600 text-xs md:text-clip-sm">31 de Octubre</span>
                                            </div>
                                            <div class="inline-flex border-grey-100 border-2 rounded-lg">
                                                <span class="text-grey-400 text-xs px-1 py-1 mr-1">Prensa</span>
                                            </div>
                                            <div class="inline-flex border-grey-100 border-2 rounded-lg">
                                                <span class="text-grey-400 text-xs px-1 py-1 mr-1">Tips</span>
                                            </div>
                                            <div class="inline-flex border-grey-100 border-2 rounded-lg">
                                                <span class="text-grey-400 text-xs px-1 py-1 mr-1">Consulta</span>
                                            </div>
                                        </div>
                                        <div class="font-bold my-2 text-sm text-grey-500 truncate">Guía para Disfrutar del
                                            Teatro: Etiqueta y Consejos para Nuevos Asistentes</div>
                                        <p class="text-grey-300 text-sm mb-2">
                                            Consejos sobre cómo comportarse en una obra de teatro y por qué es importante
                                            seguir la etiqueta en estos eventos.
                                        </p>
                                    </div>
                                    <div
                                        class="absolute inset-0 flex items-center justify-center opacity-0 hover:opacity-100 transition-opacity duration-500 bg-white bg-opacity-75">
                                        <a href="#">
                                            <button class="btn-sm btn-primary text-white flex items-center gap-x-2">
                                                <svg width="17" height="15" viewBox="0 0 17 15" fill="none"
                                                    xmlns="http://www.w3.org/2000/svg">
                                                    <path
                                                        d="M1.83334 14.0152C1.37501 14.0152 0.982644 13.8521 0.656255 13.5257C0.329866 13.1993 0.166672 12.8069 0.166672 12.3486V9.53608C0.166672 9.3833 0.215283 9.25136 0.312505 9.14025C0.409727 9.02914 0.534727 8.95969 0.687505 8.93192C1.02084 8.8208 1.29514 8.61942 1.51042 8.32775C1.7257 8.03608 1.83334 7.70969 1.83334 7.34858C1.83334 6.98747 1.7257 6.66108 1.51042 6.36942C1.29514 6.07775 1.02084 5.87636 0.687505 5.76525C0.534727 5.73747 0.409727 5.66803 0.312505 5.55692C0.215283 5.4458 0.166672 5.31386 0.166672 5.16108V2.34858C0.166672 1.89025 0.329866 1.49789 0.656255 1.1715C0.982644 0.84511 1.37501 0.681915 1.83334 0.681915H15.1667C15.625 0.681915 16.0174 0.84511 16.3438 1.1715C16.6701 1.49789 16.8333 1.89025 16.8333 2.34858V5.16108C16.8333 5.31386 16.7847 5.4458 16.6875 5.55692C16.5903 5.66803 16.4653 5.73747 16.3125 5.76525C15.9792 5.87636 15.7049 6.07775 15.4896 6.36942C15.2743 6.66108 15.1667 6.98747 15.1667 7.34858C15.1667 7.70969 15.2743 8.03608 15.4896 8.32775C15.7049 8.61942 15.9792 8.8208 16.3125 8.93192C16.4653 8.95969 16.5903 9.02914 16.6875 9.14025C16.7847 9.25136 16.8333 9.3833 16.8333 9.53608V12.3486C16.8333 12.8069 16.6701 13.1993 16.3438 13.5257C16.0174 13.8521 15.625 14.0152 15.1667 14.0152H1.83334ZM1.83334 12.3486H15.1667V10.2236C14.6528 9.91803 14.2465 9.51178 13.9479 9.00483C13.6493 8.49789 13.5 7.9458 13.5 7.34858C13.5 6.75136 13.6493 6.19928 13.9479 5.69233C14.2465 5.18539 14.6528 4.77914 15.1667 4.47358V2.34858H1.83334V4.47358C2.34723 4.77914 2.75348 5.18539 3.05209 5.69233C3.3507 6.19928 3.50001 6.75136 3.50001 7.34858C3.50001 7.9458 3.3507 8.49789 3.05209 9.00483C2.75348 9.51178 2.34723 9.91803 1.83334 10.2236V12.3486ZM8.50001 11.5152C8.73612 11.5152 8.93403 11.4354 9.09376 11.2757C9.25348 11.1159 9.33334 10.918 9.33334 10.6819C9.33334 10.4458 9.25348 10.2479 9.09376 10.0882C8.93403 9.92844 8.73612 9.84858 8.50001 9.84858C8.26389 9.84858 8.06598 9.92844 7.90626 10.0882C7.74653 10.2479 7.66667 10.4458 7.66667 10.6819C7.66667 10.918 7.74653 11.1159 7.90626 11.2757C8.06598 11.4354 8.26389 11.5152 8.50001 11.5152ZM8.50001 8.18192C8.73612 8.18192 8.93403 8.10205 9.09376 7.94233C9.25348 7.78261 9.33334 7.58469 9.33334 7.34858C9.33334 7.11247 9.25348 6.91455 9.09376 6.75483C8.93403 6.59511 8.73612 6.51525 8.50001 6.51525C8.26389 6.51525 8.06598 6.59511 7.90626 6.75483C7.74653 6.91455 7.66667 7.11247 7.66667 7.34858C7.66667 7.58469 7.74653 7.78261 7.90626 7.94233C8.06598 8.10205 8.26389 8.18192 8.50001 8.18192ZM8.50001 4.84858C8.73612 4.84858 8.93403 4.76872 9.09376 4.609C9.25348 4.44928 9.33334 4.25136 9.33334 4.01525C9.33334 3.77914 9.25348 3.58122 9.09376 3.4215C8.93403 3.26178 8.73612 3.18192 8.50001 3.18192C8.26389 3.18192 8.06598 3.26178 7.90626 3.4215C7.74653 3.58122 7.66667 3.77914 7.66667 4.01525C7.66667 4.25136 7.74653 4.44928 7.90626 4.609C8.06598 4.76872 8.26389 4.84858 8.50001 4.84858Z"
                                                        fill="#262626" />
                                                </svg>
                                                Comprar
                                            </button>
                                        </a>
                                    </div>
                                </x-card2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

@endsection