/* BPG — ajustes globais (todas as páginas): ícones do rodapé e botão "Solicite um orçamento".
   Só anima transform/opacity; respeita prefers-reduced-motion. */

/* ---------- ícones do rodapé: mesmo estilo dourado da marca ---------- */
.elementor-widget-social-icons .elementor-social-icon.bpg-social {
  --icon-size: 18px;
  --icon-padding: 11px;
  --e-social-icon-icon-color: #000407;
  background-color: #f3b626;
  color: #000407;
  transition:
    transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
    background-color 0.3s ease;
}
.elementor-widget-social-icons .elementor-social-icon.bpg-social svg {
  fill: #000407;
}
.elementor-widget-social-icons .elementor-social-icon.bpg-social:hover,
.elementor-widget-social-icons .elementor-social-icon.bpg-social:focus-visible {
  background-color: #ffca08;
  transform: translateY(-3px);
}
.elementor-widget-social-icons .elementor-social-icon.bpg-social:focus-visible {
  outline: 2px solid #ffca08;
  outline-offset: 3px;
}
/* espaço entre os ícones sem depender do espaço em branco do HTML (modo grid-0 do Elementor) */
.elementor-widget-social-icons .elementor-social-icons-wrapper:has(.bpg-social) {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  word-spacing: normal;
}

/* ---------- botão fixo "Peça sua cotação agora" (leva ao formulário) ---------- */
.bpg-quote {
  position: fixed;
  z-index: 9990;
  right: 24px;
  bottom: 24px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 18px 26px;
  overflow: hidden;
  border-radius: 14px;
  background: linear-gradient(135deg, #ffd43b, #ffca08 45%, #f3b626);
  color: #000407 !important;
  font: 700 16px/1 Sora, sans-serif;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  text-decoration: none !important;
  box-shadow:
    0 0 0 1px rgb(0 4 7 / 0.08),
    0 22px 34px -8px rgb(255 202 8 / 0.55);
  animation: bpg-quote-in 0.7s cubic-bezier(0.22, 1, 0.36, 1) 1.2s backwards;
  transition:
    transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.3s ease;
}
/* brilho que atravessa o botão: 2 passadas logo depois de entrar e para (WCAG 2.2.2) */
.bpg-quote::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent 30%, rgb(255 255 255 / 0.75) 50%, transparent 70%);
  transform: translateX(-120%);
  animation: bpg-quote-shine 1.1s ease-in-out 2.2s 2;
  pointer-events: none;
}
.bpg-quote__text,
.bpg-quote__arrow {
  position: relative;
}
.bpg-quote__arrow {
  font-size: 20px;
  transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}
.bpg-quote:focus-visible {
  transform: translateY(-3px);
  outline: 2px solid #000407;
  outline-offset: -5px;
  box-shadow:
    0 0 0 3px #fff,
    0 22px 34px -8px rgb(255 202 8 / 0.55);
}
.bpg-quote:focus-visible .bpg-quote__arrow {
  transform: translateX(4px);
}
@media (hover: hover) {
  .bpg-quote:hover {
    transform: translateY(-3px);
    box-shadow:
      0 0 0 1px rgb(0 4 7 / 0.1),
      0 26px 40px -8px rgb(255 202 8 / 0.7);
  }
  .bpg-quote:hover .bpg-quote__arrow {
    transform: translateX(5px);
  }
}
@keyframes bpg-quote-in {
  from {
    opacity: 0;
    visibility: hidden;
    transform: translateY(24px) scale(0.96);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes bpg-quote-shine {
  to {
    transform: translateX(120%);
  }
}
/* espaço no fim do rodapé para o botão fixo não cobrir endereço e copyright */
[data-elementor-type="footer"] > .elementor-top-section:last-child,
[data-elementor-type="footer"] > .e-con:last-child {
  padding-bottom: 88px;
}

@media (max-width: 720px) {
  .bpg-quote {
    right: 14px;
    bottom: 14px;
    padding: 14px 18px;
    font-size: 14px;
  }
  [data-elementor-type="footer"] > .elementor-top-section:last-child,
  [data-elementor-type="footer"] > .e-con:last-child {
    padding-bottom: 72px;
  }
}

/* telas baixas (zoom alto, celular deitado): botão mais compacto */
@media (max-height: 480px) {
  .bpg-quote {
    right: 12px;
    bottom: 12px;
    padding: 10px 14px;
    font-size: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .bpg-quote,
  .bpg-quote::before,
  .bpg-quote__arrow,
  .elementor-widget-social-icons .elementor-social-icon.bpg-social {
    animation: none;
    transition: none;
  }
}

/* aviso do formulário "Fale Conosco" (pedido enviado, ou falha no envio) */
.bpg-form-note {
  width: 100%;
  margin: 14px 0 0;
  padding: 12px 16px;
  border-radius: 12px;
  background: #e8f8ee;
  color: #0b5b2c;
  font: 500 15px/1.4 "Inter Tight", sans-serif;
}
.bpg-form-note--erro {
  background: #fff4e5;
  color: #7a4100;
}
.bpg-form-live {
  width: 100%;
}
/* campo-isca do formulário: fora da tela para pessoas, visível para robôs */
.bpg-hp {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
}

/* =====================================================================================
   Posicionamento e proporção (revisão de 10/10/2026, medida em 320 a 1440 px e com o site
   traduzido). Cada regra tem o escopo da página: .elementor-4029 home, 5006 contato,
   5028 sobre nós, 261 cabeçalho, 258 rodapé.
   ===================================================================================== */

/* ---------- faixa de idiomas (bpg/idiomas.js) ---------- */
/* o GTranslate monta os links (a.glink) e o idiomas.js os troca por uma faixa com a bandeira de cada
   um dos 13 idiomas, todas à mostra, para quem chega de qualquer país achar a sua logo de cara.
   Os links continuam no DOM, escondidos: são eles que traduzem a página. */
/* na mesma caixa da linha do logo e do menu; acima do cabeçalho fixo (z-index 9999 do Elementor),
   para a dica com o nome do idioma passar por cima dele */
.elementor-261 .elementor-element.elementor-element-339c311 {
  --content-width: min(100%, 710px);
  position: relative;
  z-index: 10000;
  background-color: #fff;
}
/* espaço reservado: a barra chega vazia e é preenchida depois, sempre com a mesma altura, para o
   topo não pular quando a faixa aparece */
.elementor-261 .gtranslate_wrapper {
  display: flex;
  align-items: center;
  min-height: 32px;
}
.elementor-261 .gtranslate_wrapper.bpg-idiomas > a.glink {
  display: none;
}
.elementor-261 .bpg-idiomas__faixa {
  display: flex;
  align-items: center;
  gap: 2px;
  direction: ltr; /* a mesma ordem das bandeiras em todos os idiomas, também no árabe */
}
.elementor-261 .bpg-idiomas__globo {
  flex: none;
  width: 17px;
  height: 17px;
  margin-inline-end: 8px;
  color: #5b6066;
}
.elementor-261 .bpg-idiomas__item {
  -webkit-appearance: none;
  appearance: none;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 37px;
  height: 32px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  box-shadow: none;
  color: #000407;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background-color 0.2s ease;
}
.elementor-261 .bpg-idiomas__item:hover,
.elementor-261 .bpg-idiomas__item:focus {
  background: transparent;
  color: #000407;
  outline: none;
}
.elementor-261 .bpg-idiomas__item:focus-visible {
  outline: 2px solid #000407;
  outline-offset: 1px;
}
.elementor-261 .bpg-idiomas__bandeira {
  flex: none;
  display: block;
  width: 24px;
  height: 18px;
  max-width: none;
  margin: 0;
  border: 0;
  border-radius: 3px;
  object-fit: cover;
  box-shadow: 0 0 0 1px rgb(0 4 7 / 0.12);
  transition: transform 0.2s cubic-bezier(0.22, 1, 0.36, 1);
}
/* idioma atual: anel dourado com a borda escura (o anel se destaca no branco) */
.elementor-261 .bpg-idiomas__item[aria-current="true"] .bpg-idiomas__bandeira {
  box-shadow:
    0 0 0 2px #fff,
    0 0 0 4px #f3b626,
    0 0 0 5px rgb(0 4 7 / 0.5);
}
/* computador: a bandeira cresce um pouco sob o mouse e aparece o nome do idioma */
@media (hover: hover) and (pointer: fine) {
  .elementor-261 .bpg-idiomas__item:hover {
    background: #f4f2ec;
  }
  .elementor-261 .bpg-idiomas__item:hover .bpg-idiomas__bandeira {
    transform: scale(1.12);
  }
  .elementor-261 .bpg-idiomas__item::after {
    content: attr(data-nome);
    position: absolute;
    top: calc(100% + 6px);
    left: 50%;
    z-index: 2;
    padding: 6px 10px;
    border-radius: 7px;
    background: #000407;
    color: #fff;
    font: 500 12px/1 Sora, sans-serif;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, -3px);
    transition:
      opacity 0.15s ease,
      transform 0.15s ease;
  }
  .elementor-261 .bpg-idiomas__item:is(:hover, :focus-visible)::after {
    opacity: 1;
    transform: translate(-50%, 0);
  }
}
/* computador e tablet: a faixa no meio do topo; o globo à esquerda é compensado do outro lado
   para as bandeiras ficarem exatamente no centro (alinhadas ao logo e ao menu, também no meio) */
@media (min-width: 768px) {
  .elementor-261 .elementor-element.elementor-element-475e04e {
    width: 100%;
  }
  .elementor-261 .gtranslate_wrapper {
    justify-content: center;
  }
  .elementor-261 .bpg-idiomas__faixa {
    padding-inline: 6px 0; /* globo + bandeiras no centro exato (medido no navegador, pt e árabe) */
  }
}
/* celular: as 13 bandeiras numa linha da largura do logo ao menu, toque de 44 px de altura */
@media (max-width: 767px) {
  .elementor-261 .elementor-element.elementor-element-339c311 {
    padding-inline: 20px;
  }
  .elementor-261 .gtranslate_wrapper {
    min-height: 44px;
  }
  .elementor-261 .gtranslate_wrapper.bpg-idiomas {
    display: block;
  }
  .elementor-261 .bpg-idiomas__faixa {
    display: grid;
    grid-template-columns: repeat(13, minmax(0, 1fr));
    gap: 0;
  }
  .elementor-261 .bpg-idiomas__globo {
    display: none;
  }
  .elementor-261 .bpg-idiomas__item {
    width: auto;
    height: 44px;
  }
  .elementor-261 .bpg-idiomas__bandeira {
    width: 20px;
    height: 15px;
  }
  .elementor-261 .bpg-idiomas__item[aria-current="true"] .bpg-idiomas__bandeira {
    box-shadow:
      0 0 0 1.5px #fff,
      0 0 0 3.5px #f3b626,
      0 0 0 4.5px rgb(0 4 7 / 0.5);
  }
}
/* telas bem estreitas (até 359 px): duas linhas, para cada bandeira ter pelo menos 24 px de toque */
@media (max-width: 359px) {
  .elementor-261 .gtranslate_wrapper {
    min-height: 80px;
  }
  .elementor-261 .bpg-idiomas__faixa {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .elementor-261 .bpg-idiomas__item {
    height: 40px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .elementor-261 .bpg-idiomas__item,
  .elementor-261 .bpg-idiomas__item::after,
  .elementor-261 .bpg-idiomas__bandeira {
    transition: none;
  }
}
/* aviso do idioma automático (bpg/idioma-auto.js): balão sob a faixa, por cima do conteúdo (não empurra
   o topo), com "Ver em português" e fechar */
.gtranslate_wrapper.bpg-idiomas {
  position: relative;
}
.bpg-idioma-aviso {
  position: absolute;
  z-index: 10001;
  top: calc(100% + 6px);
  left: 50%;
  display: flex;
  align-items: center;
  gap: 4px 12px;
  width: max-content;
  max-width: calc(100vw - 32px);
  padding: 6px 6px 6px 14px;
  border-radius: 10px;
  background: #000407;
  color: #fff;
  font: 500 13px/1.35 Sora, sans-serif;
  box-shadow: 0 10px 28px rgb(0 4 7 / 0.28);
  transform: translateX(-50%);
  animation: bpg-idioma-aviso-entra 0.25s ease-out;
}
.bpg-idioma-aviso[dir="rtl"] {
  padding: 6px 14px 6px 6px;
}
.bpg-idioma-aviso::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 50%;
  width: 10px;
  height: 10px;
  background: inherit;
  transform: translateX(-50%) rotate(45deg);
}
@keyframes bpg-idioma-aviso-entra {
  from {
    opacity: 0;
    transform: translate(-50%, -4px);
  }
}
.bpg-idioma-aviso__texto {
  color: rgb(255 255 255 / 0.88);
}
.bpg-idioma-aviso button {
  -webkit-appearance: none;
  appearance: none;
  min-height: 32px;
  margin: 0;
  border: 0;
  border-radius: 7px;
  background: transparent;
  box-shadow: none;
  font: inherit;
  cursor: pointer;
}
.bpg-idioma-aviso .bpg-idioma-aviso__pt {
  padding: 4px 8px;
  color: #f3b626;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.bpg-idioma-aviso .bpg-idioma-aviso__fechar {
  width: 32px;
  padding: 0;
  color: #fff;
  font-size: 18px;
  line-height: 1;
}
.bpg-idioma-aviso button:hover,
.bpg-idioma-aviso button:focus {
  background: rgb(255 255 255 / 0.1);
  color: #ffca08;
}
.bpg-idioma-aviso .bpg-idioma-aviso__fechar:hover,
.bpg-idioma-aviso .bpg-idioma-aviso__fechar:focus {
  color: #fff;
}
.bpg-idioma-aviso button:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 1px;
}
@media (max-width: 767px) {
  .bpg-idioma-aviso {
    top: calc(100% + 2px);
    gap: 2px 6px;
    padding: 2px 2px 2px 12px;
    font-size: 12px;
    line-height: 1.25;
  }
  .bpg-idioma-aviso[dir="rtl"] {
    padding: 2px 12px 2px 2px;
  }
  .bpg-idioma-aviso .bpg-idioma-aviso__pt {
    padding: 4px 6px;
    white-space: nowrap;
  }
}
@media (prefers-reduced-motion: reduce) {
  .bpg-idioma-aviso {
    animation: none;
  }
}

/* ---------- cabeçalho e menu ---------- */
@media (max-width: 1024px) {
  /* o padding-top do botão jogava a lista aberta por cima do próprio botão (o X sumia) */
  .elementor-261 .elementor-element.elementor-element-407dbaa > .elementor-widget-container {
    padding-top: 0;
  }
  .elementor-261 .elementor-element.elementor-element-183bbf7b.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated {
    align-content: center;
    align-items: center;
  }
  /* logo e botão do menu proporcionais (no tablet o logo tinha o dobro do computador) */
  .elementor-261 .elementor-element.elementor-element-70b7ac72 {
    text-align: start;
  }
  .elementor-261 .elementor-element.elementor-element-70b7ac72 img {
    width: 72px;
    max-width: 72px;
  }
  .elementor-261 .elementor-element.elementor-element-407dbaa {
    --container-widget-width: 100%;
    --nav-menu-icon-size: 28px;
    width: 100%;
    max-width: 100%;
  }
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-menu-toggle {
    margin: 0;
    margin-inline-start: auto;
    padding: 8px;
  }
}
@media (max-width: 767px) {
  .elementor-261 .elementor-element.elementor-element-5267aeb4 {
    padding: 12px 20px;
  }
  .elementor-261 .elementor-element.elementor-element-183bbf7b {
    width: 60%;
  }
  .elementor-261 .elementor-element.elementor-element-70b7ac72 img {
    width: 64px;
    max-width: 64px;
  }
}
/* celular e tablet (até 1024 px): os 3 itens do menu (Início, Produtos, Fale Conosco) ficam à mostra ao lado do logo, sem
   o ícone de hambúrguer (pedido do dono, 22/10). Reaproveita o menu horizontal do Elementor (o do computador, com o
   SmartMenus): Produtos e Fale Conosco abrem o submenu ao toque e o fecham ao tocar fora. O menu em hambúrguer
   (nav.elementor-nav-menu--dropdown + o botão) fica escondido. Se a linha não couber (idioma de rótulo longo em tela
   estreita), o menu desce para uma linha própria sob o logo. */
@media (max-width: 1024px) {
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-menu-toggle,
  .elementor-261 .elementor-element.elementor-element-407dbaa nav.elementor-nav-menu--dropdown {
    display: none !important;
  }
  .elementor-261 .elementor-element.elementor-element-5267aeb4 > .elementor-container {
    flex-wrap: wrap;
    align-items: center;
  }
  .elementor-261 .elementor-element.elementor-element-36e3fcbd.elementor-column {
    width: auto;
    flex: 0 0 auto;
  }
  .elementor-261 .elementor-element.elementor-element-5267aeb4 .elementor-column > .elementor-widget-wrap.elementor-element-populated {
    padding: 0;
  }
  .elementor-261 .elementor-element.elementor-element-183bbf7b.elementor-column {
    padding-inline-start: 8px;
  }
  .elementor-261 .elementor-element.elementor-element-183bbf7b.elementor-column {
    width: auto;
    flex: 1 1 0;
    min-width: min-content;
  }
  .elementor-261 .elementor-element.elementor-element-407dbaa {
    --container-widget-width: 100%;
    width: 100%;
    max-width: 100%;
  }
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--main {
    display: block;
  }
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--main > .elementor-nav-menu {
    display: flex;
    flex-wrap: wrap; /* rótulo muito longo (ex.: o holandês em 360 px): o último item desce para outra linha */
    justify-content: flex-end;
    align-items: center;
    gap: 0 2px;
  }
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--main > .elementor-nav-menu > li {
    flex: 0 0 auto;
  }
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--main .elementor-nav-menu > li > a.elementor-item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    min-height: 44px;
    padding: 0 7px;
    font-size: 15px;
    line-height: 1.2;
    letter-spacing: 0;
    white-space: nowrap;
  }
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--main .elementor-nav-menu > li > a.elementor-item .sub-arrow {
    display: inline-flex;
    margin: 0;
    padding: 0;
    font-size: 12px;
  }
  /* o traço do item (efeito de sublinhado do Elementor): fino, perto do texto */
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--main.e--pointer-underline .elementor-item::before,
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--main.e--pointer-underline .elementor-item::after {
    height: 2px;
  }
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--main.e--pointer-underline .elementor-item::before {
    top: 8px;
  }
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--main.e--pointer-underline .elementor-item::after {
    bottom: 8px;
  }
  /* submenu: painel na largura da tela logo abaixo do cabeçalho, rola por dentro se passar da tela (a altura é acertada
     pelo idiomas.js, pela posição real do cabeçalho); alvos de toque de 48 px */
  .elementor-261 .elementor-element.elementor-element-5267aeb4 {
    position: relative;
  }
  .elementor-261 .elementor-element.elementor-element-5267aeb4 :is(.elementor-container, .elementor-column, .elementor-widget-wrap, .elementor-widget),
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--main,
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--main > .elementor-nav-menu,
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--main > .elementor-nav-menu > li {
    position: static;
  }
  .elementor-261 .elementor-element.elementor-element-5267aeb4 .elementor-column.elementor-element-36e3fcbd {
    position: relative; /* o logo continua acima do fundo da seção */
  }
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--main .sub-menu.elementor-nav-menu--dropdown {
    position: absolute !important;
    top: 100% !important;
    right: 0 !important;
    left: 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    max-height: var(--bpg-sub-max, calc(100dvh - 170px));
    overflow-y: auto;
    overscroll-behavior: contain;
    margin: 0 !important;
    border-radius: 0 0 16px 16px;
    box-shadow: 0 18px 30px rgb(0 4 7 / 0.28);
    background-color: #fff;
  }
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--main .sub-menu a.elementor-sub-item {
    display: flex;
    align-items: center;
    min-height: 48px;
    padding: 10px 24px;
    font-size: 16px;
    line-height: 1.3;
    text-align: start;
  }
}
@media (max-width: 767px) {
  .elementor-261 .elementor-element.elementor-element-5267aeb4 {
    padding: 8px 20px;
  }
  .elementor-261 .elementor-element.elementor-element-70b7ac72 img {
    width: 44px;
    max-width: 44px;
  }
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--main .elementor-nav-menu > li > a.elementor-item {
    padding: 0 5px;
    font-size: 14px;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--main .elementor-nav-menu > li > a.elementor-item {
    padding: 0 14px;
    font-size: 18px;
  }
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--main .elementor-nav-menu > li > a.elementor-item .sub-arrow {
    font-size: 14px;
  }
}
/* computador: logo e menu juntos no meio do cabeçalho (antes ficavam encostados à esquerda da caixa
   de 710 px, com um vão de 160 px à direita). A faixa de idiomas segue a regra dela, sem mudar. */
@media (min-width: 1025px) {
  .elementor-261 .elementor-element.elementor-element-5267aeb4 > .elementor-container {
    justify-content: center;
  }
  .elementor-261 .elementor-element.elementor-element-183bbf7b.elementor-column {
    width: auto;
    flex: 0 1 auto;
  }
  .elementor-261 .elementor-element.elementor-element-407dbaa {
    --container-widget-width: auto;
    width: auto;
    max-width: none;
  }
}
/* menu aberto: item da página atual legível (era preto sobre cinza escuro) */
.elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--dropdown a.elementor-item-active,
.elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--dropdown a.highlighted,
.elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--dropdown a:focus-visible {
  color: #fff;
  fill: #fff;
}
@media (min-width: 768px) and (max-width: 1024px) {
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--dropdown .elementor-item {
    font-size: 18px;
  }
}
/* submenu "Produtos" do computador (15 itens desde o etanol e a soja): itens mais baixos (~38 px), para caber
   inteiro abaixo do cabeçalho numa tela útil de ~790 px (MacBook 1440×900); tela mais baixa rola dentro do submenu */
@media (min-width: 1025px) {
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--main .elementor-nav-menu--dropdown a {
    padding-top: 9px;
    padding-bottom: 9px;
  }
  /* o submenu começa a 155 px no topo da página (faixa de idiomas + menu): 170 px deixam o último item inteiro
     num notebook de 1366×768 com a barra do navegador */
  .elementor-261 .elementor-element.elementor-element-407dbaa .elementor-nav-menu--main .sub-menu {
    max-height: calc(100vh - 170px);
    overflow-y: auto;
  }
}
/* foto do topo das páginas de produto: o Elementor a faz flutuar sem parar; parada para quem pede menos movimento */
@media (prefers-reduced-motion: reduce) {
  .elementor-element.elementor-element-7b70901 {
    animation: none !important;
  }
}

/* ---------- logo do topo escondido atrás do cabeçalho (margens negativas do Elementor) ---------- */
@media (max-width: 767px) {
  .elementor-4029 .elementor-element.elementor-element-bc2885f {
    --margin-top: 0px;
  }
}
@media (max-width: 1024px) {
  .elementor-5006 .elementor-element.elementor-element-7b70901 > .elementor-widget-container {
    margin-top: 24px; /* o logo flutua para cima e para baixo */
  }
  .elementor-5028 .elementor-element.elementor-element-7b70901 > .elementor-widget-container {
    margin-top: -60px;
  }
}

/* ---------- home ---------- */
/* topo no tablet: o texto usa a largura livre (o globo já foi para baixo) */
@media (min-width: 768px) and (max-width: 1024px) {
  .elementor.elementor-4029 .elementor-element.elementor-element-bc2885f .elementor-element.elementor-element-0023bd5 {
    --container-widget-width: 100%;
    width: 100%;
    max-width: 640px;
  }
  .elementor-4029 .elementor-element.elementor-element-0023bd5 .elementor-icon-box-description {
    font-size: 21px;
  }
}
/* Soluções: parágrafo de abertura com medida de leitura; cartões sem texto justificado */
.elementor-4029 .elementor-element.elementor-element-33e41b2 .elementor-icon-box-description {
  max-width: 760px;
  margin-inline: auto;
}
@media (min-width: 768px) {
  .elementor-4029 .elementor-element.elementor-element-5260da3,
  .elementor-4029 .elementor-element.elementor-element-c9deaff,
  .elementor-4029 .elementor-element.elementor-element-00d11a0 {
    text-align: start; /* à esquerda em português, à direita em árabe */
  }
}
/* tablet: um cartão por linha (a foto inteira, sem corte, está no prova-social.css) */
@media (min-width: 768px) and (max-width: 1024px) {
  .elementor-4029 .elementor-element.elementor-element-253abe5,
  .elementor-4029 .elementor-element.elementor-element-22382a2 {
    --flex-direction: column;
  }
  .elementor-4029 .elementor-element.elementor-element-02dce86,
  .elementor-4029 .elementor-element.elementor-element-3ace49c,
  .elementor-4029 .elementor-element.elementor-element-e17bce9 {
    --width: 100%;
    width: 100%;
  }
}
/* Motivos (home e sobre nós): o contêiner de 1600 px passa a caber na tela, na grade de 1140 px. A foto da
   fachada vai inteira (16:9; caixa e cantos no prova-social.css e no bloco do Sobre Nós mais abaixo): no computador,
   foto e lista dos 6 motivos dividem a largura em duas colunas iguais, centralizadas na vertical (a foto fica
   com ~546 px em 1440); no tablet e no celular a foto vai em cima (ordem do Elementor), na largura da lista */
@media (min-width: 768px) {
  :is(.elementor-4029, .elementor-5028) .elementor-element.elementor-element-f2ad472 {
    --width: 100%;
    max-width: 1140px;
    margin-inline: auto;
  }
  :is(.elementor-4029, .elementor-5028) .elementor-element.elementor-element-8b20ebd > .elementor-widget-container {
    margin: 0;
  }
  .elementor:is(.elementor-4029, .elementor-5028) .elementor-element.elementor-element-8b20ebd img {
    width: 100%;
    max-width: 100%;
  }
}
@media (min-width: 1025px) {
  :is(.elementor-4029, .elementor-5028) .elementor-element.elementor-element-f2ad472 {
    column-gap: 48px;
  }
  .elementor:is(.elementor-4029, .elementor-5028) .e-con > .elementor-element.elementor-element-95f736a {
    --container-widget-width: auto;
    flex: 1 1 0;
    width: auto;
    min-width: 0;
    max-width: none;
  }
  .elementor:is(.elementor-4029, .elementor-5028) .e-con > .elementor-element.elementor-element-8b20ebd {
    --container-widget-width: calc(50% - 24px);
    flex: 0 0 calc(50% - 24px);
    width: calc(50% - 24px);
    max-width: none;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .elementor:is(.elementor-4029, .elementor-5028) .e-con > .elementor-element.elementor-element-8b20ebd {
    --container-widget-width: 100%;
    width: 100%;
    max-width: 100%;
  }
}
/* Nossa História no tablet e no celular: foto centralizada, sem o vão grande até o texto */
@media (max-width: 1024px) {
  .elementor-4029 .elementor-element.elementor-element-ae63c0f {
    --min-height: 0px;
    --justify-content: flex-start;
    --gap: 24px;
    --row-gap: 24px;
  }
  .elementor.elementor-4029 .e-con > .elementor-element.elementor-element-7309658 {
    align-self: center;
  }
  .elementor.elementor-4029 .e-con > .elementor-element.elementor-element-59a93d2 {
    max-width: 720px;
    margin-inline: auto;
  }
}
/* 7 Pilares: grade centralizada, vãos iguais e ícones do mesmo tamanho */
.elementor-4029 .elementor-element.elementor-element-6964581 .elementor-widget-image-box {
  width: calc(50% - 10px);
  max-width: calc(50% - 10px);
}
.elementor-4029 .elementor-element.elementor-element-08604f3 {
  --padding-bottom: 0px;
}
.elementor-4029 .elementor-element.elementor-element-9717cb8 {
  --padding-top: 0px;
}
.elementor-4029 .elementor-element.elementor-element-6964581 .elementor-image-box-img img {
  width: auto;
  height: 32px;
}
@media (min-width: 768px) and (max-width: 1024px) {
  .elementor-4029 .elementor-element.elementor-element-6964581 .elementor-image-box-title {
    font-size: 20px;
  }
}
@media (max-width: 1024px) {
  .elementor.elementor-4029 .elementor-element.elementor-element-6964581 .elementor-element.elementor-element-a3a6458 {
    width: auto;
    max-width: 100%;
  }
}
@media (max-width: 767px) {
  .elementor-4029 .elementor-element.elementor-element-6964581 .elementor-widget-image-box {
    width: 100%;
    max-width: 100%;
  }
  .elementor-4029 .elementor-element.elementor-element-6964581 .elementor-image-box-title {
    font-size: 18px;
    line-height: 1.3;
  }
  /* pílulas ("Por que somos escolhidos?") no tamanho dos outros rótulos de seção */
  .elementor-4029 .elementor-element.elementor-element-54eb682 .elementor-heading-title,
  .elementor-4029 .elementor-element.elementor-element-5bb1838 .elementor-heading-title {
    font-size: 13px;
  }
  .elementor-4029 .elementor-element.elementor-element-54eb682 > .elementor-widget-container {
    padding: 8px 20px;
  }
}
/* entrelinhas no mesmo padrão do resto do texto */
.elementor-4029 .elementor-element.elementor-element-e640829 .elementor-icon-box-description {
  line-height: 1.55;
}
@media (max-width: 767px) {
  .elementor-4029 .elementor-element.elementor-element-0023bd5 .elementor-icon-box-description {
    line-height: 1.5;
  }
  .elementor-4029 .elementor-element.elementor-element-4ab9c0e,
  .elementor-4029 .elementor-element.elementor-element-355127a,
  .elementor-4029 .elementor-element.elementor-element-96155de,
  .elementor-4029 .elementor-element.elementor-element-edfe811 {
    line-height: 1.6;
  }
}

/* ---------- páginas de produto ---------- */
/* Cenouras e Frangos: a coluna decorativa de ícones do topo fica a 850 px à esquerda do centro (CSS do Elementor). Com
   menos de ~1700 px de largura ela sai da tela, e de 1500 a 1700 px (notebooks de 1536 e 1600 px) aparecia cortada
   na borda esquerda: só aparece quando cabe inteira */
@media (max-width: 1719px) {
  .elementor-5769 .elementor-element.elementor-element-3af1965,
  .elementor-5754 .elementor-element.elementor-element-dc63b49 {
    display: none;
  }
}
/* Cenouras e Frangos não têm o script que mostra a seção "Onde estamos": aparece sem a entrada */
.elementor-5769 :is(.entrada-baixo, .entrada-cima),
.elementor-5754 :is(.entrada-baixo, .entrada-cima) {
  opacity: 1;
  transform: none;
  filter: none;
}
/* galeria de fotos em faixa (café verde, carvão, commodities, feijão, frutas e vegetais; contêiner 16ecafc, da largura
   da tela): as fotos saem do carrossel de propósito (CSS do Elementor com overflow visible) e só o <html> as cortava. A
   página ficava de 3 a 9 telas mais larga por dentro, e o foco ou o scrollIntoView num slide fora da tela (leitor de
   tela) empurrava a página para o lado, sem volta (o overflow hidden não deixa rolar de volta). O corte passa para a
   faixa: o visual é o mesmo e a página fica da largura da tela */
.elementor-element-16ecafc.e-con {
  overflow-x: clip;
}
/* títulos dos cards: 22 px em todas as larguras (o Elementor subia para 46 px no tablet) */
.elementor:is(.elementor-4730, .elementor-5277, .elementor-4849, .elementor-4833, .elementor-4861, .elementor-4895, .elementor-5320, .elementor-5421, .elementor-4791, .elementor-4952) .elementor-widget-image + .elementor-widget-heading .elementor-heading-title {
  font-size: 22px;
}
@media (max-width: 1024px) {
  .elementor:is(.elementor-4730, .elementor-5277, .elementor-4849, .elementor-4833, .elementor-4861, .elementor-4895, .elementor-5320, .elementor-5421, .elementor-4791, .elementor-4952) .elementor-widget-image + .elementor-widget-heading .elementor-heading-title {
    line-height: 30px;
  }
  .elementor:is(.elementor-4730, .elementor-5277, .elementor-4849, .elementor-4833, .elementor-4861, .elementor-4895, .elementor-5320, .elementor-5421, .elementor-4791, .elementor-4952) .elementor-widget-image + .elementor-widget-heading > .elementor-widget-container {
    padding-inline: 0;
  }
}
/* Açúcar: fotos dos cards com a mesma altura, títulos de cada linha alinhados */
@media (min-width: 1025px) {
  .elementor.elementor-4730 .e-con > .elementor-widget-image:has(+ .elementor-widget-heading) img {
    height: 300px;
    object-fit: cover;
  }
}
/* Cenouras e Frangos no celular: a descrição longa empurrava a foto do topo para trás do cabeçalho */
@media (max-width: 767px) {
  .elementor:is(.elementor-5769, .elementor-5754) > .e-con.e-parent:first-child {
    --padding-top: 140px;
  }
}
/* bloco Motivos com a mesma largura útil das outras seções */
.elementor-element.elementor-element-f2ad472.e-con:has(> [data-id="d259b7c"]) {
  --width: min(1140px, 100%);
}
.elementor.elementor-5277 .e-con > .elementor-widget.elementor-element-d259b7c {
  max-width: 845px; /* Arroz: texto embaixo da foto, linhas de leitura confortável */
}
@media (min-width: 768px) {
  .elementor.elementor-5277 .e-con > .elementor-widget.elementor-element-8b20ebd {
    --container-widget-width: 100%;
    width: 100%;
    max-width: 845px;
  }
  .elementor.elementor-5277 .elementor-element.elementor-element-8b20ebd img {
    height: auto; /* o Elementor fixa 300 px de altura e a foto achatava */
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .elementor-element.elementor-element-f2ad472.e-con:has(> [data-id="d259b7c"]) > .elementor-widget-image {
    --align-self: center;
  }
  .elementor-element.elementor-element-f2ad472.e-con:has(> [data-id="d259b7c"]) > .elementor-widget-image > .elementor-widget-container {
    margin-inline: 0;
  }
}
/* Arroz, Óleo, Produtos para Fabricação e Commodities: botões do mesmo tamanho das páginas irmãs
   (o CSS dessas páginas já usa !important) */
:is(.elementor-5277, .elementor-5421, .elementor-4791, .elementor-4952) .elementor-element:is(.elementor-element-156f275, .elementor-element-d83ad39) .elementor-button {
  padding: 20px 24px !important;
  border-radius: 8px !important;
}
:is(.elementor-5277, .elementor-5421, .elementor-4791, .elementor-4952) .elementor-element:is(.elementor-element-156f275, .elementor-element-d83ad39) .elementor-button-text {
  font-size: 18px !important;
}
@media (max-width: 1024px) {
  :is(.elementor-5277, .elementor-5421, .elementor-4791, .elementor-4952) .elementor-element:is(.elementor-element-156f275, .elementor-element-d83ad39) .elementor-button-text {
    font-size: 16px !important;
  }
}
@media (max-width: 767px) {
  :is(.elementor-5277, .elementor-5421, .elementor-4791, .elementor-4952) .elementor-element.elementor-element-d83ad39.elementor-widget-button {
    --align-self: center;
  }
}
/* topo: texto e foto centralizados juntos (a foto ocupava 71% da coluna, encostada à esquerda) */
@media (min-width: 768px) {
  .elementor.elementor .elementor-element-9ac1c10 > .elementor-widget.elementor-element-7b70901,
  .elementor.elementor .e-con > .elementor-widget:is(.elementor-element-41664be, .elementor-element-6fa3ff4) {
    --container-widget-width: auto;
    width: auto;
    max-width: none;
    flex: 0 1 auto;
  }
  .elementor.elementor .elementor-element-9ac1c10 > .elementor-element-7b70901 img,
  .elementor.elementor .elementor-element:is(.elementor-element-41664be, .elementor-element-6fa3ff4) img {
    width: 375px;
    max-width: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .elementor .elementor-element-9ac1c10 > .elementor-element-0023bd5 .elementor-icon-box-description,
  .elementor .elementor-widget:is(.elementor-element-a54209e, .elementor-element-d8905f7) .elementor-icon-box-description {
    font-size: 18px; /* tinha 25 px, quase o tamanho do título */
  }
}
@media (min-width: 1025px) {
  .elementor .elementor-element-9ac1c10 > .elementor-element-0023bd5 .elementor-icon-box-title,
  .elementor .elementor-widget:is(.elementor-element-a54209e, .elementor-element-d8905f7) .elementor-icon-box-title {
    line-height: 1;
  }
}
/* título do topo que era h3 no Elementor e virou h1 (SEO; _h1_topo do tools/fix_global.py): a margem continua a do h3
   (1em; a do h1 do navegador é 0,67em). Especificidade baixa (0,0,2): o que o Elementor define vence, como antes */
html h1:where(.bpg-h1-h3) {
  margin-block: 1em;
}
/* o de /contato/ era h2: o Elementor não dá tamanho a ele do tablet para cima, e o do h2 vinha do estilo global do
   WordPress (o do h1 é maior); no celular, o contato.css define o tamanho */
html h1:where(.bpg-h1-h2) {
  font-size: clamp(2.625rem, calc(2.625rem + ((1vw - 0.48rem) * 8.4135)), 3.25rem);
}
/* Cenouras e Frangos: blocos de produto no padrão das outras páginas (fonte, largura e margem) */
.elementor .bpg-product-container {
  width: min(1140px, 90%);
  max-width: none;
  font-family: Sora, sans-serif;
}
.elementor .bpg-product-text h3 {
  font-size: clamp(22px, 1.2rem + 0.8vw, 28px);
  line-height: 1.3;
}
/* até 1024 px (páginas de produto) o botão fixo aparece aos poucos nos primeiros 300 px de
   rolagem, para não cobrir o FALE CONOSCO do topo. Só opacidade, então vale também para quem reduz movimento */
@keyframes bpg-quote-rolagem {
  from {
    opacity: 0;
    visibility: hidden;
  }
  to {
    opacity: 1;
    visibility: visible;
  }
}
@media (max-width: 1024px) {
  @supports (animation-timeline: scroll()) {
    body:has(.elementor-element-9ac1c10, .elementor-5769, .elementor-5754) .bpg-quote {
      animation: bpg-quote-rolagem linear both;
      animation-timeline: scroll(root);
      animation-range: 0 300px;
    }
  }
}

/* ---------- sobre nós: diretoria ---------- */
@media (min-width: 768px) and (max-width: 1024px) {
  .elementor-5028 .elementor-element.elementor-element-1acee3c,
  .elementor-5028 .elementor-element.elementor-element-18781c0 {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
    max-width: none;
  }
  .elementor-5028 .elementor-element.elementor-element-940d551,
  .elementor-5028 .elementor-element.elementor-element-e189490 {
    flex: 0 0 clamp(200px, 32%, 300px);
    width: auto;
  }
}
@media (min-width: 768px) {
  .elementor-5028 .elementor-element.elementor-element-621fd6b {
    --padding-left: 0px;
    --padding-right: 0px;
  }
}

/* ---------- contato: o botão fixo leva ao formulário, que já está na tela ---------- */
@media (max-width: 1024px) {
  body.page-id-5006 .bpg-quote {
    display: none;
  }
}
/* com um campo de formulário em uso, o botão fixo sai da frente */
body:has(form :is(input, select, textarea):focus) .bpg-quote {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

/* ---------- rodapé (todas as páginas) ---------- */
/* colunas: logo | Informações de contato | Localização (mini mapa; a coluna "Menu" saiu, pedido do dono, 22/10) */
.elementor-258 .bpg-rodape-mapa {
  width: 100%;
}
.elementor-258 .bpg-rodape-mapa > .elementor-widget-wrap {
  align-content: flex-start;
}
@media (min-width: 1025px) {
  .elementor-258 .elementor-element.elementor-element-53e082e7 {
    width: 42.44%;
  }
  .elementor-258 .bpg-rodape-mapa {
    width: 38%;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  /* logo menor; contato e mapa dividem o resto */
  .elementor-258 .elementor-element.elementor-element-53e082e7 {
    width: 40%;
  }
  .elementor-258 .bpg-rodape-mapa {
    width: 35%;
  }
}
@media (max-width: 767px) {
  .elementor-258 .bpg-rodape-mapa {
    margin-top: 28px;
  }
  /* no celular o rodapé é centralizado: o link "Abrir no Google Maps" também */
  .elementor-258 .bpg-rodape-mapa > .elementor-widget-wrap {
    justify-content: center;
  }
}
[data-elementor-type="footer"] .elementor-element-27884fa .elementor-icon-list-text {
  text-wrap: pretty;
}
.elementor-258 .bpg-whatsapp-footer-item {
  margin: 0 0 10px;
}
.elementor-258 .bpg-whatsapp-footer-item > a {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 0;
  text-decoration: none;
  transition: opacity 160ms ease;
}
.elementor-258 .bpg-whatsapp-footer-item > a:hover,
.elementor-258 .bpg-whatsapp-footer-item > a:focus-visible {
  opacity: 0.78;
}
.elementor-258 .bpg-whatsapp-footer-item > a:focus-visible {
  outline: none;
  text-decoration: underline;
  text-underline-offset: 4px;
}
.elementor-258 .bpg-whatsapp-footer-item .elementor-icon-list-icon {
  margin: 0;
  color: #25d366;
}
.elementor-258 .elementor-widget-icon-list .bpg-whatsapp-footer-item .elementor-icon-list-icon svg.bpg-whatsapp-icon {
  display: block;
  width: 22px !important;
  height: 22px !important;
  fill: #25d366 !important;
}
.elementor-258 .bpg-whatsapp-footer-item strong {
  display: block;
}
.elementor-258 .bpg-whatsapp-footer-item strong {
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.4;
}
@media (max-width: 767px) {
  [data-elementor-type="footer"] .elementor-element-27884fa .elementor-icon-list-text {
    overflow-wrap: anywhere;
  }
  .elementor-258 .elementor-element.elementor-element-905fdc5 {
    font-size: 12px;
    line-height: 16px;
    text-wrap: balance;
  }
}
/* contêineres só com scripts deixavam uma faixa branca de 40 px antes do rodapé */
.elementor-element-a4d899d.e-con,
.elementor-element-dfd4fa4.e-con {
  --padding-top: 0px;
  --padding-bottom: 0px;
  --min-height: 0px;
}

/* ---------- botão fixo com textos traduzidos ---------- */
.bpg-quote {
  box-sizing: border-box; /* sem isso o max-width não conta o padding */
  max-width: calc(100% - 28px);
}
.bpg-quote__text {
  line-height: 1.15; /* só aparece quando o rótulo traduzido quebra em 2 linhas */
  text-wrap: balance;
}
@media (max-width: 720px) {
  .bpg-quote {
    padding-inline: 16px; /* com 18 px o rótulo em espanhol quebrava em 2 linhas a 360 px */
  }
}

/* ---------- site traduzido ---------- */
/* títulos sem palavra sozinha na última linha (o português fica como está) */
html:is(.translated-ltr, .translated-rtl) :is(.elementor-heading-title, .elementor-icon-box-title, .elementor-image-box-title) {
  text-wrap: balance;
}
/* árabe: o topo da home mantém texto à esquerda e globo à direita (senão o texto ia para baixo do
   globo), com o texto alinhado à direita */
@media (min-width: 1280px) {
  html.translated-rtl .elementor-4029 .elementor-element.elementor-element-bc2885f > .e-con-inner {
    direction: ltr;
  }
  html.translated-rtl .elementor-4029 .elementor-element.elementor-element-0023bd5,
  html.translated-rtl .bpg-globo {
    direction: rtl;
  }
}
@media (min-width: 1280px) {
  html.translated-rtl .elementor-4029 .elementor-element.elementor-element-ada7863 {
    width: 572px;
    max-width: 572px;
  }
  html.translated-rtl .elementor-4029 .elementor-element.elementor-element-ada7863 img {
    width: 502px; /* o mesmo tamanho do português */
  }
}
html.translated-rtl .elementor-4029 .elementor-element.elementor-element-ada7863,
html.translated-rtl .elementor-4029 .elementor-element.elementor-element-ada7863 > .elementor-widget-container,
html.translated-rtl .elementor-4029 .elementor-element.elementor-element-0023bd5 .elementor-icon-box-wrapper,
html.translated-rtl .elementor-4029 .elementor-element.elementor-element-0023bd5 .elementor-icon-box-content {
  text-align: right;
}
/* árabe: seta do botão fixo no sentido da leitura */
html.translated-rtl .bpg-quote__arrow {
  transform: scaleX(-1);
}
@media (hover: hover) {
  html.translated-rtl .bpg-quote:hover .bpg-quote__arrow {
    transform: scaleX(-1) translateX(5px);
  }
}
html.translated-rtl .bpg-quote:focus-visible .bpg-quote__arrow {
  transform: scaleX(-1) translateX(4px);
}
/* árabe: botões ("Saiba mais", "Fale conosco") com a mesma ordem e os mesmos espaços do original */
html.translated-rtl .botao .elementor-button-content-wrapper {
  direction: ltr;
}
html.translated-rtl .botao .elementor-button-text {
  direction: rtl;
}
/* inglês, espanhol e turco: "Saiba mais" traduzido cabe numa linha; cartões sem vãos do justificado */
html.translated-ltr .elementor-4029 .elementor-element.botao .elementor-button {
  padding-right: 16px !important;
  padding-left: 16px !important;
}
@media (min-width: 768px) {
  html.translated-ltr .elementor-4029 .elementor-element-5260da3 p,
  html.translated-ltr .elementor-4029 .elementor-element-c9deaff p,
  html.translated-ltr .elementor-4029 .elementor-element-00d11a0 p {
    text-align: start;
  }
}
/* o tradutor tira o espaço antes do logo no título da prova social */
html:is(.translated-ltr, .translated-rtl) .bpg-ps .bpg-ps__title-logo {
  margin-left: 0;
  margin-inline-start: 0.3em;
}

/* ---------- leveza ---------- */
/* o espaço reservado da barra de idiomas (para o topo não pular) fica na seção "faixa de idiomas" */
/* desfoque do cabeçalho fixo sem efeito visível (o fundo é branco opaco), mas recalculado a
   cada quadro da rolagem */
.elementor-261 .elementor-element.elementor-element-5267aeb4.elementor-section::before {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
/* fundo do rodapé: em "fundos com navio", logo abaixo */
/* imagens com srcset no tamanho certo: o sizes vira a largura natural da imagem, e estes dois logos
   têm largura em % de uma caixa que se ajusta ao conteúdo; a caixa fica com a largura de antes */
.elementor-4029 .elementor-element.elementor-element-ada7863 {
  width: min(100%, 1024px);
}
.elementor-258 .elementor-element.elementor-element-2e6541c7 a {
  display: block;
}

/* ---------- fundos com navio no lugar da carreta (pedido do dono, 21/10/2026) ----------
   Fotos do Pexels (licença Pexels: uso livre, sem crédito obrigatório), uma diferente em cada lugar para
   não repetir uma embaixo da outra na home. "Onde Estamos" e "7 Pilares" no mesmo tratamento da carreta
   (bg-mapa-2-web-1.webp): tons de cinza, véu branco (o cinza mais escuro fica em torno de 204 de 255, como na
   carreta, então o texto tem o mesmo contraste), desfoque leve e degradê branco elíptico para o lado do
   texto/mapa e para o alto. Só o background-image muda: posição e tamanho seguem os do Elementor, e o
   lazy-load dele continua (zera o fundo com !important até a seção entrar na tela). Nomes novos por causa
   do cache longo de /bpg/.
   - Onde Estamos (todas as páginas; 9663cdb em cenouras, 64282af em frangos): graneleiro,
     pexels.com/photo/11940863 (Jeffry Surianto), espelhado e sem a marca da chaminé;
   - 7 Pilares (home): porta-contêiner, pexels.com/photo/9806482 (William Liu), sem o nome no casco; 1920 px
     como a carreta, porque a seção usa o tamanho natural da imagem, ancorada embaixo à esquerda;
   - rodapé (todas as páginas): graneleiro no porto ao entardecer, pexels.com/photo/16678062 (Mark Stebnicki),
     sem o nome e as marcas no casco; só em cinza, porque aparece com 17% de opacidade e em luminosidade. */
.elementor .elementor-element:is(.elementor-element-2b36009, .elementor-element-9663cdb, .elementor-element-64282af).e-con.e-parent {
  background-image: url("/bpg/fotos/navio-fundo-1600.webp");
}
.elementor-4029 .elementor-element.elementor-element-6964581.e-con.e-parent {
  background-image: url("/bpg/fotos/navio-pilares-1920.webp");
}
.elementor-258 .elementor-element.elementor-element-3a92419a > .elementor-background-overlay {
  background-image: url("/bpg/fotos/navio-rodape-1600.webp");
}
@media (max-width: 767px) {
  .elementor .elementor-element:is(.elementor-element-2b36009, .elementor-element-9663cdb, .elementor-element-64282af).e-con.e-parent {
    background-image: url("/bpg/fotos/navio-fundo-960.webp");
  }
  .elementor-258 .elementor-element.elementor-element-3a92419a > .elementor-background-overlay {
    background-image: url("/bpg/fotos/navio-rodape-960.webp");
  }
}

/* ---------- Sobre Nós: nome e cargo de cada diretor acima do texto ---------- */
.elementor-5028 .bpg-diretor {
  margin: 0 0 14px;
}
.elementor-5028 .bpg-diretor__nome {
  margin: 0;
  color: #fff; /* a seção da diretoria tem fundo preto */
  font: 700 clamp(24px, 2.2vw, 30px)/1.15 Sora, sans-serif;
}
.elementor-5028 .bpg-diretor__cargo {
  display: inline-block;
  margin: 8px 0 0;
  padding: 5px 12px;
  border-radius: 999px;
  background: #f3b626;
  color: #000407;
  font: 600 13px/1.2 Sora, sans-serif;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* ---------- Sobre Nós, "Motivos": a fachada da BPG inteira (16:9, sem corte), como na home; colunas no bloco
   "Motivos (home e sobre nós)" mais acima ---------- */
.elementor-5028 .elementor-element.elementor-element-8b20ebd img.bpg-motivos-foto {
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: 50% 50%;
  border-radius: 16px;
}

/* ---------- site traduzido ---------- */
/* árabe: o <font dir="auto"> do Google invertia pedaços da frase (o "(SP)" ia para a ponta da linha) */
html.translated-rtl font[dir="auto"] {
  unicode-bidi: normal;
}
/* árabe: a seta do botão de enviar aponta para o lado da leitura */
html.translated-rtl .elementor-5006 form button[type="submit"] .elementor-button-icon svg {
  transform: scaleX(-1);
}
/* contato: o título acompanha a largura do formulário em todos os idiomas (em chinês e árabe ele cabia
   numa linha, encolhia e ia para o meio) */
.elementor-5006 .elementor-element.elementor-element-c9fab63 {
  align-self: stretch;
  width: 100%;
}
/* selos técnicos dos produtos e rótulo da prova social: quebra equilibrada quando a tradução é longa */
.bpg-tech-badge {
  width: fit-content;
  max-width: 100%;
  text-wrap: balance;
}
@media (max-width: 480px) {
  .bpg-ps__kicker {
    text-wrap: balance;
    line-height: 1.3;
  }
}
/* coreano: quebra de linha entre palavras, não no meio delas ("세계 / 를") */
html[lang="ko"] body {
  word-break: keep-all;
  overflow-wrap: anywhere;
}
/* trecho que não pode quebrar de linha (ex.: o CEP do rodapé, no hífen) */
.bpg-nowrap {
  white-space: nowrap;
}
/* botões do tema ("Fale conosco", "Saiba mais"): sem o ícone do WhatsApp, o texto fica no centro
   (o CSS das páginas guardava 10 px à direita para o ícone) */
.elementor .elementor-element.botao .elementor-button-content-wrapper > .elementor-button-text {
  padding-right: 0;
}

/* ---------- aviso de cookies (LGPD; bpg/cookies.js) ---------- */
/* computador: cartão no canto inferior esquerdo; celular: faixa presa ao pé da tela */
.bpg-cookies {
  position: fixed;
  z-index: 9995;
  left: 24px;
  bottom: 24px;
  width: min(420px, calc(100vw - 48px));
  padding: 20px 22px;
  border: 1px solid #f3b626;
  border-radius: 14px;
  background: #000407;
  color: #fff;
  box-shadow: 0 12px 36px rgba(0, 4, 7, 0.32);
  font-size: 14px;
  line-height: 1.55;
  animation: bpg-cookies-entra 0.28s ease-out;
}
@keyframes bpg-cookies-entra {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
}
@media (prefers-reduced-motion: reduce) {
  .bpg-cookies {
    animation: none;
  }
}
.bpg-cookies__titulo {
  margin: 0 0 6px;
  color: #f3b626;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.3;
}
.bpg-cookies__texto {
  margin: 0 0 4px;
  color: rgba(255, 255, 255, 0.92);
}
.bpg-cookies__link {
  color: #f3b626;
  font-size: 13px;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.bpg-cookies__link:hover,
.bpg-cookies__link:focus-visible {
  color: #ffca08;
}
.bpg-cookies__botoes {
  display: flex;
  gap: 10px;
  margin-top: 14px;
}
.bpg-cookies__botao {
  flex: 1;
  min-height: 44px;
  padding: 10px 16px;
  border: 2px solid #f3b626;
  border-radius: 8px;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.bpg-cookies__botao--recusar {
  background: transparent;
  color: #fff;
}
.bpg-cookies__botao--aceitar {
  background: #f3b626;
  color: #000407;
}
.bpg-cookies__botao:hover,
.bpg-cookies__botao:focus-visible {
  border-color: #ffca08;
}
.bpg-cookies__botao--aceitar:hover,
.bpg-cookies__botao--aceitar:focus-visible {
  background: #ffca08;
}
.bpg-cookies__botao:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
}
@media (max-width: 767px) {
  /* celular: faixa baixa presa ao pé da tela (~96 px, 15% de uma tela de 360×640; eram 222 px): só a frase com o link, sem
     o título, e Recusar/Aceitar lado a lado. Com o aviso aberto, o botão flutuante "Peça sua cotação" fica ACIMA dele, sem
     cobrir nada: o cookies.js grava a altura real do aviso em --bpg-cookies-h (cresce com idioma de frase longa ou texto
     ampliado) e o botão sobe esse tanto mais 10 px. No contato (page-id-5006) o botão some até 1024 px (o formulário já
     está na tela) */
  body.bpg-cookies-aberto .bpg-quote {
    right: 14px;
    bottom: calc(var(--bpg-cookies-h, 104px) + 10px);
    max-width: calc(100% - 28px);
  }
  /* páginas de produto: o botão só aparece com a rolagem, para não cobrir o FALE CONOSCO do topo; com o aviso aberto,
     o FALE CONOSCO fica embaixo do aviso e o botão entra logo, como nas outras páginas */
  body.bpg-cookies-aberto:has(.elementor-element-9ac1c10, .elementor-5769, .elementor-5754) .bpg-quote {
    animation: bpg-quote-in 0.7s cubic-bezier(0.22, 1, 0.36, 1) 1.2s backwards;
    animation-timeline: auto;
  }
  .bpg-cookies {
    left: 0;
    right: 0;
    bottom: 0;
    width: auto;
    padding: 8px 14px calc(8px + env(safe-area-inset-bottom));
    border-width: 1px 0 0;
    border-radius: 12px 12px 0 0;
    font-size: 13px;
    line-height: 1.3;
    box-shadow: 0 -8px 28px rgba(0, 4, 7, 0.3);
  }
  /* o título só repetia a frase: some da tela (continua como o nome da região, pelo aria-labelledby) */
  .bpg-cookies__titulo {
    display: none;
  }
  .bpg-cookies__texto {
    margin: 0 0 6px;
  }
  .bpg-cookies__botoes {
    gap: 8px;
    margin-top: 0;
  }
  .bpg-cookies__botao {
    min-height: 40px;
    padding: 6px 12px;
    border-width: 1.5px;
    font-size: 14px;
    line-height: 1.2;
  }
}
@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  body.bpg-cookies-aberto:has(.elementor-element-9ac1c10, .elementor-5769, .elementor-5754) .bpg-quote {
    animation: none;
  }
}
/* tablet (768 a 1024 px, iPad em pé): o cartão do aviso (466 px, à esquerda) cobria o começo do botão flutuante (à
   direita) até uns 860 px, e mais nos idiomas de rótulo longo. Com o aviso aberto, o botão fica por cima do cartão, no
   espaço que o cartão abre para ele embaixo do Recusar/Aceitar (como no celular); o espaço cabe o rótulo em 2 linhas.
   Celular deitado (altura até 480 px) fica de fora: lá o botão é compacto e não chega no cartão */
@media (min-width: 768px) and (max-width: 1024px) and (min-height: 481px) {
  body.bpg-cookies-aberto:not(.page-id-5006) .bpg-quote {
    z-index: 9996;
    left: 47px; /* 24 px da borda da tela + 1 da borda do cartão + 22 do padding */
    right: auto;
    bottom: 38px;
    max-width: min(420px, calc(100vw - 94px));
  }
  body.bpg-cookies-aberto:not(.page-id-5006) .bpg-cookies {
    padding-bottom: 96px;
  }
  /* páginas de produto: com o aviso aberto, o botão entra logo (sem esperar a rolagem), como no celular */
  body.bpg-cookies-aberto:has(.elementor-element-9ac1c10, .elementor-5769, .elementor-5754) .bpg-quote {
    animation: bpg-quote-in 0.7s cubic-bezier(0.22, 1, 0.36, 1) 1.2s backwards;
    animation-timeline: auto;
  }
}
@media (min-width: 768px) and (max-width: 1024px) and (min-height: 481px) and (prefers-reduced-motion: reduce) {
  body.bpg-cookies-aberto:has(.elementor-element-9ac1c10, .elementor-5769, .elementor-5754) .bpg-quote {
    animation: none;
  }
}

/* ---------- área de toque (tela de toque) ---------- */
/* os links do rodapé (Peça sua cotação, Política de privacidade, Preferências de cookies) tinham 26 px de altura e o
   "Política de privacidade" do aviso de cookies, 20 px: a área de toque passa a ~40 px sem mudar o desenho (uma camada
   invisível em volta do link; entre dois links vizinhos, a sobra fica com o de baixo) */
@media (pointer: coarse) {
  [data-elementor-type="footer"] .elementor-icon-list-item > a,
  .bpg-cookies__link {
    position: relative;
  }
  [data-elementor-type="footer"] .elementor-icon-list-item > a::after,
  .bpg-cookies__link::after {
    content: "";
    position: absolute;
    inset: -7px 0;
  }
  .bpg-cookies__link::after {
    inset: -11px -4px;
  }
}

/* ---------- Política de Privacidade (/privacidade/, tools/privacidade.py) ---------- */
/* topo: a página veio do modelo de uma página de produto, com foto (o tools/privacidade.py tira a foto); sem ela, o
   topo preto, de 700 a 850 px de altura, ficava com um vão vazio acima do título (no celular, quase metade da primeira
   tela). Agora ele tem a altura do conteúdo, com folga para a faixa inclinada de baixo */
.elementor-9003 .elementor-element.elementor-element-bc2885f {
  --min-height: 0px;
  --padding-top: clamp(48px, 7vw, 96px);
  --padding-bottom: clamp(72px, 9vw, 120px);
}
.bpg-priv {
  background: #f4efe6;
  color: #1d1b16;
  padding: clamp(40px, 6vw, 72px) 20px;
}
.bpg-priv__wrap {
  max-width: 760px;
  margin: 0 auto;
  font-size: 16px;
  line-height: 1.7;
}
.bpg-priv__data {
  margin: 0 0 28px;
  color: #6b6455;
  font-size: 14px;
}
.bpg-priv__secao + .bpg-priv__secao {
  margin-top: 30px;
  padding-top: 26px;
  border-top: 1px solid rgba(0, 4, 7, 0.1);
}
.bpg-priv__titulo {
  margin: 0 0 10px;
  color: #000407;
  font-size: clamp(20px, 1rem + 0.8vw, 26px);
  font-weight: 700;
  line-height: 1.25;
}
.bpg-priv p,
.bpg-priv li {
  color: #3a362d;
}
.bpg-priv p {
  margin: 0 0 12px;
}
.bpg-priv ul {
  margin: 0 0 12px;
  padding-left: 1.2em;
}
.bpg-priv li + li {
  margin-top: 6px;
}
.bpg-priv a {
  color: #7d5a12;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.bpg-priv a:hover,
.bpg-priv a:focus-visible {
  color: #000407;
}

/* ---------- rodapé: mini mapa do Google (coluna "Localização"; bpg/rodape-mapa.js) ---------- */
/* o <iframe> só entra depois do "Aceitar" dos cookies ou do clique em "Ver no mapa"; até lá, o cartão */
.bpg-mapa {
  position: relative;
  inline-size: 100%;
  block-size: clamp(200px, 22vw, 240px);
  border-radius: 14px;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 38%, color-mix(in oklch, #f3b626 22%, transparent), transparent 62%),
    color-mix(in oklch, #0b1016 82%, transparent);
  border: 1px solid color-mix(in oklch, #f3b626 38%, transparent);
  box-shadow: 0 10px 30px rgb(0 0 0 / 0.35);
}
.bpg-mapa__cartao {
  position: absolute;
  inset: 0;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 8px;
  padding: 16px;
  text-align: center;
  color: #fff;
}
.bpg-mapa__pino {
  inline-size: 22px;
  block-size: 30px;
  fill: #f3b626;
  filter: drop-shadow(0 4px 8px rgb(0 0 0 / 0.45));
}
.bpg-mapa__end {
  margin: 0;
  font-family: "Sora", sans-serif;
  font-size: 14px;
  line-height: 1.45;
  color: #fff;
}
.bpg-mapa__ver {
  margin-top: 4px;
  min-block-size: 44px;
  padding: 10px 20px;
  border: 0;
  border-radius: 999px;
  background: #f3b626;
  color: #000407;
  font-family: "Sora", sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  transition: background-color 0.25s ease, transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}
.bpg-mapa__ver:hover,
.bpg-mapa__ver:focus-visible {
  background: #ffca08;
  transform: translateY(-1px);
}
.bpg-mapa__ver:focus-visible,
.bpg-mapa__abrir:focus-visible,
.bpg-mapa iframe:focus-visible {
  outline: 2px solid #ffca08;
  outline-offset: 3px;
}
.bpg-mapa__nota {
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
  color: rgb(255 255 255 / 0.78);
}
.bpg-mapa iframe {
  position: absolute;
  inset: 0;
  inline-size: 100%;
  block-size: 100%;
  border: 0;
  background: #e8eaed;
}
.bpg-mapa--aberto .bpg-mapa__cartao {
  visibility: hidden;
}
.bpg-mapa__abrir {
  display: inline-flex;
  align-items: center;
  min-block-size: 40px;
  margin-top: 6px;
  font-family: "Sora", sans-serif;
  font-size: 14px;
  color: #f3b626;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.bpg-mapa__abrir::after {
  /* abre em outra aba; a seta fica fora do texto (o leitor de tela não a lê) */
  content: "\2197";
  content: "\2197" / "";
  margin-inline-start: 4px;
  text-decoration: none;
}
.bpg-mapa__abrir:hover {
  color: #ffca08;
}
@media (scripting: none) {
  /* sem JavaScript, o botão não abriria nada: fica o link "Abrir no Google Maps" */
  .bpg-mapa__ver,
  .bpg-mapa__nota {
    display: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .bpg-mapa__ver {
    transition: none;
  }
  .bpg-mapa__ver:hover,
  .bpg-mapa__ver:focus-visible {
    transform: none;
  }
}

/* ---------- mapa-múndi de pontos (todas as páginas que o mostram): o Brasil em destaque ---------- */
/* por cima do mapa, na mesma caixa: os pontos do Brasil em dourado (bpg/mundi-brasil.svg) e o pino com o símbolo da
   BPG em Jacareí (SP), a sede. A posição (left/top) é a do tools/mapa_brasil.py, em % da imagem: acompanha o tamanho
   em qualquer tela. direction: ltr para o árabe não espelhar a posição. */
.bpg-mundi {
  position: relative;
  display: block;
  direction: ltr;
  line-height: 0;
  /* o pino e o logo crescem com o mapa (cqi = 1% da largura do mapa) */
  container-type: inline-size;
}
.bpg-mundi > img:first-child {
  display: block;
  inline-size: 100%;
  block-size: auto;
}
.bpg-mundi__br {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.bpg-mundi__ouro {
  position: absolute;
  inset: 0;
  inline-size: 100%;
  block-size: 100%;
}
.bpg-mundi__pino {
  --ponto: clamp(7px, 2cqi, 12px);
  position: absolute;
  left: 34.82%;
  top: 70.47%;
  inline-size: 0;
  block-size: 0;
}
.bpg-mundi__ponto,
.bpg-mundi__pulso {
  position: absolute;
  left: 0;
  top: 0;
  inline-size: var(--ponto);
  block-size: var(--ponto);
  translate: -50% -50%;
  border-radius: 50%;
}
.bpg-mundi__ponto {
  background: #f3b626;
  box-shadow: 0 0 0 2px #fff, 0 2px 8px rgb(0 0 0 / 0.35);
}
.bpg-mundi__pulso {
  border: 2px solid #f3b626;
  opacity: 0;
}
.bpg-mundi__logo {
  /* no oceano, à direita do ponto: o Brasil dourado fica à mostra */
  position: absolute;
  left: calc(var(--ponto) / 2 + 12px);
  top: 0;
  translate: 0 -50%;
  inline-size: clamp(28px, 7cqi, 52px);
  aspect-ratio: 1;
  padding: 3px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 0 2px #f3b626, 0 6px 16px rgb(0 0 0 / 0.28);
}
.bpg-mundi__logo::after {
  /* a ponta do balão, apontando para o ponto */
  content: "";
  position: absolute;
  right: 100%;
  top: 50%;
  translate: -1px -50%;
  border: 6px solid transparent;
  border-right-color: #f3b626;
  border-left: 0;
}
.bpg-mundi__logo img {
  display: block;
  inline-size: 100%;
  block-size: 100%;
  border-radius: 50%;
}
@media (prefers-reduced-motion: no-preference) {
  .bpg-mundi__pulso {
    animation: bpg-mundi-pulso 2.6s cubic-bezier(0.22, 1, 0.36, 1) infinite;
  }
  .bpg-mundi__pulso--2 {
    animation-delay: 1.3s;
  }
}
@keyframes bpg-mundi-pulso {
  from {
    opacity: 0.9;
    scale: 1;
  }
  to {
    opacity: 0;
    scale: 5;
  }
}
@media (prefers-reduced-motion: reduce) {
  /* sem pulso: um anel parado em volta do ponto */
  .bpg-mundi__pulso {
    opacity: 0.55;
    scale: 2.2;
  }
  .bpg-mundi__pulso--2 {
    display: none;
  }
}