/* ================= quiz funnel ================= */
.quiz-body{background:var(--cream);min-height:100vh;}

.q-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 24px;
  border-bottom:2px solid var(--ink);
  position:sticky;top:0;z-index:60;background:var(--cream);
}
.q-back{
  font-size:11px;font-weight:700;letter-spacing:.14em;
  color:var(--ink);text-decoration:none;
}
.q-back:hover{color:var(--red);}
.q-logo{height:12px;display:block;}
.q-step{font-size:11px;font-weight:700;letter-spacing:.1em;color:#8a8a82;min-width:44px;text-align:right;}

.q-progress{height:6px;background:var(--cream2);border-bottom:2px solid var(--ink);}
.q-bar{height:100%;width:0;background:var(--red);transition:width .35s cubic-bezier(.2,.9,.3,1);}

.q-main{
  max-width:640px;margin:0 auto;
  padding:56px 24px 90px;
}

.q-screen{display:none;}
.q-screen.active{display:block;animation:qIn .4s cubic-bezier(.2,.9,.3,1);}
@keyframes qIn{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion: reduce){.q-screen.active{animation:none;}}

.q-scribble{
  font-family:'Caveat',cursive;
  color:var(--red);font-size:24px;font-weight:700;
  transform:rotate(-2deg);display:inline-block;
  margin-bottom:10px;
}
.q-screen h1{font-size:clamp(38px,7vw,60px);line-height:1;letter-spacing:-.01em;}
.q-q{font-size:clamp(26px,5vw,38px);line-height:1.1;margin-bottom:26px;}
.q-sub{margin-top:20px;font-size:14px;line-height:1.75;color:#3c3c36;max-width:46ch;}
.q-start{margin-top:30px;border:none;cursor:pointer;}
.q-trust{
  margin-top:34px;display:flex;gap:18px;flex-wrap:wrap;
  font-size:10.5px;font-weight:700;letter-spacing:.08em;color:#8a8a82;
}

.q-opts{display:flex;flex-direction:column;gap:12px;}
.q-opt{
  text-align:left;
  background:#fff;
  border:2px solid var(--ink);
  box-shadow:4px 4px 0 rgba(20,20,20,.75);
  padding:16px 18px;
  cursor:pointer;
  font-family:'Space Mono',monospace;
  transition:transform .1s;
}
.q-opt:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 rgba(20,20,20,.75);background:#fffef2;}
.q-opt:active{transform:translate(2px,2px);box-shadow:2px 2px 0 rgba(20,20,20,.75);}
.q-opt b{display:block;font-size:15px;margin-bottom:3px;}
.q-opt span{font-size:12px;color:#55554d;line-height:1.5;}

.q-note{font-size:12.5px;color:#55554d;line-height:1.7;margin-bottom:20px;max-width:52ch;}
.q-checks{display:flex;flex-direction:column;gap:10px;margin-bottom:26px;}
.q-check{
  display:flex;align-items:center;gap:12px;
  background:#fff;border:2px solid var(--ink);
  padding:13px 16px;cursor:pointer;
  font-size:13px;font-weight:700;
  box-shadow:3px 3px 0 rgba(20,20,20,.6);
}
.q-check input{width:18px;height:18px;accent-color:var(--red);flex:none;}
.q-check.none{background:var(--cream2);}
#qFinish{border:none;cursor:pointer;}
#qFinish:disabled{opacity:.35;cursor:not-allowed;box-shadow:6px 6px 0 rgba(207,51,36,.3);}

/* result */
.q-card{margin:26px 0 22px;transform:rotate(-1.5deg);width:min(420px,100%);}
.q-card .pc-stamp{top:38%;}
.r-row{
  font-size:12px;line-height:1.5;
  padding:8px 0;
  border-bottom:1.5px dashed var(--cream2);
  color:#3c3c36;
  display:flex;justify-content:space-between;gap:10px;align-items:baseline;
}
.r-row b{color:var(--ink);}
.r-row .r-tag{
  font-size:8.5px;font-weight:700;letter-spacing:.08em;
  border:1.5px solid var(--ink);padding:1px 5px;flex:none;
}
.r-row .r-tag.pro{background:var(--ink);color:var(--yellow);}
.r-row .r-tag.reg{background:var(--yellow);}
.q-prev{
  display:inline-block;margin-top:28px;
  background:none;border:none;cursor:pointer;padding:0;
  font-family:inherit;font-size:11.5px;font-weight:700;letter-spacing:.08em;
  color:#8a8a82;text-decoration:underline;text-underline-offset:3px;
}
.q-prev:hover{color:var(--red);}
.q-restart{
  display:block;margin-top:18px;
  background:none;border:none;cursor:pointer;
  font-family:'Caveat',cursive;font-size:20px;font-weight:700;color:#8a8a82;
}
.q-restart:hover{color:var(--red);}
#rCta{text-decoration:none;display:inline-block;}