/* Ajustes locais — alterações de layout pedidas para esta cópia, que NÃO existem
   no site publicado. Fica num arquivo separado, carregado depois do CSS do
   Webflow, para o CSS original seguir idêntico ao original e estas mudanças
   ficarem todas num lugar só. Para voltar ao visual do site no ar, é só remover
   a tag <link> deste arquivo das páginas. */

/* -------------------------------------------------------------------------
   Home — hero "A advocacia trabalhista ao lado do trabalhador."
   No site publicado o título centraliza abaixo de 480px (e ganha um recuo
   lateral de 5%), enquanto o parágrafo logo abaixo fica à esquerda. Os dois
   botões ficam centralizados em qualquer largura. Aqui tudo fica à esquerda,
   alinhado com o parágrafo.
   O seletor usa o id da coluna do hero, que só existe na home.
   ------------------------------------------------------------------------- */
#w-node-a0fd7d97-ef41-a269-0515-dcb2f60c049d-2402654b h1 {
  text-align: left;
  padding-left: 0;
  padding-right: 0;
}

#w-node-a0fd7d97-ef41-a269-0515-dcb2f60c049d-2402654b .button-group {
  justify-content: flex-start;
  margin-left: 0;
  margin-right: 0;
}

/* abaixo de 480px cada botão vira um bloco de largura total e o conteúdo
   é centralizado dentro dele — aqui também alinha à esquerda */
#w-node-a0fd7d97-ef41-a269-0515-dcb2f60c049d-2402654b .button-group .mobile-grow {
  justify-content: flex-start;
}

/* -------------------------------------------------------------------------
   Política de Privacidade — título promovido a H1 (item T6 do plano de SEO)
   O título da página era <h2> e ficou sem H1 nenhum. Ao virar <h1>, cresceu:
   a classe .heading-5.left.gray define peso e cor, mas não define font-size,
   então quem mandava era a regra por tag — e h1 (2.25em/1.11) é bem maior que
   h2 (1.5em/1.33). Aqui devolvemos o tamanho original, mantendo a semântica.
   ------------------------------------------------------------------------- */
h1.heading-5.left.gray {
  font-size: 1.5em;
  line-height: 1.33333;
}

/* -------------------------------------------------------------------------
   Rodapé em 3 colunas + barra inferior (itens T11 e T13 do plano de SEO)
   Coluna 1: marca, descrição, endereço, horários e mapa.
   Colunas 2 e 3: navegação e contato.
   O mapa é um iframe do Google com loading="lazy" — só pesa quando alguém
   rola até o rodapé. Sem internet fica em branco; o endereço em texto
   continua visível acima dele.
   ------------------------------------------------------------------------- */
footer .w-layout-vflex.align-center.row-gap-2-5 {
  align-items: stretch;        /* o container original centralizava tudo */
  row-gap: 3rem;
}

.rodape-grade {
  grid-template-columns: 1.6fr 1fr 1fr;
  grid-column-gap: 3rem;
  grid-row-gap: 3rem;
  width: 100%;
  display: grid;
}

.rodape-col {
  flex-flow: column;
  align-items: flex-start;
  row-gap: 1rem;
  min-width: 0;
  display: flex;
}

.rodape-col-marca {
  row-gap: 1.25rem;
  max-width: 30rem;
}

.rodape-col-marca .brand {
  margin-bottom: .25rem;
}

.rodape-tagline {
  opacity: .8;
  margin: 0;
}

.rodape-endereco {
  font-style: normal;          /* <address> vem em itálico por padrão */
  margin: 0;
}

.rodape-horario {
  opacity: .8;
  margin: 0;
}

/* títulos das colunas: maiúsculas, espaçadas, no tom de destaque do site */
.rodape-titulo {
  color: var(--secondary-lightest);
  letter-spacing: .12em;
  text-transform: uppercase;
  margin-bottom: .5rem;
  font-size: .8rem;
  font-weight: 700;
}

.rodape-lista {
  flex-flow: column;
  row-gap: .85rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.rodape-lista li {
  margin: 0;
  padding: 0;                  /* o CSS base do Webflow põe 6px de recuo no li */
}

.rodape-lista a {
  color: var(--gray-light);
  text-decoration: none;
  transition: color .15s;
}

.rodape-lista a:hover {
  color: var(--white);
  text-decoration: underline;
}

.rodape-mapa {
  border-radius: .5rem;
  width: 100%;
  max-width: 26rem;
  line-height: 0;              /* tira o vão que o inline-block do iframe cria */
  overflow: hidden;
}

.rodape-mapa iframe {
  border: 0;
  width: 100%;
  height: 190px;
  display: block;
  filter: grayscale(35%);      /* aproxima o mapa da paleta escura do rodapé */
}

/* barra inferior: crédito à esquerda, links à direita */
.rodape-base {
  flex-flow: wrap;
  justify-content: space-between;
  align-items: center;
  column-gap: 1.5rem;
  row-gap: .5rem;
  width: 100%;
  display: flex;
}

.rodape-base p {
  opacity: .75;
  margin: 0;
}

.rodape-base a {
  color: inherit;
  text-decoration: underline;
}

/* tablet: as duas colunas de links dividem a linha abaixo da marca */
@media screen and (max-width: 991px) {
  .rodape-grade {
    grid-template-columns: 1fr 1fr;
  }
  .rodape-col-marca {
    grid-column: 1 / -1;
    max-width: none;
  }
}

/* celular: tudo empilhado */
@media screen and (max-width: 767px) {
  .rodape-grade {
    grid-template-columns: 1fr;
    grid-row-gap: 2.5rem;
  }
  .rodape-base {
    flex-flow: column;
    align-items: flex-start;
  }
}