/* ==========================================================================
   CARD NOTA À IMPRENSA - ESTRUTURA VERTICAL COMPLETA E CORRIGIDA
   ========================================================================== */

/* Container principal de cada card */
.card-nota-imprensa {
  background-color: #f5f6f8; /* Fundo cinza bem claro */
  border-radius: 0 16px 16px 0; /* Cantos arredondados na direita */
  border-left: 14px solid #14284b; /* Barra lateral escura azul marinho */
  padding: 24px;
  margin-bottom: 24px;
  display: flex !important;
  flex-direction: column !important; /* Força o empilhamento vertical */
  gap: 16px; /* Espaço entre a imagem e o texto */
  box-sizing: border-box; 
  width: 100% !important; /* Força o card a usar toda a largura disponível */
}

/* O SEGREDO: Remove a barreira do container do Drupal que esmaga a imagem */
.nota-imprensa-midia {
  display: contents !important; 
}

/* Customização e redimensionamento da Imagem */
.card-nota-imprensa img,
.nota-imprensa-midia img {
  width: 100% !important; /* Força a foto a ocupar toda a largura do card */
  max-width: 100% !important;
  height: auto !important; /* Mantém a proporção real da foto do navio */
  max-height: 350px; /* Altura máxima para não esticar no desktop */
  object-fit: cover; /* Ajusta a foto sem distorcer ou esticar */
  border-radius: 8px; /* Cantos arredondados na foto */
  display: block !important;
}

/* Bloco que envolve os textos (Título e Data) abaixo da foto */
.nota-imprensa-corpo-texto {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px; 
  width: 100% !important;
}

/* Estilo do link do Título da Nota */
.nota-imprensa-titulo a {
  color: #2b6cb0; 
  text-decoration: none;
  font-weight: bold;
  font-size: 1.25rem;
  line-height: 1.4;
  display: block;
}
.nota-imprensa-titulo a:hover {
  text-decoration: underline;
}

/* Estilo da Data de Publicação */
.nota-imprensa-data {
  color: #616e7f;
  font-size: 0.95rem;
}

/* ==========================================================================
   CONFIGURAÇÃO AJUSTADA PARA CELULARES (MOBILE)
   ========================================================================== */
@media screen and (max-width: 768px) {
  .card-nota-imprensa {
    padding: 16px; 
    margin-bottom: 16px; 
    border-left-width: 10px; 
    gap: 12px; 
  }

  .card-nota-imprensa img,
  .nota-imprensa-midia img {
    max-height: 240px; /* Altura ideal e equilibrada para telas de celular */
    object-fit: cover; /* Garante preenchimento lateral completo no celular */
  }

  .nota-imprensa-titulo a {
    font-size: 1.1rem; 
    line-height: 1.3;
  }

  .nota-imprensa-data {
    font-size: 0.85rem; 
  }
}
