*{box-sizing:border-box}

:root{
  --qz-navy:#081B3D; --qz-navy2:#0C244F; --qz-royal:#1F4FE3;
  --qz-royal2:#5B8DEF; --qz-cyan:#79A8FF; --qz-orange:#F58220;
  --qz-line:#E3E9F2; --qz-text:#0C1B33; --qz-dim:#51607D; --qz-shell-bg:#F5F7FC;
}
.quiz-page{margin:0;background:#fff;font-family:"Inter",-apple-system,BlinkMacSystemFont,sans-serif;color:var(--qz-text);min-height:100vh}
.quiz-page a, .quiz-page button, .quiz-page input, .quiz-page select, .quiz-page textarea{
  -webkit-tap-highlight-color:transparent;
}

.quiz-page .site-head{
  position:sticky;top:0;z-index:20;background:rgba(255,255,255,.92);
  backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--qz-line);
}
.quiz-page .site-head .nav{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;max-width:1100px;margin:0 auto}
.quiz-page .brand{display:flex;align-items:center;text-decoration:none}
.quiz-page .brand__logo{height:28px;display:block}
.quiz-exit{color:var(--qz-dim);text-decoration:none;font-size:13.5px;font-weight:600;padding:9px 14px;border-radius:9px}

.quiz-shell{
  min-height:calc(100vh - 62px);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:32px 16px 56px;
  background:
    radial-gradient(560px 280px at 82% -10%, rgba(31,79,227,.06), transparent 65%),
    radial-gradient(420px 240px at 8% 100%, rgba(245,130,32,.05), transparent 60%),
    var(--qz-shell-bg);
}

.quiz-progress{width:100%;max-width:640px;margin:0 auto 14px}
.quiz-progress__bar{height:4px;border-radius:99px;background:var(--qz-line);overflow:hidden}
.quiz-progress__bar span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--qz-orange),var(--qz-royal2));transition:width .3s ease}
.quiz-progress__label{display:block;margin-top:8px;font-size:12.5px;color:var(--qz-dim)}

.quiz-card{
  width:100%;max-width:640px;background:#fff;border-radius:20px;
  padding:34px 30px;box-shadow:0 24px 56px rgba(8,27,61,.10),0 2px 8px rgba(8,27,61,.05);
  border:1px solid var(--qz-line);
}
@media (max-width:520px){.quiz-card{padding:24px 18px;border-radius:16px}}

.quiz-card--anim{animation:qzCardIn .32s cubic-bezier(.16,1,.3,1)}
@keyframes qzCardIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

.qz-title{font-family:"Sora",sans-serif;font-size:22px;margin:0 0 8px;text-wrap:balance;color:var(--qz-navy)}
.qz-subtitle{color:var(--qz-dim);font-size:14px;margin:0 0 20px}

.qz-options{display:flex;flex-direction:column;gap:10px;margin:0 0 20px}
.qz-opt{
  display:flex;align-items:center;gap:12px;text-align:left;width:100%;
  border:1px solid var(--qz-line);border-radius:12px;padding:14px 16px;
  background:#fff;cursor:pointer;font:inherit;font-size:14.5px;color:var(--qz-text);
  min-height:52px;transition:border-color .15s,background .15s,transform .1s;
}
.qz-opt:active{transform:scale(.98)}
.qz-opt:focus-visible{outline:2px solid var(--qz-royal);outline-offset:2px}
.qz-opt[aria-pressed="true"]{border-color:var(--qz-orange);background:#FFF6EC}
.qz-opt:disabled{cursor:default}
.qz-opt:disabled:not([aria-pressed="true"]){opacity:.5}
.qz-opt--subtle{border-style:dashed;color:var(--qz-dim);font-size:13px;min-height:auto;padding:9px 14px}

.qz-actions{display:flex;gap:10px;justify-content:space-between;align-items:center;flex-wrap:wrap}
.qz-back{background:none;border:none;color:var(--qz-dim);font-size:13.5px;cursor:pointer;padding:8px 4px}
.qz-continue{
  background:var(--qz-royal);color:#fff;border:none;border-radius:11px;
  padding:14px 22px;font-size:14.5px;font-weight:600;cursor:pointer;
  transition:background .15s,transform .1s;
}
.qz-continue:disabled{opacity:.4;cursor:not-allowed}
.qz-continue:active:not(:disabled){transform:scale(.98)}

.qz-hint{font-size:12.5px;color:var(--qz-dim);margin-top:-8px;margin-bottom:14px}

.qz-intro{text-align:left}
.qz-intro__foot{color:var(--qz-dim);font-size:12.5px;margin-top:18px}

.qz-field{display:flex;flex-direction:column;gap:5px;margin-bottom:16px}
.qz-field label{font-size:12.8px;color:var(--qz-dim);font-weight:600}
.qz-field input, .qz-field textarea, .qz-field select{
  width:100%;font-size:16px;padding:12px 14px;border:1px solid var(--qz-line);border-radius:10px;
  font-family:inherit;color:var(--qz-text);background:#fff;
}
.qz-field input:focus, .qz-field textarea:focus, .qz-field select:focus{outline:2px solid var(--qz-royal);outline-offset:1px}
.qz-field--split{flex-direction:row;gap:10px;align-items:flex-start}
.qz-field--split > div{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.qz-field--split .qz-field--uf{flex:0 0 92px}
.qz-consent{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--qz-dim);margin:6px 0 18px}
.qz-consent input{margin-top:3px;flex:none}

.qz-result__top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:18px;flex-wrap:wrap}
.qz-result__badge{
  display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:700;
  letter-spacing:.04em;padding:7px 13px;border-radius:99px;text-transform:uppercase;
}
.qz-result__badge::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.qz-result__badge--ok{background:#E9F7EF;color:#1A8F5E}
.qz-result__badge--err{background:#FDECEC;color:#C0392B}
.qz-result__proto{
  font-family:"IBM Plex Mono","SFMono-Regular",Consolas,monospace;font-size:11.5px;
  color:var(--qz-dim);background:var(--qz-shell-bg);padding:6px 10px;border-radius:7px;letter-spacing:.02em;
}
.qz-result__hello{color:var(--qz-dim);font-size:14.5px;margin:0 0 4px}
.qz-result__hello strong{color:var(--qz-text)}
.qz-result__route{font-family:"Sora",sans-serif;font-size:23px;line-height:1.25;margin:0 0 12px;color:var(--qz-navy);text-wrap:balance}
.qz-result__desc{color:var(--qz-dim);font-size:14.5px;line-height:1.6;margin:0 0 18px}
.qz-result__chips-label{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--qz-dim);margin:0 0 9px}
.qz-result__chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px}
.qz-chip{background:var(--qz-shell-bg);border:1px solid var(--qz-line);color:var(--qz-text);font-size:12.5px;font-weight:600;padding:7px 12px;border-radius:99px}
.qz-result__next{background:var(--qz-shell-bg);border-radius:12px;padding:14px 16px;font-size:13.5px;color:var(--qz-dim);line-height:1.55;margin:0 0 22px}
.qz-result__next strong{color:var(--qz-text)}
.qz-result__cta{display:flex;gap:10px;flex-wrap:wrap}
.qz-btn-primary, .qz-btn-ghost{
  border-radius:11px;padding:14px 22px;font-size:14.5px;font-weight:700;text-decoration:none;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:1 1 auto;
  min-height:50px;transition:transform .12s,box-shadow .12s;
  border:none;cursor:pointer;font-family:inherit;
}
.qz-btn-primary:disabled{opacity:.6;cursor:not-allowed}
.qz-btn-primary{background:var(--qz-orange);color:#fff;box-shadow:0 10px 24px rgba(245,130,32,.28)}
.qz-btn-ghost{background:var(--qz-shell-bg);color:var(--qz-text)}

@media (max-width:480px){
  .qz-result__top{width:100%}
  .qz-result__cta{flex-direction:column}
  .qz-result__cta a{width:100%}
}

@media (prefers-reduced-motion: reduce){
  .quiz-progress__bar span{transition:none}
  .quiz-card--anim{animation:none}
  .qz-opt, .qz-continue, .qz-btn-primary, .qz-btn-ghost{transition:none}
}

/* hover states isoladas de ponteiros de toque: em telas sensiveis ao toque
   o :hover fica "grudado" no elemento tocado ate o proximo toque, o que
   parecia um campo pre-selecionado por engano. */
@media (hover:hover) and (pointer:fine){
  .quiz-exit:hover{background:var(--qz-shell-bg);color:var(--qz-text)}
  .qz-opt:hover{border-color:var(--qz-royal2)}
  .qz-back:hover{color:var(--qz-royal)}
  .qz-continue:hover:not(:disabled){background:#173dc0}
  .qz-btn-primary:hover{transform:translateY(-1px)}
  .qz-btn-ghost:hover{background:#E7EAF2}
}