body {
    background-color: #f8f9fa;
}

h1 {
    color: #007bff;
    margin-bottom: 20px;
}

@media (min-width: 768px) {
    .card {
        display: flex;
        flex-direction: column;
        justify-content: space-between; /* Esto asegura que los botones queden alineados en la parte inferior */
    }

    .card-body {
        display: flex;
        flex-direction: column;
        justify-content: space-between; /* Ayuda a mantener el contenido bien espaciado y alineado */
    }
}

.btn-success {
    white-space: nowrap; /* Evita que el texto del botón se divida en dos líneas */
}

/* Mejoras generales para móviles */
@media (max-width: 767px) {
    .btn {
        margin-top: 10px; /* Asegura un poco de espacio vertical entre los botones en dispositivos más pequeños */
    }
}