/* Botões de âncora do topo da home ("Ver Jogo do Bicho" / "Ver Loterias
   da Caixa") — bin/criar-paginas.php (Fase D) grava só `<a class="dnp-btn-anchor">`
   crus, sem shortcode dedicado; auto-contido, sem depender de tokens de
   outro CSS (mesma prática de dnp-nav-dia.css). */
.dnp-home-anchors{
  display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch;
  gap:14px;
  margin:0 0 30px;
}
.dnp-btn-anchor{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:220px;
  padding:14px 28px;
  background:linear-gradient(180deg,#1c6b3f 0%,#0d3a22 100%);
  border-radius:999px;
  color:#fff;
  font-family:'Montserrat',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  font-size:1rem;font-weight:800;
  text-decoration:none;text-align:center;
  box-shadow:0 4px 12px rgba(13,58,34,.25);
  transition:transform .16s ease,box-shadow .16s ease;
}
/* color explícito no :hover — sem isso, um a:hover mais genérico do tema
   (mesma especificidade, carregado depois) pode vencer no cascade e
   deixar o texto com a cor de link padrão em vez de branco. */
.dnp-btn-anchor:hover{color:#fff;transform:translateY(-2px);box-shadow:0 6px 16px rgba(13,58,34,.32)}
.dnp-btn-anchor:active{color:#fff;transform:translateY(0)}
.dnp-btn-anchor:focus-visible{outline:2px solid #0d3a22;outline-offset:3px}

@media (prefers-reduced-motion:reduce){
  .dnp-btn-anchor{transition:none}
  .dnp-btn-anchor:hover{transform:none}
}

@media (max-width:480px){
  .dnp-btn-anchor{min-width:0;flex:1 1 auto;padding:12px 18px;font-size:.92rem}
}

/* ---------- botões estáticos das 10 loterias da Caixa ---------- */
.dnp-caixa-botoes{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:14px;
  max-width:1060px;margin:0 auto 25px;
}
/* wpautop() insere <br> entre tags separadas por quebra de linha simples
   no HTML fonte — como o container é display:grid, cada <br> vira um item
   de grade próprio e empurra os botões pra posições erradas (3-2-3-2 em
   vez de 5-5). Blindagem: esconder qualquer <br> que apareça aqui, mesmo
   que o conteúdo seja reeditado manualmente com quebras de linha depois. */
.dnp-caixa-botoes br{display:none}
.dnp-btn-caixa{
  display:flex;align-items:center;justify-content:center;
  min-height:64px;padding:14px 12px;
  background:linear-gradient(180deg,#1c6b3f 0%,#0d3a22 100%);
  border-radius:14px;
  color:#fff;
  font-family:'Montserrat',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  font-size:.92rem;font-weight:800;
  text-decoration:none;text-align:center;line-height:1.25;
  box-shadow:0 4px 12px rgba(13,58,34,.2);
  transition:transform .16s ease,box-shadow .16s ease;
}
.dnp-btn-caixa:hover{color:#fff;transform:translateY(-2px);box-shadow:0 6px 16px rgba(13,58,34,.28)}
.dnp-btn-caixa:active{color:#fff;transform:translateY(0)}
.dnp-btn-caixa:focus-visible{outline:2px solid #0d3a22;outline-offset:3px}

@media (prefers-reduced-motion:reduce){
  .dnp-btn-caixa{transition:none}
  .dnp-btn-caixa:hover{transform:none}
}

@media (max-width:768px){
  .dnp-caixa-botoes{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:480px){
  .dnp-caixa-botoes{grid-template-columns:repeat(2,1fr);gap:10px}
  .dnp-btn-caixa{min-height:56px;padding:11px 8px;font-size:.84rem}
}
