.listing-container {
    width: 100%;
}

.listing-item {
    display: flex;
    flex-wrap: wrap; /* Permite que os itens se ajustem conforme a largura da tela */
    margin-bottom: 20px;
    align-items: stretch; /* Faz com que os itens filhos se estendam para ocupar todo o espaço disponível em altura */
    overflow: hidden;
    background: #f8f8f8;
    border: 10px solid #fff;
    border-radius: 20px;
    box-shadow: inset 0 0 1rem #eee;
}

.listing-item .listing-image,
.listing-item .listing-content {
    flex-basis: 50%; /* Ajusta a base para metade do container pai */
    /* Restante do código para estilização de sombra, borda e arredondamento conforme necessário */
}

.listing-image {
    width: 100%; /* Ocupa toda a largura do espaço alocado a ele */
    position: relative; /* Permite posicionar absolutamente a imagem dentro */
}

.listing-image a{
    width: 100%;
    height: 100%;
    display: block;
}

.listing-image img {
    width: 100%;
    height: 100%; /* Mantém a proporção da imagem */
    object-fit: cover; /* Garante que a imagem cubra toda a área sem distorcer */
    position: absolute;
    top: 0%;
    left: 0;
    bottom: 0;
/*    transform:translateY(-50%);*/
}

.listing-content {
    padding: 50px 50px 60px;
    display: flex;
    flex-direction: column; /* Organiza o conteúdo interno em coluna */
    justify-content: center; /* Centraliza o conteúdo na vertical */
    /* Restante do código para estilização de cor, fonte, etc. */
}

/* Seu código para .list-content-info-top e estilos relacionados a seguir */

/* Restante do seu código para responsividade e outros estilos */

.listing-item .listing-content {
    flex-basis: 50%;
    padding: 50px 50px 60px;
    color: #666666;
    font-size: 15px;
}

.list-content-info-top {
    display: flex;
    justify-content: flex-start;
    align-items: start;
}

.list-content-info-top .list-logo {
    /*flex-basis: 15%;*/
    flex-basis: 80px;
    height: 80px;
    border: 1px solid #bbbbbb;
    border-radius: 5px;
    padding: 3px;
    margin-right: 7px;
    display: flex;
    justify-content: center;
    align-items: center;
    image-rendering: auto;
}

.list-content-info-top .list-content-info-text{
    /*flex-basis: 75%;*/
    flex-basis: 82%;
}

.list-content-info-text .atributos {
    margin-bottom: 0;
    font-family: 'Manrope', sans-serif;
}

.list-content-info-text .atributos a{
    color: #666666;
}

.list-content-info-text h2.title-imovel-list {
    margin: 1px 0;
    font-size: 34px;
    color: #000000;
    font-family: 'Manrope', sans-serif;
    font-weight: 100;
}

.listing-content p.endereco {
    font-weight: 700;
    color: #222222;
    font-family: 'Manrope', sans-serif;
    margin: 30px 0 16px;
}

.listing-content .info-adicionais {
    margin-bottom: 40px;
}

.listing-content .previsao-entrega {
/*    margin-bottom: 30px;*/
    text-align: left;
    border: 1px solid #999;
    border-radius: 5px;
    padding: 3px 8px;
    font-family: 'Manrope', sans-serif;
    font-size: 14px;
}

.listing-content a.list-btn {
    background: #666666;
    color: #ffffff;
    font-family: 'Manrope', sans-serif;
    font-size: 14px;
    font-weight: 600;
    padding: 13px 22px;
    border-radius: 5px;
    transition: ease-in-out .3s;
    width: 120px;
    text-align: center;
    margin-top:30px;
}

.listing-content a.list-btn:hover {
    background: #3e3e3e;
}

.listing-item {
    display: flex;
    /* Adicionar mais propriedades como alinhamento e justificação conforme necessário */
}


/* Adiciona estilos para os itens de listagem pares */

.listing-item:nth-child(even) {
    flex-direction: row-reverse; /* Inverte a ordem dos elementos filhos */
}

/*!* Ajusta o sombreamento para estar no lado interno da imagem quando invertido *!*/

/*.listing-item:nth-child(even) .listing-image {*/

/*    box-shadow: -10px 0 20px #bbb; !* Ajuste conforme necessário *!*/

/*}*/

/*!* Para telas menores, mantenha a imagem acima do conteúdo *!*/

/*@media (max-width: 900px) {*/

/*    .listing-item {*/

/*        flex-direction: column !important; !* Força a direção da coluna *!*/

/*    }*/

/*}*/

.listing-image {
    position: relative;
}

.listing-image .overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.9); /* Cor branca com transparência */
    opacity: 0; /* Começa totalmente transparente */
    transition: opacity 0.5s ease-in-out;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none; /* Se houver algum estilo padrão para links */
}

.listing-image .overlay span {
    color: #000; /* Cor do texto */
    font-size: 17px; /* Tamanho do texto */
    transition: transform 0.5s ease-in-out; /* Animação suave para transformação */
    transform: translateY(20px); /* Começa um pouco abaixo do centro */
}

.listing-image:hover .overlay {
    opacity: 1; /* Mostra o overlay ao passar o mouse */
}

.listing-image:hover .overlay span {
    transform: translateY(0); /* Move o texto para o centro */
}

/* Para telas menores, você pode querer que a imagem e o conteúdo fiquem um abaixo do outro */
@media (max-width: 900px) {
    .listing-item .listing-image {
        flex-basis: 100%;
    }
    .listing-item .listing-content {
        flex-basis: 100%;
    }
    .listing-item .listing-content {
        padding: 30px 20px 20px;
        font-size: 14px;
    }

    .list-content-info-text h2.title-imovel-list{
        font-size: 22px;
    }
    .listing-content .info-adicionais {
        margin-bottom: 30px;
    }
    .listing-content p.endereco {
        margin: 20px 0 12px;
    }
    .listing-content a.list-btn {
        width: 100%;
        display: block;
        text-align: center;
    }
    .listing-item {
        flex-direction: column; /* Empilha imagem e conteúdo verticalmente */
    }
    .listing-item .listing-image,
    .listing-item .listing-content {
        flex-basis: 100%; /* Ambos ocupam a largura total do contêiner */
    }

    .listing-item .listing-image {
        height: auto; /* Altura automática para manter a proporção */
        max-height: 300px; /* Altura máxima de 300px */
    }

    .listing-item .listing-image img {
        position: relative; /* Volta para o posicionamento normal */
        width: 100%; /* Largura total */
        height: auto; /* Altura automática para manter a proporção */
        object-fit: cover; /* Cobrir a área disponível sem perder a proporção */
        max-height: 300px; /* Altura máxima de 300px */
    }

    .list-content-info-top {
        align-items: center;
    }

}

@media (max-width: 400px) {
    .listing-item .listing-content,
    .listing-content .previsao-entrega {
        font-size: 13px;
    }

    .list-content-info-top .list-logo{
        flex-basis: 62px;
        height: 62px;
    }
}

/* Remova o position absolute da regra geral da imagem */
.listing-image img {
    width: 100%;
/*    height: auto;*/
    object-fit: cover;
    /* Removido position: absolute */
    /* Removidos top: 0, left: 0 e bottom: 0 */
}

/* Certifique-se de que .listing-item use flex e alinhe os filhos corretamente */
.listing-item {
    display: flex;
    /*flex-direction: column; !* Isso colocará a imagem em cima e o conteúdo abaixo *!*/
    align-items: stretch;
    /* ... outras propriedades ... */
}

/* Para telas menores, defina uma altura máxima para a imagem */
@media (max-width: 900px) {
    .listing-image img {
        max-height: 240px; /* Isso limitará a altura da imagem */
        object-fit: cover; /* Isso cortará a parte inferior da imagem se for muito alta */
    }
}

/* Outros estilos que você pode precisar para o responsivo */
@media (max-width: 900px) {
    .listing-item {
        /* Se necessário, ajuste os estilos dos itens de listagem aqui */
    }

    .listing-content {
        /* Ajuste o padding ou outros estilos do conteúdo aqui, se necessário */
    }
    /* ... */
}

/*
==================================================
Custom - Tiago
==================================================
*/

/* Estilizando a paginação */

/*.tmw-pagination{
    display: flex;
    justify-content: space-between;
    position: relative;
}
.tmw-pagination > *{
    z-index: 2;
}
.tmw-pagination a,
.tmw-pagination span{
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 2px solid white;
    text-align: center;
    color: #000000;
    display: flex;
    justify-content: center;
    align-items: center;
}
.tmw-pagination .page-numbers{
    background-color: var(--e-global-color-accent);
}
.tmw-pagination .page-numbers:first-of-type{
    margin-right:auto;
}
.tmw-pagination .page-numbers:last-of-type{
    margin-left:auto;
}
.tmw-pagination:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: calc(100% - 80px);
    height: 2px;
    background:white;
    z-index: 0;
    transform: translate(-50%);
}
.tmw-pagination .page-numbers.current{
    background:white;
}
.tmw-pagination a:hover{
    border-color:var(--e-global-color-secondary);
}*/


.tmw-pagination{
    display: flex;
    justify-content: center;
    position: relative;
    z-index: 0;
}
.tmw-pagination > *{
    z-index: 2;
}
.tmw-pagination a,
.tmw-pagination span{
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 2px solid white;
    text-align: center;
    color: #000000;
    display: flex;
    justify-content: center;
    align-items: center;
}
.tmw-pagination .page-numbers{
    background-color: transparent;
}
.tmw-pagination .page-numbers:first-of-type{
/*    margin-right:auto;*/
}
.tmw-pagination .page-numbers:last-of-type{
/*    margin-left:auto;*/
}
.tmw-pagination:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: calc(100% - 80px);
    height: 2px;
    background:transparent;
    z-index: 0;
    transform: translate(-50%);
}
.tmw-pagination .page-numbers.current{
    background:var(--e-global-color-accent);
}
.tmw-pagination a:hover{
    border-color:var(--e-global-color-secondary);
}
