/* Horta Assunção Advocacia — CSS escrito a mão, mobile primeiro.
   Breakpoints: 768px (tablet) e 1025px (desktop).
   Cores e fontes tiradas do CSS do site original (kit global post-6 e home post-641). */

:root {
  --vinho: #872F45;
  --grafite: #363636;
  --cinza-claro: #EBEBEB;
  --fundo-claro: #F1F1F1;
  --verde: #3C9C22;
  --rodape: #181818;
  --largura: 1140px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: "Montserrat", sans-serif;
  font-size: 16px;
  line-height: 1.5;
  color: #000;
  background: #fff;
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
h1, h2, h3, p, figure, blockquote { margin: 0; }
a { color: inherit; }
.container { width: 100%; max-width: var(--largura); margin: 0 auto; padding: 0 20px; }
.centro { text-align: center; }

.botao {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  width: 100%;
  background: var(--verde); color: #fff; text-decoration: none; text-align: center;
  font-family: "Roboto", sans-serif; font-size: 18px; font-weight: 500; line-height: 1.2;
  padding: 18px;
  transition: filter .2s;
}
.botao:hover { filter: brightness(1.1); }
.botao__icone { width: 18px; height: 18px; fill: currentColor; flex: none; }

/* ---------- Topo ---------- */
.topo { background: #fff; }
.topo__barra { display: flex; justify-content: center; padding-top: 10px; padding-bottom: 10px; }
.topo__logo img { width: 210px; }

/* ---------- Hero ---------- */
.hero {
  color: #fff;
  background: linear-gradient(289deg, rgba(54,54,54,.91) 47%, rgba(23,21,21,.91) 100%), url("img/7009.jpg") 30% center / cover;
  padding: 60px 0;
  min-height: 521px; display: flex; align-items: center;
}
.hero__texto { display: grid; gap: 28px; }
.hero__titulo {
  font-family: "Poppins", sans-serif; font-weight: 600; font-size: 24px; line-height: 1.4;
  text-align: center;
}

/* ---------- Quem somos ---------- */
.sobre {
  background: linear-gradient(rgba(255,255,255,.97), rgba(255,255,255,.97)), url("img/2151202360.jpg") center / cover;
  padding: 60px 0;
}
.sobre__grade { display: grid; gap: 40px; }
.sobre__texto { display: grid; font-family: "Open Sans", sans-serif; font-weight: 300; font-size: 17px; line-height: 1.5; }
.sobre__pre { font-family: "Montserrat", sans-serif; font-size: 16px; line-height: 1.2; }
.sobre__titulo { font-family: "Montserrat", sans-serif; font-weight: 600; font-size: 38px; line-height: 1.2; margin-bottom: 10px; }
.sobre__missao { margin-top: 26px; }
.sobre__foto { width: 100%; border-radius: 5px; }

/* ---------- Sócios ---------- */
.socios {
  background: linear-gradient(rgba(54,54,54,.96), rgba(54,54,54,.96)), url("img/2149318525.jpg") center / cover;
  padding: 60px 0;
  color: #fff; text-align: center;
}
.socios__titulo { font-weight: 700; font-size: 30px; line-height: 1.2; }
.socios__traco { width: 25%; border: 0; border-top: 3px solid var(--vinho); margin: 14px auto 24px; }
.socios__grade { display: grid; gap: 40px; }
.socio img { width: 100%; border-radius: 10px; margin-bottom: 18px; }
.socio h3 { font-weight: 600; font-size: 23px; line-height: 1.4; color: var(--cinza-claro); margin-bottom: 14px; }
.socio:first-child h3 { font-size: 26px; }
.socio p { font-family: "Lato", sans-serif; font-weight: 300; font-size: 18px; line-height: 22px; }
.socio b { font-weight: 700; }

/* ---------- Serviços ---------- */
.servicos { background: #fff; padding: 60px 0; text-align: center; }
.servicos__pre { font-family: "Roboto", sans-serif; font-size: 16px; letter-spacing: 1.5px; color: var(--vinho); margin-bottom: 14px; }
.servicos__titulo { font-family: "Poppins", sans-serif; font-weight: 600; font-size: 34px; line-height: 1.2; color: #313131; margin-bottom: 20px; }
.servicos__intro { display: grid; gap: 14px; font-family: "Open Sans", sans-serif; font-weight: 300; font-size: 17px; line-height: 1.5; }
.divisor { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 24px auto 35px; width: 43%; min-width: 180px; }
.divisor::before, .divisor::after { content: ""; flex: 1; border-top: 1px dashed var(--vinho); }
.divisor svg { width: 20px; height: 20px; fill: var(--vinho); flex: none; }
.servicos__grade { display: grid; gap: 20px; text-align: left; }
.servico { background: var(--grafite); color: #fff; border-radius: 10px; padding: 28px; }
.servico svg { width: 33px; height: 33px; fill: #fff; margin-bottom: 13px; }
.servico { min-width: 0; }
.servico h3 { overflow-wrap: break-word; font-weight: 600; font-size: clamp(18px, 6.5vw, 22px); line-height: 1.2; margin-bottom: 12px; }
.servico p { font-weight: 300; font-size: 16px; line-height: 27px; }

/* ---------- Áreas ---------- */
.areas {
  background: linear-gradient(rgba(54,54,54,.96), rgba(54,54,54,.96)), url("img/2149318525.jpg") center / cover;
  padding: 60px 0; color: #fff; text-align: center;
}
.areas__titulo { font-weight: 700; font-size: 34px; line-height: 1.2; margin-bottom: 20px; }
.areas__intro, .areas__fecho { font-family: "Open Sans", sans-serif; font-weight: 400; font-size: 17px; line-height: 1.5; }
.areas__grade { display: grid; gap: 40px; margin: 40px auto; max-width: 1060px; }
.area {
  background: var(--vinho); border-left: 4px solid #fff; border-radius: 15px;
  padding: 25px; margin: 0 10px;
}
.area svg { width: 46px; height: 41px; fill: #fff; margin: 0 auto 20px; display: block; }
.area h3 { font-weight: 600; font-size: 21px; line-height: 1.1; text-transform: uppercase; margin-bottom: 20px; }
.area p { font-size: 14px; line-height: 1.5; }

/* ---------- Avaliações (texto copiado do widget Trustindex do original) ---------- */
.avaliacoes { background: var(--fundo-claro); padding: 50px 0; text-align: center; font-family: "Poppins", sans-serif; }
.avaliacoes__titulo { font-family: "Montserrat", sans-serif; font-weight: 700; font-size: 29px; line-height: 1.2; color: var(--grafite); margin-bottom: 20px; }
.avaliacoes__resumo { display: flex; flex-direction: column; align-items: center; gap: 4px; margin-bottom: 24px; }
.avaliacoes__nota { font-size: 22px; font-weight: 600; color: #000; }
.avaliacoes__base { font-size: 14px; color: #000; }
.avaliacoes__base strong { font-weight: 600; }
.avaliacoes__google { width: 110px; margin-top: 6px; }
.estrelas { display: inline-flex; align-items: center; gap: 2px; }
.estrelas svg { width: 17px; height: 17px; fill: #F6BB06; }
.estrelas--grandes svg { width: 30px; height: 30px; }
.estrelas .verificado { width: 16px; height: 16px; fill: #4F8DF5; margin-left: 6px; }
.avaliacoes__trilho {
  display: grid; grid-auto-flow: column; grid-auto-columns: 100%;
  gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 14px;
  scrollbar-color: #bbb transparent; text-align: left; align-items: start;
}
.avaliacao {
  background: #F4F4F4; border-radius: 8px; padding: 20px;
  scroll-snap-align: start; display: grid; gap: 10px; align-content: start;
  box-shadow: 0 0 0 1px rgba(0,0,0,.03);
}
.avaliacao__topo { display: flex; align-items: center; gap: 15px; }
.avaliacao__topo img { width: 40px; height: 40px; border-radius: 50%; flex: none; }
.avaliacao__topo span { display: grid; flex: 1; min-width: 0; line-height: 1.3; }
.avaliacao__topo strong { font-size: 15px; font-weight: 600; color: #000; }
.avaliacao__topo small { font-size: 13px; color: #555; }
.avaliacao__topo .avaliacao__g { width: 20px; height: 20px; align-self: flex-start; }
.avaliacao blockquote { font-size: 15px; line-height: 1.45; color: #000; }

/* ---------- Diferenciais ---------- */
.diferenciais {
  background: linear-gradient(rgba(54,54,54,.83), rgba(54,54,54,.83)), url("img/escritorio.webp") center / cover;
  padding: 60px 0; color: #fff;
}
.diferenciais__titulo { font-family: "Poppins", sans-serif; font-weight: 600; font-size: 28px; line-height: 1.1; text-align: center; padding: 0 10px; }
.diferenciais__grade { display: grid; gap: 20px; margin: 50px 0 46px; }
.diferencial { background: #fff; color: #000; border-radius: 20px; padding: 38px 26px 36px; font-family: "Poppins", sans-serif; }
.diferencial img { width: 45px; margin-bottom: 26px; }
.diferencial h3 { font-weight: 600; font-size: 21px; line-height: 1.2; margin-bottom: 18px; }
.diferencial p { font-weight: 300; font-size: 15px; line-height: 1.5; }

/* ---------- Contato ---------- */
.contato { background: var(--fundo-claro); padding: 30px 0; }
.contato__grade { display: grid; gap: 40px; }
.contato__mapa { order: -1; }
.contato__mapa iframe { display: block; width: 100%; height: 156px; border: 0; }
.contato__texto { display: grid; gap: 16px; }
.contato__titulo { font-weight: 700; font-size: 29px; line-height: 1.2; color: var(--grafite); text-align: center; }
.contato__intro { font-size: 16px; text-align: center; }
.contato__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; font-size: 15px; }
.contato__lista a, .contato__lista span { display: flex; align-items: center; gap: 10px; text-decoration: none; color: #000; }
.contato__lista svg { width: 16px; height: 16px; fill: var(--vinho); flex: none; }
.contato__lista a { overflow-wrap: anywhere; }

/* ---------- Rodapé ---------- */
.rodape { background: var(--rodape); color: #fff; text-align: center; padding: 22px 0 18px; font-size: 13px; line-height: 1.5; }
.rodape__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 16px; margin-top: 12px; font-family: "Lato", sans-serif; font-weight: 300; font-size: 16px; }
.rodape__links a { text-decoration: none; }
.rodape__links a:hover { text-decoration: underline; }
.rodape__lema { margin-bottom: 8px; }

/* ---------- Páginas legais ---------- */
.legal-topo { background: var(--cinza-claro); }
.legal-topo__barra { display: flex; flex-direction: column; align-items: center; gap: 18px; padding-top: 18px; padding-bottom: 18px; }
.legal-topo .topo__logo img { width: 210px; }
.legal-topo__lista {
  list-style: none; margin: 0; padding: 0; display: grid; gap: 12px;
  font-size: 13px; line-height: 20px; letter-spacing: .5px; color: var(--vinho);
}
.legal-topo__lista li { display: flex; align-items: center; gap: 10px; }
.legal-topo__lista a { text-decoration: none; overflow-wrap: anywhere; }
.legal-topo__lista svg { width: 18px; height: 18px; flex: none; fill: none; stroke: #555; stroke-width: 1.3; }
.legal {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: #333; padding: 20px 0 50px;
}
.legal h1 { font-size: 34px; font-weight: 600; line-height: 1.2; margin-bottom: 18px; color: #333; }
.legal h2 { font-size: 22px; font-weight: 600; line-height: 1.3; margin: 28px 0 10px; color: #333; }
.legal p { font-size: 16px; line-height: 1.5; margin-bottom: 14px; overflow-wrap: break-word; }
.legal__voltar { display: inline-block; margin-top: 28px; color: var(--vinho); font-family: "Montserrat", sans-serif; font-size: 15px; }
.rodape__marca { width: 90px; border-radius: 50%; margin: 0 auto 12px; }

/* ================= Tablet ================= */
@media (min-width: 768px) {
  .botao { width: auto; display: inline-flex; font-size: 20px; padding: 20px 29px; }
  .botao__icone { width: 20px; height: 20px; }
  .topo__logo img { width: 210px; }

  .hero { min-height: 704px; background-position: center; padding: 60px 0; }
  .hero__grade { display: grid; grid-template-columns: 53% 1fr; }
  .hero__texto { justify-items: start; gap: 24px; }
  .hero__titulo { font-size: 36px; line-height: 42px; text-align: left; }

  .sobre { padding: 100px 0; }
  .sobre__grade { grid-template-columns: 1fr 1fr; gap: 30px; align-items: start; }
  .sobre__foto { width: 86%; justify-self: center; }

  .socios { padding: 65px 0; }
  .socios__titulo { font-size: 36px; line-height: 51px; }
  .socios__traco { width: 12%; margin: 6px auto 40px; }
  .socios__grade { grid-template-columns: 1fr 1fr; gap: 20px; }
  .socio { padding: 16px; }
  .socio img { width: 68%; margin: 0 auto 26px; }
  .socio h3, .socio:first-child h3 { font-size: 26px; }

  .servicos { padding: 80px 0 100px; }
  .servicos__titulo { font-size: 42px; }
  .servicos__intro { padding: 0 40px; }
  .divisor { width: 15%; }
  .servicos__grade { grid-template-columns: 1fr 1fr; }
  .servico h3 { font-size: 32px; }

  .areas { padding: 80px 0; }
  .areas__titulo { font-size: 40px; }
  .areas__intro, .areas__fecho { padding: 0 40px; }
  .areas__grade { grid-template-columns: 1fr 1fr; gap: 40px 20px; }
  .area { margin: 0; }

  .avaliacoes { padding: 60px 0; }
  .avaliacoes__titulo { font-size: 40px; }
  .avaliacoes__trilho { grid-auto-columns: calc((100% - 16px) / 2); }

  .diferenciais { padding: 100px 0; }
  .diferenciais__titulo { font-size: 34px; }
  .diferenciais__grade { grid-template-columns: 1fr 1fr; margin: 50px 0 46px; }

  .contato { padding: 60px 0; }
  .contato__grade { grid-template-columns: 55% 1fr; gap: 20px; align-items: center; }
  .contato__mapa { order: 0; }
  .contato__mapa iframe { height: 337px; }
  .contato__titulo { font-size: 44px; text-align: left; }
  .contato__intro { font-size: 19px; text-align: left; }
  .contato__lista { font-size: 19px; }
  .contato__texto { justify-items: start; }

  .rodape { font-size: 12px; }

  .legal-topo__barra { flex-direction: row; justify-content: space-between; }
  .legal { padding: 20px 0 60px; }
  .legal h1 { font-size: 40px; }
}

/* ================= Desktop ================= */
@media (min-width: 1025px) {
  .topo__logo img { width: 307px; }
  .hero__grade { max-width: 1280px; padding: 0 20px; }

  .sobre__grade { gap: 60px; }
  .sobre__texto p:not(.sobre__pre) { max-width: 94%; }

  .servicos__intro { padding: 0 90px; }
  .servicos__grade { gap: 16px 20px; }

  .areas__intro, .areas__fecho { padding: 0 120px; }
  .areas__grade { gap: 40px 40px; }

  .avaliacoes__trilho { grid-auto-columns: calc((100% - 32px) / 3); }

  .diferenciais__grade { grid-template-columns: repeat(4, 1fr); }

  .contato__grade { max-width: 1280px; }
  .contato__mapa iframe { height: 337px; }

  .legal-topo__barra { max-width: 1300px; padding: 26px 70px; }
  .legal-topo .topo__logo img { width: 257px; }
}