.elementor-8739 .elementor-element.elementor-element-0296984{--display:flex;}:root{--page-title-display:none;}/* Start custom CSS for shortcode, class: .elementor-element-f129478 *//* Opcional: Importar la fuente Montserrat si tu tema no la incluye por defecto */
@import url('https://fonts.googleapis.com/css2?family=Unbounded:wght@600;700&display=swap');

/* 1. Estructura de la rejilla (3 columnas) */
.mi-grid-entradas {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px; /* Espacio entre las tarjetas */
    width: 100%;
}

/* 2. Contenedor individual de cada entrada */
.tarjeta-entrada {
    position: relative;
    overflow: hidden; /* Oculta la capa naranja cuando está fuera */
    border-radius: 0px; /* <--- MODIFICADO: Reducido a la mitad (antes 8px, ahora 4px) */
    aspect-ratio: 1 / 1;
    
    background: #f4f4f4;
}

/* 3. Imagen de fondo */
.tarjeta-entrada img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Evita que las imágenes se deformen */
    display: block;
}

/* 4. Capa Naranja (El overlay) */
.tarjeta-entrada .capa-naranja {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(46, 46, 46, 0.9);
    display: flex;
    flex-direction: column;      /* Permite apilar elementos verticalmente si hay más de una línea/párrafo */
    justify-content: flex-end;   /* Empuja todo el contenido hacia abajo */
    align-items: flex-end;     /* Alinea a la derecha */
    text-align: left;
    padding: 20px;
    box-sizing: border-box;
    
    /* ANIMACIÓN: Inicia escondido a la izquierda (-100%) */
    transform: translateX(-100%);
    transition: transform 0.4s ease-in-out;
}

/* 5. Efecto al pasar el mouse */
.tarjeta-entrada:hover .capa-naranja {
    /* La capa naranja se mueve a su posición original (0) */
    transform: translateX(0); 
}

/* 6. Estilo del título */
.tarjeta-entrada .capa-naranja h3 {
    font-family: 'Unbounded', sans-serif; /* <--- MODIFICADO: Se añade la fuente Unbounded */
    color: #ffffff; /* Texto blanco para contrastar con el naranja */
    font-size: 16px;
    margin: 0;
    font-weight: 700; /* Negrita */
    text-shadow: 1px 1px 3px rgba(0,0,0,0.3);
}

/* 7. Diseño responsivo (Tablets: 2 columnas, Móviles: 1 columna) */
@media (max-width: 992px) {
    .mi-grid-entradas {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 768px) {
    .mi-grid-entradas {
        grid-template-columns: 1fr;
    }
}/* End custom CSS */