/* Layout: página institucional clara, creme e dourado; faixas alternadas creme / papel / tinta; rosé só em microdetalhes */
:root{
  --creme:#F7F1E6;
  --papel:#EFE5D3;
  --tinta:#2B2622;
  --tinta-suave:#5E554C;
  --ouro:#B08A3E;
  --ouro-claro:#D9BC74;
  --rose:#B98E98;
  --linha:#DCCDB2;
  --f-display:"Libre Caslon Display","Libre Caslon Text",Georgia,serif;
  --f-texto:"Source Sans 3","Segoe UI",system-ui,sans-serif;
  --f-rotulo:"Oswald","Arial Narrow",sans-serif;
  --f-assinatura:"Mrs Saint Delafield","Brush Script MT",cursive;
  --max:1160px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--creme);color:var(--tinta);font-family:var(--f-texto);font-size:17px;line-height:1.65;margin:0}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:var(--max);margin:0 auto;padding-inline:clamp(16px,4vw,40px)}
h1,h2,h3{font-family:var(--f-display);font-weight:400;text-wrap:balance;margin:0;line-height:1.15}
p{margin:0}
.rotulo{font-family:var(--f-rotulo);font-weight:300;text-transform:uppercase;letter-spacing:.32em;font-size:12.5px;color:var(--ouro)}
.losango{display:flex;align-items:center;gap:10px;color:var(--ouro-claro)}
.losango::before,.losango::after{content:"";height:1px;background:currentColor;flex:1}
.losango span{width:14px;height:8px;border:1px solid currentColor;transform:none;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);background:currentColor;opacity:.9}
:focus-visible{outline:2px solid var(--ouro);outline-offset:3px}

/* Cabeçalho */
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:10;background:color-mix(in srgb,var(--creme) 94%,transparent);backdrop-filter:blur(6px);border-bottom:1px solid var(--linha)}
.topo{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:14px}
.marca{display:flex;align-items:center;gap:14px;text-decoration:none}
.mono-img{height:52px;width:auto}
.logo-rodape{width:min(280px,100%);height:auto}
.marca-txt{display:flex;flex-direction:column;gap:2px}
.marca-nome{font-family:"Libre Caslon Text",Georgia,serif;letter-spacing:.2em;font-size:15px}
.marca-sub{font-family:var(--f-rotulo);font-weight:300;letter-spacing:.3em;font-size:9.5px;color:var(--tinta-suave)}
nav ul{display:flex;gap:28px;list-style:none;margin:0;padding:0}
nav a{text-decoration:none;font-family:var(--f-rotulo);font-weight:400;text-transform:uppercase;letter-spacing:.16em;font-size:13px;padding-block:6px;border-bottom:1px solid transparent}
nav a:hover{border-color:var(--rose)}
.topo-dir{display:flex;align-items:center;gap:10px}
.btn-wpp{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-family:var(--f-rotulo);text-transform:uppercase;letter-spacing:.16em;font-size:12.5px;padding:9px 14px;border:1px solid var(--ouro);color:var(--tinta)}
.btn-wpp svg{width:17px;height:17px;fill:var(--ouro)}
.btn-wpp:hover{background:var(--tinta);color:var(--creme);border-color:var(--tinta)}
.btn-wpp:hover svg{fill:var(--ouro-claro)}
.btn-wpp{background:none;cursor:pointer}
.wpp{position:relative}
.wpp-lista{position:absolute;right:0;top:calc(100% + 10px);z-index:30;width:270px;max-width:calc(100vw - 32px);background:var(--creme);border:1px solid var(--linha);border-top:2px solid var(--ouro);box-shadow:0 12px 30px rgba(43,38,34,.16);padding:14px 16px;display:grid;gap:4px}
/* o display:grid acima anularia o atributo hidden; esta regra garante que a lista comece fechada */
[hidden]{display:none!important}
.wpp-titulo{font-family:var(--f-rotulo);font-weight:300;text-transform:uppercase;letter-spacing:.28em;font-size:11.5px;color:var(--ouro);margin-bottom:4px}
.wpp-lista a{display:grid;gap:1px;text-decoration:none;padding:10px 0;border-top:1px solid var(--linha);color:var(--tinta)}
.wpp-lista a strong{font-family:"Libre Caslon Text",serif;font-weight:400;font-size:16px}
.wpp-lista a span{font-size:14.5px;color:var(--tinta-suave)}
.wpp-lista a:hover strong{color:var(--ouro)}
.wpp-canto{position:fixed;right:20px;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:20}
.wpp-canto .wpp-lista{top:auto;bottom:calc(100% + 12px)}
.wpp-flutuante{cursor:pointer;width:54px;height:54px;border-radius:50%;background:var(--tinta);display:grid;place-items:center;box-shadow:0 6px 18px rgba(43,38,34,.25);border:1px solid var(--ouro);padding:0}
.wpp-flutuante svg{width:26px;height:26px;fill:var(--ouro-claro)}
.wpp-flutuante:hover{background:#3a332d}
.contato-item a{color:var(--tinta-suave);text-decoration-color:var(--ouro);text-underline-offset:3px}
.contato-item a:hover{color:var(--tinta)}
.menu-btn{display:none;background:none;border:1px solid var(--linha);font:inherit;font-family:var(--f-rotulo);letter-spacing:.16em;text-transform:uppercase;font-size:12px;padding:8px 12px;color:var(--tinta)}

/* Abertura */
.abertura{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(28px,5vw,64px);align-items:center;padding-block:clamp(40px,7vw,88px)}
.abertura h1{font-size:clamp(36px,5vw,60px);margin-block:18px 22px}
.abertura h1 em{font-family:"Libre Caslon Text",serif;font-style:italic;color:var(--ouro)}
.abertura .lead{font-size:19px;color:var(--tinta-suave);max-width:34em}
.acoes{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}
.btn{display:inline-block;text-decoration:none;font-family:var(--f-rotulo);text-transform:uppercase;letter-spacing:.18em;font-size:13px;padding:14px 22px;border:1px solid var(--ouro)}
.btn.cheio{background:var(--tinta);color:var(--creme);border-color:var(--tinta)}
.btn.cheio:hover{background:#3a332d}
.btn:not(.cheio):hover{background:var(--papel)}
.foto-abertura{position:relative}
.foto-abertura img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:center 30%}
.foto-abertura::before{content:"";position:absolute;inset:18px -18px -18px 18px;border:1px solid var(--ouro-claro);z-index:-1}
.local{margin-top:18px;font-size:14px;color:var(--tinta-suave);display:flex;flex-wrap:wrap;gap:6px 18px}
.local b{font-weight:600;color:var(--tinta)}

/* Áreas */
.faixa{padding-block:clamp(56px,8vw,104px)}
.papel{background:var(--papel)}
.cab-secao{display:grid;gap:14px;max-width:640px;margin-bottom:44px}
.cab-secao h2{font-size:clamp(30px,3.6vw,44px)}
.cab-secao p{color:var(--tinta-suave)}
.areas{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,48px)}
.area{background:var(--creme);padding:clamp(24px,3vw,40px);border-top:2px solid var(--ouro)}
.area h3{font-size:30px;margin-bottom:8px}
.area > p{color:var(--tinta-suave);margin-bottom:22px}
.servicos{list-style:none;margin:0;padding:0;display:grid}
.servicos a{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:baseline;text-decoration:none;padding-block:14px;border-top:1px solid var(--linha)}
.servicos a:hover .nome{color:var(--ouro)}
.servicos .nome{font-family:"Libre Caslon Text",serif;font-size:18px}
.servicos .desc{grid-column:1/2;font-size:15px;color:var(--tinta-suave)}
.servicos .seta{grid-row:1/3;grid-column:2;color:var(--ouro);font-size:18px}

/* Etapas */
.etapas-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,72px);align-items:center}
.etapas-grid img{width:100%;aspect-ratio:3/2;object-fit:cover}
.etapas{list-style:none;margin:0;padding:0;display:grid;gap:0;counter-reset:e}
.etapas li{display:grid;grid-template-columns:56px 1fr;gap:16px;padding-block:18px;border-top:1px solid var(--linha)}
.etapas li:last-child{border-bottom:1px solid var(--linha)}
.etapas li::before{counter-increment:e;content:"0" counter(e);font-family:var(--f-display);font-size:28px;color:var(--ouro);line-height:1.1}
.etapas h3{font-size:22px;margin-bottom:4px}
.etapas p{color:var(--tinta-suave);font-size:16px}

/* Escritório */
.escritorio{background:var(--tinta);color:var(--creme)}
.escritorio .rotulo{color:var(--ouro-claro)}
.esc-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,5vw,72px);align-items:start}
.esc-grid img{width:100%;aspect-ratio:2/3;object-fit:cover;object-position:center 20%}
.esc-grid h2{font-size:clamp(30px,3.6vw,44px);margin-block:14px 20px}
.esc-txt > p{color:#D9CFC0;max-width:36em;margin-bottom:16px}
.socias{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:36px}
.socia{border-top:1px solid #5a4f44;padding-top:20px}
.socia h3{font-size:22px;color:var(--creme)}
.socia .oab{font-family:var(--f-rotulo);font-weight:300;letter-spacing:.18em;text-transform:uppercase;font-size:12px;color:var(--ouro-claro);margin-block:6px 12px}
.socia ul{margin:0;padding-left:18px;color:#D9CFC0;font-size:15.5px;display:grid;gap:4px}
.socia li::marker{color:var(--rose)}

/* Blog */
.blog-cab{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:40px}
.blog-cab .cab-secao{margin-bottom:0}
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,36px)}
.post{display:flex;flex-direction:column;gap:12px;text-decoration:none}
.post .img{aspect-ratio:16/10;overflow:hidden;background:var(--papel)}
.post img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.post:hover img{transform:scale(1.03)}
.post .cat{font-family:var(--f-rotulo);font-weight:300;text-transform:uppercase;letter-spacing:.24em;font-size:11.5px;color:var(--ouro)}
.post h3{font-size:22px}
.post p{font-size:15.5px;color:var(--tinta-suave)}
.post .meta{font-size:13px;color:var(--tinta-suave);margin-top:auto}
.amostra{font-size:13px;color:var(--tinta-suave);margin-top:24px;font-style:italic}

/* Perguntas */
.faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,5vw,72px)}
details{border-top:1px solid var(--linha);padding-block:18px}
details:last-child{border-bottom:1px solid var(--linha)}
summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;font-family:"Libre Caslon Text",serif;font-size:19px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:var(--ouro);font-size:22px;line-height:1}
details[open] summary::after{content:"–"}
details p{margin-top:12px;color:var(--tinta-suave);max-width:40em}

/* Contato */
.contato-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:28px}
.contato-item{display:grid;gap:6px;padding-top:18px;border-top:1px solid var(--ouro)}
.contato-item .rotulo{font-size:11.5px}
.contato-item strong{font-family:"Libre Caslon Text",serif;font-weight:400;font-size:19px}
.contato-item span{color:var(--tinta-suave);font-size:15.5px}

footer{background:var(--tinta);color:#CFC4B4;font-size:14px;padding-block:48px}
.rodape{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:32px;align-items:start}
.rodape p + p{margin-top:8px}
.rodape h2{font-family:var(--f-rotulo);font-weight:300;text-transform:uppercase;letter-spacing:.28em;font-size:12px;color:var(--ouro-claro);margin-bottom:14px}
.rodape ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.rodape a{text-decoration:none}
.rodape a:hover{color:var(--creme);text-decoration:underline;text-decoration-color:var(--ouro)}
.aviso{border-top:1px solid #4d443b;margin-top:32px;padding-top:18px;font-size:13px;color:#A99D8D}
.menu-aberto{display:flex!important;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:var(--creme);padding:16px 20px;gap:14px!important;border-bottom:1px solid var(--linha)}

/* Páginas de serviço */
.cab-pagina{padding-block:clamp(36px,6vw,72px)}
.trilha{font-size:14px;color:var(--tinta-suave);display:flex;flex-wrap:wrap;gap:6px}
.trilha a{text-decoration:none}
.trilha a:hover{color:var(--ouro)}
.trilha span[aria-hidden]{color:var(--ouro)}
.cab-pagina .rotulo{margin-top:26px}
.cab-pagina h1{font-size:clamp(34px,4.6vw,56px);margin-block:14px 18px;max-width:18em}
.cab-pagina .lead{font-size:19px;color:var(--tinta-suave);max-width:40em}
.pagina-servico{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:clamp(32px,5vw,72px);padding-block:clamp(44px,6vw,80px);align-items:start}
.texto{max-width:42em;min-width:0}
.texto h2{font-size:clamp(26px,2.8vw,34px);margin-block:48px 16px;scroll-margin-top:110px}
.texto h2:first-child{margin-top:0}
.texto h3{font-family:"Libre Caslon Text",serif;font-size:20px;margin-block:28px 10px}
.texto p{margin-bottom:16px}
.texto ul,.texto ol{margin:0 0 18px;padding-left:22px;display:grid;gap:8px}
.texto li::marker{color:var(--ouro)}
.texto strong{font-weight:600}
.texto .destaque{background:var(--papel);border-left:2px solid var(--ouro);padding:18px 22px;margin-block:24px}
.texto .destaque p:last-child{margin-bottom:0}
.texto details p{margin-bottom:0}
.texto .faq{margin-top:8px}
.lateral{position:sticky;top:110px;display:grid;gap:28px}
.lateral h2{font-family:var(--f-rotulo);font-weight:300;text-transform:uppercase;letter-spacing:.28em;font-size:12px;color:var(--ouro);margin-bottom:12px}
.lateral ul{list-style:none;margin:0;padding:0;display:grid}
.lateral li a{display:block;text-decoration:none;font-size:15px;padding-block:8px;border-top:1px solid var(--linha);color:var(--tinta-suave)}
.lateral li a:hover{color:var(--tinta)}
.cartao-contato{background:var(--tinta);color:#D9CFC0;padding:24px;font-size:15px;display:grid;gap:10px}
.cartao-contato h2{color:var(--ouro-claro)}
.cartao-contato strong{color:var(--creme);font-weight:500}
.cartao-contato a{color:var(--creme);text-decoration-color:var(--ouro);text-underline-offset:3px}
.relacionados{border-top:1px solid var(--linha)}

/* Blog */
.assinatura{margin-top:18px;font-size:14px;color:var(--tinta-suave)}
.capa-artigo{margin:0 0 36px}
.capa-artigo img{width:100%;aspect-ratio:16/9;object-fit:cover}
.nota-artigo{margin-top:40px;padding-top:16px;border-top:1px solid var(--linha);font-size:14px;color:var(--tinta-suave);font-style:italic}
.relacionados .servicos{grid-template-columns:repeat(3,1fr);gap:0 32px}


@media (max-width:900px){
  nav ul{display:none}
  .menu-btn{display:inline-block}
  .abertura,.etapas-grid,.esc-grid,.faq-grid{grid-template-columns:1fr}
  .foto-abertura{order:-1}
  .foto-abertura::before{inset:12px -10px -12px 10px}
  .areas,.socias,.contato-grid{grid-template-columns:1fr}
  .posts{grid-template-columns:1fr 1fr}
  .esc-grid img{aspect-ratio:4/3}
  .rodape{grid-template-columns:1fr}
  .pagina-servico{grid-template-columns:1fr}
  .lateral{position:static}
  .lateral .indice{display:none}
  .relacionados .servicos{grid-template-columns:1fr}
}
@media (max-width:560px){
  .posts{grid-template-columns:1fr}
  .marca-sub{display:none}
  .btn-wpp span{display:none}
  /* o header tem backdrop-filter, então "fixed" aqui se posiciona em relação a ele */
  .topo .wpp-lista{position:fixed;left:16px;right:16px;top:calc(100% + 8px);width:auto;max-width:none}
  .mono-img{height:44px}
  body{font-size:16px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}