.elementor-5722 .elementor-element.elementor-element-623a285{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--margin-top:15%;--margin-bottom:0%;--margin-left:0%;--margin-right:0%;}.elementor-widget-html .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family );font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-html .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family );font-weight:var( --e-global-typography-secondary-font-weight );}/* Start custom CSS for html, class: .elementor-element-7f5c35e *//* ============================
   QUIZ PODAL - CSS
   Cole este bloco inteiro no CSS personalizado do Elementor.
   Responsivo, mobile-first. Variáveis de cor no :root.
   ============================ */

:root{
  --primario: #2D535C;
  --secundario: #829FA6;
  --realce: #96C470;       /* cor do botão solicitada */
  --realce-dark: #7fb15b;  /* hover (2-3 pontos mais escuro visualmente) */
  --texto: #333333;        /* grafite */
  --fundo: #FFFFFF;
  --radius: 12px;
  --maxw: 980px;
}

/* Basic reset for quiz block */
#quiz-podal-root, #quiz-podal-root * { box-sizing: border-box; font-family: "Montserrat", "Clear Sans", "Roboto", Arial, sans-serif; }

/* Container central do quiz */
#quiz-podal-root {
  max-width: var(--maxw);
  margin: 18px auto;
  padding: 14px;
  color: var(--texto);
}

/* Card principal */
.q-card {
  background: var(--fundo);
  border-radius: var(--radius);
  padding: 20px;
  box-shadow: 0 12px 34px rgba(16,24,32,0.06);
}

/* ----- INTRO / PRELOAD ----- */
/* monograma no topo - apenas na intro */
.intro-monogram {
  display:block;
  margin: 0 auto 12px auto;
  width: 350px; /* desktop default */
  max-width: 90%;
  height: auto;
}

/* Logo menor (após intro) - centralizado e 60% menor */
.small-logo {
  display:block;
  margin: 12px auto 6px auto;
  width: 40%; /* ~60% menor que o original */
  max-width: 220px;
  height: auto;
}

/* Nome e sub-título - solicitadas fontes (fallbacks incluídos) */
.brand-name {
  font-family: "Cherolina", "Georgia", serif; /* se Cherolina não disponível, usar serif */
  font-size: 26px;
  text-align: center;
  margin: 6px auto 0;
  letter-spacing: 0.2px;
  width: 100%;
  max-width: 520px;
}

.brand-sub {
  font-family: "Clear Sans", "Helvetica Neue", Arial, sans-serif;
  font-weight: 300;
  font-size: 14px;
  text-align: center;
  margin: 2px auto 12px;
  width: 100%;
  max-width: 520px;
  color: var(--texto);
}

/* ----- PROGRESSO ----- */
.progress-wrap { margin: 8px 0 16px 0; }
.progress-bar { height: 12px; background:#f3f5f4; border-radius:999px; overflow:hidden; border:1px solid #eee; }
.progress-fill { height:100%; width:0%; background: linear-gradient(90deg,var(--realce),var(--realce-dark)); transition: width .45s ease; }
.progress-meta { display:flex; justify-content:space-between; margin-top:6px; font-size:12px; color:var(--texto); }

/* ----- QUESTÕES E OPÇÕES ----- */
.question-title { font-size:18px; font-weight:800; color:var(--primario); margin-bottom:8px; text-align:left; }
.question-sub { font-size:13px; color:var(--texto); margin-bottom:12px; text-align:left; }

.options { display:grid; gap:10px; grid-template-columns: 1fr; }
@media(min-width:720px){ .options { grid-template-columns: repeat(2,1fr); } }

.option {
  display:flex; gap:12px; align-items:flex-start; padding:12px; border-radius:12px; border:1px solid #e8e8e8;
  background: linear-gradient(180deg,#fff,#fcfffc);
  cursor:pointer; transition:transform .12s ease, box-shadow .12s ease;
  user-select:none;
}
.option:hover { transform: translateY(-3px); box-shadow: 0 10px 28px rgba(16,24,32,0.06); }
.option .letter { width:36px; height:36px; border-radius:50%; background:var(--primario); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:800; flex-shrink:0; }
.option .label { font-weight:700; color:var(--texto); }

/* selected state */
.option.selected { border-color: var(--primario); box-shadow: 0 12px 30px rgba(45,48,120,0.06); background: linear-gradient(180deg,#f7fff5,#fff); }

/* ----- BOTÕES CTA ----- */
.btn-main, .btn-continue, .btn-accept, .btn-send, .btn-book {
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:12px 18px; border-radius:10px; border:none; cursor:pointer;
  background: linear-gradient(90deg,var(--realce),var(--realce-dark)); color: #ffffff; font-weight:800;
  transition: transform .12s ease, box-shadow .12s ease;
}
.btn-main:hover, .btn-continue:hover, .btn-accept:hover, .btn-send:hover, .btn-book:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 30px rgba(45,72,40,0.14);
}

/* ----- INTERSTITIAL/MENSAGENS ----- */
.interstitial {
  display:none; padding:18px; border-radius:12px; text-align:center; background: linear-gradient(180deg,#fff,#fbfff6); border:1px solid #eef7e8;
}
.interstitial.show { display:block; }
.interstitial-title { font-size:20px; font-weight:900; color:var(--primario); margin-bottom:8px; }
.interstitial-sub { color:var(--texto); font-size:16px; line-height:1.5; max-width:760px; margin: 0 auto; }

/* ----- PROCESSAMENTO ----- */
.processing { display:none; text-align:center; padding:18px; }
.process-bar { height:12px; background:#eef2f1; border-radius:999px; overflow:hidden; border:1px solid #e9efea; margin-top:12px; }
.process-fill { height:100%; width:0%; background: linear-gradient(90deg,var(--secundario),var(--primario)); transition: width 5s linear; }

/* ----- RESULTADO ----- */
.result-block { display:none; padding:14px; border-radius:12px; background:#f7fffb; border:1px solid #e6f6ee; margin-top:12px; }
.result-block.show { display:block; }
.result-title { font-size:16px; font-weight:900; color:var(--primario); margin-bottom:8px; text-align:left; }
.result-score { font-size:14px; font-weight:800; color:var(--texto); margin-bottom:8px; }
.result-desc { color:var(--texto); line-height:1.5; white-space:pre-line; }

/* destaque de impacto + CTA */
.impact-box { margin-top:12px; padding:14px; border-radius:10px; background: linear-gradient(180deg,#fffdf5,#fff8ee); border:1px solid #f1e7d7; text-align:left; }
.impact-text { font-weight:800; color:var(--primario); margin-bottom:10px; }
.impact-cta { margin-top:8px; }

/* ----- FORMULÁRIO DE LEAD ----- */
.lead-form { display:none; margin-top:12px; padding:12px; border-radius:10px; border:1px solid #eee; background:#ffffff; }
.lead-form.show { display:block; }
.form-row { display:flex; gap:10px; flex-direction:column; }
@media(min-width:720px){ .form-row.row-2 { flex-direction:row; } .form-row.row-3 { flex-direction:row; } }
.form-field { display:flex; flex-direction:column; gap:6px; }
.form-field input, .form-field textarea { padding:10px 12px; border-radius:8px; border:1px solid #e8e8e8; font-size:14px; }

/* checkbox LGPD */
.lgpd-text { font-size:13px; color:var(--texto); margin-top:8px; }

/* ----- PLAN PREVIEW ----- */
.plan-preview { display:none; margin-top:12px; padding:12px; border-radius:10px; border:1px solid #eee; background:#fffefb; }
.plan-preview.show { display:block; }
.plan-text { white-space:pre-line; color:var(--texto); }

/* ----- FOOTER small screens tweaks ----- */
@media(max-width:420px){
  .intro-monogram { width:90%; }
  .small-logo { width:60%; }
  .brand-name { font-size:20px; }
  .brand-sub { font-size:12px; }
  .btn-main { width:100%; }
  .option .letter { width:30px; height:30px; }
}/* End custom CSS */