/* Início header */

.link-home {
  border: 0.5em white solid;
  text-decoration: none;
}

/* Fim Header */

/* Início Footer */

.footer-conteudo {
  text-align: center;
  padding: 5em 0;
  display: flex;
  flex-direction: column;
  text-align: center;

  @media (min-width: 768px) {
    flex-direction: row;
    justify-content: space-between;
  }
}

.nome-blog {
  order: 2;
  padding: 4em 0 0 0;
  @media (min-width: 768px) {
    padding: 0;
    order: 1;
  }
}

.nome-blog a {
  text-decoration: none;
}

.area-redes-sociais {
  display: flex;
  flex-direction: column;
  gap: 1em;
  order: 1;
  font-size: 2em;
  @media (min-width: 768px) {
    flex-direction: row;
    order: 2;
    font-size: 1.5em;
  }
}

.area-redes-sociais a {
  text-decoration: none;
}

/* Fim Footer */

/* Início Index */
article a {
  text-decoration: none;
}
.lista-posts {
  display: flex;
  flex-wrap: wrap; /* Permite que os itens se movam para a próxima linha */
  justify-content: center; /* Centraliza as colunas na linha */
}

.lista-posts a {
  text-decoration: none;
  margin: 0; /* Espaçamento entre os posts */
  box-sizing: border-box; /* Para garantir que o padding e margem não afetem a largura */

  @media (min-width: 768px) {
    flex: 0 0 calc(33.33% - 20px); /* Cada coluna ocupa 1/3 da largura da tela */
    margin: 10px; /* Espaçamento entre os posts */
    box-sizing: border-box; /* Para garantir que o padding e margem não afetem a largura */
  }
}

.card-post {
  display: flex;
  flex-direction: column;
  justify-content: space-between; /* Mantém o conteúdo distribuído */
  height: 100%; /* Preenche altura completa do grid */
}

/* Ajusta o comportamento do título */
.card-post h4 {
  flex-grow: 1; /* Expande para ocupar espaço e alinhar com outros */
  margin: 10px 0; /* Ajuste de margem para consistência visual */
}

.img-container {
  width: 100%; /* Largura completa do elemento pai */
  aspect-ratio: 16 / 9; /* Proporção 16:9 (pode ajustar para 1:1, 4:3, etc.) */
  overflow: hidden; /*Esconde o excesso de imagem */
  position: relative;
}

.img-container img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* Ajusta a imagem para cobrir o contêiner sem distorcer */
  object-position: center; /* Centraliza o foco da imagem */
}
/* Fim Index */

/* Início Post */
.post {
  padding: 2em 0 1em 0;
}

.dados-post {
  padding: 1em 1em 2em 0;
  display: flex;
  flex-direction: column;
  align-items: end;
}
.nota-sobre-credito {
  margin-top: 3em;
}

.imagem-post {
  text-align: center;
  padding: 1em 0;
}

.imagem-post img {
  transition: transform 0.3s ease; /* transição suave */
  border-radius: 0.2em; /* bordas arredondadas para suavizar o visual */
  box-shadow: 0 0.5em 1em rgba(255, 255, 255, 0.1); /* sombra suave */
}

/* Fim Post */

/* Início Base */
.titulo-pagina-index {
  text-align: center;
  padding: 1em 0 2em 0;
}

.titulo-pagina-index a {
  text-decoration: none;
}

/* Estilos para o body */
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh; /* Ocupa a altura total da viewport */
  margin: 0;
}

/* Faz o main crescer para preencher o espaço */
main {
  flex-grow: 1;
}

/* Fim Base */

/* Início Geral */
.clicavel {
  cursor: pointer;
}

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

.conteudo-justify {
  text-align: justify;
}

/* Fim Geral */