/*
Theme Name: BLAA Institucional
Theme URI: https://brambilaleonardo.com/
Author: Brambila e Leonardo Advogados Associados
Description: Tema institucional minimo, fiel ao manual de marca do escritorio. Sem JavaScript, sem fontes externas, sem rastreadores. Feito para as paginas de conteudo em subdiretorio, mantendo a identidade da pagina inicial estatica.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
License: Uso interno do escritorio
Text Domain: blaa
*/

:root{
  --azul:#122C3D;
  --azul-70:#4a5f6f;
  --dourado:#BE954D;        /* cor oficial do manual de marca: decoracao */
  --dourado-texto:#8C6A2F;  /* variante acessivel para texto pequeno: 4,77:1 */
  --dourado-claro:#e6d5b4;
  --papel:#FBFAF8;
  --linha:#e4ded3;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:Tahoma,Verdana,Geneva,sans-serif;
  background:var(--papel);
  color:var(--azul);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:840px;margin:0 auto;padding:0 28px}

/* ---------- pular para o conteudo ---------- */
.pular{
  position:absolute;left:-9999px;top:0;
  background:var(--azul);color:#fff;padding:10px 16px;z-index:99;
}
.pular:focus{left:8px;top:8px}

/* ---------- cabecalho ---------- */
.topo{background:#fff;border-bottom:3px solid var(--dourado);padding:34px 0 26px;text-align:center}
.topo img.logo{width:100%;max-width:280px;height:auto;display:block;margin:0 auto}
.topo .nome{
  font-size:13px;letter-spacing:.04em;color:var(--azul-70);
  margin-top:14px;
}

/* ---------- navegacao ---------- */
.nav{background:#fff;border-bottom:1px solid var(--linha)}
.nav ul{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:4px}
.nav li{margin:0}
.nav a{
  display:inline-block;
  font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:bold;
  color:var(--azul);padding:14px 14px;border-bottom:3px solid transparent;
  text-decoration:none;
}
.nav a:hover{border-bottom-color:var(--dourado)}
.nav .atual > a{border-bottom-color:var(--dourado);color:var(--dourado-texto)}

/* ---------- conteudo ---------- */
main{padding:44px 0 8px}
article,.bloco{margin-bottom:44px}
h1{
  font-size:25px;line-height:1.3;letter-spacing:-.005em;
  margin-bottom:8px;font-weight:bold;
}
.linha-fina{
  font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--dourado-texto);font-weight:bold;margin-bottom:10px;
}
h2{
  font-size:18px;margin:32px 0 12px;padding-bottom:9px;
  border-bottom:1px solid var(--linha);
}
h3{font-size:16px;margin:24px 0 8px}
p{font-size:15.5px;color:var(--azul-70);max-width:66ch}
p+p{margin-top:14px}
ul,ol{margin:12px 0 12px 22px}
li{font-size:15.5px;color:var(--azul-70);margin-bottom:8px;max-width:64ch}
li strong,p strong{color:var(--azul)}
blockquote{
  border-left:4px solid var(--dourado);background:#fff;
  padding:16px 20px;margin:18px 0;
}
blockquote p{margin:0;font-size:15px}
table{width:100%;border-collapse:collapse;margin:16px 0;font-size:14.5px}
th,td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--linha);vertical-align:top}
th{
  font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--dourado-texto);font-weight:bold;
}
img{max-width:100%;height:auto}
figcaption{font-size:13px;color:var(--azul-70);margin-top:6px}
code{background:#f2efe9;padding:1px 5px;border-radius:3px;font-size:13.5px}

a{color:var(--azul);text-decoration:none;border-bottom:1px solid var(--dourado-claro)}
a:hover{border-bottom-color:var(--dourado)}
a:focus-visible{outline:2px solid var(--dourado-texto);outline-offset:3px;border-radius:1px}

/* ---------- lista de paginas ---------- */
.indice{list-style:none;margin:0}
.indice li{
  padding:14px 0 14px 20px;border-bottom:1px solid var(--linha);
  position:relative;max-width:none;
}
.indice li:last-child{border-bottom:none}
.indice li::before{
  content:"";position:absolute;left:0;top:24px;
  width:7px;height:7px;background:var(--dourado);
}
.indice a{font-size:16px;border-bottom:none;font-weight:bold}
.indice .resumo{display:block;font-size:14.5px;color:var(--azul-70);margin-top:3px}

/* ---------- rodape ---------- */
.rodape{
  background:var(--azul);color:#c3cdd5;margin-top:48px;
  padding:36px 0 46px;font-size:12px;line-height:1.8;
}
.rodape p{color:#c3cdd5;font-size:12px;max-width:none}
.rodape a{color:#fff;border-bottom-color:rgba(255,255,255,.35)}
.rodape .razao{color:#fff;font-size:12.5px;letter-spacing:.04em;margin-bottom:16px}
.rodape .razao b{color:var(--dourado)}
.rodape .voltar{margin-bottom:18px}

@media (max-width:520px){
  .topo{padding:26px 0 20px}
  .topo img.logo{max-width:220px}
  h1{font-size:21px}
  .nav a{padding:12px 10px;font-size:11.5px}
}