/*
Theme Name: Twenty Twenty-Five HopeAgents
Template: twentytwentyfive
Description: Tema-filho do Twenty Twenty-Five com o CSS de marca do blog HopeAgents.
Author: HopeAgents
Version: 1.0.3
Text Domain: twentytwentyfive-hopeagents
*/

/* ============================================================
   Blog HopeAgents — estilos do artigo
   Paleta da marca: #3a5bff (azul) · #0b1020 (tinta) · #f4f5fa (fundo)
   ============================================================ */

:root{
  --ha-azul:#3a5bff;
  --ha-tinta:#0b1020;
  --ha-cinza:#5a6785;
  --ha-fundo:#f4f5fa;
  --ha-borda:rgba(15,23,42,.10);
}

/* Coluna de leitura mais larga: reduz o vazio nas laterais */
.wp-site-blocks .entry-content > *{max-width:820px}
.wp-site-blocks .entry-content > .alignwide{max-width:1080px}
.wp-site-blocks .entry-content > .alignfull{max-width:none}

/* Ritmo de leitura */
.entry-content p{line-height:1.7;color:var(--ha-tinta)}
.entry-content li{line-height:1.65;margin-bottom:.45rem}

/* Hierarquia de títulos */
.entry-content h2{
  font-weight:700;
  letter-spacing:-.015em;
  line-height:1.25;
  margin-top:2.8rem;
  padding-top:1.4rem;
  border-top:3px solid var(--ha-azul);
}
.entry-content h3{font-weight:650;line-height:1.32;margin-top:2rem}

/* Índice do artigo */
.ha-indice{
  background:var(--ha-fundo);
  border:1px solid var(--ha-borda);
  border-left:4px solid var(--ha-azul);
  border-radius:14px;
  padding:1.4rem 1.6rem;
  margin:2rem 0;
}
.ha-indice h2{
  margin:0 0 .7rem;
  padding:0;
  border:0;
  font-size:1rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--ha-cinza);
}
.ha-indice ul{margin:0;padding-left:1.1rem}
.ha-indice li{margin:.32rem 0;line-height:1.45}
.ha-indice a{
  color:var(--ha-tinta);
  text-decoration:none;
  border-bottom:1px solid rgba(58,91,255,.35);
}
.ha-indice a:hover{color:var(--ha-azul)}

/* Bloco de destaque escuro */
.ha-destaque{
  background:var(--ha-tinta);
  color:#fff;
  border-radius:14px;
  padding:1.5rem 1.7rem;
  margin:2.5rem 0;
}
.ha-destaque p{margin:0;line-height:1.65;color:#fff}
.ha-destaque strong{color:#8fa5ff}

/* Tabelas */
.entry-content .wp-block-table{margin:2.2rem 0}
.entry-content .wp-block-table table{
  border-collapse:separate;
  border-spacing:0;
  border:1px solid var(--ha-borda);
  border-radius:14px;
  overflow:hidden;
  font-size:.93rem;
  width:100%;
  background:#fff;
}
.entry-content .wp-block-table thead th{
  background:var(--ha-tinta);
  color:#fff;
  font-weight:600;
  font-size:.78rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  text-align:left;
  padding:.85rem 1rem;
  border:0;
  white-space:nowrap;
}
.entry-content .wp-block-table td{
  padding:.85rem 1rem;
  border:0;
  border-top:1px solid rgba(15,23,42,.07);
  vertical-align:top;
  background:#fff;
}
.entry-content .wp-block-table tbody tr:nth-child(even) td{background:var(--ha-fundo)}
.entry-content .wp-block-table td:first-child{font-weight:600;width:20%;min-width:9rem}

/* Citação usada como CTA */
.entry-content blockquote{
  background:var(--ha-fundo);
  border:1px solid var(--ha-borda);
  border-left:4px solid var(--ha-azul);
  border-radius:12px;
  padding:1.3rem 1.5rem;
  margin:2.5rem 0;
  font-style:normal;
}
.entry-content blockquote p{margin:0}

/* Imagens: limita a altura dos diagramas verticais */
.entry-content figure.wp-block-image img{
  max-height:72vh;
  width:auto;
  margin-inline:auto;
  display:block;
  border-radius:12px;
}
.entry-content figcaption,
.wp-element-caption{
  font-size:.82rem;
  color:var(--ha-cinza);
  text-align:center;
  margin-top:.7rem;
  line-height:1.5;
}

/* Links no corpo */
.entry-content a{color:var(--ha-azul);text-underline-offset:3px}

/* Celular: tabela rola em vez de espremer */
@media (max-width:781px){
  .entry-content .wp-block-table{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .entry-content .wp-block-table table{min-width:34rem}
  .entry-content .wp-block-table td:first-child{min-width:8rem}
}

/* ============================================================
   Título do artigo alinhado ao corpo do texto
   Restrito ao <h1> mesmo (não só a body.single): o padrão "Mais posts"
   do tema pai reusa a classe .wp-block-post-title em <h3> para os
   títulos relacionados no rodapé do artigo — sem o seletor de tag,
   essa regra também pegava esses h3 e descentralizava cada linha de
   um jeito diferente, dependendo do tamanho do título.
   ============================================================ */
body.single .wp-site-blocks h1.wp-block-post-title{
  max-width:820px;
  margin-inline:auto;
}

/* ============================================================
   Barra lateral esquerda — categorias (listagem) e índice (artigo)
   ============================================================ */

/* Container mais largo que o wideSize padrão do tema, para a barra
   ocupar o espaço vazio sem espremer a coluna de leitura. */
.wp-site-blocks .ha-left-layout{
  max-width:1400px;
  margin-inline:auto;
}

.ha-sidebar-col{
  padding-right:1.75rem;
}

.ha-sidebar-title{
  font-size:.78rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--ha-cinza);
  margin:0 0 .8rem;
}

/* Categorias (templates home/index) */
.ha-sidebar-categories{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:.5rem;
}
.ha-sidebar-categories li{margin:0}
.ha-sidebar-categories a{
  display:block;
  color:var(--ha-tinta);
  text-decoration:none;
  font-size:.92rem;
  padding:.4rem .6rem;
  border-radius:8px;
  border-left:2px solid transparent;
}
.ha-sidebar-categories a:hover{
  background:var(--ha-fundo);
  border-left-color:var(--ha-azul);
  color:var(--ha-azul);
}

/* Índice do artigo, fixo ao rolar (template single) */
.ha-toc-container{
  position:sticky;
  top:2rem;
}
.ha-toc{font-size:.86rem}
.ha-toc ul{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:.5rem;
  border-left:2px solid var(--ha-borda);
}
.ha-toc a{
  display:block;
  padding:.3rem 0 .3rem .9rem;
  margin-left:-2px;
  border-left:2px solid transparent;
  color:var(--ha-cinza);
  text-decoration:none;
  line-height:1.4;
}
.ha-toc a:hover{color:var(--ha-tinta)}
.ha-toc a.is-active{
  color:var(--ha-azul);
  border-left-color:var(--ha-azul);
  font-weight:600;
}

/* Celular: sem barra lateral, conteúdo ocupa a tela inteira */
@media (max-width:900px){
  .ha-sidebar-col{display:none}
  .ha-content-col{
    flex-basis:100% !important;
    width:100% !important;
  }
}