/* Start custom CSS for html, class: .elementor-element-2e75ba0 */.memory-game {
    display: grid;
    grid-template-columns: repeat(5, 1fr); /* Fijar un máximo de 5 columnas */
    grid-gap: 15px; /* Espaciado entre las cartas */
    width: 100%;
    max-width: 1000px; /* Ancho máximo para pantallas grandes */
    margin: 0 auto;
    padding: 10px;
    box-sizing: border-box;
}

@media (max-width: 1024px) {
    .memory-game {
        grid-template-columns: repeat(4, 1fr); /* Reducir a 4 columnas en pantallas medianas */
    }
}

@media (max-width: 768px) {
    .memory-game {
        grid-template-columns: repeat(3, 1fr); /* Reducir a 3 columnas en pantallas pequeñas */
        grid-gap: 10px; /* Espaciado reducido */
    }
}

@media (max-width: 480px) {
    .memory-game {
        grid-template-columns: repeat(2, 1fr); /* Reducir a 2 columnas en móviles */
        grid-gap: 8px; /* Espaciado más compacto */
    }
}

.memory-card {
    width: 100%;
    aspect-ratio: 1 / 1; /* Mantener proporción cuadrada */
    background-color: #333;
    position: relative;
    cursor: pointer;
    border-radius: 5px;
    overflow: hidden;
    transform: scale(1);
    transition: transform 0.3s;
}/* End custom CSS */