/* Aviso — Nova Marca
   Figma: Site Update Nova Marca — node 7833:3896 (desk) / 7833:4789 (mobo)

   Reconstruído com classes .nm-aviso__* que não existem em css.css.
   Conteúdo continua vindo do mesmo campo ACF de sempre — "mensagem_fundo_fechado_captacao"
   (texto livre, às vezes com <strong>/<a>, às vezes só texto puro) — sem
   filtro novo (a página nunca aplicou wpautop aqui, mantido assim pra não
   mudar como avisos já cadastrados renderizam).

   .aviso-fundo/.btnCloseAviso continuam no HTML só pelo JS de fechar, que é
   genérico e compartilhado (definido inline no footer de cada categoria):
   $(".btnCloseAviso").click(() => $(".aviso-fundo").addClass('inativo')).
   .aviso-fundo.inativo{display:none} também continua vindo do css.css. */

.aviso-fundo.nm-aviso {
  display: flex;
  align-items: flex-start;
  gap: var(--nm-space-5); /* 24px */
  position: relative;
  width: 100%;
  margin-top: var(--nm-space-7); /* 40px — mesmo respiro das outras seções */
  padding: var(--nm-space-5) var(--nm-space-5) var(--nm-space-5) var(--nm-space-5); /* 24px, ajustado no desktop abaixo */
  background: var(--nm-color-off-white);
  border-radius: var(--nm-radius-md); /* 16px */
  box-sizing: border-box;
}

.aviso-fundo.nm-aviso .nm-aviso__icon {
  display: flex;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
}

.aviso-fundo.nm-aviso .nm-aviso__icon img {
  display: block;
  width: 100%;
  height: 100%;
}

.aviso-fundo.nm-aviso .nm-aviso__content {
  display: flex;
  flex-direction: column;
  gap: var(--nm-space-4); /* 16px */
  flex: 1 1 auto;
  min-width: 0;
  padding-right: 40px; /* não deixa o texto passar por baixo do X */
  font-family: var(--nm-font-family);
  font-weight: var(--nm-font-weight-regular);
  font-size: var(--nm-font-size-base);
  line-height: var(--nm-line-height-base);
  color: var(--nm-color-chumbo);
}

.aviso-fundo.nm-aviso .nm-aviso__content > *:first-child {
  margin-top: 0;
}

.aviso-fundo.nm-aviso .nm-aviso__content > *:last-child {
  margin-bottom: 0;
}

.aviso-fundo.nm-aviso .nm-aviso__content p {
  margin: 0 0 var(--nm-space-4);
}

.aviso-fundo.nm-aviso .nm-aviso__content strong,
.aviso-fundo.nm-aviso .nm-aviso__content b {
  font-weight: var(--nm-font-weight-semibold);
  color: var(--nm-color-chumbo);
}

.aviso-fundo.nm-aviso .nm-aviso__content a {
  color: var(--nm-color-blue);
  text-decoration: none;
}

.aviso-fundo.nm-aviso .nm-aviso__content a:hover {
  text-decoration: underline;
}

.aviso-fundo.nm-aviso .btnCloseAviso {
  position: absolute;
  top: var(--nm-space-4); /* 16px */
  right: var(--nm-space-4); /* 16px */
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  cursor: pointer;
}

.aviso-fundo.nm-aviso .btnCloseAviso img {
  display: block;
  width: 100%;
  height: 100%;
}

@media (max-width: 768px) {
  .aviso-fundo.nm-aviso {
    flex-direction: column;
    gap: var(--nm-space-5); /* 24px */
    margin-top: var(--nm-space-6); /* 32px */
    padding: var(--nm-space-5) var(--nm-space-4) var(--nm-space-5) var(--nm-space-5); /* pl-24 pr-16 py-24, igual ao Figma mobile */
  }

  .aviso-fundo.nm-aviso .nm-aviso__content {
    padding-right: 0;
  }
}