/* ==========================================================================
   Ornelas Advogados | leitura de artigo e listagem
   ========================================================================== */

/* cabecalho solido fora da home, para o logo branco ter contraste */
.ao-topo-solido{background:var(--ao-vinho-esc);}

/* ---------- topo do artigo ---------- */
.ao-artigo-medida{max-width:70ch;}
.ao-artigo-topo{background:var(--ao-branco);padding-block:clamp(120px,14vw,180px) clamp(30px,4vw,48px);}
.ao-migalha{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--ao-conhaque);margin-bottom:22px;display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
.ao-migalha a{transition:color .3s ease;}
.ao-migalha a:hover{color:var(--ao-vinho);}
.ao-migalha-sep{color:var(--ao-cinza-cl);}
.ao-artigo-topo h1{font-size:clamp(1.85rem,3.2vw,2.65rem);line-height:1.16;letter-spacing:-.008em;font-weight:300;}
.ao-artigo-meta{display:flex;align-items:center;gap:12px;margin-top:22px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ao-cinza);}
.ao-artigo-meta time{font-variant-numeric:tabular-nums;}

/* ---------- capa ---------- */
.ao-artigo-capa{background:var(--ao-branco);}
.ao-artigo-capa img{width:100%;max-height:60vh;object-fit:cover;}

/* ---------- corpo ---------- */
.ao-artigo-corpo{padding-block:clamp(44px,6vw,76px);color:var(--ao-cinza);font-size:17px;font-weight:300;line-height:1.85;}
/* nao reintroduzir "p{margin:0}" abaixo desta regra: anularia o espacamento */
.ao-artigo-corpo > * + *{margin-top:1.2em;}
.ao-artigo-corpo h2 + *,.ao-artigo-corpo h3 + *{margin-top:.85em;}
.ao-artigo-corpo strong{color:var(--ao-vinho);font-weight:500;}
.ao-artigo-corpo em{font-style:italic;}
.ao-artigo-corpo a{color:var(--ao-conhaque);border-bottom:1px solid rgba(169,102,63,.4);transition:border-color .3s ease;}
.ao-artigo-corpo a:hover{border-color:var(--ao-conhaque);}

.ao-artigo-corpo h2{
  font-size:clamp(1.55rem,3vw,2.15rem);line-height:1.2;color:var(--ao-tinta);
  margin-top:2.1em;padding-top:.35em;
}
.ao-artigo-corpo h3{font-size:clamp(1.2rem,2vw,1.45rem);color:var(--ao-vinho);margin-top:1.8em;}

.ao-artigo-corpo ul,.ao-artigo-corpo ol{padding-left:1.15em;display:grid;gap:.6em;}
.ao-artigo-corpo ul li{list-style:none;position:relative;padding-left:20px;}
.ao-artigo-corpo ul li::before{content:"";position:absolute;left:0;top:.72em;width:9px;height:1px;background:var(--ao-conhaque);}
.ao-artigo-corpo ol{counter-reset:ao;padding-left:0;}
.ao-artigo-corpo ol li{list-style:none;counter-increment:ao;position:relative;padding-left:34px;}
.ao-artigo-corpo ol li::before{content:counter(ao);position:absolute;left:0;top:0;font-family:var(--ao-serif);font-size:15px;color:var(--ao-conhaque);}

.ao-artigo-corpo blockquote{
  margin:2em 0;padding:4px 0 4px 26px;border-left:2px solid var(--ao-areia);
  font-family:var(--ao-serif);font-size:clamp(1.25rem,2.2vw,1.6rem);line-height:1.45;
  font-weight:300;color:var(--ao-vinho);
}
.ao-artigo-corpo blockquote p{margin:0;}

/* caixa de destaque legal, usada com a classe no editor */
.ao-artigo-corpo .ao-box{
  background:var(--ao-papel);border-left:2px solid var(--ao-conhaque);
  padding:clamp(22px,3vw,30px);font-size:15px;
}
.ao-artigo-corpo .ao-box p{margin:0;}
.ao-artigo-corpo .ao-box p + p{margin-top:.8em;}

.ao-artigo-corpo figure{margin:2em 0;}
.ao-artigo-corpo figcaption{margin-top:10px;font-size:11.5px;letter-spacing:.06em;color:var(--ao-cinza-cl);}

.ao-artigo-corpo table{width:100%;border-collapse:collapse;font-size:14.5px;}
.ao-artigo-corpo th,.ao-artigo-corpo td{text-align:left;padding:13px 14px;border-bottom:var(--ao-fio);}
.ao-artigo-corpo th{font-family:var(--ao-sans);font-size:10.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--ao-conhaque);}

/* ---------- aviso e chamada ---------- */
.ao-artigo-nota{
  border-top:var(--ao-fio);border-bottom:var(--ao-fio);
  padding-block:clamp(26px,3.4vw,38px);margin-bottom:clamp(50px,7vw,90px);
  display:flex;flex-direction:column;align-items:flex-start;gap:22px;
}
.ao-artigo-nota p{margin:0;font-size:14px;font-weight:300;color:var(--ao-cinza);line-height:1.8;}
.ao-artigo-nota strong{color:var(--ao-vinho);font-weight:500;}

/* ---------- relacionados ---------- */
.ao-relacionados{padding-bottom:clamp(60px,8vw,110px);}
.ao-relacionados-tit{font-size:clamp(1.5rem,2.6vw,2rem);margin-bottom:clamp(24px,3vw,36px);}
.ao-relacionados-grade{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.4vw,30px);}
.ao-relacionados .ao-art h3{padding-bottom:0;}
.ao-relacionados .ao-art .ao-art-mais{padding-top:20px;}

/* ---------- listagem ---------- */
.ao-lista-topo{padding-block:clamp(126px,15vw,186px) clamp(40px,5vw,64px);}
.ao-lista-tit{font-family:var(--ao-serif);font-size:clamp(2.4rem,5.4vw,4rem);font-weight:300;line-height:1.08;}
.ao-artigos-lista{grid-template-columns:repeat(3,1fr);}
.ao-art-capa{display:block;overflow:hidden;aspect-ratio:16/10;background:var(--ao-papel-2);}
.ao-art-capa img{width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.16,1,.3,1);}
a.ao-art:hover .ao-art-capa img{transform:scale(1.05);}
.ao-art-tit{font-family:var(--ao-serif);font-weight:400;padding:14px 26px 0;font-size:1.18rem;line-height:1.32;}
.ao-paginacao{margin-top:clamp(36px,5vw,60px);display:flex;justify-content:center;gap:10px;flex-wrap:wrap;}
.ao-paginacao .page-numbers{
  display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 14px;
  border:1px solid rgba(50,26,32,.18);font-size:12px;letter-spacing:.1em;color:var(--ao-vinho);
  transition:background .3s ease,color .3s ease,border-color .3s ease;
}
.ao-paginacao .page-numbers:hover,.ao-paginacao .page-numbers.current{background:var(--ao-vinho);color:var(--ao-areia);border-color:var(--ao-vinho);}

@media (max-width:1000px){
  .ao-relacionados-grade,.ao-artigos-lista{grid-template-columns:1fr;}
}

.ao-ver-todos{display:flex;align-items:center;gap:10px;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--ao-conhaque);transition:gap .3s ease;}
.ao-ver-todos:hover{gap:16px;}
