/* ==========================================================================
   pages/erp-mei.css — ajustes só da página ERP-MEI/index.html
   Espaçamento e cabeçalhos de seção vêm do layout.css (.section,
   .section__intro); aqui fica só a faixa escura das Novidades.
   Ritmo da página: hero azul → faixa cinza com os vídeos → conteúdo em
   branco → faixa escura com as novidades → rodapé.
   ========================================================================== */

/* --- Novidades: faixa escura, no tom dos slides do carrossel --- */
.erp-news {
  background: linear-gradient(160deg, var(--color-blue-900) 0%, var(--color-gray-900) 100%);
  color: var(--color-white);
}

.erp-news .section__header {
  color: var(--color-white);
}

.erp-news .section__lead {
  color: rgba(255, 255, 255, 0.8);
}

.erp-news__tag {
  display: inline-block;
  margin-bottom: var(--space-3);
  padding: var(--space-1) var(--space-3);
  border-radius: 999px;
  background: var(--color-success);
  color: var(--color-white);
  font-family: var(--font-display);
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.erp-news .carousel__track {
  box-shadow: var(--shadow-lg);
}

.erp-news .carousel__btn {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.3);
  color: var(--color-white);
}

.erp-news .carousel__btn:hover:not(:disabled) {
  background: rgba(255, 255, 255, 0.18);
}

.erp-news .carousel__dot {
  background: rgba(255, 255, 255, 0.3);
}

.erp-news .carousel__dot[aria-current="true"] {
  background: var(--color-white);
}

.erp-news__cta {
  margin-top: var(--space-7);
  text-align: center;
}

.erp-news__note {
  margin: var(--space-3) auto 0;
  font-size: var(--fs-sm);
  color: rgba(255, 255, 255, 0.7);
}