/* =========================================================
   QUIZ DE LEAD-GEN — modal multi-step (Home + Auto Equity)
   Vanilla, tema warm V4. Sem Tailwind, sem Phosphor.
   Tokens herdados de styles.css (:root).
   ========================================================= */

.quiz-overlay{
  position:fixed; inset:0;
  background:rgba(15,12,9,.55);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
  z-index:2000;
  display:none;
  align-items:flex-end;
  justify-content:center;
  padding:0;
}
.quiz-overlay.is-open{display:flex}
@media (min-width:640px){
  .quiz-overlay{align-items:center;padding:24px}
}

.quiz-modal{
  background:var(--paper);
  width:100%;
  max-width:600px;
  max-height:92vh;
  border-radius:22px 22px 0 0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  box-shadow:0 -8px 40px -12px rgba(26,22,18,.4);
  animation:quizUp .32s cubic-bezier(.2,.7,.2,1);
}
@media (min-width:640px){
  .quiz-modal{border-radius:22px;box-shadow:0 30px 80px -24px rgba(26,22,18,.5)}
}
@keyframes quizUp{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}

/* header */
.quiz-head{
  display:flex; align-items:flex-start; justify-content:space-between;
  gap:16px;
  padding:22px 24px 18px;
  border-bottom:1px solid var(--line);
}
.quiz-head__title{
  font-family:var(--serif); font-weight:500;
  font-size:20px; line-height:1.15; letter-spacing:-0.01em;
  margin:0; color:var(--ink);
}
.quiz-close{
  flex:none;
  width:36px;height:36px;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:var(--ink-3);
  transition:background .15s, color .15s;
}
.quiz-close:hover{background:var(--paper-2);color:var(--ink)}
.quiz-close svg{width:18px;height:18px}

/* progress */
.quiz-progress-wrap{padding:16px 24px 4px}
.quiz-progress-meta{
  display:flex;justify-content:space-between;
  font-size:11.5px; letter-spacing:.06em;
  color:var(--ink-3); margin-bottom:8px;
  font-variant-numeric:tabular-nums;
}
.quiz-progress-track{
  height:5px;
  background:var(--line);
  border-radius:999px;
  overflow:hidden;
}
.quiz-progress-bar{
  height:100%;
  width:16.66%;
  background:var(--orange);
  border-radius:999px;
  transition:width .3s ease;
}

/* body / scroll area */
.quiz-body{
  padding:22px 24px 8px;
  overflow-y:auto;
  flex:1;
}
.quiz-step{display:none}
.quiz-step.is-active{display:block;animation:quizFade .25s ease}
@keyframes quizFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.quiz-step__title{
  font-weight:600; font-size:18px; line-height:1.25;
  color:var(--ink); margin:0 0 6px;
}
.quiz-step__sub{font-size:13.5px;color:var(--ink-3);margin:0 0 18px}
/* hero por passo: copy à esquerda + ilustração à direita, bg seamless */
.quiz-hero{
  position:relative;
  height:152px;
  margin:-2px 0 18px;
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
  display:flex;
  align-items:center;
}
.quiz-hero__copy{
  position:relative;
  z-index:2;
  padding:0 18px;
  max-width:60%;
}
.quiz-hero__eyebrow{
  font-family:var(--serif);
  font-weight:600;
  font-size:24px;
  line-height:1.1;
  letter-spacing:-0.01em;
  color:var(--ink);
  margin:0 0 5px;
  text-wrap:balance;
}
.quiz-hero__body{
  font-size:13px;
  line-height:1.4;
  color:var(--ink-2);
  margin:0;
}
.quiz-hero__art{
  position:absolute;
  right:0; top:0;
  height:100%;
  aspect-ratio:1 / 1;
  width:auto;
  object-fit:cover;
  object-position:center;
}
@media (min-width:640px){ .quiz-hero{height:168px} }
@media (max-height:720px){ .quiz-hero{height:122px} .quiz-hero__eyebrow{font-size:21px} }
@media (max-width:440px){ .quiz-hero__copy{max-width:64%} }

/* mensagem fixa (LTV ditado pelo banco) */
.quiz-fixed{
  font-size:15px;
  line-height:1.45;
  color:var(--ink);
  margin:0;
}
.quiz-fixed strong{ color:var(--orange-2); }
.quiz-fixed sup{ color:var(--orange-2); font-weight:700; }
.quiz-aster{
  font-size:11.5px;
  line-height:1.4;
  color:var(--ink-3);
  margin:7px 0 0;
}

/* chips de prazo (estilo Galleria) */
.quiz-chips{ display:flex; gap:8px; flex-wrap:wrap; }
.quiz-chip{
  flex:1;
  min-width:74px;
  padding:11px 8px;
  border-radius:10px;
  border:1.5px solid var(--line);
  background:#fff;
  color:var(--ink-2);
  font-size:13px;
  font-weight:600;
  transition:border-color .15s, background .15s, color .15s;
}
.quiz-chip:hover{ border-color:var(--orange-3); }
.quiz-chip.is-active{ border-color:var(--orange); background:var(--orange-soft); color:var(--orange-2); }

/* verificação de e-mail */
.quiz-verify{ margin:8px 0 4px; }
.quiz-verify__btn{
  width:100%; padding:11px; border-radius:10px;
  border:1.5px solid var(--orange); background:var(--orange-soft);
  color:var(--orange-2); font-weight:600; font-size:13.5px;
  transition:background .15s, color .15s, opacity .15s;
}
.quiz-verify__btn:hover:not(:disabled){ background:var(--orange); color:#fff; }
.quiz-verify__btn:disabled{ opacity:.5; cursor:not-allowed; }
.quiz-label{
  display:flex;justify-content:space-between;align-items:baseline;
  font-size:13.5px;font-weight:500;color:var(--ink-2);
  margin:0 0 8px;
}
.quiz-label strong{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
.quiz-field{margin-bottom:18px}
.quiz-field--box{
  background:#fff;border:1px solid var(--line);
  border-radius:14px;padding:16px;margin-bottom:18px;
}

/* slider (reuses V4 warm theme) */
.quiz-slider{
  -webkit-appearance:none;appearance:none;
  width:100%;height:4px;border-radius:4px;
  background:var(--line);outline:none;margin:2px 0;
}
.quiz-slider::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;
  width:22px;height:22px;border-radius:50%;
  background:#fff;border:2px solid var(--orange);
  cursor:pointer;box-shadow:0 1px 4px rgba(26,22,18,.18);
}
.quiz-slider::-moz-range-thumb{
  width:22px;height:22px;border-radius:50%;
  background:#fff;border:2px solid var(--orange);cursor:pointer;
}
.quiz-range-ticks{
  display:flex;justify-content:space-between;
  font-size:11px;color:var(--ink-3);margin-top:4px;
  font-variant-numeric:tabular-nums;
}

/* dynamic result card */
.quiz-result{
  background:var(--bg);color:#fff;
  border-radius:14px;padding:18px;
}
.quiz-result__eyebrow{
  font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(255,255,255,.6);margin:0 0 4px;
}
.quiz-result__big{
  font-family:var(--serif);font-weight:500;font-size:30px;
  letter-spacing:-0.01em;margin:0;font-variant-numeric:tabular-nums;line-height:1.05;
}
.quiz-result__big--sm{font-size:23px}
.quiz-result__cols{display:flex;align-items:flex-end;justify-content:space-between;gap:18px}
.quiz-result__col{min-width:0}
.quiz-result__col + .quiz-result__col{text-align:right}

/* option cards */
.quiz-options{display:flex;flex-direction:column;gap:8px;margin-bottom:6px}
.quiz-option{
  display:flex;align-items:flex-start;gap:12px;
  padding:14px;
  background:#fff;border:1.5px solid var(--line);
  border-radius:12px;cursor:pointer;
  transition:border-color .15s, background .15s;
}
.quiz-option:hover{border-color:var(--orange-3)}
.quiz-option.is-selected{border-color:var(--orange);background:var(--orange-soft)}
.quiz-radio{
  flex:none;width:20px;height:20px;border-radius:50%;
  border:2px solid var(--line);margin-top:1px;
  position:relative;transition:border-color .15s;
}
.quiz-option.is-selected .quiz-radio{border-color:var(--orange)}
.quiz-option.is-selected .quiz-radio::after{
  content:"";position:absolute;inset:3px;border-radius:50%;background:var(--orange);
}
.quiz-option__title{font-weight:500;font-size:14.5px;color:var(--ink)}
.quiz-option__desc{font-size:12px;color:var(--ink-3);margin-top:2px}

/* inputs / selects */
.quiz-input, .quiz-select{
  width:100%;
  padding:12px 14px;
  border:1.5px solid var(--line);
  border-radius:10px;
  background:#fff;color:var(--ink);
  font:inherit;font-size:14.5px;
  outline:none;transition:border-color .15s;
}
.quiz-input:focus, .quiz-select:focus{border-color:var(--orange)}
.quiz-sublabel{display:block;font-size:13px;font-weight:500;color:var(--ink-2);margin:0 0 6px}
.quiz-note{font-size:11.5px;line-height:1.5;color:var(--ink-3);margin:10px 0 0}

/* mini summary chip */
.quiz-summary{
  background:var(--orange-soft);border:1px solid var(--orange-3);
  border-radius:12px;padding:14px;margin-bottom:18px;
}
.quiz-summary__k{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-bottom:4px}
.quiz-summary__row{display:flex;justify-content:space-between;align-items:baseline}
.quiz-summary__big{font-family:var(--serif);font-weight:500;font-size:20px;color:var(--ink);font-variant-numeric:tabular-nums}

/* success */
.quiz-success{text-align:center;padding:6px 0 0}
.quiz-success__icon{
  width:72px;height:72px;border-radius:50%;
  background:rgba(31,138,76,.12);color:#1f8a4c;
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 16px;
}
.quiz-success__icon svg{width:40px;height:40px}
.quiz-success__title{font-family:var(--serif);font-weight:500;font-size:24px;color:var(--ink);margin:0 0 8px}
.quiz-success__text{font-size:14.5px;line-height:1.6;color:var(--ink-2);margin:0 0 20px;padding:0 8px}
.quiz-estimate{
  background:var(--bg);color:#fff;border-radius:14px;padding:18px;margin-bottom:18px;text-align:left;
}
.quiz-estimate__eyebrow{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--orange-3);margin:0 0 12px}
.quiz-estimate__row{display:flex;justify-content:space-between;align-items:baseline;font-size:13.5px;padding:6px 0}
.quiz-estimate__row + .quiz-estimate__row{border-top:1px solid rgba(255,255,255,.1)}
.quiz-estimate__row .k{color:rgba(255,255,255,.65)}
.quiz-estimate__row .v{font-weight:600;font-variant-numeric:tabular-nums}
.quiz-estimate__row .v--big{font-family:var(--serif);font-weight:500;font-size:22px}
.quiz-estimate__row .v--accent{color:var(--orange-3)}
.quiz-meta{
  background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:14px;font-size:13.5px;margin-bottom:18px;text-align:left;
}
.quiz-meta__row{display:flex;justify-content:space-between;padding:4px 0}
.quiz-meta__row .k{color:var(--ink-3)}
.quiz-disclaimer{font-size:11.5px;line-height:1.5;color:var(--ink-3);text-align:center;margin:0 0 18px;padding:0 6px}

/* footer nav */
.quiz-foot{
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;padding:16px 24px;border-top:1px solid var(--line);
  background:var(--paper);
}
.quiz-back{
  display:inline-flex;align-items:center;gap:6px;
  font-size:14px;font-weight:500;color:var(--ink-3);
  padding:8px 4px;transition:color .15s;
}
.quiz-back:hover{color:var(--ink)}
.quiz-back svg{width:16px;height:16px}
.quiz-next{
  display:inline-flex;align-items:center;gap:8px;
  padding:12px 22px;border-radius:6px;
  background:var(--orange);color:#fff;font-weight:600;font-size:14.5px;
  transition:background .2s, opacity .2s;
}
.quiz-next:hover{background:var(--orange-2)}
.quiz-next:disabled{opacity:.45;cursor:not-allowed}
.quiz-next svg{width:16px;height:16px}
.quiz-full-btn{
  width:100%;justify-content:center;
  padding:13px 22px;border-radius:6px;
  background:var(--orange);color:#fff;font-weight:600;font-size:14.5px;
  display:inline-flex;align-items:center;gap:8px;
  transition:background .2s;
}
.quiz-full-btn:hover{background:var(--orange-2)}

/* ===== Auto: grid, Fácil IA, upload, validação ===== */
.quiz-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:520px){.quiz-grid2{grid-template-columns:1fr}}

.quiz-ia{background:var(--orange-soft);border:1px solid var(--orange-3);border-radius:14px;padding:14px;margin-bottom:18px}
.quiz-ia__tabs{display:flex;gap:6px;margin-bottom:12px}
.quiz-ia__tab{
  flex:1;padding:9px 10px;border-radius:9px;font-size:13px;font-weight:600;
  background:#fff;color:var(--ink-2);border:1px solid var(--line);transition:all .15s;
}
.quiz-ia__tab.is-active{background:var(--orange);color:#fff;border-color:var(--orange)}
.quiz-ia__row{display:flex;gap:8px}
.quiz-ia__row .quiz-input{flex:1}
.quiz-ia__go{
  flex:none;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;
  padding:0 14px;border-radius:10px;background:var(--ink);color:#fff;font-weight:600;font-size:13.5px;
  transition:background .2s;
}
.quiz-ia__go:hover{background:#000}
.quiz-ia__go svg{width:16px;height:16px}
.quiz-ia__status{font-size:12.5px;margin:10px 0 0;min-height:1px;line-height:1.45}
.quiz-ia__status.is-load{color:var(--ink-2)}
.quiz-ia__status.is-ok{color:#1f8a4c}
.quiz-ia__status.is-warn{color:#d9a300}
.quiz-ia__status.is-err{color:#d63a3a;font-weight:500}

.quiz-upload{
  display:flex;align-items:center;gap:12px;padding:16px;cursor:pointer;
  border:1.5px dashed var(--orange-3);border-radius:12px;background:#fff;
  transition:border-color .15s, background .15s;
}
.quiz-upload:hover{border-color:var(--orange);background:var(--orange-soft)}
.quiz-upload__ic{
  flex:none;width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  background:var(--orange-soft);color:var(--orange-2);
}
.quiz-upload__ic svg{width:22px;height:22px}
.quiz-upload__txt{font-size:13.5px;color:var(--ink-2);line-height:1.35}
.quiz-upload__txt small{color:var(--ink-3)}

.quiz-ok{
  display:flex;align-items:center;gap:12px;padding:16px;border-radius:12px;
  background:#f1f9f4;border:1px solid #1f8a4c;font-size:13.5px;color:var(--ink-2);
}
.quiz-ok__ic{flex:none;width:34px;height:34px;border-radius:50%;background:rgba(31,138,76,.15);color:#1f8a4c;display:flex;align-items:center;justify-content:center}
.quiz-ok__ic svg{width:20px;height:20px}
