/* ============================================================
   QUIZ · Diagnóstico de Decisão · Método Clareza
   Herda a paleta e as fontes da página de vendas e acrescenta
   quatro cores próprias. Uma única tela escura: a revelação.
   ============================================================ */

:root{
  /* herdadas da página de vendas */
  --bg-primary:#F4F6F7; --bg-secondary:#E9EEF1;
  --bg-dark:#10181D;    --bg-dark-2:#16222A;
  --text-primary:#11181D; --text-secondary:#5E6970;
  --bordeaux:#8F2539;   --bordeaux-2:#A93248;
  --slate-blue:#6793C2; --slate-ink:#416A96;
  --white:#FFFFFF;
  --font-display:"Banburi","Fraunces",Georgia,"Times New Roman",serif;
  --font-body:"Montserrat",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --s-1:8px; --s-2:16px; --s-3:24px; --s-4:32px; --s-5:48px; --s-6:64px;
  --r-16:16px; --r-20:20px; --r-24:24px;
  /* novas, só do quiz */
  --bordeaux-vivid:#C11E3A;
  --bordeaux-hot:#D92348;
  --slate-vivid:#4F8FE0;
  --pulse:#FF7A5A;
  /* apoio */
  --line:rgba(17,24,29,.12);
  --line-soft:rgba(17,24,29,.07);
  --line-dark:rgba(255,255,255,.14);
  --ease:cubic-bezier(.16,1,.3,1);
  --head-h:60px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg-primary);color:var(--text-primary);font-family:var(--font-body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
h1,h2,h3,p,ul,ol,figure{margin:0}
ul,ol{padding:0;list-style:none}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus{outline:none}
:focus-visible{outline:3px solid var(--bordeaux);outline-offset:3px;border-radius:6px}
.qz-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
[hidden]{display:none!important}

/* ---------- estrutura ---------- */
.qz-shell{min-height:100svh;min-height:100vh;display:flex;flex-direction:column}
.qz-head{position:sticky;top:0;z-index:20;min-height:var(--head-h);display:flex;align-items:center;gap:14px;padding:12px clamp(16px,4vw,32px);background:rgba(244,246,247,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line-soft)}
.qz-brand{display:inline-flex;align-items:center;gap:9px;flex:none}
.qz-brand .mk{width:30px;height:30px;border-radius:9px;background:var(--bordeaux);color:#fff;display:grid;place-items:center;flex:none}
.qz-brand .mk svg{width:18px;height:18px}
.qz-brand b{font-family:var(--font-display);font-weight:500;font-size:1rem;line-height:1}
.qz-back{margin-left:auto;font-weight:600;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-secondary);display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:0 4px}
.qz-back:hover{color:var(--bordeaux)}
.qz-back svg{width:14px;height:14px;flex:none}
.qz-back{white-space:nowrap}
.qz-when{display:inline-block;margin:4px 0 2px;font-style:normal;font-weight:700;font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--bordeaux-vivid);border:1px solid rgba(193,30,58,.28);border-radius:999px;padding:3px 9px}
@media (max-width:479px){.qz-back__long{display:none}}
.qz-main{flex:1;display:flex;flex-direction:column;justify-content:center;padding:clamp(20px,4vw,40px) clamp(16px,4vw,32px) clamp(28px,5vw,48px)}
.qz-wrap{width:100%;max-width:660px;margin:0 auto}
.qz-wrap--wide{max-width:820px}

/* ---------- progresso ---------- */
.qz-prog{margin-bottom:clamp(20px,3vw,30px)}
.qz-prog__row{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-bottom:9px}
.qz-prog__label{font-weight:700;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--slate-ink)}
.qz-prog__mark{font-weight:600;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text-secondary)}
.qz-prog__track{height:6px;border-radius:999px;background:rgba(17,24,29,.09);overflow:hidden}
.qz-prog__fill{height:100%;width:4%;border-radius:999px;background:linear-gradient(90deg,var(--bordeaux-vivid),var(--pulse));transition:width .55s var(--ease)}

/* ---------- tipografia de tela ---------- */
.qz-eyebrow{display:inline-flex;align-items:center;gap:11px;font-weight:700;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--bordeaux)}
.qz-eyebrow::before{content:"";width:24px;height:2px;border-radius:2px;background:var(--bordeaux);flex:none}
.qz-q{font-family:var(--font-display);font-weight:500;font-size:clamp(1.45rem,1.15rem + 1.5vw,2.05rem);line-height:1.16;letter-spacing:-.005em;margin-top:12px;text-wrap:balance}
.qz-q:focus{outline:none}
.qz-help{margin-top:10px;color:var(--text-secondary);font-size:.9rem}
.qz-lead{margin-top:16px;color:var(--text-secondary);font-size:clamp(.98rem,.94rem + .2vw,1.08rem);line-height:1.6}

/* ---------- alternativas ---------- */
.qz-opts{display:grid;gap:10px;margin-top:clamp(18px,3vw,26px)}
.qz-opt{position:relative;display:flex;align-items:center;gap:14px;width:100%;min-height:60px;padding:14px 18px;text-align:left;background:var(--white);border:1px solid var(--line);border-radius:var(--r-16);font-size:.98rem;line-height:1.4;color:var(--text-primary);transition:border-color .18s,background-color .18s,transform .18s var(--ease),box-shadow .18s}
.qz-opt:hover{border-color:var(--slate-vivid);transform:translateY(-1px);box-shadow:0 8px 22px -14px rgba(17,24,29,.35)}
.qz-opt__k{flex:none;width:26px;height:26px;border-radius:8px;border:1px solid var(--line);display:grid;place-items:center;font-family:var(--font-body);font-weight:700;font-size:.7rem;color:var(--text-secondary);transition:background-color .18s,border-color .18s,color .18s}
.qz-opt[aria-checked="true"]{border-color:var(--bordeaux-vivid);background:linear-gradient(180deg,rgba(193,30,58,.06),rgba(193,30,58,.02))}
.qz-opt[aria-checked="true"] .qz-opt__k{background:var(--bordeaux-vivid);border-color:var(--bordeaux-vivid);color:#fff}
.qz-opt:disabled{cursor:default}

/* leitura após a resposta */
.qz-reading{min-height:24px;margin-top:16px;font-size:.9rem;line-height:1.45;color:var(--slate-ink);opacity:0;transform:translateY(6px);transition:opacity .3s,transform .3s var(--ease)}
.qz-reading.is-on{opacity:1;transform:none}

/* resposta colapsada da qualificação */
.qz-answered{display:flex;align-items:center;gap:12px;padding:12px 16px;border:1px dashed var(--line);border-radius:var(--r-16);background:var(--bg-secondary);font-size:.9rem;color:var(--text-secondary);margin-bottom:16px}
.qz-answered b{color:var(--text-primary);font-weight:600}
.qz-answered button{margin-left:auto;font-weight:700;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--slate-ink);min-height:44px;padding:0 6px}
.qz-answered button:hover{color:var(--bordeaux)}

/* ---------- micro-conquista ---------- */
.qz-conquest{display:flex;align-items:center;justify-content:center;min-height:120px;text-align:center;font-family:var(--font-display);font-weight:500;font-size:clamp(1.15rem,1rem + .8vw,1.5rem);color:var(--text-primary);animation:qzFade .32s var(--ease)}
.qz-conquest span{display:inline-block;padding-bottom:10px;border-bottom:2px solid var(--pulse)}

/* ---------- botões ---------- */
.qz-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--font-body);font-weight:700;letter-spacing:.1em;text-transform:uppercase;text-align:center;border-radius:14px;transition:transform .25s var(--ease),box-shadow .25s,background .25s,border-color .25s,color .25s}
.qz-btn svg{width:15px;height:15px;flex:none}
.qz-btn--primary{width:100%;min-height:64px;padding:0 24px;font-size:.86rem;color:#fff;background:linear-gradient(180deg,var(--bordeaux-vivid),var(--bordeaux));box-shadow:0 14px 30px -14px rgba(193,30,58,.6);overflow:hidden}
.qz-btn--primary:hover{background:linear-gradient(180deg,var(--bordeaux-hot),var(--bordeaux-vivid));transform:translateY(-3px);box-shadow:0 20px 38px -16px rgba(217,35,72,.65)}
.qz-btn--primary::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,rgba(255,255,255,0) 40%,rgba(255,255,255,.28) 50%,rgba(255,255,255,0) 60%);background-size:250% 100%;background-repeat:no-repeat;animation:qzSheen 9s ease-in-out infinite}
.qz-btn--ghost{width:100%;max-width:340px;min-height:46px;padding:0 18px;font-size:.74rem;color:var(--text-primary);border:1px solid var(--line);background:transparent}
.qz-btn--ghost:hover{border-color:var(--bordeaux);color:var(--bordeaux);transform:translateY(-2px)}
.qz-btn--light{width:100%;max-width:420px;min-height:60px;padding:0 24px;font-size:.84rem;color:var(--bg-dark);background:linear-gradient(180deg,#fff,#e9eef1)}
.qz-btn--light:hover{transform:translateY(-3px);box-shadow:0 18px 34px -18px rgba(0,0,0,.7)}
.qz-link{display:inline-block;font-weight:700;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--slate-ink);min-height:44px;line-height:44px}
.qz-link:hover{color:var(--bordeaux)}
.qz-note{margin-top:12px;font-size:.8rem;color:var(--text-secondary)}
.qz-cta-stack{display:flex;flex-direction:column;align-items:flex-start;gap:14px;margin-top:var(--s-3)}

/* ---------- abertura ---------- */
.qz-intro__meta{margin-top:18px;font-weight:600;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text-secondary)}
.qz-sign{display:flex;align-items:center;gap:14px;margin-top:26px;padding-top:22px;border-top:1px solid var(--line-soft)}
.qz-sign img{width:52px;height:52px;border-radius:50%;object-fit:cover;flex:none}
.qz-sign b{display:block;font-family:var(--font-display);font-weight:500;font-size:1.02rem;line-height:1.2}
.qz-sign span{display:block;font-size:.82rem;color:var(--text-secondary);margin-top:2px}
.qz-legal{margin-top:22px;padding:14px 16px;border-left:2px solid var(--slate-blue);background:var(--bg-secondary);border-radius:0 10px 10px 0;font-size:.84rem;line-height:1.5;color:var(--text-secondary)}

/* ---------- revelação: a única tela escura ---------- */
.qz-dark{background:var(--bg-dark);color:#fff;border-radius:var(--r-24);padding:clamp(26px,4vw,44px);position:relative;overflow:hidden}
.qz-dark::before{content:"";position:absolute;width:62%;aspect-ratio:1;right:-14%;top:-24%;border-radius:50%;background:radial-gradient(circle,rgba(103,147,194,.18),rgba(103,147,194,0) 70%);pointer-events:none}
.qz-dark .qz-eyebrow{color:var(--slate-blue)}
.qz-dark .qz-eyebrow::before{background:var(--slate-blue)}
.qz-reveal__name{position:relative;font-family:var(--font-display);font-weight:500;font-size:clamp(2.1rem,1.4rem + 3vw,3.4rem);line-height:1;letter-spacing:-.01em;margin-top:14px;animation:qzReveal .7s var(--ease) both}
.qz-reveal__tag{position:relative;margin-top:14px;color:#AAB6BE;font-size:clamp(1rem,.95rem + .3vw,1.15rem);max-width:34ch}
.qz-free{margin-top:26px;border:1px solid var(--line-dark);border-radius:var(--r-20);padding:18px 20px 8px}
.qz-free__k{margin:0 0 12px;font-weight:700;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--pulse)}
.qz-locked{margin-top:12px!important;position:relative;margin-top:26px;border:1px solid var(--line-dark);border-radius:var(--r-20);padding:20px;overflow:hidden}
.qz-locked__inner{filter:blur(10px);opacity:.85;pointer-events:none}
.qz-locked__tag{position:absolute;inset:0;display:grid;place-items:center;font-weight:700;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.8)}
.qz-dark .qz-cta-stack{margin-top:26px}

/* ---------- barras do mapa ---------- */
.qz-bars{display:grid;gap:14px;margin-top:18px}
.qz-bar__head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.qz-bar__key{font-weight:700;font-size:.76rem;letter-spacing:.12em}
.qz-bar__role{font-weight:600;font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-secondary)}
.qz-bar__track{height:10px;margin-top:7px;border-radius:999px;background:rgba(17,24,29,.08);overflow:hidden}
.qz-dark .qz-bar__track{background:rgba(255,255,255,.1)}
.qz-dark .qz-bar__role{color:#8D939A}
.qz-bar__fill{height:100%;width:0;border-radius:999px;transition:width .85s var(--ease)}
.qz-bar--natural .qz-bar__fill{background:linear-gradient(90deg,var(--bordeaux-vivid),var(--pulse))}
.qz-bar--support .qz-bar__fill{background:linear-gradient(90deg,var(--bordeaux),var(--bordeaux-vivid))}
.qz-bar--attention .qz-bar__fill{background:linear-gradient(90deg,var(--slate-blue),var(--slate-vivid))}
.qz-bar__def{margin-top:6px;font-size:.78rem;line-height:1.45;color:var(--text-secondary)}
.qz-spread{display:grid;gap:12px;margin-top:18px}
.qz-spread__row{display:grid;grid-template-columns:120px 1fr 42px;align-items:center;gap:12px}
.qz-spread__k{font-weight:700;font-size:.72rem;letter-spacing:.1em}
.qz-spread__n{font-weight:700;font-size:.76rem;color:var(--text-secondary);text-align:right;font-variant-numeric:tabular-nums}
.qz-spread__track{height:9px;border-radius:999px;background:rgba(17,24,29,.08);overflow:hidden}
.qz-spread__fill{height:100%;width:0;border-radius:999px;background:var(--slate-blue);transition:width .85s var(--ease)}
.qz-spread__row.is-win .qz-spread__fill{background:linear-gradient(90deg,var(--bordeaux-vivid),var(--pulse))}
.qz-spread__row.is-win .qz-spread__k{color:var(--bordeaux)}

/* ---------- resultado ---------- */
.qz-result{display:grid;gap:clamp(20px,3vw,30px)}
.qz-card{background:var(--white);border:1px solid var(--line-soft);border-radius:var(--r-20);padding:clamp(20px,3vw,30px)}
.qz-card h2{font-family:var(--font-display);font-weight:500;font-size:clamp(1.2rem,1.05rem + .7vw,1.55rem);line-height:1.2;margin-bottom:12px}
.qz-card p{color:var(--text-secondary)}
.qz-card p + p{margin-top:12px}
.qz-hero-result .qz-reveal__name{font-size:clamp(1.8rem,1.3rem + 2vw,2.6rem);animation:none}
.qz-hero-result p{position:relative;margin-top:12px;color:#AAB6BE}
.qz-bridge{background:linear-gradient(135deg,rgba(193,30,58,.08),rgba(255,122,90,.06));border:1px solid rgba(193,30,58,.18);border-radius:var(--r-20);padding:clamp(20px,3vw,28px)}
.qz-bridge p{font-family:var(--font-display);font-weight:500;font-size:clamp(1.15rem,1rem + .8vw,1.5rem);line-height:1.25;color:var(--text-primary)}
.qz-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.qz-chip{font-weight:700;font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--bordeaux);border:1px solid rgba(193,30,58,.25);border-radius:999px;padding:7px 12px;background:var(--white)}
.qz-doctor{display:grid;grid-template-columns:120px 1fr;grid-template-areas:"foto head" "corpo corpo";gap:16px 18px;align-items:center}
.qz-doctor__photo{grid-area:foto;border-radius:14px;overflow:hidden;aspect-ratio:3/4;background:var(--bg-secondary)}
.qz-doctor__photo img{width:100%;height:100%;object-fit:cover}
.qz-doctor__head{grid-area:head}
.qz-doctor__head b{display:block;font-family:var(--font-display);font-weight:500;font-size:1.2rem;line-height:1.2}
.qz-doctor__head span{display:block;margin-top:6px;font-size:.84rem;color:var(--text-secondary)}
.qz-doctor__body{grid-area:corpo;color:var(--text-secondary);font-size:.94rem}
.qz-list{display:grid;gap:9px;margin-top:14px}
.qz-list li{display:flex;gap:12px;align-items:baseline;color:var(--text-secondary);font-size:.94rem}
.qz-list li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--slate-vivid);transform:translateY(-2px)}
.qz-journey{display:grid;gap:0;margin-top:14px}
.qz-journey li{display:grid;grid-template-columns:96px 1fr;gap:14px;padding:14px 0;border-top:1px solid var(--line-soft)}
.qz-journey li:last-child{border-bottom:1px solid var(--line-soft)}
.qz-journey b{font-weight:700;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--slate-ink)}
.qz-journey strong{display:block;font-family:var(--font-display);font-weight:500;font-size:1.02rem;line-height:1.2}
.qz-journey p{margin-top:5px;font-size:.88rem;color:var(--text-secondary)}
.qz-stack{width:100%;border-collapse:collapse;margin-top:14px}
.qz-stack td{padding:12px 0;border-bottom:1px solid var(--line-soft);font-size:.92rem;color:var(--text-secondary)}
.qz-stack td:last-child{text-align:right;font-variant-numeric:tabular-nums;color:var(--text-primary);font-weight:600}
.qz-stack tfoot td{border-bottom:0;padding-top:16px;font-weight:700;color:var(--text-primary);text-transform:uppercase;font-size:.72rem;letter-spacing:.12em}
.qz-stack tfoot td:last-child{font-family:var(--font-display);font-size:1.5rem;letter-spacing:0;color:var(--bordeaux)}
.qz-price{margin-top:18px;padding-top:18px;border-top:1px solid var(--line-soft)}
.qz-price b{display:block;font-family:var(--font-display);font-weight:500;font-size:clamp(2.2rem,1.6rem + 2vw,3rem);line-height:1;color:var(--text-primary)}
.qz-price span{display:block;margin-top:8px;font-weight:700;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--slate-ink)}
.qz-foot{margin-top:var(--s-4);padding-top:var(--s-3);border-top:1px solid var(--line-soft);display:grid;gap:12px}
.qz-foot p{font-size:.8rem;line-height:1.5;color:var(--text-secondary)}

/* ---------- portão do WhatsApp ---------- */
.qz-field{margin-top:20px}
.qz-field label{display:block;font-weight:600;font-size:.78rem;letter-spacing:.04em;color:var(--text-secondary);margin-bottom:8px}
.qz-field input{width:100%;min-height:52px;padding:0 16px;border:1px solid var(--line);border-radius:var(--r-16);background:var(--white);font-family:var(--font-body);font-size:1rem;color:var(--text-primary)}
.qz-field input:focus-visible{outline:3px solid var(--bordeaux);outline-offset:2px}
.qz-purpose{margin-top:18px;font-size:.76rem;line-height:1.5;color:var(--text-secondary)}
.qz-check{display:flex;gap:12px;align-items:flex-start;margin-top:16px;font-size:.84rem;color:var(--text-secondary)}
.qz-check input{width:22px;height:22px;flex:none;accent-color:var(--bordeaux-vivid)}

@keyframes qzFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes qzReveal{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}
@keyframes qzSheen{0%,72%{background-position:180% 0}100%{background-position:-80% 0}}
.qz-screen{animation:qzFade .32s var(--ease)}

/* ---------- telas curtas: uma pergunta sem rolagem em 320x568 ---------- */
/* telas curtas: a pergunta tem de caber sem rolagem, inclusive em 320x568 */
@media (max-height:760px){
  :root{--head-h:52px}
  .qz-main{padding-top:12px;padding-bottom:14px;justify-content:flex-start}
  .qz-prog{margin-bottom:12px}
  .qz-q{font-size:1.18rem;margin-top:8px;line-height:1.2}
  .qz-help{margin-top:7px;font-size:.82rem}
  .qz-opts{gap:7px;margin-top:12px}
  .qz-opt{min-height:48px;padding:9px 13px;font-size:.87rem;gap:11px}
  .qz-opt__k{width:23px;height:23px;font-size:.66rem}
  .qz-reading{min-height:0;margin-top:9px;font-size:.79rem;line-height:1.3}
  .qz-eyebrow{font-size:.62rem}
  .qz-answered{padding:8px 12px;margin-bottom:9px;font-size:.8rem}
  .qz-answered button{min-height:36px}
  .qz-cta-stack{margin-top:10px;gap:8px}
  .qz-link{min-height:36px;line-height:36px}
  .qz-conquest{min-height:90px}
}
@media (max-height:620px){
  .qz-q{font-size:1.06rem}
  .qz-opt{min-height:46px;padding:8px 12px;font-size:.83rem}
  .qz-prog{margin-bottom:10px}
  .qz-opts{gap:6px;margin-top:10px}
}
@media (max-width:400px){
  .qz-doctor{grid-template-columns:96px 1fr}
  .qz-spread__row{grid-template-columns:96px 1fr 38px;gap:9px}
  .qz-journey li{grid-template-columns:1fr;gap:5px}
}
@media (min-width:768px){
  .qz-doctor{grid-template-columns:180px 1fr;grid-template-areas:"foto head" "foto corpo";align-items:start}
  .qz-doctor__body{align-self:start}
  .qz-cta-stack{align-items:flex-start}
  .qz-btn--primary{max-width:520px}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:opacity .2s ease!important}
  .qz-reading{opacity:1;transform:none}
  .qz-prog__fill,.qz-bar__fill,.qz-spread__fill{transition:none!important}
}

.qz-close .qz-price{margin:14px 0 2px;font-family:var(--qz-font-display,inherit);font-size:2.4rem;line-height:1;color:var(--bordeaux-vivid)}
.qz-close .qz-price__note{margin:0 0 18px;font-weight:600;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text-secondary)}
.qz-close .qz-crm{font-weight:700;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--slate-vivid)}