/* th-q3.css — T7 (2026-10-12): the three quick questions before a get-started page (th-q3.js). Paper ground, one
   question per screen, big tap rows, the actions pinned to the bottom of the screen on a phone. */
html.q3-open,html.q3-open body{overflow:hidden}
.q3{position:fixed;inset:0;z-index:1200;overflow-y:auto;-webkit-overflow-scrolling:touch;background:#F2F7F4;color:#04241A;
  font-family:Switzer,ui-sans-serif,system-ui,-apple-system,sans-serif;opacity:1;transition:opacity .4s cubic-bezier(.16,1,.3,1)}
.q3.is-out{opacity:0;pointer-events:none}
.q3::before{content:"";position:fixed;left:-20vw;top:-30vh;width:70vw;height:70vw;border-radius:50%;background:#4FD8A6;opacity:.18;filter:blur(80px);pointer-events:none}
.q3__in{position:relative;min-height:100%;display:flex;justify-content:center;padding:clamp(18px,4vh,56px) clamp(16px,4vw,40px) 0}
.q3__card{width:100%;max-width:640px;display:flex;flex-direction:column;min-height:calc(100dvh - clamp(18px,4vh,56px));animation:q3in .45s cubic-bezier(.16,1,.3,1) both}
.q3__card--next{animation-name:q3next}.q3__card--back{animation-name:q3back}
@keyframes q3in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes q3next{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:none}}
@keyframes q3back{from{opacity:0;transform:translateX(-28px)}to{opacity:1;transform:none}}
.q3__top{display:flex;align-items:center;gap:12px;margin:0 0 clamp(22px,4vh,40px)}
.q3__n{font:700 12px/1 Switzer,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#0B7A55;white-space:nowrap}
.q3__bar{flex:1;height:4px;border-radius:4px;background:rgba(2,36,25,.1);overflow:hidden}
.q3__bar b{display:block;height:100%;background:#4FD8A6;border-radius:4px;transition:width .45s cubic-bezier(.16,1,.3,1)}
.q3__skip{min-height:44px;min-width:44px;padding:0 6px;border:0;background:none;color:rgba(2,36,25,.62);font:600 14px/1 Switzer,sans-serif;cursor:pointer}
.q3__skip:hover,.q3__skip:focus-visible{color:#04241A;text-decoration:underline}
.q3__k{margin:0 0 10px;font:600 12px/1 Switzer,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:rgba(2,36,25,.6)}
.q3__h{margin:0;font:900 clamp(30px,6.4vw,46px)/.98 Satoshi,ui-sans-serif,system-ui,sans-serif;letter-spacing:-.045em;text-wrap:balance}
.q3__s{margin:12px 0 22px;font:500 15px/1.4 Switzer,sans-serif;color:rgba(2,36,25,.66)}
.q3__opts{display:grid;gap:10px}
.q3__o{display:flex;align-items:center;gap:14px;width:100%;min-height:58px;padding:13px 16px;text-align:left;cursor:pointer;
  background:#fff;border:1.5px solid rgba(2,36,25,.12);border-radius:16px;color:#04241A;font:600 16px/1.3 Switzer,sans-serif;
  transition:border-color .2s,background-color .2s,transform .15s}
.q3__o:hover{border-color:rgba(2,36,25,.3)}
.q3__o:active{transform:scale(.985)}
.q3__o:focus-visible{outline:2px solid #0B7A55;outline-offset:2px}
.q3__o i{flex:none;width:26px;height:26px;border-radius:50%;border:1.5px solid rgba(2,36,25,.28);display:grid;place-items:center;color:transparent;transition:background-color .2s,border-color .2s,color .2s}
.q3__o i svg{width:15px;height:15px}
.q3__o.is-on{border-color:#37C08C;background:#E8F9F1}
.q3__o.is-on i{background:#4FD8A6;border-color:#4FD8A6;color:#02241A}
.q3__go{position:sticky;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;
  padding:18px 0 max(18px,env(safe-area-inset-bottom));background:linear-gradient(rgba(242,247,244,0),#F2F7F4 30%)}
.q3__opts + .q3__go{margin-top:auto}
.q3__card .q3__opts{margin-bottom:22px}
.q3__back{min-height:44px;padding:0 8px;border:0;background:none;color:#04241A;font:600 15px/1 Switzer,sans-serif;cursor:pointer}
.q3__back:hover,.q3__back:focus-visible{text-decoration:underline}
.q3__next[disabled]{opacity:.4;pointer-events:none}
@media (max-width:420px){.q3__o{min-height:54px;font-size:15px;padding:12px 14px}.q3__s{margin-bottom:16px}}
@media (prefers-reduced-motion:reduce){.q3__card,.q3__card--next,.q3__card--back{animation:none}.q3{transition:none}}