/* Complemento do frontend v2 (Astro). O grosso do design vem de
   index-D1rYUQ0G.css (CSS compilado do site original, mantido para
   preservar o visual). Aqui ficam apenas:
   1. utilities novas que o build antigo purgou;
   2. estilos do botão de WhatsApp (antes inline no index.html);
   3. correção de contraste apontada pelo Lighthouse (só o tom do texto). */

/* --- utilities ausentes no build antigo --- */
.scroll-mt-32 { scroll-margin-top: 8rem; }
.line-clamp-1 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.bg-primary-lighter\/40 { background-color: rgb(138 155 168 / 0.25); }
.border-primary-lighter { border-color: rgb(138 155 168 / 0.5); }
.text-6xl { font-size: 3.75rem; line-height: 1; }

/* --- correção de contraste (Lighthouse), sem alterar a paleta ---
   Apenas o TOM dos textos afetados muda; fundos e cores de marca ficam. */

/* #8A9BA8 sobre o navy #3D4F5C tinha ~2.9:1; o tom abaixo mantém o mesmo
   matiz azul-acinzentado e atinge AA (>4.5:1) sobre o gradiente escuro. */
.gradient-primary .text-primary-lighter,
.bg-primary .text-primary-lighter,
footer.bg-primary .text-primary-lighter {
  color: rgb(205 215 223);
}

/* texto navy sobre dourado (#C9A34A) ficava em ~3.9:1; navy mais fechado
   no mesmo matiz chega a ~5.5:1 */
.bg-accent-gold.text-primary,
.bg-accent-gold .text-primary {
  color: rgb(35 47 59);
}

/* corpo de texto cinza (#718096) não passava de 4.5:1 sobre o cinza-claro
   #F7FAFC; tom um passo mais escuro, mesmo matiz */
.text-gray-medium {
  color: rgb(90 103 122);
}

/* chips de categoria: navy #3D4F5C sobre #8A9BA8 dava 2.96:1; texto quase
   preto no mesmo matiz chega a ~4.6:1 sem mudar o fundo do chip */
.bg-primary-lighter.text-primary {
  color: rgb(30 41 51);
}

/* --- WhatsApp FAB (idêntico ao comportamento anterior) --- */
#mma-wa-fab {
  position: fixed;
  right: 24px;
  bottom: 24px;
  width: 60px;
  height: 60px;
  background: #25D366;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 20px rgba(0, 0, 0, .22);
  text-decoration: none;
  z-index: 9999;
  transition: transform .2s ease;
}
#mma-wa-fab:hover { transform: scale(1.08); }
#mma-wa-fab svg { width: 32px; height: 32px; fill: #fff; position: relative; z-index: 2; }
#mma-wa-fab .pulse {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: #25D366;
  opacity: .55;
  animation: mma-pulse 2s infinite;
  z-index: 1;
}
#mma-wa-fab .tip {
  position: absolute;
  right: 72px;
  top: 50%;
  transform: translateY(-50%);
  background: #1f2937;
  color: #fff;
  padding: 8px 14px;
  border-radius: 8px;
  font: 500 13px/1.2 'Inter', system-ui, sans-serif;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .18);
}
#mma-wa-fab .tip::after {
  content: '';
  position: absolute;
  right: -5px;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
  width: 10px;
  height: 10px;
  background: #1f2937;
}
#mma-wa-fab:hover .tip { opacity: 1; }
@keyframes mma-pulse {
  0% { transform: scale(1); opacity: .55; }
  100% { transform: scale(1.7); opacity: 0; }
}
@media (max-width: 480px) {
  #mma-wa-fab { right: 16px; bottom: 16px; width: 56px; height: 56px; }
  #mma-wa-fab .tip { display: none; }
}

/* breadcrumb: mantém a trilha em uma linha discreta */
nav[aria-label="Trilha de navegação"] svg { flex-shrink: 0; color: rgb(160 174 192); }

/* --- tabelas e citações dentro de artigos (regras que o SPA injetava
       via JavaScript; agora fazem parte do CSS estático) --- */
.article-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.5rem 0;
  background-color: white;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}
.article-content table th {
  background-color: #3D4F5C;
  color: white;
  padding: 0.75rem;
  text-align: left;
  font-weight: 600;
  border: 1px solid #ddd;
}
.article-content table td { padding: 0.75rem; border: 1px solid #ddd; }
.article-content table tr:nth-child(even) { background-color: #f9fafb; }
.article-content .ql-indent-1 { padding-left: 3rem; }
.article-content .ql-indent-2 { padding-left: 6rem; }
.article-content .ql-indent-3 { padding-left: 9rem; }
.article-content blockquote {
  border-left: 4px solid #C9A34A;
  padding-left: 1rem;
  margin: 1.5rem 0;
  font-style: italic;
  color: #6b7280;
}