/* Pre-launch quiz: plain, type-only. Builds on site.css tokens (brand blue, Abril Fatface + IBM Plex Mono).
   Hierarchy per screen: one dominant line (headline / question / URL), one supporting line, then actions. */

body.qz{min-height:100dvh}
.qz [hidden]{display:none!important}
.qz .wrap{width:100%;box-sizing:border-box}

/* ---------- Start ---------- */
.qs{min-height:100dvh;display:grid;align-items:center}
.qs-in{padding-block:56px;display:flex;flex-direction:column;align-items:flex-start}
.qs-big{font-family:var(--serif);font-weight:400;font-size:clamp(58px,12vw,200px);line-height:.92;letter-spacing:-.015em;margin:0;max-width:11ch;user-select:none;padding-bottom:.06em}
.qs-big .w,.qz-domain .w{display:inline-block;white-space:nowrap}
.qs-big .ch,.qz-domain .ch{display:inline-block;transform-origin:50% 90%;will-change:transform}
.nw{white-space:nowrap}
.qs-sub{margin:28px 0 0;color:var(--soft);font-size:clamp(15px,1.3vw,18px);line-height:1.5}
.qs-go{appearance:none;font-family:var(--serif);font-size:clamp(34px,4.4vw,64px);line-height:1.1;color:var(--white);background:transparent;border:0;padding:.04em .18em;margin:24px 0 0 -.18em;cursor:pointer;display:inline-flex;align-items:center;gap:.3em;position:relative;isolation:isolate;min-height:48px}
.qs-go::before{content:"";position:absolute;inset:0;background:var(--white);transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.16,1,.3,1);z-index:-1}
.qs-go span{position:relative;transition:color .3s var(--ease)}
.qs-go:hover::before,.qs-go:focus-visible::before{transform:scaleX(1)}
.qs-go:hover span,.qs-go:focus-visible span{color:var(--blue)}
.qs-go:focus-visible{outline:2px solid var(--cyan);outline-offset:6px}
.qs-go.small{font-size:clamp(28px,3.2vw,44px);margin:0}
.qs-go:disabled{opacity:.4;cursor:not-allowed}
.qs-go:disabled::before{transform:scaleX(0)}
.qs-go:disabled span{color:var(--white)}
@media (prefers-reduced-motion:no-preference){
  .qs-arrow{display:inline-block;animation:nudge 1.6s cubic-bezier(.16,1,.3,1) infinite}
  @keyframes nudge{0%,100%{transform:none}50%{transform:translateX(.18em)}}
  .qs-big .ch{animation:chIn .9s cubic-bezier(.16,1,.3,1) backwards;animation-delay:calc(var(--i) * 28ms)}
  @keyframes chIn{from{transform:translateY(55%) rotate(6deg)}to{transform:none}}
}

/* ---------- Quiz ---------- */
.qz-panel{min-height:100dvh;position:relative}
.qz-progress{position:fixed;left:0;right:0;top:0;height:6px;background:var(--line);z-index:5}
.qz-progress span{display:block;height:100%;width:0;background:var(--cyan);transition:width .6s cubic-bezier(.16,1,.3,1)}
.qz-body{padding-block:clamp(44px,9vh,104px) 64px;display:flex;flex-direction:column;max-width:1100px;margin-inline:auto}
.qz-count{color:var(--soft);margin:0 0 18px}
.qz-step{display:flex;flex-direction:column;align-items:flex-start}
.qz-q{font-family:var(--serif);font-weight:400;font-size:clamp(38px,5.6vw,88px);line-height:1.04;margin:0;max-width:15ch;text-wrap:balance;outline:none;padding-bottom:.05em}
.qz-hint{margin:14px 0 0;color:var(--soft);font-size:15px;line-height:1.5}
.qz-opts{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin-top:32px;width:100%}
.qz-opt{appearance:none;font-family:var(--serif);font-size:clamp(23px,2.8vw,38px);line-height:1.2;color:var(--white);background:transparent;border:0;padding:.22em .45em;margin-left:-.45em;display:inline-flex;align-items:center;gap:.6em;text-align:left;cursor:pointer;touch-action:manipulation;max-width:calc(100% + .45em);min-height:48px;box-sizing:border-box;transition:background .25s var(--ease),color .25s var(--ease)}
.qz-opt .lbl{overflow-wrap:anywhere}
.qz-opt .key{flex:none;display:grid;place-items:center;width:24px;height:24px;font-family:var(--mono);font-weight:500;font-size:11px;letter-spacing:0;border:1px solid currentColor;opacity:.75}
.qz-opt:hover{background:rgba(251,251,255,.12)}
.qz-opt[aria-pressed="true"]{background:var(--white);color:var(--blue)}
.qz-opt[aria-pressed="true"] .key{background:var(--cyan);border-color:var(--cyan);color:var(--navy);opacity:1}
.qz-opt:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
.qz-opt.pop{animation:pop .35s cubic-bezier(.34,1.56,.64,1)}
@keyframes pop{40%{transform:scale(1.03)}}
.qz-tip{color:var(--soft);font-size:11px;letter-spacing:.14em;text-transform:uppercase;margin:20px 0 0}
.qz-form{margin-top:32px;width:100%;max-width:880px}
.qz .err{margin:16px 0 0}
.qz-nav{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:32px;min-height:56px}
.qz-nav .qs-go{margin-left:auto}
.tlink{appearance:none;font:inherit;font-weight:500;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--soft);background:none;border:0;min-height:44px;padding:0;cursor:pointer}
.tlink:hover{color:var(--white)}
@media (hover:none){.qz-opt .key,.qz-tip{display:none}}
@media (prefers-reduced-motion:no-preference){
  .qz-step.in .qz-q,.qz-step.in .qz-hint,.qz-step.in .qz-form{animation:stepIn .6s cubic-bezier(.16,1,.3,1) backwards}
  .qz-step.in .qz-opt{animation:stepIn .6s cubic-bezier(.16,1,.3,1) backwards;animation-delay:calc(80ms + var(--i) * 45ms)}
  @keyframes stepIn{from{transform:translateY(20px)}to{transform:none}}
}

/* ---------- Thank you: the URL is the hero ---------- */
.qz-done{min-height:100dvh;display:grid;align-items:center}
.qz-done-in{padding-block:56px;display:flex;flex-direction:column;align-items:flex-start}
.qz-kicker{color:var(--cyan);margin:0}
.qz-thanks{font-family:var(--serif);font-weight:400;font-size:clamp(28px,3.6vw,52px);line-height:1.1;margin:14px 0 0}
.qz-domain{font-family:var(--serif);font-size:min(13.4vw,230px);line-height:1;letter-spacing:-.02em;margin:clamp(16px,3vh,32px) 0 0 -.04em;white-space:nowrap;user-select:none;padding-bottom:.08em}
.qz-soon{font-family:var(--serif);font-size:clamp(24px,3.4vw,50px);line-height:1.2;margin:clamp(12px,2.4vh,24px) 0 0}
@media (prefers-reduced-motion:no-preference){
  .qz-done.in .qz-thanks{animation:stepIn .7s cubic-bezier(.16,1,.3,1) backwards}
  .qz-done.in .qz-domain .ch{animation:chIn .9s cubic-bezier(.16,1,.3,1) backwards;animation-delay:calc(120ms + var(--i) * 40ms)}
  .qz-done.in .qz-soon{animation:stepIn .8s cubic-bezier(.16,1,.3,1) .6s backwards}
}

@media (max-width:767px){
  .qz-opts{gap:4px;margin-top:26px}
  .qz-nav{margin-top:28px}
}


.qs-brand{margin:clamp(40px,8vh,80px) 0 0;max-width:46ch;color:var(--soft);font-size:13px;line-height:1.6}
.qs-brand a{color:var(--white)}