.card {
    transition: box-shadow 0.3s, transform 0.3s;
    /* Agrega transiciones suaves para la sombra y la transformación */
    border-radius: 15px;
    /* Agrega bordes redondos con un radio de 15px */
    opacity: 0;
    /* Inicialmente, las tarjetas están ocultas */
    transform: translateY(20px);
    /* Las tarjetas se desplazan hacia abajo */
}

.card:hover {
    box-shadow: 0 0 15px rgba(199, 181, 76, 0.7);
    /* Sombra dorada al pasar el ratón */
    transform: translateY(-5px);
    /* Eleva ligeramente la tarjeta */
}

.card:hover .card-title,
.card:hover .card-text {
    color: #c7b75c;
    /* Cambia el color del texto al dorado al pasar el ratón */

}

.card.animated-appear {
    opacity: 1;
    /* Cuando la clase de animación es activada, las tarjetas se hacen visibles */
    transform: translateY(0);
    /* Las tarjetas vuelven a su posición original */
}

.text-center.mb-5 {
    position: relative;
}

.text-center.mb-5 {
    font-family: Arial, sans-serif;
    /* Cambiar la fuente a Arial o la fuente que prefieras */
    font-size: 35px;
    font-weight: bold;
    /* Hacer el texto en negrita */
    position: relative;
}

.text-center.mb-5::before,
.text-center.mb-5::after {
    content: '';
    position: absolute;
    top: 50%;
    height: 4px;
    /* Aumentamos el grosor de las líneas */
    width: 118px;
    /* Ancho de cada línea */
    background-color: #b38d5d;
    /* Color de las líneas */
}

.text-center.mb-5::before {
    left: -30px;
    /* Ajusta la posición de la primera línea */
    transform: translateY(-50%);
}

.text-center.mb-5::after {
    right: -30px;
    /* Ajusta la posición de la segunda línea */
    transform: translateY(-50%);
}

@media (max-width: 768px) {

    .text-center.mb-5::before,
    .text-center.mb-5::after {
        width: 80px;
        /* Reducir el ancho de las líneas */
    }

    .text-center.mb-5::before {
        left: -10px;
        /* Ajustar la posición de la primera línea */
    }

    .text-center.mb-5::after {
        right: -10px;
        /* Ajustar la posición de la segunda línea */
    }
}

/* Estilo para los enlaces dentro de las tarjetas */
.card a.specialty-link {
    color: inherit;
    /* Hereda el color del texto de la tarjeta */
    text-decoration: none;
    /* Quita la subrayado predeterminado */
}

/* Colores para los iconos según el tema de cada carrera */
.icon-programacion {
    color: #007bff;
}

.icon-laboratorista {
    color: #26aa82;
}

.icon-mecanica {
    color: gray;
}

.icon-alimentos {
    color: orange;
}

.icon-ofimatica {
    color: #b43fdc;
}

.icon-contabilidad {
    color: #dc5252;
}

.icon-recursos-humanos {
    color: pink;
}

.text-center.mb-3 {
    font-size: 18px;
    color: #333;
    margin-bottom: 20px;
    /* Espaciado inferior */
    font-style: italic;
    /* Texto en cursiva */
}