/* ============================================================================
   blog.css — COMPLEMENTO do tema do site (NÃO é mais o tema completo)
   ----------------------------------------------------------------------------
   As páginas públicas do blog agora carregam o MESMO css/premium.css do site
   principal (cabeçalho .header, rodapé .footer, botões .btn, cookie-card,
   .whatsapp-float, .modal-overlay, .section, .container, .service-card...),
   para serem uma RÉPLICA visual do index.html.

   Este arquivo só adiciona o que é exclusivo das páginas do blog e NÃO existe
   no premium.css:
     • os pesos de fonte display mais fortes (800/900) usados nos títulos do
       blog e dos artigos (o premium.css importa Outfit só até 700);
     • o link de acessibilidade "Pular para o conteúdo" (skip-link).

   As CORES e o layout do miolo (hero do blog, cards da listagem, corpo do
   artigo, newsletter) são definidos inline em index.php / render-post.php,
   que injetam a paleta de marca.php (--primary, --secondary, etc.).
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Outfit:wght@600;700;800;900&display=swap');

:root{ --font-display:'Outfit','Inter',system-ui,sans-serif; }

/* Link "pular para o conteúdo" (acessibilidade) usado no topo dos artigos. */
.skip-link{
  position:absolute;left:-999px;top:0;
  background:var(--primary,#354881);color:#fff;
  padding:.6rem 1rem;border-radius:0 0 8px 0;z-index:2000;
  font-family:var(--font-display);font-weight:700;text-decoration:none;
}
.skip-link:focus{left:0;}
