/* ==========================================================================
   Novo visual 2026 — reskin a partir do design_handoff_site_inforpro
   Contém apenas: estados :hover reais (o mock usa o atributo `style-hover`,
   que só existe no runtime do design tool) + resets pontuais + breakpoints
   responsivos. O restante do visual permanece inline nos templates, como
   o próprio README do handoff recomenda.
   ========================================================================== */

.np-page { font-family: 'Archivo', -apple-system, 'Segoe UI', sans-serif; color: #16161A; -webkit-font-smoothing: antialiased; }
.np-page a { text-decoration: none; color: inherit; }
.np-page ::selection { background: #C80000; color: #fff; }
html { scroll-behavior: smooth; }

/* ---- Header / nav ---- */
.np-navlink:hover { color: #C80000; }
.np-cta-specialist:hover { background: #a90000 !important; }
.np-hamburger { display: none; }
.np-drawer { display: none; }
.np-drawer.is-open { display: block; }
.np-drawer-link:hover { color: #C80000; }

/* ---- Botões / CTAs ---- */
.np-red-cta:hover { background: #a90000 !important; }
.np-white-cta:hover { background: #fff5f5 !important; }
.np-dark-cta:hover { background: #C80000 !important; }
.np-outline-cta:hover { border-color: #C80000 !important; color: #C80000 !important; }
.np-whats-cta:hover { background: #1fbe5a !important; }
.np-social-icon:hover { background: #C80000 !important; }
.np-footer-link:hover { color: #fff !important; }

/* ---- Paginação do catálogo ---- */
.paginacao { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 36px; flex-wrap: wrap; font-family: 'Archivo', -apple-system, sans-serif; }
.paginacao a, .paginacao span.np-page-dots { text-decoration: none; }
.paginacao .num_pag, .paginacao .num_pag_ativo { width: 40px; height: 40px; border-radius: 10px; font-size: 14px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.paginacao .num_pag { border: 1px solid #E0E0E6; color: #52525b; font-weight: 600; }
.paginacao .num_pag:hover { border-color: #C80000; color: #C80000; }
.paginacao .num_pag_ativo { background: #C80000; color: #fff; border: 1px solid #C80000; }
.paginacao .np-page-dots { color: #b4b4bc; padding: 0 4px; }
.paginacao .a-prev, .paginacao .a-next { height: 40px; padding: 0 16px; border-radius: 10px; border: 1px solid #E0E0E6; color: #16161A; font-size: 14px; font-weight: 700; display: flex; align-items: center; gap: 7px; }
.paginacao .a-prev:hover, .paginacao .a-next:hover { border-color: #C80000; color: #C80000; }

/* ---- Catálogo / cards de produto ---- */
.np-prod-card:hover { box-shadow: 0 16px 38px -18px rgba(0,0,0,0.18); border-color: #dcdce2 !important; }
.np-prod-card:hover .np-btn-details { background: #C80000; }
.np-cat-link:hover { background: #fafafb; color: #C80000 !important; }
.np-brand-chip:hover { border-color: #C80000 !important; color: #C80000 !important; }
.np-page-link:hover { border-color: #C80000 !important; color: #C80000 !important; }

/* ---- Responsivo ---- */
@media (max-width: 991px) {
    .np-nav, .np-cta-specialist, .np-utility-email, .np-utility-area { display: none !important; }
    .np-hamburger { display: flex !important; }
    .np-grid-2col { grid-template-columns: 1fr !important; }
    .np-grid-sidebar { grid-template-columns: 1fr !important; }
    .np-grid-3col, .np-grid-4col { grid-template-columns: repeat(2, 1fr) !important; }
    .np-sticky { position: static !important; top: auto !important; }
    .np-hide-mobile { display: none !important; }
}

@media (max-width: 560px) {
    .np-grid-3col, .np-grid-4col { grid-template-columns: 1fr 1fr !important; gap: 12px !important; }
    .np-h1 { font-size: 28px !important; }
    .np-h2 { font-size: 26px !important; }
}