/* ==========================================================================
   padrao.css — classes do site da Midas Consórcios (midasconsorcios.com.br)
   Extraído em 21/09/2026 das folhas midasconsorcios.css,
   detalhes.midasconsorcios.css e do <style> inline da página.

   Critério:
   - só seletores cujas classes TODAS aparecem no HTML de referência
     (cards de produto, simulador, formulários de conversão, rodapé,
     listagem de contempladas, artigos);
   - só a declaração que vence a cascata no próprio site da Midas —
     o que é sobrescrito depois pelo mesmo seletor ficou de fora;
   - o que vem de normalize.css, components.css e detalhes.acaoweb.css
     ficou de fora, porque o site da Rauber já carrega esses arquivos;
   - regras por tela: desktop, tablet (991px), celular paisagem (767px)
     e celular (479px).
   ========================================================================== */

/* Variáveis usadas pelas regras abaixo (valores da Midas) */
:root {
  --cor-1: #1d3128;
  --fonte-cor-1: #ffffff;
  --branco: white;
  --cinza: #333;
  --cor-2: #17261f;
  --cinza-claro: lightgrey;
  --gainsboro: #e4e7ec;
  --whatsapp-verde: #00b2a8;
  --whatsapp-verde-escuro: #078a76;
  --gold: #d7b55d;
  --gold-foreground: #1d3128;
  --fonte-cor-2: #000000;
  --transparente: rgba(0, 0, 0, 0);
}

/* ==================== DESKTOP (base, vale para todas as telas) ==================== */
.div-24 {
  width: 24%;
}

.imagem-produto {
  background-color: rgb(255, 255, 255);
  width: 100%;
  transition: 0.2s;
  display: block;
  object-fit: cover;
  height: 240px;
}

/* .div-produto completa: resultado final da cascata no site da Midas
   (components.css + midasconsorcios.css + detalhes.acaoweb.css +
   detalhes.midasconsorcios.css), para não depender da base. */
.div-produto {
  position: relative;
  display: flex;
  flex-flow: column;
  flex: 0 1 auto;
  justify-content: center;
  align-items: stretch;
  min-height: 340px;
  margin-bottom: 20px;
  padding: 0px 0px 5px 0px;
  overflow: hidden;
  background-color: rgb(255, 255, 255);
  border: 0px solid rgba(23, 38, 31, 0.42);
  border-radius: 20px;
  box-shadow: rgba(23, 38, 31, 0.74) 0px 12px 40px;
  transition: transform 0.2s, 0.35s;
}

.div-produto:hover {
  z-index: 10;
  transform: translate(0px, -5px);
  box-shadow: rgba(10, 40, 30, 0.1) 0px 5px 30px;
}

.preco-produto {
  margin-bottom: 15px;
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 1.6em;
}

.div-produto-texto {
  text-align: center;
  padding-bottom: 15px;
  padding-left: 15px;
  padding-right: 15px;
}

.div-produto-texto.alinhamento--esquerdo {
  text-align: left;
}

.opcao-simulador {
  border: 1px solid var(--cor-1);
  color: var(--fonte-cor-1);
  text-align: center;
  background-color: rgba(225, 152, 10, 0);
  border-radius: 5px;
  width: 23%;
  margin-bottom: 15px;
  padding: 6px 0px 4px;
  transition: color 0.2s, background-color 0.2s;
}

.opcao-simulador:hover {
  background-color: rgba(0, 0, 0, 0.2);
}

.opcao-simulador.w--current {
  background-color: var(--cor-1);
  color: var(--branco);
}

.icone-simulador {
  margin-bottom: 5px;
  font-family: Fontawesome, Fontawesome7, sans-serif;
  font-size: 24px;
  display: block;
}

.input {
  border-style: none none solid;
  border-width: 1px;
  border-color: black black var(--cinza);
  background-color: rgba(0, 0, 0, 0);
  height: auto;
  margin-bottom: 0px;
  font-size: 1em;
  display: inline-block;
}

.input.placeholder-transparente::placeholder {
  color: rgba(128, 128, 128, 0);
}

.input.placeholder-transparente.sem-borda {
  border-bottom-style: none;
}

.input.sem-borda {
  border-bottom-style: none;
}

.icone-input-form {
  text-align: center;
  border-radius: 100px;
  justify-content: center;
  align-self: center;
  align-items: center;
  line-height: 22px;
  display: flex;
  transform: translate(-5px);
  background-color: rgb(215, 181, 93);
  color: rgb(29, 49, 40);
  width: 47px;
  height: 40px;
  font-family: Fontawesome, Fontawesome7, sans-serif;
  font-size: 22px;
}

.icone-input-form.valor {
  padding-top: 0px;
  font-weight: 100;
  font-size: 24px;
}

.titulo-pagina {
  margin-bottom: 20px;
  font-size: clamp(38px, 5vw, 58px);
  line-height: 1.08;
}

.titulo-pagina.cor-fonte-2 {
  color: var(--cor-2);
}

.secao-base {
  position: relative;
  padding: 8vh 10.5vw;
}

.div-simulador-slide {
  z-index: 20;
  justify-content: flex-end;
  align-items: center;
  width: 22%;
  min-width: 290px;
  display: flex;
  position: absolute;
  inset: 110px 10.5vw 0% auto;
}

.bloco-dados-envio {
  margin-top: 10px;
  margin-bottom: 15px;
}

.div-input-simulador {
  z-index: 1;
  text-align: right;
  background-color: rgb(255, 255, 255);
  border-radius: 15px 6px 6px 15px;
  align-items: center;
  margin-bottom: 15px;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-right: 10px;
  display: flex;
  position: relative;
}

.label-input {
  z-index: -1;
  transform-origin: 0px 0px;
  text-align: left;
  margin-bottom: 0px;
  font-weight: 400;
  transition: color 0.2s, transform 0.2s;
  position: absolute;
  top: 6px;
  bottom: auto;
  right: auto;
}

.label-input.label-efeito-simulador {
  z-index: -1;
  inset: 15px auto auto 40px;
  color: rgb(0, 0, 0);
}

.bloco-icone-vantagem {
  flex-direction: column;
  align-items: center;
  width: 24%;
  padding-top: 7px;
  display: flex;
}

.div-padding-10 {
  text-align: left;
  padding: 10px;
}

.div-padding-10.transparente {
  background-color: rgba(255, 255, 255, 0);
}

.link-icone {
  margin-bottom: 3px;
  padding-top: 2px;
  padding-bottom: 2px;
  font-family: Fontawesome, Fontawesome7, sans-serif;
  text-decoration: none;
  transition: 0.3s;
  display: block;
}

.link-icone.redes-sociais {
  margin-right: 5px;
  padding: 6px;
  font-size: 26px;
  display: inline-block;
}

.icone {
  font-family: Fontawesome, Fontawesome7, sans-serif;
  font-weight: 400;
  line-height: 14px;
}

.div-form-conversor {
  z-index: 10;
  background-color: var(--cor-2);
  color: var(--cor-1);
  text-align: center;
  position: relative;
  box-shadow: rgba(0, 33, 97, 0.2) 0px 12px 40px;
  border-radius: 25px;
  padding: 24px 15px;
  width: 100%;
}

.div-flex-horizontal {
  justify-content: space-between;
  display: flex;
}

.div-flex-horizontal.filhos {
  flex-wrap: wrap;
  align-content: space-between;
}

.div-flex-horizontal.alinhamento-centralizado-vertical {
  align-items: center;
}

.div-flex-horizontal.alinhamento-esquerdo {
  justify-content: flex-start;
}

.titulo-maiusculas-2 {
  text-transform: uppercase;
  margin-bottom: 5px;
  font-size: 1em;
}

.div-form-conversao {
  z-index: 20;
  background-color: var(--cinza-claro);
  flex-direction: column;
  justify-content: center;
  align-items: stretch;
  height: auto;
  padding: 10px;
  display: flex;
  position: absolute;
  inset: 0%;
}

.div-form-conversao.oculta {
  display: none;
}

.div-borda {
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  border: 1px solid var(--cinza);
  border-radius: 5px;
  display: inline-block;
  border-color: var(--cor-1);
}

.botao-1 {
  border: 1px solid var(--cor-1);
  text-align: center;
  width: 100%;
  transition: color 0.2s, background-color 0.2s, box-shadow 0.2s;
  display: block;
  border-radius: 30px;
  font-weight: 600;
  background-color: rgb(215, 181, 93);
  color: rgb(29, 49, 40);
  font-size: 1rem;
}

.botao-1:hover {
  background-color: var(--branco) !important;
  color: var(--cor-1);
}

.botao-1.cor-1 {
  border-color: var(--cor-1);
  color: var(--branco);
}

.botao-1.cor-1:hover {
  color: var(--cor-1);
}

.botao-1.cor-2 {
  border-color: var(--cor-2);
  text-shadow: none;
  background: var(--gold) !important;
  color: var(--gold-foreground) !important;
}

.botao-1.cor-2:hover {
  color: var(--cor-2);
}

.botao-fechar {
  z-index: 100;
  background-color: var(--gainsboro);
  color: var(--cinza);
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  padding: 2px;
  font-family: Fontawesome, Fontawesome7, sans-serif;
  line-height: 14px;
  display: flex;
  position: absolute;
  inset: 5px 5px auto auto;
}

.botao-fechar:hover {
  color: var(--cinza);
}

.margem-inferior-0 {
  margin-bottom: 0px;
}

.div-72 {
  flex-direction: column;
  width: 72%;
  display: flex;
}

.div-32 {
  flex-direction: column;
  width: 32%;
  display: flex;
}

.link-rodape {
  color: var(--branco);
  margin-bottom: 10px;
  display: block;
}

.link-rodape.cor-fonte-2 {
  color: var(--cinza);
}

.titulo-rodape {
  color: var(--branco);
  margin-bottom: 10px;
}

.div-flex-vertical {
  flex-flow: column;
  display: flex;
}

.div-flex-vertical.filhos {
  flex-direction: column;
}

.div-padding-5 {
  text-align: left;
  margin: 5px;
  padding: 5px;
}

.margem-inferior-60 {
  margin-bottom: 60px;
}

.branco {
  color: rgb(255, 255, 255);
}

.oculta {
  display: none;
}

.div-relativo {
  position: relative;
}

.valor {
  font-size: 1.9em;
  font-weight: 700;
  line-height: 1.3em;
}

.margem-inferior-20 {
  margin-bottom: 20px;
}

.margem-superior-20 {
  margin-top: 20px;
}

.div-titulo-pagina {
  flex: 1 1 0%;
  padding-left: 10px;
  display: inline-block;
}

.padding-5 {
  padding: 5px;
}

.botao-consulta-whatsapp-2 {
  border: 1px solid var(--whatsapp-verde);
  background-color: var(--whatsapp-verde);
  text-align: center;
  border-radius: 20px;
  margin-bottom: 5px;
  transition: color 0.2s, background-color 0.35s;
  display: block;
}

.botao-consulta-whatsapp-2:hover {
  background-color: var(--branco);
  color: var(--whatsapp-verde);
}

.negrito {
  font-weight: 700;
}

.margem-inferior-10 {
  margin-bottom: 10px;
}

.alinhamento-esquerdo {
  text-align: left;
}

.texto-sucesso {
  font-size: 16px;
}

.bloco-conversao-whatsapp {
  z-index: 30;
  background-color: var(--whatsapp-verde-escuro);
  text-align: center;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0px;
}

.bloco-conversao-whatsapp.oculta {
  display: none;
}

.div {
  position: relative;
}

.div.conversao {
  text-align: right;
  margin-bottom: 8px;
}

.botao-whatsapp {
  background-color: var(--whatsapp-verde);
  color: var(--branco);
  text-align: center;
  text-transform: uppercase;
  background-image: url("../images/Icone-Whatsapp-chat_1Icone-Whatsapp-chat.png");
  background-position: 10% center;
  background-repeat: no-repeat;
  background-size: 25px auto;
  border-radius: 5px;
  width: 100%;
  font-size: 0.9em;
  font-weight: 700;
  display: block;
}

.botao-whatsapp:hover {
  color: var(--cinza);
  background-color: rgb(255, 255, 255);
}

.z-index-10 {
  z-index: 10;
  position: relative;
}

.div-64 {
  flex-direction: column;
  width: 64%;
  display: flex;
}

.fonte-cor-2 {
  color: var(--cor-2);
}

.paragrafo-1 {
  margin-bottom: 0px;
  font-size: 18px;
  line-height: 1.2em;
}

.ornamento-linha-4 {
  background-color: rgb(0, 0, 0);
  width: 140px;
  height: 1px;
  display: inline-block;
}

.tabs-menu {
  justify-content: space-around;
  display: flex;
}

.titulo-tab-simulador {
  margin-top: 5px;
  font-size: 0.9rem;
  line-height: 0.9rem;
}

.tab-content-pane {
  padding-left: 8px;
  padding-right: 8px;
}

.alinhamento-centralizado-vertical {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.icone-input-form.cor-1 {
  background-color: rgb(215, 181, 93) !important;
}

h2.titulo-pagina.cor-fonte-2.negrito {
  font-weight: 400;
}

input.botao-1.w-button.cor-1 {
  background-color: rgb(215, 181, 93) !important;
  color: rgb(29, 49, 40);
}

.cor-1 {
  background-color: var(--cor-1) !important;
}

.cor-2 {
  background-color: var(--cor-2) !important;
}

.cor-fonte-1 {
  color: var(--fonte-cor-1) !important;
}

.cor-fonte-2 {
  color: var(--fonte-cor-2) !important;
}

.ornamento-linha-4.margem-inferior-20.margem-superior-20 {
  background-color: var(--cor-1) !important;
}

/* --- Rodapé: classes do HTML de referência que faltavam aqui -------------
   Conferido no site da Midas no ar em 21/09/2026. */

/* Vem do components.css da Midas (base Webflow). Repetida aqui para o
   rodapé não depender dessa base. */
.w-inline-block {
  max-width: 100%;
  display: inline-block;
}

/* Vem do detalhes.acaoweb.css da Midas */
.img-rodape {
  max-width: 150px;
}

/* A Midas só estiliza a variação .imagem-logo.largura-50, que o rodapé não
   usa. Sem esta regra a imagem cai no comportamento inline do navegador. */
.imagem-logo {
  display: block;
  height: auto;
}

/* Na Midas só existe combinada com botão; aqui vale sozinha, como a
   .margem-superior-20 acima. */
.margem-superior-10 {
  margin-top: 10px;
}

/* .wf-section e .bloco-interno-rodape não têm regra nenhuma no site da
   Midas: são só marcadores no HTML. Ficam declaradas para constar e para
   receber estilo daqui, se um dia for preciso. */
.wf-section {
}

.bloco-interno-rodape {
}

/* Mesma situação nas três abaixo, que vêm do card de carta contemplada da
   AJ Capital (html-padrao/card-carta-contemplada.html). Conferi a folha
   deles: ajcapital.css não declara nenhuma das três. Quem veste o bloco de
   erro é o components.css do Webflow, por .w-form-fail e .w-form-done, que
   este site já carrega — e o texto vermelho do erro vem do .paragrafo-erro,
   no detalhes.rauberconsorcio.css.

   Ficam declaradas para constar: são os ganchos previstos pelo markup, e é
   aqui que entra o estilo se um dia for preciso diferenciar o retorno do
   formulário de carta do retorno dos demais. */
.form-whatsapp {
}

.div-sucesso {
}

.div-erro-2 {
}

/* Menu do topo (html-padrao/menu.html). Regras de
   midasconsorcios.com.br/css/midasconsorcios.css. O comportamento — abrir o
   dropdown e o sanduíche — é do bundle do Webflow em js/acaoweb.js, que as
   páginas carregam depois do jQuery. */
.secao-menu-2 {
  background-color: var(--cor-2);
  width: 100%;
  z-index: 100;
  display: block;
  position: relative;
  overflow: visible;
}

.bloco-sup {
  padding: 3px 5vw 6px;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.link-contatos-superior {
  color: var(--branco);
  letter-spacing: .8px;
}

.menu {
  background-color: rgba(0, 0, 0, 0);
}

.div-logos {
  align-self: center;
  align-items: center;
  width: 21%;
  margin-right: 10px;
  display: flex;
}

.link-logo.margem-direita-10 {
  margin-left: 10px;
}

.menu-flex {
  background-color: var(--transparente);
  flex: 1;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.link-menu {
  color: var(--branco);
  border-bottom: 1px solid rgba(0, 0, 0, 0);
  padding: 15px 0 5px;
}

.link-menu:hover {
  color: var(--branco);
  border-bottom: 1px solid var(--branco);
}

.link-menu.cor-fonte-1 {
  color: var(--branco);
}

.menu-text {
  margin-bottom: 0;
}

.fonte-branco {
  color: #fff;
}

.largura-auto {
  width: auto;
}

.botao-menu.w--open {
  background-color: var(--transparente);
}

/* Seção de contato (html-padrao/secao-contato.html). Regras tiradas de
   midasconsorcios.com.br/css/midasconsorcios.css. A .cor-neutra e a
   .paragrafo sozinhas não têm regra lá: são marcadores. */
.div-48 {
  flex-direction: column;
  width: 48%;
  display: flex;
}

.div-100 {
  width: 100%;
}

.div-padding-20 {
  padding: 20px;
}

.div-borda-cor {
  background-color: var(--branco);
  border: 1px solid #830909;
  border-radius: 5px;
}

/* Combinadas, a borda passa a seguir o token — é o que a Midas faz. */
.div-padding-20.div-borda-cor {
  border-color: var(--cor-2);
}

.input.text-area {
  min-height: 80px;
}

.paragrafo.rodape {
  margin-bottom: 0;
}

/* Assinatura da agência (.secao-acao-2), logo abaixo do rodapé.
   .link-acao-web não tem regra nenhuma na Midas: é só marcador no HTML. */
.secao-acao-2 {
  z-index: 1500;
  text-align: center;
  padding-top: 6px;
  padding-bottom: 6px;
  position: relative;
}

.div-acao {
  z-index: 2100;
  background-color: var(--branco);
  text-align: center;
  margin-bottom: 70px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 10px;
  padding-bottom: 10px;
  display: block;
  position: relative;
}

.link-texto-acao-web {
  color: #000b98;
  text-decoration: none;
}

.titulo-acao-web {
  color: #000b98;
  margin-top: 0;
  margin-bottom: 0;
  margin-right: 5px;
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  text-decoration: none;
  display: inline-block;
}

.imagem-acao-web {
  width: 80px;
}

/* Chat flutuante do WhatsApp (.secao-chat-whatsapp-cookie-2). Na Midas a
   barra atravessa a tela inteira porque divide espaco com o aviso de
   cookies — dai o space-between e o nome da classe. */
.secao-chat-whatsapp-cookie-2 {
  width: 100%;
  /* CORRIGIDO EM RELAÇÃO À MIDAS: lá esta linha é `z-index: 1400`, abaixo
     dos 1500 da .secao-acao-2 — ou seja, a assinatura da agência pinta por
     cima do botão de WhatsApp. Na Midas isso nunca aparece porque o
     .div-acao reserva de 70 a 120px de folga embaixo, e os dois blocos não
     chegam a se encontrar. Em qualquer site que dispense essa folga o botão
     some atrás da assinatura.

     O 2200 do .bloco-whatsapp-2 logo abaixo não resolve: ele fica preso no
     contexto de empilhamento que esta regra cria ao juntar `position:
     fixed` com z-index, então só ordena o bloco entre os irmãos dele.

     2300 põe o botão acima da assinatura, que é o comportamento esperado de
     um botão flutuante. A barra continua atravessável ao clique — quem
     cuida disso é o `pointer-events` na folha de cada site. */
  z-index: 2300;
  justify-content: space-between;
  display: flex;
  position: fixed;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.bloco-whatsapp-2 {
  z-index: 2200;
  text-align: center;
  display: flex;
}

.whatsapp-botao-verde {
  /* #078a76 e o mesmo valor de --whatsapp-verde-escuro */
  background-color: var(--whatsapp-verde-escuro);
  border-radius: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 8px 20px 10px;
  text-decoration: none;
  transition: background-color .2s;
  display: block;
  box-shadow: 0 2px 5px #0006;
}

.whatsapp-botao-verde:hover {
  background-color: #027664;
  text-decoration: none;
}

.whatsapp-icone {
  display: inline-block;
}

.whatsapp-icone-image {
  width: 22px;
  height: 22px;
}

.whatsapp-paragrafo {
  color: #fff;
  margin-top: 2px;
  margin-bottom: 0;
  margin-left: 5px;
  display: inline-block;
}

/* ==================== TABLET (até 991px) ==================== */
@media screen and (max-width: 991px) {
  .div-24 {
    width: 48%;
  }

  .div-produto {
    padding-bottom: 5px;
  }

  .preco-produto {
    font-size: 18px;
  }

  .div-simulador-slide {
    width: 60%;
    margin-top: 30px;
    margin-left: auto;
    margin-right: auto;
    display: block;
    position: relative;
    inset: 0px;
  }

  .div-flex-horizontal {
    flex-wrap: wrap;
  }

  .div-72.div-tablet-100 {
    width: 100%;
  }

  .div-32 {
    width: 49%;
  }

  .div-flex-vertical {
    flex-wrap: wrap;
  }

  .div.conversao {
    margin-bottom: 4px;
  }

  .bloco-whatsapp-2 {
    padding-left: 0;
    padding-right: 0;
    left: 10px;
  }

  .secao-chat-whatsapp-cookie-2 {
    flex-direction: column;
  }

  .div-acao {
    margin-bottom: 90px;
    display: block;
  }

  .menu {
    z-index: 10000;
    padding-top: 6px;
    padding-bottom: 6px;
    transform: none;
  }

  .div-logos {
    width: 60%;
  }

  .link-logo {
    margin-top: 0;
  }

  .link-menu {
    text-align: center;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 20px;
    line-height: 22px;
    display: block;
  }

  .botao-menu {
    margin-top: 10px;
    padding: 0;
  }

  .div-48.div-mobile-100 {
    width: 100%;
  }

  .div-tablet-100 {
    width: 100%;
  }
}

/* ==================== CELULAR PAISAGEM (até 767px) ==================== */
@media screen and (max-width: 767px) {
  .div-produto {
    margin-bottom: 20px;
  }

  .preco-produto {
    margin-bottom: 10px;
    font-size: 21px;
    line-height: 24px;
  }

  .titulo-pagina {
    font-size: 2em;
  }

  .div-simulador-slide {
    width: auto;
    margin-left: 20px;
    margin-right: 24px;
  }

  .div-72.div-tablet-100 {
    width: auto;
  }

  .bloco-conversao-whatsapp {
    position: absolute;
    inset: 0px;
  }

  .whatsapp-paragrafo {
    font-size: 16px;
  }

  .bloco-whatsapp-2 {
    justify-content: flex-end;
  }

  .secao-chat-whatsapp-cookie-2 {
    margin-left: 0;
  }

  .secao-acao-2 {
    position: relative;
  }

  .div-acao {
    z-index: 5000;
    margin-bottom: 110px;
    position: relative;
  }

  .botao-menu {
    margin-top: 5px;
  }

  .div-mobile-100 {
    width: 100%;
  }

  .botao-whatsapp {
    padding-top: 8px;
    padding-bottom: 8px;
  }
}

/* ==================== CELULAR (até 479px) ==================== */
@media screen and (max-width: 479px) {
  .div-24 {
    width: 100%;
  }

  .preco-produto {
    font-size: 22px;
  }

  .opcao-simulador {
    display: inline-block;
  }

  .titulo-pagina {
    font-size: 1.8em;
  }

  .div-simulador-slide {
    min-width: auto;
    margin-left: 15px;
    margin-right: 15px;
  }

  .div-padding-10 {
    padding-top: 5px;
    padding-bottom: 5px;
  }

  .titulo-maiusculas-2 {
    font-size: 0.8em;
  }

  .botao-1 {
    padding-left: 12px;
    padding-right: 12px;
  }

  .div-32 {
    width: auto;
  }

  .div-padding-5 {
    padding-top: 5px;
    padding-bottom: 5px;
  }

  .margem-inferior-60 {
    margin-bottom: 20px;
  }

  .margem-inferior-20 {
    margin-bottom: 20px;
  }

  .whatsapp-icone-image {
    width: 20px;
    height: 20px;
  }

  .whatsapp-botao-verde {
    padding-top: 4px;
    padding-bottom: 8px;
  }

  .whatsapp-paragrafo {
    margin-left: 6px;
  }

  .bloco-whatsapp-2 {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    width: 100%;
    margin-left: 0;
    display: block;
    left: 0;
  }

  .secao-acao-2 {
    text-align: center;
    padding-bottom: 50px;
  }

  .div-acao {
    width: 100%;
    margin-bottom: 120px;
  }

  .div-logos {
    width: 70%;
  }

  .div-48 {
    width: auto;
  }

  .paragrafo.rodape {
    display: inline;
  }

  .botao-whatsapp {
    padding-left: 12px;
    padding-right: 12px;
  }
}

/* ==========================================================================
   Slide do banner — padrão do site da AJ Capital (ajcapital.com.br)
   --------------------------------------------------------------------------
   Regra tirada de ajcapital.com.br/css/ajcapital.css, a folha do site deles.
   O resto do bloco já chega pelo detalhes.acaoweb.css, que este site também
   carrega: .secao-slides { position: relative } e, até 991px,
   .slide-gradiente { min-height: 400px; padding-top: 160px }.

   Uma só declaração ficou de fora: o `background-image` da AJ, que aponta
   para uma foto do site deles. Aqui a foto entra pelo style de cada página,
   junto com o gradiente — do mesmo jeito que a AJ faz nos slides em que a
   imagem muda. Por isso as três linhas de background abaixo declaram duas
   camadas: a primeira é o gradiente, a segunda é a foto.
   ========================================================================== */
.slide-gradiente {
  color: #fff;
  background-position: 0 0, 50% 0;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  padding: 35px 5vw;
}