/* Comum a todas as páginas: fontes, cores, cabeçalho, rodapé, painel de contato e as páginas internas.
   A página inicial carrega também o site.css (a abertura com a pena). */
@font-face { font-family: "EB Garamond"; src: url(fonts/EBGaramond-Regular.woff2) format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "EB Garamond"; src: url(fonts/EBGaramond-Italic.woff2) format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "EB Garamond"; src: url(fonts/EBGaramond-Medium.woff2) format("woff2"); font-weight: 500 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Jost"; src: url(fonts/Jost-Regular.woff2) format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Jost"; src: url(fonts/Jost-Medium.woff2) format("woff2"); font-weight: 500 700; font-style: normal; font-display: swap; }

:root {
  --bordo: #5C1A24;
  --bordo-claro: #7A2633;
  --marfim: #F5F0E6;
  --tinta: #1F1A1C;
  --tinta-2: #2A2326;
  --latao: #A98455;
  --latao-claro: #C9A777;
  --latao-escuro: #8A6A40;   /* latão sobre o marfim: contraste de texto */
  --pedra: #8A817C;
  --pedra-escura: #5E5753;
  --areia: #E6DDD0;
  --linha-clara: rgba(230, 221, 208, .16);
  --linha-escura: rgba(31, 26, 28, .14);
  --serif: "EB Garamond", Garamond, Georgia, serif;
  --sans: "Jost", "Futura", "Century Gothic", system-ui, sans-serif;
  --lado: max(20px, env(safe-area-inset-left), env(safe-area-inset-right));
  --largura: 1240px;
  --coluna: 700px;
  --altura: 100vh;
  --rotulo: 11px;
  --curva: cubic-bezier(.2, .7, .2, 1);
}
@supports (height: 100dvh) { :root { --altura: 100dvh; } }

/* transição entre páginas (Chrome, Edge, Safari 18): o logotipo e a pena atravessam a navegação */
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .45s; }
@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
}

*, *::before, *::after { box-sizing: border-box; }
html { background: var(--tinta); -webkit-text-size-adjust: 100%; scroll-padding-top: 96px; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0;
  background: var(--tinta);
  color: var(--marfim);
  font-family: var(--serif);
  font-size: 18px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: clip;
}
img, svg, canvas { display: block; }
a { color: inherit; }
p { margin: 0; }
h1, h2, h3 { margin: 0; font-weight: 400; }
ul, ol { margin: 0; padding: 0; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 1px solid var(--latao-claro); outline-offset: 4px; }
.icone { flex: none; }

.pular {
  position: absolute; left: 12px; top: -60px; z-index: 50; padding: 10px 14px;
  background: var(--marfim); color: var(--tinta); font-family: var(--sans); font-size: 13px; text-decoration: none;
}
.pular:focus { top: 12px; }

.rotulo {
  font-family: var(--sans); font-weight: 500; font-size: var(--rotulo); letter-spacing: .26em; text-transform: uppercase;
  color: var(--latao);
}
.rotulo a { text-decoration: none; }
.rotulo--escuro { color: var(--latao-escuro); }

/* ---------- botões e links com seta ---------- */
.botao {
  display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 48px; padding: 0 22px;
  border: 1px solid rgba(169, 132, 85, .7); background: transparent; color: var(--marfim); cursor: pointer;
  font-family: var(--sans); font-weight: 500; font-size: 12px; letter-spacing: .22em; text-transform: uppercase; text-decoration: none;
  transition: background .35s var(--curva), color .35s var(--curva), border-color .35s var(--curva);
}
.botao:hover { background: rgba(169, 132, 85, .14); border-color: var(--latao-claro); }
.botao--cheio { background: var(--latao); border-color: var(--latao); color: var(--tinta); }
.botao--cheio:hover { background: var(--latao-claro); border-color: var(--latao-claro); }
.botao--escuro { color: var(--tinta); border-color: var(--tinta); }
.botao--escuro:hover { background: var(--tinta); color: var(--marfim); }
.botao .icone { width: 18px; height: 18px; transition: transform .35s var(--curva); }
.botao:hover .icone:last-child { transform: translateX(3px); }
.botao[disabled] { opacity: .6; cursor: progress; }
.link-seta {
  display: inline-flex; align-items: center; gap: 10px; min-height: 44px;
  font-family: var(--sans); font-weight: 500; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; text-decoration: none;
  color: var(--latao);
}
.papel .link-seta { color: var(--bordo); }
.link-seta .icone { width: 18px; height: 18px; transition: transform .35s var(--curva); }
.link-seta:hover .icone { transform: translateX(4px); }

/* ---------- cabeçalho ---------- */
.cabecalho {
  position: fixed; top: 0; left: 0; right: 0; z-index: 20;
  padding-top: env(safe-area-inset-top);
  transition: background .4s ease, border-color .4s ease, backdrop-filter .4s ease;
  border-bottom: 1px solid transparent;
}
.cabecalho.rolou {
  background: rgba(31, 26, 28, .86); border-bottom-color: var(--linha-clara);
  -webkit-backdrop-filter: blur(14px) saturate(1.2); backdrop-filter: blur(14px) saturate(1.2);
}
.cabecalho--inicio { position: absolute; }
.cabecalho-faixa {
  display: flex; align-items: center; gap: clamp(16px, 2.6vw, 40px);
  max-width: 1840px; margin: 0 auto; min-height: 72px; padding: 0 var(--lado);
}
.cabecalho--inicio .cabecalho-faixa { justify-content: flex-end; min-height: 64px; padding-inline: max(var(--lado), 7vw); }
.cabecalho-marca { margin-right: auto; display: block; padding: 10px 0; }
.cabecalho-marca img { width: clamp(140px, 15vw, 188px); height: auto; view-transition-name: marca; }
.nav ul { list-style: none; display: flex; align-items: center; gap: clamp(18px, 2.4vw, 36px); }
.nav a, .nav-restrita {
  position: relative; display: inline-flex; align-items: center; min-height: 44px;
  font-family: var(--sans); font-weight: 500; font-size: var(--rotulo); letter-spacing: .24em; text-transform: uppercase;
  text-decoration: none; color: var(--areia);
}
.nav a::after, .nav-restrita::after {
  content: ""; position: absolute; left: 0; right: .24em; bottom: 11px; height: 1px;
  background: var(--latao); transform: scaleX(0); transform-origin: left center; transition: transform .45s var(--curva);
}
.nav a:hover::after, .nav-restrita:hover::after, .nav a[aria-current]::after { transform: scaleX(1); }
.nav a[aria-current] { color: var(--marfim); }
.nav-contato { color: var(--marfim) !important; }
.nav-restrita { color: var(--pedra); padding-left: clamp(16px, 2vw, 30px); border-left: 1px solid var(--linha-clara); }
.nav-curto { display: none; }
.cabecalho--inicio .nav-item-contato { display: none; }
.nav-menu {
  display: none; align-items: center; min-height: 44px; padding: 0 0 0 12px; margin-left: auto;
  border: 0; background: none; cursor: pointer;
  font-family: var(--sans); font-weight: 500; font-size: var(--rotulo); letter-spacing: .26em; text-transform: uppercase; color: var(--areia);
}
.nav-menu::before { content: ""; width: 22px; height: 7px; margin-right: 12px; border-top: 1px solid currentColor; border-bottom: 1px solid currentColor; }
@media (max-width: 1080px) { .nav-longo { display: none; } .nav-curto { display: inline; } }
@media (max-width: 820px) {
  .nav, .nav-restrita { display: none; }
  .nav-menu { display: inline-flex; }
}

/* ---------- menu do celular ---------- */
.menu {
  position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0;
  background: var(--tinta); color: var(--marfim);
}
.menu::backdrop { background: var(--tinta); }
.menu[open] { display: flex; }
.menu-caixa {
  display: flex; flex-direction: column; width: 100%; min-height: 100%;
  padding: calc(env(safe-area-inset-top) + 76px) var(--lado) calc(env(safe-area-inset-bottom) + 28px);
  background: radial-gradient(120% 70% at 85% 0%, rgba(92, 26, 36, .45), transparent 60%);
}
.menu-fechar, .painel-fechar {
  position: absolute; top: calc(env(safe-area-inset-top) + 12px); right: var(--lado);
  display: grid; place-items: center; width: 48px; height: 48px; border: 0; background: none; cursor: pointer; color: var(--areia);
}
.menu-fechar .icone, .painel-fechar .icone { width: 24px; height: 24px; }
.menu-lista { list-style: none; }
.menu-lista li { border-bottom: 1px solid var(--linha-clara); }
.menu-lista a {
  display: block; padding: 14px 0; text-decoration: none;
  font-size: clamp(30px, 9vw, 44px); line-height: 1.15; font-style: italic; color: var(--marfim);
}
.menu-lista a[aria-current] { color: var(--latao-claro); }
.menu[open] .menu-lista li { animation: menu-entra .55s var(--curva) both; }
.menu[open] .menu-lista li:nth-child(2) { animation-delay: .04s; }
.menu[open] .menu-lista li:nth-child(3) { animation-delay: .08s; }
.menu[open] .menu-lista li:nth-child(4) { animation-delay: .12s; }
.menu[open] .menu-lista li:nth-child(5) { animation-delay: .16s; }
@keyframes menu-entra { from { opacity: 0; transform: translateY(14px); } }
.menu-pe { margin-top: auto; padding-top: 28px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.menu-restrita { font-family: var(--sans); font-weight: 500; font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--pedra); text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; }

/* ---------- redes ---------- */
.redes { list-style: none; display: flex; gap: 6px; }
.redes a { display: grid; place-items: center; width: 44px; height: 44px; color: var(--areia); opacity: .8; transition: opacity .3s ease, color .3s ease; }
.redes a:hover { opacity: 1; color: var(--latao-claro); }
.redes .icone { width: 20px; height: 20px; }
.redes--escuro a { color: var(--tinta); opacity: .7; }
.redes--escuro a:hover { color: var(--bordo); opacity: 1; }

/* ---------- rodapé ---------- */
.rodape { position: relative; background: var(--tinta); border-top: 1px solid rgba(169, 132, 85, .3); color: var(--areia); }
.rodape-faixa {
  display: grid; grid-template-columns: 1.3fr 1fr 1.2fr 1.3fr; gap: clamp(28px, 4vw, 64px);
  max-width: var(--largura); margin: 0 auto; padding: clamp(48px, 7vw, 88px) var(--lado) 40px;
}
.rodape-marca img { width: 34px; height: auto; margin-bottom: 18px; }
.rodape-nome { font-size: 22px; color: var(--marfim); }
.rodape-oab { margin-top: 6px; font-family: var(--sans); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; line-height: 1.8; color: var(--latao); }
.rodape-redes { margin: 14px 0 0 -12px; }
.rodape-titulo { margin-bottom: 14px; font-family: var(--sans); font-weight: 500; font-size: 11px; letter-spacing: .26em; text-transform: uppercase; color: var(--pedra); }
.rodape-col ul { list-style: none; }
.rodape-col li a { display: inline-flex; align-items: center; min-height: 36px; text-decoration: none; font-size: 16px; color: var(--areia); transition: color .3s ease; overflow-wrap: anywhere; }
.rodape-col li a:hover { color: var(--latao-claro); }
.rodape-endereco address { font-style: normal; font-size: 16px; line-height: 1.6; }
.rodape-aviso { margin-top: 14px; font-style: italic; font-size: 15px; line-height: 1.5; color: var(--pedra); }
.rodape-base {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px;
  max-width: var(--largura); margin: 0 auto; padding: 22px var(--lado) calc(env(safe-area-inset-bottom) + 26px);
  border-top: 1px solid var(--linha-clara);
  font-family: var(--sans); font-size: 12px; letter-spacing: .04em; color: var(--pedra);
}
.rodape-base a { color: var(--areia); text-underline-offset: 3px; }
@media (max-width: 960px) { .rodape-faixa { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .rodape-faixa { grid-template-columns: 1fr; } }

/* ---------- painel de contato ---------- */
.painel {
  width: min(560px, 100% - 32px); max-width: none; max-height: min(92dvh, 860px); margin: auto; padding: 0; border: 0;
  background: transparent; color: var(--marfim); overflow: visible;
}
.painel::backdrop { background: rgba(18, 14, 16, .62); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.painel-caixa {
  position: relative; max-height: min(92dvh, 860px); overflow-y: auto; overscroll-behavior: contain;
  padding: 40px clamp(22px, 5vw, 44px) 36px;
  background:
    radial-gradient(120% 60% at 100% 0%, rgba(92, 26, 36, .5), transparent 60%),
    var(--tinta);
  border: 1px solid rgba(169, 132, 85, .4);
  box-shadow: 0 40px 120px rgba(0, 0, 0, .55);
}
.painel[open] .painel-caixa { animation: painel-entra .5s var(--curva); }
.painel[open]::backdrop { animation: some-entra .4s ease; }
@keyframes painel-entra { from { opacity: 0; transform: translateY(18px) scale(.985); } }
@keyframes some-entra { from { opacity: 0; } }
.painel-fechar { position: absolute; top: 10px; right: 10px; }
.painel-titulo { margin-top: 10px; font-size: clamp(28px, 6vw, 36px); line-height: 1.12; font-style: italic; outline: none; }
.painel-texto { margin-top: 10px; color: var(--areia); font-size: 17px; line-height: 1.5; }
.painel-vista[hidden] { display: none; }
.painel-vista { animation: vista-entra .4s var(--curva); }
@keyframes vista-entra { from { opacity: 0; transform: translateX(10px); } }
.opcoes { display: grid; gap: 12px; margin-top: 26px; }
.opcao {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 16px; width: 100%;
  padding: 18px 18px; border: 1px solid var(--linha-clara); background: rgba(245, 240, 230, .03);
  text-align: left; text-decoration: none; cursor: pointer; color: var(--marfim);
  transition: border-color .35s var(--curva), background .35s var(--curva);
}
.opcao:hover { border-color: rgba(169, 132, 85, .8); background: rgba(169, 132, 85, .08); }
.opcao-icone { display: grid; place-items: center; width: 46px; height: 46px; border: 1px solid rgba(169, 132, 85, .5); border-radius: 50%; color: var(--latao-claro); }
.opcao-icone .icone { width: 22px; height: 22px; }
.opcao-nome { display: block; font-family: var(--sans); font-weight: 500; font-size: 13px; letter-spacing: .2em; text-transform: uppercase; }
.opcao-desc { display: block; margin-top: 4px; font-size: 16px; line-height: 1.4; color: var(--areia); }
.opcao-seta { color: var(--latao); transition: transform .35s var(--curva); }
.opcao:hover .opcao-seta { transform: translateX(4px); }
.painel-vcf { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; margin-top: 18px; color: var(--pedra); font-family: var(--sans); font-size: 13px; letter-spacing: .06em; text-underline-offset: 4px; }
.painel-vcf .icone { width: 18px; height: 18px; }
.painel-voltar {
  display: inline-flex; align-items: center; gap: 8px; min-height: 40px; margin: -8px 0 4px; padding: 0; border: 0; background: none; cursor: pointer;
  font-family: var(--sans); font-weight: 500; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--latao);
}
.painel-voltar .icone { width: 16px; height: 16px; }
.painel-enviado { text-align: center; padding: 18px 0 4px; }
.painel-enviado img { margin: 0 auto 8px; }
.painel-frase { margin: 18px 0 24px; font-style: italic; color: var(--latao-claro); font-size: 20px; }
/* celular: o painel sobe da borda de baixo */
@media (max-width: 600px) {
  .painel { width: 100%; margin: auto 0 0; max-height: 94dvh; }
  .painel-caixa { max-height: 94dvh; border-width: 1px 0 0; padding-bottom: calc(env(safe-area-inset-bottom) + 28px); }
  .painel[open] .painel-caixa { animation: painel-sobe .5s var(--curva); }
}
@keyframes painel-sobe { from { transform: translateY(40px); opacity: 0; } }

/* ---------- formulário ---------- */
.formulario { display: grid; gap: 18px; margin-top: 24px; }
.campos-dois { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
@media (max-width: 520px) { .campos-dois { grid-template-columns: 1fr; } }
.campo label, .escolha legend {
  display: block; margin-bottom: 6px; padding: 0;
  font-family: var(--sans); font-weight: 500; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--latao);
}
.campo input, .campo textarea {
  width: 100%; padding: 12px 0 10px; border: 0; border-bottom: 1px solid rgba(230, 221, 208, .3); border-radius: 0;
  background: transparent; color: var(--marfim); font: inherit; font-size: 18px; line-height: 1.4;
  transition: border-color .3s ease;
}
.campo textarea { resize: vertical; min-height: 120px; }
.campo input::placeholder, .campo textarea::placeholder { color: rgba(230, 221, 208, .38); }
.campo input:focus, .campo textarea:focus { outline: none; border-bottom-color: var(--latao-claro); }
.campo input[aria-invalid="true"], .campo textarea[aria-invalid="true"] { border-bottom-color: #D9826F; }
.campo-dica { margin-top: 6px; font-size: 14px; color: var(--pedra); font-style: italic; }
.escolha { margin: 0; padding: 0; border: 0; min-width: 0; }
.escolha-opcoes { display: flex; flex-wrap: wrap; gap: 8px; }
.pilula { position: relative; cursor: pointer; }
.pilula input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.pilula span {
  display: inline-flex; align-items: baseline; gap: 6px; min-height: 40px; padding: 9px 14px;
  border: 1px solid rgba(230, 221, 208, .28); font-family: var(--sans); font-size: 13px; letter-spacing: .04em; color: var(--areia);
  transition: background .3s ease, border-color .3s ease, color .3s ease;
}
.pilula small { font-size: 11px; color: var(--pedra); }
.pilula:hover span { border-color: rgba(169, 132, 85, .8); }
.pilula input:checked + span { background: var(--latao); border-color: var(--latao); color: var(--tinta); }
.pilula input:checked + span small { color: rgba(31, 26, 28, .7); }
.pilula input:focus-visible + span { outline: 1px solid var(--latao-claro); outline-offset: 3px; }
.isca { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.aceite { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: start; font-size: 15px; line-height: 1.45; color: var(--areia); cursor: pointer; }
.aceite input { width: 18px; height: 18px; margin: 3px 0 0; accent-color: var(--latao); }
.aceite a { color: var(--latao-claro); text-underline-offset: 3px; }
.campo-erro { margin-top: 8px; font-size: 15px; line-height: 1.4; color: #E79A86; }
.papel .campo-erro { color: #9A2E22; }
.formulario-erro { padding: 12px 14px; border-left: 2px solid #D9826F; background: rgba(217, 130, 111, .1); font-size: 16px; color: var(--marfim); }
.formulario-erro a { color: var(--latao-claro); }
.formulario .botao { justify-self: start; min-width: 180px; }
/* o formulário sobre o papel (página /contato) */
.papel .campo label, .papel .escolha legend { color: var(--latao-escuro); }
.papel .campo input, .papel .campo textarea { color: var(--tinta); border-bottom-color: rgba(31, 26, 28, .28); }
.papel .campo input::placeholder, .papel .campo textarea::placeholder { color: rgba(31, 26, 28, .38); }
.papel .campo input:focus, .papel .campo textarea:focus { border-bottom-color: var(--bordo); }
.papel .campo-dica { color: var(--pedra-escura); }
.papel .pilula span { border-color: rgba(31, 26, 28, .25); color: var(--tinta); }
.papel .pilula small { color: var(--pedra-escura); }
.papel .pilula input:checked + span { background: var(--tinta); border-color: var(--tinta); color: var(--marfim); }
.papel .pilula input:checked + span small { color: var(--areia); }
.papel .aceite { color: var(--tinta); }
.papel .aceite input { accent-color: var(--bordo); }
.papel .aceite a { color: var(--bordo); }
.papel .formulario-erro { color: var(--tinta); }
.papel .formulario-erro a { color: var(--bordo); }

/* ---------- topo das páginas internas ---------- */
.heroi {
  position: relative; isolation: isolate; overflow: hidden;
  min-height: min(68vh, 640px); display: flex; align-items: flex-end;
  padding: calc(env(safe-area-inset-top) + 120px) 0 clamp(48px, 7vw, 88px);
  background:
    radial-gradient(90% 80% at 85% 10%, rgba(92, 26, 36, .7), transparent 62%),
    radial-gradient(60% 60% at 10% 100%, rgba(169, 132, 85, .14), transparent 70%),
    var(--tinta);
}
.heroi::after {
  content: ""; position: absolute; inset: auto 0 0; height: 40%; z-index: -1; pointer-events: none;
  background: linear-gradient(to bottom, transparent, rgba(31, 26, 28, .85));
}
.vfx { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; opacity: 0; transition: opacity 1.6s ease; }
.vfx.pronto { opacity: 1; }
.heroi-faixa { position: relative; width: 100%; max-width: var(--largura); margin: 0 auto; padding: 0 var(--lado); }
.heroi-rotulo { margin-bottom: 18px; }
.heroi-titulo {
  max-width: 16ch; font-size: clamp(40px, 6.4vw, 88px); line-height: 1.02; letter-spacing: -.012em; color: var(--marfim);
  text-wrap: balance;
}
.heroi--artigo .heroi-titulo { max-width: 24ch; font-size: clamp(34px, 4.8vw, 64px); line-height: 1.08; }
.heroi-lead { max-width: 40em; margin-top: 22px; font-style: italic; font-size: clamp(19px, 2vw, 25px); line-height: 1.4; color: var(--areia); text-wrap: pretty; }
.heroi-meta { margin-top: 26px; font-family: var(--sans); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--pedra); }
.heroi-meta a { color: var(--areia); text-decoration: none; }
.heroi-acoes { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.heroi-indice { display: flex; flex-wrap: wrap; gap: 8px 28px; margin-top: 34px; }
.heroi-indice a { font-family: var(--sans); font-weight: 500; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--areia); text-decoration: none; min-height: 40px; display: inline-flex; align-items: center; border-bottom: 1px solid rgba(169, 132, 85, .5); }
.heroi-indice a:hover { color: var(--latao-claro); }
.migalhas ol { list-style: none; display: flex; flex-wrap: wrap; gap: 4px 0; margin-bottom: 28px; font-family: var(--sans); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--pedra); }
.migalhas li + li::before { content: "/"; margin: 0 10px; color: rgba(138, 129, 124, .6); }
.migalhas a { color: var(--areia); text-decoration: none; }
.migalhas a:hover { color: var(--latao-claro); }
.migalhas [aria-current] { color: var(--pedra); }
.pagina-curta .heroi { min-height: calc(var(--altura) - 120px); }

/* sobre: o topo ocupa a tela; a pena vem da página inicial (mesmo nome de transição) */
.heroi--sobre { min-height: var(--altura); }
.heroi-pena {
  position: absolute; z-index: -1; right: max(var(--lado), 5vw); top: 50%; width: min(34vw, 420px); aspect-ratio: 1142 / 1486;
  transform: translateY(-50%); pointer-events: none;
}
.heroi-pena img { width: 100%; height: 100%; object-fit: contain; view-transition-name: pena; filter: drop-shadow(0 30px 60px rgba(0, 0, 0, .45)); }
/* o texto do topo não passa por baixo da pena: fica à esquerda dela */
@media (min-width: 761px) { .heroi--sobre .heroi-titulo, .heroi--sobre .heroi-lead { max-width: min(40em, 46vw); } }
@media (max-width: 760px) {
  .heroi--sobre { align-items: flex-end; }
  /* a pena fica acima do texto, sem cobrir migalhas nem título: a folga é a altura dela (1486/1142) mais 32px */
  .heroi-pena { top: 0; right: 50%; transform: translateX(50%); width: min(44vw, 220px); opacity: .9; }
  .heroi--sobre .heroi-faixa { padding-top: calc(min(44vw, 220px) * 1.3013 + 32px); }
}

/* ---------- superfícies: papel (marfim) e escuro ---------- */
.papel { position: relative; background: var(--marfim); color: var(--tinta); }
.papel--areia { background: #EDE5D8; }
.escuro { position: relative; isolation: isolate; overflow: hidden; background: var(--tinta); color: var(--marfim); }
.faixa { max-width: var(--largura); margin: 0 auto; padding: clamp(56px, 8vw, 112px) var(--lado); }
.faixa--estreita { max-width: calc(var(--coluna) + 2 * 24px); }
.faixa--duas { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
@media (max-width: 860px) { .faixa--duas { grid-template-columns: 1fr; } }
.titulo-secao { font-size: clamp(32px, 4vw, 52px); line-height: 1.08; letter-spacing: -.01em; text-wrap: balance; }
.cabeca-secao { margin-bottom: clamp(32px, 5vw, 56px); }
.cabeca-secao .rotulo { margin-bottom: 14px; }
.faixa--duas .rotulo { margin-bottom: 14px; }
.escuro .titulo-secao { color: var(--marfim); }

/* ---------- texto corrido ---------- */
.prosa { font-size: 19px; line-height: 1.72; color: #2C2528; }
.prosa > * + * { margin-top: 1.05em; }
.prosa h2 { margin-top: 2.1em; font-size: clamp(27px, 3vw, 34px); line-height: 1.18; color: var(--tinta); }
.prosa h3 { margin-top: 1.7em; font-size: 22px; line-height: 1.3; font-weight: 500; color: var(--tinta); }
.prosa h2 + *, .prosa h3 + * { margin-top: .6em; }
.prosa a { color: var(--bordo); text-decoration-color: rgba(92, 26, 36, .4); text-underline-offset: 3px; text-decoration-thickness: 1px; }
.prosa a:hover { text-decoration-color: var(--bordo); }
.prosa strong { font-weight: 500; color: var(--tinta); }
.prosa ul, .prosa ol { padding-left: 1.3em; }
.prosa li + li { margin-top: .45em; }
.prosa li::marker { color: var(--latao-escuro); }
.prosa blockquote { margin: 1.5em 0; padding: 4px 0 4px 22px; border-left: 2px solid var(--latao); font-style: italic; color: var(--tinta); }
.prosa hr { border: 0; height: 1px; background: var(--linha-escura); margin: 2.4em 0; }
.prosa code { font-family: ui-monospace, monospace; font-size: .85em; }
.prosa--curta > p:first-child { font-size: 22px; line-height: 1.55; color: var(--tinta); }
.tabela { overflow-x: auto; margin: 1.6em 0; border-top: 1px solid var(--tinta); }
.tabela table { width: 100%; border-collapse: collapse; font-size: 16px; line-height: 1.45; }
.tabela th { text-align: left; font-family: var(--sans); font-weight: 500; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--latao-escuro); padding: 14px 14px 10px 0; }
.tabela td { padding: 12px 14px 12px 0; border-top: 1px solid var(--linha-escura); vertical-align: top; }
.aviso-informativo { margin-top: 2.4em; padding-top: 16px; border-top: 1px solid var(--linha-escura); font-size: 15px; font-style: italic; line-height: 1.5; color: var(--pedra-escura); }

/* ---------- artigo ---------- */
.faixa--artigo { display: grid; grid-template-columns: 250px minmax(0, var(--coluna)); justify-content: center; gap: clamp(40px, 6vw, 96px); align-items: start; }
.artigo-lado { position: sticky; top: 100px; display: grid; gap: 34px; font-family: var(--sans); }
.indice summary { cursor: pointer; list-style: none; margin-bottom: 12px; font-weight: 500; font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--latao-escuro); }
.indice summary::-webkit-details-marker { display: none; }
.indice ol { list-style: none; counter-reset: i; display: grid; gap: 2px; border-left: 1px solid var(--linha-escura); }
.indice li { counter-increment: i; }
.indice a { display: block; padding: 6px 0 6px 16px; margin-left: -1px; border-left: 1px solid transparent; font-size: 14px; line-height: 1.4; color: var(--pedra-escura); text-decoration: none; transition: color .3s ease, border-color .3s ease; }
.indice a:hover, .indice a.ativo { color: var(--tinta); border-left-color: var(--bordo); }
.compartilhar ul { list-style: none; display: flex; gap: 4px; margin: 10px 0 0 -12px; }
.compartilhar a, .compartilhar button { display: grid; place-items: center; width: 44px; height: 44px; border: 0; background: none; cursor: pointer; color: var(--tinta); opacity: .7; }
.compartilhar a:hover, .compartilhar button:hover { opacity: 1; color: var(--bordo); }
.compartilhar .icone { width: 20px; height: 20px; }
.copiado { min-height: 20px; font-size: 13px; color: var(--bordo); }
.prosa--artigo > p:first-child { font-size: 22px; line-height: 1.6; color: var(--tinta); }
.prosa--artigo > p:first-child::first-letter {
  float: left; margin: .08em .1em 0 0; font-size: 3.4em; line-height: .78; color: var(--bordo);
}
@media (max-width: 980px) {
  .faixa--artigo { grid-template-columns: minmax(0, var(--coluna)); }
  .artigo-lado { position: static; order: 2; grid-template-columns: 1fr; }
  .indice { order: -1; }
  .faixa--artigo .indice { display: none; }
}
.faixa--autor { padding-top: 0; }
.autor {
  display: grid; grid-template-columns: auto 1fr; gap: 24px; align-items: start; max-width: calc(var(--coluna) + 250px + 96px); margin: 0 auto;
  padding: 32px; background: #EDE5D8; border-left: 2px solid var(--latao);
}
.autor-simbolo { width: 34px; height: auto; filter: brightness(.25) sepia(1) hue-rotate(-20deg) saturate(2.4); }
.autor-nome { margin-top: 6px; font-size: 26px; }
.autor-nome a { text-decoration: none; }
.autor-texto { margin-top: 6px; font-size: 17px; color: #4A4245; }
.autor .redes { margin: 8px 0 0 -12px; }

/* ---------- cartões do blog ---------- */
.grade-cartoes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 clamp(24px, 3vw, 48px); }
@media (max-width: 980px) { .grade-cartoes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .grade-cartoes { grid-template-columns: 1fr; } }
.cartao { border-top: 1px solid var(--linha-escura); }
.cartao[hidden] { display: none; }
.cartao-link { display: block; height: 100%; padding: 26px 0 34px; text-decoration: none; color: inherit; }
.cartao-area { font-family: var(--sans); font-weight: 500; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--latao-escuro); }
.cartao-titulo { margin-top: 12px; font-size: 25px; line-height: 1.2; color: var(--tinta); transition: color .3s ease; text-wrap: balance; }
.cartao-resumo { margin-top: 12px; font-size: 17px; line-height: 1.5; color: #4A4245; }
.cartao-meta { margin-top: 16px; font-family: var(--sans); font-size: 12px; letter-spacing: .06em; color: var(--pedra-escura); }
.cartao-link:hover .cartao-titulo { color: var(--bordo); }
.cartao-titulo { background: linear-gradient(var(--bordo), var(--bordo)) 0 100% / 0 1px no-repeat; transition: background-size .5s var(--curva), color .3s ease; display: inline; }
.cartao-link:hover .cartao-titulo { background-size: 100% 1px; }
.destaque { margin-bottom: clamp(24px, 4vw, 48px); }
.cartao--destaque { border-top: 2px solid var(--tinta); }
.cartao--destaque .cartao-link { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 12px clamp(24px, 5vw, 80px); padding: 34px 0 40px; }
.cartao--destaque .cartao-area { grid-column: 1 / -1; }
.cartao--destaque .cartao-titulo { font-size: clamp(32px, 4vw, 50px); line-height: 1.08; grid-column: 1; }
.cartao--destaque .cartao-resumo { grid-column: 2; grid-row: 2; margin-top: 4px; font-size: 19px; align-self: end; }
.cartao--destaque .cartao-meta { grid-column: 2; }
@media (max-width: 760px) {
  .cartao--destaque .cartao-link { grid-template-columns: 1fr; }
  .cartao--destaque .cartao-resumo, .cartao--destaque .cartao-meta { grid-column: 1; grid-row: auto; }
}
.filtro { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: clamp(28px, 4vw, 48px); }
.filtro[hidden] { display: none; }
.pilula-filtro {
  min-height: 40px; padding: 8px 16px; border: 1px solid rgba(31, 26, 28, .22); background: none; cursor: pointer;
  font-family: var(--sans); font-size: 13px; letter-spacing: .04em; color: var(--tinta); transition: background .3s ease, color .3s ease, border-color .3s ease;
}
.pilula-filtro:hover { border-color: var(--tinta); }
.pilula-filtro[aria-pressed="true"] { background: var(--tinta); border-color: var(--tinta); color: var(--marfim); }
.vazio { padding: 40px 0; font-style: italic; color: var(--pedra-escura); }
.relacionados { padding-top: 0; }
.relacionados .link-seta { margin-top: 24px; }

/* ---------- áreas ---------- */
.nucleo + .nucleo .faixa { border-top: 1px solid var(--linha-escura); }
.faixa--nucleo { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(28px, 5vw, 80px); align-items: start; }
.nucleo-cabeca { position: sticky; top: 110px; }
.nucleo-cabeca .rotulo { margin-bottom: 12px; }
.nucleo-texto { margin-top: 16px; font-size: 18px; color: #4A4245; }
@media (max-width: 860px) { .faixa--nucleo { grid-template-columns: 1fr; } .nucleo-cabeca { position: static; } }
.linhas-areas { list-style: none; }
.linhas-areas li { border-top: 1px solid var(--linha-escura); }
.linhas-areas li:last-child { border-bottom: 1px solid var(--linha-escura); }
.linhas-areas a {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 24px; padding: 26px 0; text-decoration: none; color: inherit;
}
.linha-nome { font-size: clamp(26px, 3vw, 36px); line-height: 1.1; color: var(--tinta); transition: color .3s ease, transform .5s var(--curva); }
.linha-resumo { grid-column: 1; font-size: 17px; line-height: 1.5; color: #4A4245; max-width: 46em; }
.linha-meta { grid-column: 1; font-family: var(--sans); font-size: 12px; letter-spacing: .08em; color: var(--pedra-escura); }
.linha-seta { grid-column: 2; grid-row: 1 / span 3; align-self: center; display: grid; place-items: center; width: 52px; height: 52px; border: 1px solid var(--linha-escura); border-radius: 50%; color: var(--bordo); transition: background .35s var(--curva), color .35s var(--curva), transform .35s var(--curva); }
.linhas-areas a:hover .linha-nome { color: var(--bordo); transform: translateX(6px); }
.linhas-areas a:hover .linha-seta { background: var(--bordo); color: var(--marfim); transform: rotate(-35deg); }
.faixa--area { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
@media (max-width: 900px) { .faixa--area { grid-template-columns: 1fr; } }
.faixa--area .prosa > p:first-child { font-size: 22px; line-height: 1.55; color: var(--tinta); }
.servicos { position: sticky; top: 100px; padding: 32px; background: #EDE5D8; border-top: 2px solid var(--bordo); }
.servicos ul { list-style: none; margin: 16px 0 26px; }
.servicos li { padding: 11px 0; border-bottom: 1px solid var(--linha-escura); font-size: 17px; line-height: 1.4; }
.servicos .botao { width: 100%; }
@media (max-width: 900px) { .servicos { position: static; } }
.perguntas { padding-top: 0; max-width: calc(var(--coluna) + 2 * 24px + 300px); }
.perguntas .titulo-secao { margin-bottom: 24px; }
.pergunta { border-top: 1px solid var(--linha-escura); }
.pergunta:last-of-type { border-bottom: 1px solid var(--linha-escura); }
.pergunta summary { position: relative; cursor: pointer; list-style: none; padding: 22px 56px 22px 0; font-size: 22px; line-height: 1.3; }
.pergunta summary::-webkit-details-marker { display: none; }
.pergunta summary::after { content: ""; position: absolute; right: 8px; top: 50%; width: 14px; height: 14px; margin-top: -9px; border-right: 1px solid var(--bordo); border-bottom: 1px solid var(--bordo); transform: rotate(45deg); transition: transform .35s var(--curva); }
.pergunta[open] summary::after { transform: rotate(225deg); margin-top: -2px; }
.pergunta p { padding: 0 56px 24px 0; font-size: 18px; line-height: 1.65; color: #3A3235; }
.vizinhas { padding-top: 0; }
.vizinhas ul { list-style: none; display: flex; flex-wrap: wrap; gap: 10px 32px; margin-top: 14px; }
.vizinhas a { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font-size: 21px; color: var(--tinta); text-decoration: none; border-bottom: 1px solid var(--linha-escura); }
.vizinhas a:hover { color: var(--bordo); border-bottom-color: var(--bordo); }
.vizinhas .icone { width: 16px; height: 16px; }

/* ---------- sobre ---------- */
.sobre-oab { margin-top: 10px; font-family: var(--sans); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--latao-escuro); }
.faixa--duas .redes { margin: 14px 0 0 -12px; }
.numeros { background: var(--tinta); border-block: 1px solid rgba(169, 132, 85, .25); }
.numeros-grade { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; padding-block: clamp(48px, 6vw, 80px); }
@media (max-width: 860px) { .numeros-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.numero-valor { font-size: clamp(56px, 7vw, 96px); line-height: 1; color: var(--latao-claro); font-variant-numeric: lining-nums tabular-nums; }
.numero-rotulo { margin-top: 12px; font-family: var(--sans); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--areia); max-width: 16em; line-height: 1.6; }
.metodo { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--tinta); }
@media (max-width: 960px) { .metodo { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .metodo { grid-template-columns: 1fr; } }
.metodo li { padding: 28px 28px 36px 0; border-bottom: 1px solid var(--linha-escura); }
.metodo-n { display: block; font-family: var(--sans); font-weight: 500; font-size: 12px; letter-spacing: .2em; color: var(--latao-escuro); }
.metodo h3 { margin-top: 18px; font-size: 30px; font-style: italic; }
.metodo p { margin-top: 10px; font-size: 17px; line-height: 1.55; color: #4A4245; }
.vfx--suave { opacity: 0; }
.vfx--suave.pronto { opacity: .55; }
.principios { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(32px, 6vw, 96px); }
@media (max-width: 760px) { .principios { grid-template-columns: 1fr; } }
.principio { padding: 30px 0; border-top: 1px solid var(--linha-clara); }
.principio h3 { font-size: 32px; font-style: italic; color: var(--latao-claro); }
.principio p { margin-top: 10px; font-size: 18px; line-height: 1.6; color: var(--areia); max-width: 34em; }
.parcerias { list-style: none; display: grid; gap: 0; }
.parcerias li { padding: 26px 0; border-top: 1px solid var(--linha-escura); }
.parcerias li:last-child { border-bottom: 1px solid var(--linha-escura); }
.parceria-nome { font-size: 28px; line-height: 1.2; }
.parcerias p + p { margin-top: 8px; font-size: 17px; color: #4A4245; }
.parcerias .link-seta { margin-top: 6px; }

/* ---------- contato ---------- */
.faixa--contato { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
@media (max-width: 900px) { .faixa--contato { grid-template-columns: 1fr; } }
.contato-canais { display: grid; gap: 12px; }
.canal { display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: center; padding: 18px 20px; border: 1px solid var(--linha-escura); text-decoration: none; color: var(--tinta); transition: border-color .3s ease, background .3s ease; }
.canal:hover { border-color: var(--bordo); background: rgba(92, 26, 36, .04); }
.canal .icone { width: 24px; height: 24px; color: var(--bordo); }
.canal span { font-size: 17px; overflow-wrap: anywhere; }
.canal strong { display: block; font-family: var(--sans); font-weight: 500; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--latao-escuro); }
.contato-endereco { margin-top: 20px; }
.contato-endereco .rotulo { margin-bottom: 10px; }
.contato-endereco address { font-style: normal; font-size: 17px; line-height: 1.6; }
.contato-endereco .aviso-informativo { margin-top: 12px; }
.contato-intro { margin-top: 12px; font-size: 18px; color: #4A4245; }
.formulario-enviado { margin-top: 24px; padding: 28px; background: #EDE5D8; border-left: 2px solid var(--latao); }
.formulario-enviado h3 { font-size: 28px; font-style: italic; }
.formulario-enviado p { margin-top: 8px; }

/* ---------- faixa de fechamento ---------- */
.chamada { position: relative; overflow: hidden; background: var(--tinta); border-top: 1px solid rgba(169, 132, 85, .25); }
.chamada::before { content: ""; position: absolute; inset: 0; background: radial-gradient(70% 90% at 80% 100%, rgba(92, 26, 36, .55), transparent 70%); pointer-events: none; }
.chamada-faixa { position: relative; max-width: var(--largura); margin: 0 auto; padding: clamp(64px, 9vw, 128px) var(--lado); }
.chamada-frase { margin-top: 16px; max-width: 18ch; font-size: clamp(40px, 6vw, 80px); line-height: 1.02; font-style: italic; color: var(--marfim); }
.chamada-texto { margin-top: 22px; max-width: 34em; font-size: 19px; line-height: 1.55; color: var(--areia); }
.chamada-botoes { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }

/* ---------- revelação ao rolar (só com JS e sem "reduzir movimento") ---------- */
/* a transição mora só no estado visível: marcar a página (no <head>) não faz nada sumir aos olhos de ninguém */
.com-revela .revela { opacity: 0; transform: translateY(22px); }
.com-revela .revela.visivel { opacity: 1; transform: none; transition: opacity 1s ease, transform 1.1s var(--curva); }
.com-revela .revela.visivel:nth-child(2) { transition-delay: .06s; }
.com-revela .revela.visivel:nth-child(3) { transition-delay: .12s; }
.com-revela .revela.visivel:nth-child(4) { transition-delay: .18s; }

@media print {
  .cabecalho, .rodape, .chamada, .painel, .menu, .artigo-lado, .vfx { display: none !important; }
  body, .papel { background: #fff; color: #000; }
  .heroi { min-height: 0; padding: 0 0 24px; background: none; color: #000; }
  .heroi-titulo, .heroi-lead { color: #000; }
}