main{
    margin-top: 2vw !important;
    text-align:justif !important;

}

/* ... resto de tus estilos ... */
.hero {
    display: flex;
    padding: 8rem 4rem;
    background-size: cover;
    background-position: center;
    color: white;
    align-items: center; /* Alinea verticalmente los elementos del hero */
    justify-content:center;
    mask-image: linear-gradient(black 80%, transparent);
    overflow: hidden;
}

.info {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}
/* ✅ ESTILO CLAVE PARA EL CONTENEDOR DE LA IMAGEN */
.hero-image-container {

    padding: 6rem 2rem; /* Usa la variable CSS para el fondo */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

    /* ✅ ESTILO CLAVE PARA LA IMAGEN DENTRO DEL CONTENEDOR */
    .hero-image-container img {
        width: 150%; /* La imagen ocupa todo el ancho del contenedor */
        height: 150%; /* La imagen ocupa toda la altura del contenedor */
        /* object-fit: contain;  Ajusta la imagen sin recortarla, dejando espacios si es necesario */
        object-fit: scale-down; /* ✅ Alternativa: Recorta la imagen para llenar el contenedor */
        /* Prueba con 'contain' o 'cover' para ver cuál se adapta mejor a tus imágenes */
    }

.btn {
    background-color: azure;
    color: black !important;
}

.img1landing {

    padding: 12rem 4rem; /* Usa la variable CSS para el fondo */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.img2landing {

    padding: 4rem 2rem; /* Usa la variable CSS para el fondo */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.div-flex-center {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.card {
    background-image: url('/img/pages/FondoCards/FondoCardVerde.jpg');
    padding: 4rem 2rem;
    background-size: cover;
    background-position: center;
}
.card-body img{
    width: 100%;
}
.col-md-6 {
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    align-items: center;
}
p{
    text-align:justify;
}

img{
    width:100%
}