/* --- Estilos para a Grade de Lançamentos (Discografia) --- */
.releases-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
  background-color: var(--black);
}
.release-card {
  position: relative; /* Cria um contexto de empilhamento para o z-index funcionar */
  overflow: hidden; /* Garante que o overlay não vaze */
  display: flex;
  flex-direction: column;
  /* Borda interna: use top/left para evitar dobra nas extremidades */
  border-right: 1px solid var(--black);
  border-bottom: 1px solid var(--black);
}

.release-card img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
  transition: var(--transition);
}

/* A caixa de informação, agora sempre visível abaixo da imagem */
.release-info {
  position: relative; /* Permite que o z-index seja aplicado */
  z-index: 1; /* Garante que a barra de info fique SOBRE a imagem no hover */
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: var(--transition);
  background-color: var(--black);
  color: var(--white);
  border-top: 1px solid var(--black);
  margin: 0;
  padding: 10px; /* Adiciona um respiro interno */
  white-space: nowrap; /* Impede que o texto quebre em múltiplas linhas */
  overflow: hidden; /* Esconde o texto que transborda */
  text-overflow: ellipsis; /* Adiciona "..." se o texto for muito longo */
}

/* Efeito para a imagem: zoom e desaturação */
.release-card:hover img {
  transform: scale(1.005);
}

/* No hover do card, muda a cor da caixa de informação */
.release-card:hover .release-info {
  background-color: var(--grey);
  color: var(--black);
}

/* Remove a margem do parágrafo dentro do overlay, que causava o vão. */
.release-info .p-small {
  margin: 0; /* Garante que não haja margens extras */
}