@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap');

.h1-style {
    margin-bottom: 4rem; /* Aumenta el espacio debajo del título */
    font-size: 3.5rem;
    font-weight: bold;
    background: linear-gradient(to right, #0080ff, #ff8000); /* Ajusta los colores aquí */
    background-size: 50%; /* Asegura que el gradiente sea más amplio */
    background-position: center; /* Centra el gradiente */
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.card{
    background-color: black !important; /* Asegura que el fondo sea negro */
    font-family: 'Montserrat', sans-serif;
}
.link-style {
    color: white; /* Cambia el color del enlace a blanco */
    text-decoration: none; /* Elimina el subrayado */
}

.link-style:hover {
    color: #ccc; /* Cambia el color al pasar el ratón (opcional) */
    text-decoration: underline; /* Agrega un subrayado al pasar el ratón (opcional) */
}

.card-title {
    font-weight: 400;
    font-size: 1.8rem;
    margin-right: 1rem;
}

.card-img {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 0 !important;
}

.isotipo{
    width: 10%;
    filter: invert(65%) sepia(30%) saturate(500%) hue-rotate(345deg) brightness(95%) contrast(90%);
    margin-bottom: 2rem; /* Espacio debajo del isotipo */
    margin-right: 1rem;
}


.btn-outline-light:hover {
    color: black;
    background-color: #fff;
}

body.bg-black footer {
    background-color: black !important; /* Asegura que el fondo sea negro */
}

.bar {
    width: 100%; /* Ocupa todo el ancho */
    height: 0.1rem; /* Altura de la barra */
    margin-top: 0-5rem; /* Espaciado superior */
    background-color: white;
    border-radius: 1rem;
    margin-bottom: 0.15rem;
}


/* ------ RESPONSIVE ------ */

@media (max-width: 1600px) {

    .h1-style {
        font-size: 2.5rem;
        margin-bottom: 2rem;
    }

    p{
        font-size: 14px;
    }
}


@media (max-width: 768px) {

    .h1-style {
        background-size: 100%; /* Asegura que el gradiente sea más amplio */
    }

}