/* Quiz Engine v1.0 — layout estrutural das famílias de template.
 * As CORES/medidas vêm das vars --qz-* declaradas no <style> escopado por
 * instância (com valores concretos + !important nas peças críticas — lição
 * do quiz-arquetipo contra tema/builder/otimizador de CSS). */

.qz-app{max-width:760px;margin:0 auto;box-sizing:border-box;font-family:var(--qz-ff-content,inherit);height:auto;min-height:0;overflow:visible}
.qz-app *,.qz-app *:before,.qz-app *:after{box-sizing:border-box}
.qz-stage{min-width:0}
.qz-loading{text-align:center;color:#999;padding:30px 0}
.qz-screen{animation:qzfade .25s ease}
@keyframes qzfade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ---------- chips (família A) ---------- */
.qz-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.qz-chip{display:inline-block;color:#fff;border-radius:999px;padding:4px 14px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;font-family:var(--qz-ff-chip,inherit);font-size:var(--qz-fs-chip,13px)}

/* ---------- intro ---------- */
.qz-title{margin:0 0 10px;color:var(--qz-title-color,#1f1a14);font-family:var(--qz-ff-title,inherit);font-size:var(--qz-fs-title,30px);line-height:1.25}
.qz-subtitle{margin:0 0 12px;color:var(--qz-subtitle-color,#6b6257);font-family:var(--qz-ff-subtitle,inherit);font-size:var(--qz-fs-subtitle,18px)}
.qz-intro-text{margin:0 0 18px;color:var(--qz-intro-color,#6b6257);font-family:var(--qz-ff-intro,inherit);font-size:var(--qz-fs-intro,16px);line-height:1.6}

/* ---------- splash (família B) ---------- */
.qz-splash{border-radius:16px;padding:56px 30px;text-align:center;background-size:cover;background-position:center}
.qz-splash-title{margin:0 0 10px;color:var(--qz-splash-title-color,#fff);font-family:var(--qz-ff-title,inherit);font-size:var(--qz-fs-title,30px);line-height:1.25}
.qz-splash-subtitle{margin:0 0 24px;color:var(--qz-splash-subtitle-color,#f3e8ff);font-family:var(--qz-ff-subtitle,inherit);font-size:var(--qz-fs-subtitle,18px)}
.qz-splash-btn{display:inline-block;border:0;cursor:pointer;background:var(--qz-splash-button-background,#fff);color:var(--qz-splash-button-text,#5b2d8e);border-radius:var(--qz-button-radius,999px);padding:var(--qz-button-padding-y,14px) var(--qz-button-padding-x,24px);font-weight:700;font-family:var(--qz-ff-btn,inherit);font-size:var(--qz-fs-btn,16px);letter-spacing:.04em;transition:background .15s ease,color .15s ease}
/* v1.15: hover REAL editável (fundo/texto por quiz), sem filtro fixo */
.qz-splash-btn:hover{background:var(--qz-splash-button-background-hover,var(--qz-splash-button-background,#fff));color:var(--qz-splash-button-text-hover,var(--qz-splash-button-text,#5b2d8e));filter:none}

/* ---------- barra de progresso ---------- */
.qz-progress-wrap{margin:0 0 18px}
.qz-progress-text{color:var(--qz-progress-label-color,#2a231c);font-family:var(--qz-ff-progress,inherit);font-size:var(--qz-fs-progress,13px);font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin:0 0 6px}
.qz-progress{border-radius:999px;overflow:hidden}
.qz-progress-fill{display:block;height:100%;border-radius:999px;transition:width .35s ease}

/* ---------- pergunta ---------- */
.qz-question-text{margin:0 0 18px;text-align:center;color:var(--qz-question-color,#2a231c);font-family:var(--qz-ff-question,inherit);font-size:var(--qz-fs-question,22px);line-height:1.35}
.qz-qimage{display:block;width:100%;height:auto;border-radius:var(--qz-question-image-radius,12px);margin:0 0 14px}
.qz-qimage-inline{max-width:420px;margin:0 auto 16px}
.qz-screen-question.qz-has-bg{background-size:cover;background-position:center;border-radius:12px;padding:22px}
.qz-screen-question.qz-has-bg .qz-q-inner{background:rgba(255,255,255,.92);border-radius:12px;padding:18px}

/* card da pergunta (família A) */
.qz-qcard{border:1px solid var(--qz-option-border,#d9d2c6);border-radius:14px;overflow:hidden;background:#fff}
.qz-qcard-head{background:var(--qz-qcard-header-background,#f2efe9);color:var(--qz-question-color,#2a231c);font-weight:700;padding:14px 16px;font-family:var(--qz-ff-question,inherit);font-size:var(--qz-fs-question,22px);line-height:1.35}
.qz-qcard .qz-qimage{border-radius:0;margin:0}
.qz-qcard .qz-options{padding:14px}

/* ---------- opções ---------- */
/* v1.1: largura travada + quebra de texto (a opção NUNCA vaza do card) */
/* v1.2: caixa da opção CRESCE com o texto (height auto, radio no topo,
 * label flex:1 quebrando) — rótulo de 3-4 linhas nunca vaza nem sobrepõe */
.qz-options-list{display:flex;flex-direction:column;gap:10px;min-width:0;height:auto}
.qz-option{display:flex;align-items:flex-start;gap:12px;box-sizing:border-box;width:100%;max-width:100%;min-width:0;height:auto;min-height:0;max-height:none;overflow:visible;text-align:left;white-space:normal;overflow-wrap:anywhere;word-break:break-word;line-height:1.45;cursor:pointer;font-family:var(--qz-ff-option,inherit);font-size:var(--qz-fs-option,16px);font-weight:700;padding:13px 16px;margin:0;transition:background .15s ease,color .15s ease;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.qz-option:disabled{cursor:default;opacity:.85}
.qz-option.is-selected:disabled{opacity:1}
.qz-check{flex:0 0 auto;width:20px;height:20px;border:2px solid var(--qz-option-border,#d9d2c6);background:#fff;position:relative}
.qz-check-square{border-radius:4px}
.qz-check-circle{border-radius:50%}
.qz-option.is-selected .qz-check:after{content:"✓";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:900;color:var(--qz-option-check-color,#2e9e5b)}
.qz-opt-label{flex:1 1 auto;display:block;min-width:0;white-space:normal;overflow-wrap:anywhere;word-break:break-word;line-height:1.45;height:auto}
.qz-option-row .qz-check{margin-top:2px}

/* grade de cards com imagem (prints 1289/1290) — v1.1: imagem em proporção
 * FIXA via wrapper com aspect-ratio (sem tirinha, sem distorção), check e
 * rótulo sempre visíveis, card destacado quando selecionado */
.qz-options-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;min-width:0}
.qz-option-card{flex-direction:column;align-items:stretch;gap:0;text-align:center;padding:0 0 12px;overflow:hidden;height:auto}
.qz-opt-imgwrap{display:block;width:100%;aspect-ratio:4/3;overflow:hidden}
.qz-opt-imgwrap .qz-opt-image{width:100%;height:100%;object-fit:cover;display:block}
.qz-option-card .qz-check{margin:10px auto 6px;border-radius:50%}
.qz-option-card .qz-opt-label{display:block;padding:0 10px}

/* ---------- pop-up de resposta (família A) ---------- */
.qz-popup-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;z-index:99999;padding:16px}
.qz-popup{position:relative;background:var(--qz-popup-background,#fff);color:var(--qz-popup-text-color,#2a231c);border-radius:14px;max-width:520px;width:100%;max-height:86vh;overflow:auto;padding:26px;text-align:center;box-shadow:0 12px 40px rgba(0,0,0,.3)}
.qz-popup-close{position:absolute;top:8px;right:12px;border:0;background:none;font-size:26px;line-height:1;cursor:pointer;color:inherit}
.qz-popup-quiz{font-size:12px;letter-spacing:.08em;text-transform:uppercase;opacity:.7;margin:0 0 8px}
.qz-popup-title{margin:0 0 12px;font-size:20px;font-family:var(--qz-ff-question,inherit)}
.qz-popup-image{display:block;max-width:100%;height:auto;border-radius:10px;margin:0 auto 12px}
.qz-popup-text{margin:0 0 14px;line-height:1.6;font-size:var(--qz-fs-content,16px)}
.qz-popup-dots{display:flex;gap:6px;justify-content:center}
.qz-dot{width:22px;height:22px;border-radius:50%;background:#eee;font-size:11px;display:flex;align-items:center;justify-content:center;color:#666}
.qz-dot.is-on{background:var(--qz-progress-fill,#2e9e5b);color:#fff}
.qz-popup-continue{display:block;margin:16px auto 0}

/* ---------- botões ---------- */
.qz-btn{display:inline-block;border:0;cursor:pointer;font-weight:700;font-family:var(--qz-ff-btn,inherit);font-size:var(--qz-fs-btn,16px);text-decoration:none;transition:background .15s ease,color .15s ease;text-align:center;box-sizing:border-box;max-width:100%}
.qz-btn .qz-btn-label{display:inline-block}
/* v1.1: botões de fluxo centralizados (o escopado reforça com !important) */
.qz-start,.qz-continue,.qz-submit{display:block;margin:18px auto 0}
.qz-ghost{background:transparent !important;border:2px solid var(--qz-button-background,#2e9e5b) !important;color:var(--qz-button-background,#2e9e5b) !important}
a.qz-btn{line-height:normal}

/* ---------- formulário de lead ---------- */
.qz-form-title{margin:0 0 8px;color:var(--qz-title-color,#1f1a14);font-family:var(--qz-ff-title,inherit);font-size:var(--qz-fs-title,26px)}
.qz-form-note{margin:0 0 16px;color:var(--qz-intro-color,#6b6257);font-size:var(--qz-fs-content,16px);line-height:1.55}
.qz-field{margin:0 0 14px}
.qz-field label{display:block;margin:0 0 5px;color:var(--qz-label-color,#2a231c);font-family:var(--qz-ff-label,inherit);font-size:var(--qz-fs-label,15px);font-weight:700}
.qz-field input{width:100%;padding:11px 12px;border:1px solid var(--qz-option-border,#d9d2c6);border-radius:8px;font-size:16px;background:#fff;color:#222}
.qz-field.has-error input{border-color:#c0392b}
.qz-error{color:#c0392b;font-size:13px;margin:5px 0 0}
.qz-hp{position:absolute !important;left:-9999px !important;opacity:0;height:0;width:0}
.qz-skip-wrap{text-align:center;margin:12px 0 0}
.qz-skip{color:var(--qz-skip-color,#8a8378);font-size:var(--qz-skip-font-size,14px);text-decoration:underline}

/* ---------- resultado ---------- */
.qz-screen-result{text-align:center}
.qz-result-badge{display:inline-block;color:var(--qz-badge-color,#b8860b);border:1px solid var(--qz-badge-color,#b8860b);border-radius:999px;padding:5px 16px;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin:0 0 16px}
.qz-result-image{display:block;margin:0 auto 16px}
.qz-result-name{margin:0 0 6px;color:var(--qz-result-title-color,#1f1a14);font-family:var(--qz-ff-title,inherit);font-size:var(--qz-fs-title,28px)}
.qz-result-tagline{margin:0 0 14px;color:var(--qz-subtitle-color,#6b6257);font-style:italic;font-size:var(--qz-fs-subtitle,18px)}
.qz-result-desc,.qz-result-block{margin:0 0 14px;color:var(--qz-text-color,#2a231c);text-align:left;line-height:1.65;font-family:var(--qz-ff-content,inherit);font-size:var(--qz-fs-content,16px)}
.qz-result-label{margin:18px 0 6px;color:var(--qz-result-label-color,#b8860b);font-size:15px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;text-align:left}
.qz-score-card{background:linear-gradient(135deg,var(--qz-splash-grad1,#7b2ff7),var(--qz-splash-grad2,#b04df1));border-radius:16px;padding:34px 22px;color:#fff;margin:0 0 18px}
.qz-score-headline{font-size:var(--qz-fs-subtitle,18px);font-weight:700;letter-spacing:.03em;margin:0 0 8px}
.qz-score-pct{font-size:56px;font-weight:900;line-height:1}
.qz-ranges{list-style:none;margin:0 0 14px;padding:0;text-align:left}
.qz-range{padding:9px 12px;border:1px solid var(--qz-option-border,#d9d2c6);border-radius:8px;margin:0 0 8px;color:var(--qz-text-color,#2a231c);font-size:var(--qz-fs-content,16px)}
.qz-range.is-hit{border-color:var(--qz-progress-fill,#2e9e5b);border-width:2px;font-weight:700}
.qz-range-text{color:var(--qz-text-color,#2a231c);text-align:left;line-height:1.6;margin:0 0 14px;font-size:var(--qz-fs-content,16px)}
.qz-offer{margin:20px 0 6px;padding:18px;border:1px solid var(--qz-option-border,#d9d2c6);border-radius:12px;background:#fff}
.qz-offer-image{display:block;max-width:100%;height:auto;border-radius:10px;margin:0 auto 12px}
.qz-offer-title{margin:0 0 8px;color:var(--qz-offer-title-color,#1f1a14);font-size:20px;font-family:var(--qz-ff-title,inherit)}
.qz-offer-text{margin:0;color:var(--qz-offer-text-color,#2a231c);line-height:1.6;font-size:var(--qz-fs-content,16px)}
.qz-actions{display:flex;flex-direction:column;gap:12px;align-items:center;margin:18px 0 0}
.qz-share{margin:18px 0 0;display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap}
.qz-share-label{color:var(--qz-text-color,#2a231c);font-size:14px}
.qz-share-btn{width:38px;height:38px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:#fff !important;font-weight:900;text-decoration:none;font-size:15px;border:0;cursor:pointer;padding:0;line-height:1}
.qz-share-facebook{background:#1877f2}
.qz-share-twitter{background:#111}
.qz-share-pinterest{background:#e60023}
.qz-share-whatsapp{background:#25d366}
.qz-share-telegram{background:#229ed9}
.qz-share-linkedin{background:#0a66c2}
.qz-share-reddit{background:#ff4500}
.qz-share-email{background:#667085}
.qz-share-copy{background:#475467}
/* v1.4: redes sem share-intent (copiar+abrir OU link de perfil) — cores de marca */
.qz-share-instagram{background:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);font-size:12px}
.qz-share-tiktok{background:linear-gradient(135deg,#25f4ee,#010101 40%,#010101 60%,#fe2c55);font-size:12px}
.qz-share-youtube{background:#ff0000;font-size:12px}
.qz-share-substack{background:#ff6719}
.qz-share-bilibili{background:linear-gradient(135deg,#fb7299,#00a1d6)}
.qz-share-toast{display:inline-block;background:#1f2937;color:#fff;border-radius:8px;padding:6px 12px;font-size:13px;font-weight:700}
.qz-disclaimer{margin:20px 0 0;color:var(--qz-disclaimer-color,#6b6257);font-size:14px;line-height:1.6;text-align:left}

/* revisão de respostas (modo "mostrar respostas só no final") */
.qz-review{text-align:left}
.qz-review-item{border:1px solid var(--qz-option-border,#d9d2c6);border-radius:10px;padding:14px;margin:0 0 10px;background:#fff}
.qz-review-q{margin:0 0 6px;font-weight:700;color:var(--qz-question-color,#2a231c);font-size:var(--qz-fs-content,16px)}
.qz-review-a{margin:0 0 6px;font-weight:700;color:var(--qz-result-label-color,#b8860b)}
.qz-review-image{display:block;max-width:220px;height:auto;border-radius:8px;margin:0 0 8px}
.qz-review-text{margin:0;line-height:1.6;color:var(--qz-text-color,#2a231c);font-size:var(--qz-fs-content,16px)}
.qz-review-title{text-align:left;margin-top:24px}

@media(max-width:680px){
  .qz-splash{padding:40px 18px}
  .qz-score-pct{font-size:44px}
}
@media(max-width:480px){
  .qz-options-grid{grid-template-columns:1fr 1fr;gap:10px}
  .qz-start,.qz-continue,.qz-submit{width:100%}
  .qz-popup{padding:18px 14px}
}
@media(max-width:340px){
  .qz-options-grid{grid-template-columns:1fr}
}