/* Estilo geral para o bloco "the-life" */
.block-the-life {
    margin-bottom: 60px;
}

/* Título do bloco */
.block-the-life .block-title {
    font-size: 2rem;
    font-weight: bold;
    margin-bottom: 25px; /* Espaço abaixo do título */
    text-align: left; /* Alinha à esquerda */
    color: #1e1e1e;
}

/* Grid principal */
.the-life-grid {
    display: grid;
    grid-template-columns: 6fr 7fr; /* Bloco maior à esquerda, menor à direita */
    gap: 20px; /* Espaçamento entre os blocos */
    align-items: stretch; /* Garante que os itens fiquem alinhados verticalmente */
}

/* Artigo em destaque */
.the-life-highlight {
    display: flex;
    flex-direction: column;
    border: 1px solid #eee;
    border-radius: 8px;
    overflow: hidden;
    background-color: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Imagem no destaque */
.the-life-highlight .the-life-image img {
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 8px 8px 0 0;
}

/* Conteúdo do destaque */
.the-life-highlight .the-life-content {
    padding: 15px;
    display: flex;
    flex-direction: column;
    gap: 10px; /* Espaçamento entre elementos */
}

/* Categoria no destaque */
.the-life-highlight .the-life-category {
    font-size: 1rem;
    font-weight: bold;
    color: #555;
    text-transform: none; /* Exibe texto normal */
}

.the-life-highlight .the-life-category a {
    text-decoration: none;
    color: inherit;
}

.the-life-highlight .the-life-category a:hover {
    color: #3764b9;
}

/* Título no destaque */
.the-life-highlight .the-life-title {
    font-size: 1.5rem;
    font-weight: bold;
    color: #1e1e1e;
    margin: 10px 0;
}

.the-life-highlight .the-life-title a {
    text-decoration: none;
    color: inherit;
}

.the-life-highlight .the-life-title a:hover {
    color: #3764b9;
}

/* Resumo no destaque */
.the-life-highlight .the-life-excerpt {
    font-size: 0.9rem;
    color: #666;
}

/* Meta no destaque */
.the-life-highlight .the-life-meta {
    display: flex;
    justify-content: space-between; /* Autor à esquerda, data à direita */
    align-items: center;
    font-size: 0.875rem;
    color: #555;
}

.the-life-highlight .the-life-meta .the-life-author {
    display: flex;
    align-items: center;
    gap: 8px;
}

.the-life-highlight .the-life-meta .the-life-author a {
    text-decoration: none;
    color: #555; /* Mesma cor padrão dos artigos menores */
    font-size: inherit; /* Mantém o tamanho atual do artigo maior */
}

.the-life-highlight .the-life-meta .the-life-author a:hover {
    color: #3764b9; /* Cor ao passar o mouse */
}

.the-life-highlight .the-life-meta .the-life-date {
    color: #555;
    text-align: right; /* Alinha a data à direita */
}

.the-life-highlight .the-life-meta .the-life-date:hover {
    color: #3764b9;
}

/* Ajuste da imagem do autor no destaque do bloco "the-life" */
.the-life-highlight .the-life-meta .the-life-author img {
    width: 32px; /* Define a largura fixa da imagem do autor */
    height: 32px; /* Define a altura fixa da imagem do autor */
    border-radius: 50%; /* Mantém o formato arredondado */
    margin-right: 5px; /* Espaçamento entre a imagem e o texto */
    object-fit: cover; /* Garante que a imagem fique proporcional dentro do círculo */
    border: 1px solid #eee; /* Adiciona uma borda clara */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Sombra para destaque */
}


/* Lista de artigos menores */
.the-life-list {
    display: flex;
    flex-direction: column;
    gap: 20px; /* Espaçamento entre os artigos */
    justify-content: space-between; /* Distribui os artigos para ocupar o mesmo espaço do bloco maior */
}

/* Cada artigo menor */
.the-life-item {
    display: flex;
    gap: 15px; /* Espaçamento entre a imagem e o conteúdo */
    border: 1px solid #eee;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    background-color: #fff;
    height: calc(25% - 15px); /* Ajusta para que 4 artigos menores ocupem a mesma altura do artigo maior */
}

/* Imagem nos artigos menores */
.the-life-item .the-life-image {
    flex: 0 0 160px; /* Aumenta a largura da imagem */
    height: 100%; /* Imagem ocupa toda a altura do artigo */
    overflow: hidden;
    border-radius: 8px 0 0 8px;
}

.the-life-item .the-life-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Conteúdo dos artigos menores */
.the-life-item .the-life-content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex-grow: 1;
    padding: 10px; /* Adiciona padding ao conteúdo */
}

/* Categoria nos artigos menores */
.the-life-item .the-life-category {
    font-size: 0.875rem;
    font-weight: bold;
    color: #555;
    margin-bottom: 5px; /* Espaçamento abaixo da categoria */
    text-transform: none; /* Texto normal (não em maiúsculas) */
}

.the-life-item .the-life-category a {
    text-decoration: none;
    color: inherit;
}

.the-life-item .the-life-category a:hover {
    color: #3764b9; /* Cor ao passar o mouse */
}

/* Título nos artigos menores */
.the-life-item .the-life-title {
    font-size: 1rem;
    font-weight: bold;
    color: #1e1e1e;
    margin-bottom: 5px;
}

.the-life-item .the-life-title a {
    text-decoration: none;
    color: inherit;
}

.the-life-item .the-life-title a:hover {
    color: #3764b9;
}

/* Informações do autor e data */
.the-life-item .the-life-meta {
    display: flex;
    justify-content: space-between; /* Alinha o autor à esquerda e a data à direita */
    align-items: center;
    font-size: 0.875rem;
    color: #555;
}

/* Autor nos artigos menores */
.the-life-item .the-life-author a {
    text-decoration: none;
    color: #555; /* Nova cor padrão */
}

.the-life-item .the-life-author a:hover {
    color: #3764b9; /* Cor ao passar o mouse */
}

/* Data nos artigos menores */
.the-life-item .the-life-date {
    text-align: right; /* Alinha a data à direita */
    color: #555; /* Nova cor padrão */
}

.the-life-item .the-life-date:hover {
    color: #3764b9; /* Cor ao passar o mouse */
}