
.landing-container {
    max-width: 1200px;
    width: 100%;
    padding: 20px;
    background-color: #F2F4EA; 
    border-radius: 8px;
    box-shadow: none; /* Elimina la sombra */
}

.landing-landing {
    text-align: center;
}

.landing-text, .landing-text06 {
    margin: 20px 0;
}

.landing-text {
    font-size: 80px; /* Tamaño del texto */
    color: #5C937B; /* Color del texto */
    font-family: 'Quicksand', sans-serif; /* Estilo de letra Quicksand */
    font-weight: 550; /* Texto en negrita con intensidad reducida */
    line-height: 1.0; /* Ajuste del espacio entre renglones */
}

.landing-text06 {
    font-weight: bold;
}

.landing-text07 {
    font-size: 20px; /* Tamaño del texto */
    color: #5C937B; /* Color del texto */
    font-family: 'Quicksand', sans-serif; /* Estilo de letra Quicksand */
    font-weight: 550; /* Texto en negrita con intensidad reducida */
    line-height: 1.0; /* Ajuste del espacio entre renglones */
}

.blog-section {
    display: flex;
    justify-content: flex-start; /* Alinea los elementos sin espacio extra */
    gap: 20px; /* Controla la separación */
    margin-top: 40px;
}

.small-blog-box {
    display: flex;
    align-items: center;
    background-color: #F2F4EA;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    text-align: left;
    border: 2px solid #5C937B;
    padding: 10px;
    gap: 15px;
}

.small-blog-box img {
    width: 150px; /* Imagen más grande */
    height: auto;
    border-radius: 8px;
    margin: 0;
}

.small-blog-content {
    display: flex;
    flex-direction: column; /* Coloca el título arriba y la descripción abajo */
    justify-content: center; /* Asegura que el contenido quede bien alineado */
}


.large-blog-box {
    width: 50%;
    padding: 10px;
    background-color: #F2F4EA;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    text-align: center;
    padding-bottom: 0px; 
    margin-bottom: 0px;
    border: 2px solid #5C937B;
}


.large-blog-box img {
    width: 80%;
    border-radius: 8px;
    margin-bottom: 10px;
}

.large-blog-box h2, .small-blog-box h2 {
    font-size: 25px;
    color: #5C937B;
    margin: 10px 0;
    font-family: 'Quicksand', sans-serif;
}


.blog-description {
    font-size: 17px;
    color: #5C937B;
    margin: 10px 0;
    font-family: 'Quicksand', sans-serif;
    font-weight: 600; /* Aumenta el grosor del texto */
}


.btn {
    padding: 15px 30px; /* Aumenta el tamaño del botón */
    font-size: 14px; /* Aumenta el tamaño del texto */
    width: fit-content; /* Ajusta el ancho al contenido */
    align-self: flex-start; /* Evita que se extienda en toda la caja */
    background-color: #5C937B;
    color: white;
    border: none;
    border-radius: 60px; /* Mantiene el botón redondo */
    cursor: pointer;
    transition: background-color 0.3s ease;
    font-family: 'Quicksand', sans-serif;
    margin: 15px;
    font-weight: bold;
}

.btn:hover {
    background-color: #4a7a64;
}

.btn.btn-primary:hover {
    background-color: #4A7F66; /* Cambia el color de fondo al pasar el mouse sobre el botón */
}

.small-blog-boxes {
    width: 35%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.small-blog-box {
    width: 100%;
    margin: 10px;
}


/* Media Queries para pantallas pequeñas (máx. 768px) */
@media (max-width: 768px) {
    .blog-section {
        flex-direction: column; /* Cambia a columna para pantallas pequeñas */
        gap: 20px; /* Espaciado uniforme entre los elementos */
    }

    .large-blog-box,
    .small-blog-box {
        width: 80%; /* Hace que los cuadros ocupen todo el ancho */
    }

    .large-blog-box{
        align-items: center;
        margin-left: 10px;
    }

    .small-blog-boxes {
        width: 80%; /* Los cuadros pequeños también ocupan todo el ancho */
        align-items: center;
        margin-left:20px ;
        margin-bottom: 10px;
    }

    .blog-description {
        font-size: 14px;
    }

    .boton_leer{
        margin: 20px;
        padding: 20px;
    }

    .landing-text07 {
        width: 80%;
        text-align: center;
        align-items: center;
        margin-left: 20px;
    }
}

/* Media Queries para pantallas muy pequeñas (máx. 480px) */
@media (max-width: 480px) {
    .landing-text {
        font-size: 28px;
        margin-right: 30px;
    }

    .blog-description {
        font-size: 16px;
    }

    .large-blog-box img,
    .small-blog-box img {
        width: 60%; /* Ajusta el tamaño de las imágenes */
    }

    .btn.btn-primary {
        font-size: 14px;
        padding: 10px 20px; /* Reduce el relleno para botones pequeños */
    }
     
}