/* =====================================================================
   Complementos da versao estatica.
   Cobre o que o JS do Elementor fazia em tempo de execucao.
   ===================================================================== */

/* ---------- Carrossel: rolagem continua ----------------------------
   O Elementor usa autoplay com delay 0. Sem timing linear o Swiper
   aplica easing a cada slide e o movimento fica aos solavancos.       */
[data-lure-carousel] .swiper-wrapper {
  transition-timing-function: linear !important;
}

/* ---------- Videos sob demanda -------------------------------------
   O .elementor-wrapper ja define aspect-ratio e border-radius. O botao
   apenas preenche essa caixa, exatamente como o iframe faria
   (o Elementor da width:100%/height:100% ao iframe).

   O transbordo do video para fora do card branco e proposital: vem do
   margin-bottom negativo do widget no CSS original. Nao mexer.          */
/* No CSS original o raio de 20px e aplicado ao .elementor-wrapper apenas no
   primeiro video; nos outros quatro ele mira o <iframe>. Como o iframe so
   passa a existir depois do clique, esses quatro ficavam com canto reto.
   Aplicando no wrapper, os dois estados (capa e player) ficam arredondados. */
.elementor-widget-video .elementor-wrapper {
  border-radius: 20px;
  overflow: hidden;
}

.lure-video-facade {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 20px;
  background: #000;
  cursor: pointer;
  overflow: hidden;
  -webkit-appearance: none;
  appearance: none;
}

.lure-video-poster {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border: 0;
  transition: transform .4s ease, opacity .3s ease;
}

.lure-video-facade:hover .lure-video-poster {
  transform: scale(1.03);
  opacity: .88;
}

.lure-video-play {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 68px;
  height: 68px;
  margin: -34px 0 0 -34px;
  border-radius: 50%;
  background: rgba(0, 0, 0, .55);
  border: 2px solid rgba(255, 255, 255, .9);
  transition: background .25s ease, transform .25s ease;
  pointer-events: none;
}

.lure-video-play::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -11px 0 0 -6px;
  border-style: solid;
  border-width: 11px 0 11px 18px;
  border-color: transparent transparent transparent #fff;
}

.lure-video-facade:hover .lure-video-play,
.lure-video-facade:focus-visible .lure-video-play {
  background: rgba(217, 186, 121, .92);
  transform: scale(1.08);
}

.lure-video-facade:focus-visible {
  outline: 3px solid #D9BA79;
  outline-offset: 3px;
}

/* O iframe injetado no clique ja e dimensionado pelo CSS do Elementor
   (.elementor-widget-video .elementor-wrapper iframe -> 100% x 100%),
   entao nao precisa de regra propria aqui. */

/* =====================================================================
   SECAO DOS LOGOS
   Titulo e subtitulo saíram; ficam os carrosseis no topo e o selo
   MAHOVI no rodape. O selo vinha do hero com margin-top negativo e
   alinhado a direita, entao esse posicionamento e anulado aqui.
   ===================================================================== */
/* A faixa dourada vira a referencia de posicionamento do selo, e ganha
   respiro no topo (o titulo saiu) e embaixo (espaco para o selo). */
.elementor-1823 .elementor-element.elementor-element-2cdab6b {
  position: relative;
  --padding-top: 56px;
  --padding-bottom: 96px;
}

/* Vale para as duas copias do selo (desktop 10e50ca e mobile b110ee1).
   Ancorado no canto inferior direito da faixa, atravessando a divisa
   com a secao escura. O original usava top/right cravados em pixel por
   breakpoint; aqui a ancora e o proprio rodape da secao. */
.elementor-1823 .elementor-element[data-lure-selo] {
  position: absolute !important;
  top: auto !important;
  left: auto !important;
  right: 90px !important;
  bottom: -78px !important;
  margin: 0 !important;
  z-index: 12;
}

@media (max-width: 1366px) {
  .elementor-1823 .elementor-element[data-lure-selo] {
    right: 60px !important;
    bottom: -70px !important;
  }
}

@media (max-width: 1024px) {
  .elementor-1823 .elementor-element.elementor-element-2cdab6b {
    --padding-bottom: 80px;
  }
  .elementor-1823 .elementor-element[data-lure-selo] {
    right: 40px !important;
    bottom: -60px !important;
  }
}

@media (max-width: 767px) {
  /* O selo MAHOVI morava no fim do hero e emprestava altura a ele. Com o
     selo movido daqui, o -179px de recuo passou a comer o botao do hero.
     Este valor devolve a folga sem alterar o desenho da faixa. */
  .elementor-1823 .elementor-element.elementor-element-2cdab6b {
    --margin-top: -74px;
    --padding-top: 34px;
    --padding-bottom: 128px;
  }
  .elementor-1823 .elementor-element[data-lure-selo] {
    right: 14px !important;
    bottom: -40px !important;
  }
}

/* ---------- Formulario: mensagens ---------------------------------- */
.lure-form-error,
.lure-form-success {
  margin-top: 12px;
}

.lure-form-error[hidden],
.lure-form-success[hidden] {
  display: none !important;
}

.elementor-field-group.elementor-error .elementor-field-textual {
  border-color: #d9534f;
}

.elementor-button[disabled] {
  opacity: .65;
  cursor: progress;
}

/* =====================================================================
   CTA FIXO NO RODAPE
   Aparece depois que o visitante passa do hero e acompanha a rolagem.
   ===================================================================== */
.lure-cta-fixo {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9000;
  display: flex;
  justify-content: center;
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
  background: rgba(2, 20, 34, .92);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border-top: 1px solid rgba(219, 178, 92, .28);
  /* fora da tela por padrao: sem JS o CTA nunca cobre o conteudo */
  transform: translateY(105%);
  opacity: 0;
  visibility: hidden;
  transition: transform .35s cubic-bezier(.2, .8, .2, 1), opacity .3s ease, visibility .3s;
}

.lure-cta-fixo.visivel {
  transform: none;
  opacity: 1;
  visibility: visible;
}

.lure-cta-fixo__botao {
  width: 100%;
  max-width: 520px;
  padding: 17px 26px;
  border: 0;
  border-radius: 5px;
  color: #fff;
  font-family: "Sora", sans-serif;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.25;
  white-space: normal;
  cursor: pointer;
  background-image: linear-gradient(-45deg,
    #DBB25C, #A88945, #DBB25C, #A88945, #DBB25C, #A88945);
  background-size: 300% 300%;
  box-shadow: 0 6px 20px rgba(219, 178, 92, .28);
  transition: background-position .5s ease, filter .2s ease, transform .15s ease;
}

.lure-cta-fixo__botao:hover { background-position: 100% 50%; filter: brightness(1.06); }

/* ---------- Pulso do CTA ----------
   Chama atencao sem virar ruido: respiro leve mais um halo dourado que
   se expande e some. So roda com a barra na tela.                      */
@keyframes lurePulsa {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 6px 20px rgba(219, 178, 92, .28),
                0 0 0 0 rgba(219, 178, 92, .5);
  }
  50% {
    transform: scale(1.028);
    box-shadow: 0 9px 28px rgba(219, 178, 92, .45),
                0 0 0 14px rgba(219, 178, 92, 0);
  }
}

.lure-cta-fixo.visivel .lure-cta-fixo__botao {
  animation: lurePulsa 2.2s cubic-bezier(.4, 0, .6, 1) infinite;
}

/* enquanto o visitante interage, o botao fica parado para nao fugir do clique */
.lure-cta-fixo .lure-cta-fixo__botao:hover,
.lure-cta-fixo .lure-cta-fixo__botao:focus-visible,
.lure-cta-fixo .lure-cta-fixo__botao:active {
  animation-play-state: paused;
}

.lure-cta-fixo__botao:active { transform: translateY(1px); }

/* quem pediu menos animacao no sistema nao ve o pulso */
@media (prefers-reduced-motion: reduce) {
  .lure-cta-fixo.visivel .lure-cta-fixo__botao { animation: none; }
}

/* o rodape da pagina precisa caber acima da barra */
body.lure-com-cta { padding-bottom: 88px; }

@media (max-width: 767px) {
  .lure-cta-fixo { padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px)); }
  .lure-cta-fixo__botao { font-size: 15.5px; padding: 15px 18px; }
  body.lure-com-cta { padding-bottom: 78px; }
}

/* =====================================================================
   POPUP DO FORMULARIO
   Valores extraidos do tema atual: dourado do CTA, campos #E9E9E9 com
   raio 10px, tipografia Sora.
   ===================================================================== */
:root {
  --lure-ouro-claro: #DBB25C;
  --lure-ouro-escuro: #A88945;
  --lure-escuro: #021422;
  --lure-campo: #E9E9E9;
}

.lure-modal[hidden] { display: none; }

.lure-modal {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  overflow-y: auto;
}

.lure-modal__fundo {
  position: fixed;
  inset: 0;
  background: rgba(2, 20, 34, .82);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  animation: lureFade .25s ease;
}

.lure-modal__caixa {
  position: relative;
  width: 100%;
  max-width: 520px;
  margin: auto;
  background: #fff;
  border: 1px solid #CFCFCF;
  border-radius: 10px;
  padding: 40px;
  box-shadow: 0 24px 60px rgba(2, 20, 34, .45);
  animation: lureSobe .3s cubic-bezier(.2, .8, .2, 1);
}

@keyframes lureFade { from { opacity: 0 } to { opacity: 1 } }
@keyframes lureSobe {
  from { opacity: 0; transform: translateY(18px) scale(.98) }
  to   { opacity: 1; transform: none }
}

.lure-modal__x {
  position: absolute;
  top: 12px;
  right: 12px;
  /* flex centrado: sem isso o glifo puxa a caixa e o circulo sai torto */
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #9aa2b1;
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 22px;
  font-weight: 400;
  line-height: 0;
  cursor: pointer;
  transition: background .18s ease, color .18s ease;
}

.lure-modal__x:hover,
.lure-modal__x:focus-visible {
  background: rgba(219, 178, 92, .16);
  color: var(--lure-ouro-escuro);
  outline: none;
}

.lure-modal__x:active { background: rgba(219, 178, 92, .28); }

.lure-modal__titulo {
  margin: 0 0 8px;
  font-family: "Sora", sans-serif;
  font-size: 28px;
  font-weight: 600;
  line-height: 1.2;
  color: var(--lure-escuro);
}
.lure-modal__titulo span {
  background: linear-gradient(-45deg, var(--lure-ouro-claro), var(--lure-ouro-escuro));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.lure-modal__sub {
  margin: 0 0 26px;
  font-family: "Roboto", sans-serif;
  font-size: 15px;
  line-height: 1.5;
  color: #6a7280;
}

/* ---------- Barra de progresso ---------- */
.lure-progresso { margin: 22px 0 26px; }

.lure-progresso__trilho {
  height: 6px;
  border-radius: 99px;
  background: #EAEAEA;
  overflow: hidden;
}

.lure-progresso__barra {
  display: block;
  height: 100%;
  width: 6%;
  border-radius: 99px;
  background-image: linear-gradient(-45deg, var(--lure-ouro-claro), var(--lure-ouro-escuro));
  transition: width .45s cubic-bezier(.4, 0, .2, 1);
}

.lure-progresso__texto {
  margin: 9px 0 0;
  font-family: "Roboto", sans-serif;
  font-size: 12.5px;
  font-weight: 500;
  letter-spacing: .3px;
  color: #8A93A6;
}

/* ---------- Passos ---------- */
.lure-passo[hidden] { display: none; }

.lure-passo {
  animation: lurePasso .32s cubic-bezier(.2, .8, .2, 1);
}

@keyframes lurePasso {
  from { opacity: 0; transform: translateX(14px) }
  to   { opacity: 1; transform: none }
}

/* A pergunta vira o destaque da vez, entao cresce.
   Usa `>` de proposito: os cartoes de opcao tambem sao <label>, e sem
   isso herdariam o tamanho de pergunta. */
.lure-passo .lure-campo > label {
  font-size: 19px;
  line-height: 1.3;
  margin-bottom: 14px;
}

/* ---------- Navegacao ---------- */
.lure-nav[hidden] { display: none !important; }

.lure-nav {
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 24px;
}

/* min-width:0 e obrigatorio: por padrao um item flex nao encolhe abaixo da
   largura do proprio texto, e "Receber mais informacoes" estourava o card.
   O flex-basis de 190px + wrap garantem que, faltando espaco, o botao cai
   para a linha de baixo em vez de vazar. */
.lure-nav .lure-form__enviar {
  margin-top: 0;
  flex: 1 1 190px;
  min-width: 0;
  width: auto;
  padding-left: 16px;
  padding-right: 16px;
  /* o tema aplica nowrap nos botoes: sem isto o rotulo longo escapa da caixa */
  white-space: normal;
  overflow-wrap: break-word;
  line-height: 1.25;
}

/* O CSS do tema define display em `button`, e regra de autor vence o
   [hidden] do navegador. Sem isto o botao de enviar aparece junto com o
   de continuar em todos os passos. */
.lure-nav [hidden],
.lure-form [hidden] { display: none !important; }

.lure-nav__voltar {
  flex: 0 0 auto;
  padding: 19px 22px;
  border: 1px solid #DDD;
  border-radius: 5px;
  background: #fff;
  color: #6a7280;
  font-family: "Sora", sans-serif;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: border-color .2s, color .2s, background .2s;
}
.lure-nav__voltar:hover {
  border-color: var(--lure-ouro-claro);
  color: var(--lure-escuro);
  background: #FCF8F0;
}
.lure-nav__voltar[hidden] { display: none; }

/* ---------- Campos ---------- */
.lure-campo { margin-bottom: 16px; }

.lure-campo label {
  display: block;
  margin-bottom: 7px;
  font-family: "Sora", sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: var(--lure-escuro);
}

.lure-form input[type="text"],
.lure-form input[type="tel"],
.lure-form select {
  width: 100%;
  background: var(--lure-campo);
  border: 1px solid transparent;
  border-radius: 10px;
  padding: 13px 16px;
  font-family: "Sora", sans-serif;
  font-size: 16px;
  color: #000;
  outline: none;
  transition: border-color .2s, box-shadow .2s;
  -webkit-appearance: none;
  appearance: none;
}

.lure-form input::placeholder { color: #8b8b8b; }

.lure-form input:focus,
.lure-form select:focus {
  border-color: var(--lure-ouro-claro);
  box-shadow: 0 0 0 3px rgba(219, 178, 92, .22);
}

/* ---------- Opcoes visiveis (no lugar do dropdown) ----------
   Todas as alternativas ficam a mostra: o visitante escolhe em um
   clique so, sem abrir e fechar lista.                            */
.lure-pergunta {
  display: block;
  margin-bottom: 14px;
  font-family: "Sora", sans-serif;
  font-size: 19px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--lure-escuro);
}

.lure-opcoes {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

/* O tema aplica `display:block` a <label>, entao a especificidade sobe
   aqui - sem isso os filhos viram inline e o marcador vira um risco. */
.lure-opcoes .lure-opcao {
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 14px 16px;
  margin: 0;
  border: 1.5px solid #E4E4E4;
  border-radius: 10px;
  background: #fff;
  font-family: "Sora", sans-serif;
  font-size: 15.5px;
  font-weight: 400;
  line-height: 1.35;
  color: var(--lure-escuro);
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.lure-opcoes .lure-opcao > span:not(.lure-opcao__marca) {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
}

.lure-opcao:hover {
  border-color: var(--lure-ouro-claro);
  background: #FDFAF3;
}

/* o input real fica invisivel, mas continua acessivel pelo teclado */
.lure-opcao input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.lure-opcoes .lure-opcao__marca {
  display: block;
  flex: 0 0 auto;
  width: 21px;
  height: 21px;
  border: 2px solid #CFCFCF;
  border-radius: 50%;
  position: relative;
  transition: border-color .18s ease;
}

.lure-opcoes .lure-opcao__marca::after {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: 50%;
  background: linear-gradient(-45deg, var(--lure-ouro-claro), var(--lure-ouro-escuro));
  transform: scale(0);
  transition: transform .18s cubic-bezier(.2, .8, .2, 1);
}

/* estado escolhido */
.lure-opcao:has(input:checked) {
  border-color: var(--lure-ouro-claro);
  background: #FBF5E9;
  box-shadow: 0 0 0 3px rgba(219, 178, 92, .18);
}
.lure-opcao:has(input:checked) .lure-opcao__marca { border-color: var(--lure-ouro-escuro); }
.lure-opcao:has(input:checked) .lure-opcoes .lure-opcao__marca::after { transform: scale(1); }

/* navegacao por teclado */
.lure-opcao:has(input:focus-visible) {
  border-color: var(--lure-ouro-escuro);
  box-shadow: 0 0 0 3px rgba(219, 178, 92, .3);
}

/* Sem :has() (navegadores antigos) a classe abaixo e aplicada via JS. */
.lure-opcao.escolhida {
  border-color: var(--lure-ouro-claro);
  background: #FBF5E9;
  box-shadow: 0 0 0 3px rgba(219, 178, 92, .18);
}
.lure-opcao.escolhida .lure-opcao__marca { border-color: var(--lure-ouro-escuro); }
.lure-opcao.escolhida .lure-opcoes .lure-opcao__marca::after { transform: scale(1); }

.lure-campo.tem-erro .lure-opcao { border-color: #e9b4b2; }

/* seta do select */
.lure-select { position: relative; }
.lure-select::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 18px;
  width: 9px;
  height: 9px;
  margin-top: -6px;
  border-right: 2px solid #6a7280;
  border-bottom: 2px solid #6a7280;
  transform: rotate(45deg);
  pointer-events: none;
}
.lure-form select { padding-right: 42px; cursor: pointer; }

/* estado de erro */
.lure-campo.tem-erro input,
.lure-campo.tem-erro select { border-color: #d9534f; background: #fdf2f2; }

.lure-campo__erro {
  display: block;
  margin-top: 6px;
  font-family: "Roboto", sans-serif;
  font-size: 13px;
  color: #d9534f;
}

.lure-form__erro {
  margin: 14px 0 0;
  padding: 12px 14px;
  border-radius: 8px;
  background: #fdf2f2;
  border: 1px solid #f2c4c4;
  font-family: "Roboto", sans-serif;
  font-size: 14px;
  color: #b02a26;
}
.lure-form__erro[hidden] { display: none; }

/* ---------- Botao ---------- */
.lure-form__enviar {
  width: 100%;
  margin-top: 22px;
  padding: 19px 24px;
  border: 0;
  border-radius: 5px;
  color: #fff;
  font-family: "Sora", sans-serif;
  font-size: 18px;
  font-weight: 600;
  cursor: pointer;
  background-image: linear-gradient(-45deg,
    #DBB25C, #A88945, #DBB25C, #A88945, #DBB25C, #A88945);
  background-size: 300% 300%;
  transition: background-position .5s ease, transform .15s ease, filter .2s;
}
.lure-form__enviar:hover { background-position: 100% 50%; filter: brightness(1.06); }
.lure-form__enviar:active { transform: translateY(1px); }
.lure-form__enviar[disabled] { opacity: .6; cursor: progress; }

.lure-form__nota {
  margin: 14px 0 0;
  text-align: center;
  font-family: "Roboto", sans-serif;
  font-size: 12.5px;
  color: #8A93A6;
}

/* o seletor de pais precisa ocupar a largura toda do campo */
.lure-campo .iti { width: 100%; display: block; }

body.lure-travado { overflow: hidden; }

@media (max-width: 600px) {
  .lure-modal { padding: 12px; align-items: flex-start; }
  .lure-modal__caixa { padding: 30px 22px; }
  .lure-modal__titulo { font-size: 23px; }
  .lure-modal__sub { font-size: 14px; margin-bottom: 20px; }
  .lure-passo .lure-campo > label { font-size: 17px; }

  /* com 7 alternativas a lista fica alta: compacta para caber sem rolar */
  .lure-pergunta { font-size: 17px; margin-bottom: 12px; }
  .lure-opcoes { gap: 7px; }
  .lure-opcoes .lure-opcao { padding: 12px 14px; font-size: 15px; gap: 11px; }
  .lure-opcoes .lure-opcao__marca { width: 19px; height: 19px; }

  /* espaco curto: rotulos menores e o enviar ocupando a linha inteira */
  .lure-nav .lure-form__enviar { font-size: 16px; padding: 17px 14px; flex: 1 1 100%; }
  .lure-nav__voltar { font-size: 14px; padding: 15px 18px; flex: 1 1 100%; order: 2; }
}

/* O modo de teste nao desenha nada na pagina: o payload sai apenas no
   console do navegador. */