/* ================================================================
   Regularize Consultoria — CSS separado (rascunho técnico)
   ----------------------------------------------------------------
   Gerado a partir de assets/css/custom.css para a fase de separação.
   Não substitui custom.css/custom.min.css automaticamente.
   Preserve a ordem de carregamento indicada no README antes de usar.
   ================================================================ */

/* ---------- 5.1. Variantes de hero para notícias ---------- */
.article-hero-informativo {
  background-color: var(--color-brand-dark);
  background-image: linear-gradient(90deg, #c2410c 0%, var(--color-brand-dark) 52%, var(--color-brand) 100%);
}

.article-badge-informativo {
  background-color: #ea580c;
  color: #fff;
}

.news-topic-shortcuts > span {
  display: inline-flex;
  align-items: center;
  border-color: rgba(255, 255, 255, 0.22);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 999px;
  background-color: rgba(255, 255, 255, 0.22);
  color: #f8fbff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

/* ---------- 15. Notícias e artigos: listagem, chips e corpo editorial ----------
   Mantém juntos os estilos da listagem /noticias/ e dos artigos individuais.
   Nesta fase, os subtítulos abaixo apenas documentam o bloco sem alterar regras. */

/* 15.1 Notícias: filtros e estados ativos da listagem */
.news-filter-button[aria-pressed="true"] {
  background-color: var(--color-brand);
  color: #fff;
  border-color: var(--color-brand);
}

.news-filter-button[aria-pressed="true"] span {
  color: #fff !important;
}

.news-sort-button[aria-pressed="true"] {
  background-color: #fff;
  color: var(--color-brand);
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.12);
}

/* 15.2 Notícias: cards da listagem e barras decorativas por tipo */
.news-card {
  position: relative;
}

.news-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 1.25rem;
  right: 1.25rem;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--color-brand), var(--color-brand-light));
  opacity: 0;
  transition: opacity 0.2s ease;
}

#news-article-list .news-card::before {
  left: 1.25rem;
  right: 1.25rem;
  height: 5px;
  border-radius: 999px;
  opacity: 1;
}

.news-card:hover::before,
.news-featured-card::before {
  opacity: 1;
}

.news-urgent-card::before {
  height: 5px;
  background: linear-gradient(90deg, #dc2626, #ef4444, #991b1b);
  opacity: 1;
}

.news-amber-card::before {
  height: 5px;
  background: linear-gradient(90deg, #d97706, #f59e0b, #fbbf24);
  opacity: 1;
}

.news-history-card::before {
  background: linear-gradient(90deg, #475569, #64748b, #94a3b8);
  opacity: 1;
}

/* Removida customização de ::before para evitar alterar a barra superior
   dos cards "Orientação". Em vez disso, aplicar apenas destaque na borda
   externa no hover para cards com etiqueta bg-brand/10 (Orientação). */

/* Hover da borda externa para cards de Orientação: usa classe semântica
   `news-card--orientation` aplicada ao <article> correspondente. */
#news-article-list .news-card.news-card--orientation:hover,
#news-article-list .news-card.news-card--orientation:focus-within {
  border-color: var(--color-brand) !important;
  box-shadow: 0 8px 24px rgba(21,101,192,0.06) !important;
}
.news-card > div:first-of-type > div:first-child > span:not(.category-chip):not([aria-hidden="true"]) {
  text-transform: uppercase;
}

#news-article-list .news-card > div:first-of-type > div:first-child > span.bg-brand\/10:not(.category-chip):not([aria-hidden="true"]),
main > article > header span.bg-white\/10:not(.category-chip) {
  background-color: var(--color-brand);
  border-color: var(--color-brand);
  border-width: 0;
  color: #fff;
}

/* 15.3 Notícias: card compacto e CTAs internos */
.news-card-compact {
  border-color: rgba(21, 101, 192, 0.2) !important;
  border-width: 1px !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05) !important;
  padding: 1.25rem !important;
}

#news-article-list .news-card.news-orange-card:hover,
#news-article-list .news-card.news-orange-card:focus-within {
  border-color: rgba(234, 88, 12, 0.45) !important;
}

#news-article-list .news-card.news-urgent-card:hover,
#news-article-list .news-card.news-urgent-card:focus-within {
  border-color: rgba(220, 38, 38, 0.48) !important;
}

#news-article-list .news-card.news-amber-card:hover,
#news-article-list .news-card.news-amber-card:focus-within {
  border-color: rgba(217, 119, 6, 0.5) !important;
}

/* Removida regra genérica que aplicava borda semi-transparente a cards não laranja/urgent/amber.
   Preferimos regras específicas por tipo para evitar clareamento/transparência indesejada. */

.news-card-compact::before {
  opacity: 1;
}

.news-card-compact:hover::before,
.news-card-compact:focus-within::before {
  opacity: 1;
}

.news-card-compact h2 {
  max-width: none !important;
  font-size: 1.25rem !important;
  line-height: 1.25 !important;
  margin-bottom: 0.5rem !important;
}

.news-card-compact p {
  max-width: none !important;
  color: #64748b !important;
  font-size: 0.875rem !important;
  line-height: 1.625 !important;
  margin-bottom: 1rem !important;
}

.news-card-compact > a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.375rem !important;
  border-radius: 9999px !important;
  padding: 0.375rem 0.875rem !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  color: #fff !important;
  box-shadow: none !important;
  transition: background-color 0.2s ease, box-shadow 0.15s ease !important;
}

.news-card-compact > a svg[aria-hidden="true"] {
  display: inline-block !important;
  transition: transform 0.15s ease !important;
}

.news-card-compact > a:hover svg[aria-hidden="true"],
.news-card-compact > a:focus-visible svg[aria-hidden="true"] {
  transform: translateX(2px) !important;
}

.news-card-compact.news-orange-card > a {
  background-color: #ea580c !important;
}

.news-card-compact.news-orange-card > a:hover,
.news-card-compact.news-orange-card > a:focus-visible {
  background-color: #c2410c !important;
  box-shadow: 0 2px 6px rgba(234, 88, 12, 0.28) !important;
}

.news-card-compact.news-urgent-card > a {
  background-color: #dc2626 !important;
}

.news-card-compact.news-urgent-card > a:hover,
.news-card-compact.news-urgent-card > a:focus-visible {
  background-color: #b91c1c !important;
  box-shadow: 0 2px 6px rgba(220, 38, 38, 0.28) !important;
}

.news-card-compact.news-amber-card > a {
  background-color: #f59e0b !important;
}

.news-card-compact.news-amber-card > a:hover,
.news-card-compact.news-amber-card > a:focus-visible {
  background-color: #d97706 !important;
  box-shadow: 0 2px 6px rgba(245, 158, 11, 0.32) !important;
}

.news-card-compact:not(.news-orange-card):not(.news-urgent-card):not(.news-amber-card) > a {
  background-color: var(--color-brand) !important;
}

.news-card-compact:not(.news-orange-card):not(.news-urgent-card):not(.news-amber-card) > a:hover,
.news-card-compact:not(.news-orange-card):not(.news-urgent-card):not(.news-amber-card) > a:focus-visible {
  background-color: var(--color-brand-dark) !important;
  box-shadow: 0 2px 6px rgba(21, 101, 192, 0.28) !important;
}

/* 15.4 Notícias: chips, categorias e reguladores */
.category-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.5rem;
  padding: 0.25rem 0.625rem;
  border: 0;
  border-radius: 9999px;
  box-shadow: none;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1rem;
  text-transform: uppercase;
  white-space: nowrap;
  vertical-align: middle;
}

.regulator-chip {
  text-transform: none;
}

/* 15.5 Artigos: metadados e taxonomia */
.article-meta-groups,
.article-meta-block {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.article-meta-taxonomy {
  margin-top: 0.625rem;
  padding-top: 0.625rem;
  border-top: 1px solid #f1f5f9;
}

.article-meta-card .category-chip {
  min-height: 1.125rem;
  padding: 0.125rem 0.45rem;
  font-size: 0.6875rem;
  line-height: 0.875rem;
  font-weight: 600;
  box-shadow: none;
}

@media (min-width: 640px) {
  .news-card .category-chip {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}

.category-chip--anvisa {
  background-color: #e8f2fb;
  border-color: #bfd7ee;
  color: #174f8f;
}

.category-chip--farmacia-popular {
  background-color: #e7f6ef;
  border-color: #b9e4cc;
  color: #166534;
}

.category-chip--cnes {
  background-color: #e0f2fe;
  border-color: #bae6fd;
  color: #075985;
}

.category-chip--crf {
  background-color: #edf7f2;
  border-color: #c9e6d9;
  color: #176b55;
}

.category-chip--mapa {
  background-color: #ecf6e8;
  border-color: #cfe8bf;
  color: #3f6212;
}

.category-chip--sncr {
  background-color: #e6f5f4;
  border-color: #b9dedb;
  color: #0f5f63;
}

.category-chip--sngpc {
  background-color: #fef3c7;
  border-color: #fde68a;
  color: #92400e;
}

.category-chip--visa {
  background-color: #eef2f7;
  border-color: #cbd5e1;
  color: #334155;
}

.category-chip--pf {
  background-color: #e8edf5;
  border-color: #c7d2e3;
  color: #1e3a5f;
}

main > article > header .category-chip {
  background-color: rgba(255, 255, 255, 0.15);
  color: #f1f5f9;
}

/* 15.6 Artigos: corpo editorial */
.article-body {
  color: #475569;
  font-size: 1rem;
  line-height: 1.8;
}

.article-body h2 {
  color: #0f172a;
  font-size: 1.5rem;
  font-weight: 800;
  line-height: 1.25;
  margin-top: 2.5rem;
  margin-bottom: 0.9rem;
}

.article-body h3 {
  color: #1e293b;
  font-size: 1.15rem;
  font-weight: 700;
  margin-top: 1.75rem;
  margin-bottom: 0.6rem;
}

.article-body p,
.article-body ul,
.article-body ol {
  margin-bottom: 1.1rem;
}

.article-body ul,
.article-body ol {
  padding-left: 1.25rem;
}

.article-body ul {
  list-style: disc;
}

.article-body ol {
  list-style: decimal;
}

.article-body li {
  margin-bottom: 0.45rem;
}

.article-body a {
  color: var(--color-brand);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* 15.7 Artigos: aviso importante, CTA final e notícias relacionadas */
.article-important-notice {
  background-color: #fff1f2;
  border: 1px solid #fecaca;
  border-radius: 1rem;
  color: #334155;
  font-size: 0.875rem;
  line-height: 1.6;
  padding: 1.25rem;
}

.article-important-notice p {
  margin: 0;
}

.article-important-notice strong {
  color: #b91c1c;
  font-weight: 700;
}

@media (min-width: 640px) {
  .article-important-notice {
    padding: 1.5rem;
  }
}

.article-final-cta,
.article-related-news {
  margin-top: 2rem;
}

.article-final-cta__grid,
.article-related-news__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

.article-final-cta__card,
.article-related-news__card {
  background-color: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  padding: 1.25rem;
}

.article-related-news__card {
  color: inherit;
  display: block;
  height: 100%;
  text-decoration: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.article-related-news__card:hover,
.article-related-news__card:focus-visible {
  border-color: rgba(21, 101, 192, 0.35);
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
  transform: translateY(-2px);
}

.article-final-cta__eyebrow,
.article-related-news__eyebrow {
  color: #64748b;
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  margin-bottom: 0.75rem;
  text-transform: uppercase;
}

.article-final-cta__title {
  color: #0f172a;
  font-size: 1.5rem;
  font-weight: 800;
  line-height: 1.25;
  margin: 0 0 0.75rem;
}

.article-final-cta__text {
  color: #475569;
  margin: 0;
}

.article-final-cta__actions {
  display: grid;
  gap: 0.75rem;
  margin-top: 1.25rem;
}

.article-final-cta__link {
  align-items: center;
  border-radius: 0.75rem;
  display: inline-flex;
  font-size: 0.9375rem;
  font-weight: 700;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.75rem 1rem;
  text-decoration: none;
  transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.article-final-cta__link:hover,
.article-final-cta__link:focus-visible {
  transform: translateY(-1px);
}

.article-final-cta__link--primary {
  background-color: var(--color-brand);
  box-shadow: 0 8px 20px rgba(21, 101, 192, 0.15);
  color: #fff;
}

.article-final-cta__link--primary:hover,
.article-final-cta__link--primary:focus-visible {
  background-color: var(--color-brand-dark);
  color: #fff;
}

.article-final-cta__link--secondary {
  background-color: #fff;
  border: 1px solid #cbd5e1;
  color: #0f172a;
}

.article-final-cta__link--secondary:hover,
.article-final-cta__link--secondary:focus-visible {
  border-color: rgba(21, 101, 192, 0.35);
  color: var(--color-brand);
}

.article-related-news__title {
  color: #0f172a;
  display: block;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.45;
}

.article-back-link {
  align-items: center;
  color: var(--color-brand);
  display: inline-flex;
  font-size: 0.9375rem;
  font-weight: 600;
  gap: 0.4rem;
  margin-top: 1.25rem;
  text-decoration: none;
}

.article-back-link:hover,
.article-back-link:focus-visible {
  color: var(--color-brand-dark);
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (max-width: 479px) {
  .article-final-cta__card,
  .article-related-news__card {
    padding: 1rem;
  }
}

@media (min-width: 768px) {
  .article-final-cta__actions,
  .article-related-news__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ---------- 17. Notícias: CTA dos cards em destaque ----------
   Escopo restrito a .news-featured-card — não afeta .news-card-compact.
   Mantém botões destacados separados dos cards compactos da listagem. */

.news-featured-card .news-orange-button {
  border-radius: 9999px;
  padding: 0.625rem 1.375rem;
  gap: 0.5rem;
  transition: background-color 0.2s ease, box-shadow 0.15s ease;
}

.news-featured-card .news-orange-button svg[aria-hidden="true"] {
  display: inline-block;
  transition: transform 0.15s ease;
}

/* ===== Correção local de overflow decorativo (tablet / meia-tela) ===== */
/* (Removidas regras experimentais de overflow decorativo — preservando ajustes aprovados) */

.news-featured-card .news-orange-button:hover {
  box-shadow: 0 2px 8px rgba(234, 88, 12, 0.28);
}

.news-featured-card .news-orange-button:hover svg[aria-hidden="true"] {
  transform: translateX(2px);
}

.news-featured-card.news-urgent-card > a {
  border-radius: 9999px;
  padding: 0.625rem 1.375rem;
  gap: 0.5rem;
  transition: background-color 0.2s ease, box-shadow 0.15s ease;
}

.news-featured-card.news-urgent-card > a svg[aria-hidden="true"] {
  display: inline-block;
  transition: transform 0.15s ease;
}

.news-featured-card.news-urgent-card > a:hover {
  box-shadow: 0 2px 8px rgba(220, 38, 38, 0.28);
}

.news-featured-card.news-urgent-card > a:hover svg[aria-hidden="true"] {
  transform: translateX(2px);
}

/* ---------- 18. Notícias: borda de destaque dos cards ----------
   Borda perceptível nos cards em destaque; excluída de .news-card-compact via :not().
   As variações por cor seguem as classes de destaque já usadas na listagem. */

#news-article-list .news-featured-card:not(.news-card-compact) {
  border-width: 2px;
}

#news-article-list .news-featured-card.news-orange-card:not(.news-card-compact) {
  border-color: rgba(234, 88, 12, 0.65);
}

#news-article-list .news-featured-card.news-urgent-card:not(.news-card-compact) {
  border-color: rgba(220, 38, 38, 0.65);
}

#news-article-list .news-featured-card.news-amber-card:not(.news-card-compact) {
  border-color: rgba(245, 158, 11, 0.70);
}

#news-article-list .news-featured-card:not(.news-orange-card):not(.news-urgent-card):not(.news-amber-card):not(.news-card-compact) {
  border-color: rgba(21, 101, 192, 0.60);
}

/* Hover: borda 100% na cor do tipo, sobrescreve regras genéricas */
#news-article-list .news-featured-card.news-orange-card:not(.news-card-compact):hover,
#news-article-list .news-featured-card.news-orange-card:not(.news-card-compact):focus-within {
  border-color: #ea580c !important;
}

#news-article-list .news-featured-card.news-urgent-card:not(.news-card-compact):hover,
#news-article-list .news-featured-card.news-urgent-card:not(.news-card-compact):focus-within {
  border-color: #dc2626 !important;
}

#news-article-list .news-featured-card.news-amber-card:not(.news-card-compact):hover,
#news-article-list .news-featured-card.news-amber-card:not(.news-card-compact):focus-within {
  border-color: #f59e0b !important;
}

#news-article-list .news-featured-card:not(.news-orange-card):not(.news-urgent-card):not(.news-amber-card):not(.news-card-co