@media only screen and (max-width: 767px) {
    .home-logo {
        width: 20rem;
    }

    #offcanvasVidasVentos {
        display: flex !important;
    }

    #home .container-fluid,
    .carousel.slide,
    .carousel-inner,
    .carousel-item {
        height: 100%;
    }

    .carousel-item img {
        height: 100%;
        object-fit: cover;
    }

    .article-box {
        flex-flow: column;
    }

    .article-box .author> :nth-child(1),
    .article-box .category> :nth-child(1) {
        margin-left: 0rem;
        font-weight: 500;
    }

    .article-content,
    .article-tags {
        width: 85%;
    }

    .user-about-img {
        width: 100%;
    }

    .article-list .vv-card-title {
        font-size: 1.5rem;
    }

    .article-list .vv-card-description {
        font-size: 1rem;
    }

}


@media (max-width: 768px) {
    .login-container {
        grid-template-columns: 1fr;
        /* só uma coluna */
        height: auto;
        min-height: 80vh;
        /* garante que o container não fique muito pequeno */
        background: #fff;
        /* mantém fundo sólido */
    }

    .login-form .form-control {
        border: 1px solid #ccc;
        /* borda cinza visível no fundo branco */
        color: #333;
        /* texto e placeholder mais escuros */
        background: #fff;
        /* garante fundo branco dentro do input */
    }

    .login-form .form-control::placeholder {
        color: #999;
        /* placeholder cinza escuro */
        opacity: 1;
        /* garante que apareça */
    }
}

/* MACBOOKS: */
@media (min-width: 1367px) and (max-width: 1680px) {
    .home-logo {
        width: 38rem;
    }
}

@media (max-width: 1366px) {
    .home-logo {
        width: 38rem;
    }

}