.join{--u:8px;--col:520px;--bar-h:calc(var(--u) * 10);--gutter:clamp(28px, 4.5vw, 72px);--bar-inset:clamp(24px, 2.8vw, 44px);--t-caption:13px;--t-small:15px;--t-body:17px;--t-lead:21px;--t-question:42px;--t-display:56px;--ink:var(--color-ink);--ink-60:#1212128f;--ink-40:#12121261;--ink-20:#1212122e;--hairline:#1212121f;--warn:#9d3520;--ease:cubic-bezier(.22, .9, .32, 1);--step-t:.45s;background:var(--color-bg);grid-template-columns:minmax(0,.82fr) minmax(0,1fr);height:100svh;display:grid;overflow:hidden}.join__visual{background:#e8e6e3;height:100%;position:relative;overflow:hidden}.join__visual img{object-fit:cover;object-position:50% 36%;width:100%;height:100%;animation:join-reveal 1.1s var(--ease) both;position:absolute;inset:0}.join__panel{flex-direction:column;min-width:0;height:100%;display:flex;position:relative}.join__progress{z-index:2;background:var(--ink);width:0;height:2px;transition:width .55s var(--ease);position:absolute;inset:0 auto auto 0}.join__bar{justify-content:space-between;align-items:center;gap:calc(var(--u) * 3);height:var(--bar-h);padding-inline:var(--bar-inset) var(--gutter);flex:none;display:flex}.join__brand{align-items:center;gap:calc(var(--u) * 1.5);transition:opacity .2s;display:inline-flex}.join__brand:hover{opacity:.55}.join__mark{width:44px;height:22px}.join__wordmark{font-size:var(--t-lead);letter-spacing:-.025em;font-weight:600}.join__count{font-size:var(--t-caption);letter-spacing:.02em;color:var(--ink-40);font-variant-numeric:tabular-nums;opacity:0;font-weight:500;transition:opacity .3s}.join__count.is-shown{opacity:1}.join__stage{padding:calc(var(--u) * 3) var(--gutter) calc(var(--u) * 8);flex-direction:column;flex:1;display:flex;overflow-y:auto}.join__well{width:100%;max-width:var(--col);margin:auto}.join__steps{transition:height var(--step-t) var(--ease);position:relative}.join__step{opacity:0;transform:translateY(calc(var(--u) * 1.5));visibility:hidden;transition:opacity .3s ease, transform var(--step-t) var(--ease), visibility 0s linear .3s;position:absolute;inset:0 0 auto}.join__step.is-active{opacity:1;visibility:visible;transition:opacity .4s ease .1s, transform var(--step-t) var(--ease) .1s, visibility 0s;transform:none}.join__step.is-behind{transform:translateY(calc(var(--u) * -1.5))}.join__display{font-size:var(--t-display);letter-spacing:-.045em;font-weight:600;line-height:1}.join__lead{margin-top:calc(var(--u) * 3);font-size:var(--t-lead);letter-spacing:-.01em;color:var(--ink-60);text-wrap:pretty;font-weight:400;line-height:1.5}.join__meta{margin-top:calc(var(--u) * 5);font-size:var(--t-small);color:var(--ink-40)}.join__question{font-size:var(--t-question);letter-spacing:-.04em;text-wrap:balance;font-weight:600;line-height:1.08}.join__help{margin-top:calc(var(--u) * 2);font-size:var(--t-body);color:var(--ink-40);text-wrap:pretty;line-height:1.5}.join__answer{margin-top:calc(var(--u) * 5)}.join__field+.join__field{margin-top:calc(var(--u) * 4)}.join__label{margin-bottom:calc(var(--u) * 1);font-size:var(--t-small);color:var(--ink-60);font-weight:450;display:block}.join__input,.join__textarea{width:100%;padding:0 0 calc(var(--u) * 1.5);border:0;border-bottom:1px solid var(--hairline);font:inherit;font-size:var(--t-lead);letter-spacing:-.015em;color:var(--ink);background:0 0;border-radius:0;font-weight:450;transition:border-color .25s;display:block}.join__input::placeholder,.join__textarea::placeholder{color:var(--ink-20)}.join__input:hover,.join__textarea:hover{border-bottom-color:var(--ink-20)}.join__input:focus,.join__textarea:focus{border-bottom-color:var(--ink);outline:none}.join__textarea{min-height:calc(var(--u) * 11);font-size:var(--t-body);resize:none;line-height:1.6;overflow:hidden}.join__group{border:0;min-width:0;margin:0;padding:0}.join__options{border-top:1px solid var(--hairline)}.join__option{border-bottom:1px solid var(--hairline);display:block}.join__option input{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.join__option span{justify-content:space-between;align-items:center;gap:calc(var(--u) * 2);min-height:calc(var(--u) * 7);padding-block:calc(var(--u) * 1.5);font-size:var(--t-lead);letter-spacing:-.015em;color:#121212c7;cursor:pointer;user-select:none;font-weight:450;line-height:1.25;transition:color .18s;display:flex}.join__option span:hover{color:var(--ink)}.join__option input:checked+span{color:var(--ink);font-weight:550}.join__option input:focus-visible+span{outline:2px solid var(--ink);outline-offset:4px}.join__tick{opacity:0;transition:opacity .2s ease, transform .25s var(--ease);flex:none;transform:scale(.7)}.join__option input:checked+span .join__tick{opacity:1;transform:none}.join__error{margin-top:calc(var(--u) * 2);font-size:var(--t-small);color:var(--warn);display:none}.join__step.has-error .join__error{display:block}.join__step.has-error .join__input,.join__step.has-error .join__textarea{border-bottom-color:var(--warn)}.join__pot{width:1px;height:1px;position:absolute;left:-9999px;overflow:hidden}.join__actions{align-items:center;gap:calc(var(--u) * 3);margin-top:calc(var(--u) * 5);display:flex}.join__next{justify-content:center;align-items:center;gap:calc(var(--u) * 1.5);height:calc(var(--u) * 7);padding-inline:calc(var(--u) * 4.5);background:var(--ink);color:#fff;font-size:var(--t-body);letter-spacing:-.01em;cursor:pointer;transition:background-color .2s ease, opacity .2s ease, transform .2s var(--ease);border:0;border-radius:999px;font-weight:500;display:inline-flex}.join__next:hover{background:#000}.join__next:active{transform:scale(.98)}.join__next:disabled{opacity:.4;pointer-events:none}.join__arrow{transition:transform .25s var(--ease)}.join__next:hover .join__arrow{transform:translate(3px)}.join__back{font-size:var(--t-small);color:var(--ink-40);cursor:pointer;background:0 0;border:0;padding:0;transition:color .2s}.join__back:hover{color:var(--ink)}.join__back[hidden]{display:none}.join__failure{margin-top:calc(var(--u) * 3);font-size:var(--t-small);color:var(--warn);line-height:1.5}.join__failure a{text-underline-offset:3px;text-decoration:underline}.join__failure[hidden],.join__done{display:none}.join.is-done .join__done{animation:join-in .6s var(--ease) both;display:block}.join.is-done .join__steps,.join.is-done .join__actions,.join.is-done .join__failure{display:none}.join__done-title{font-size:var(--t-display);letter-spacing:-.045em;text-wrap:balance;font-weight:600;line-height:1.05}.join__done-body{margin-top:calc(var(--u) * 3);font-size:var(--t-lead);color:var(--ink-60);text-wrap:pretty;line-height:1.5}.join__done-link{margin-top:calc(var(--u) * 5);padding-bottom:calc(var(--u) * .5);border-bottom:1px solid var(--ink-20);font-size:var(--t-body);font-weight:500;transition:border-color .2s;display:inline-block}.join__done-link:hover{border-bottom-color:var(--ink)}@keyframes join-in{0%{opacity:0;transform:translateY(calc(var(--u) * 2))}to{opacity:1;transform:none}}@keyframes join-reveal{0%{opacity:0;transform:scale(1.04)}to{opacity:1;transform:none}}@media (width<=1080px){.join{--col:480px;--t-question:36px;--t-display:48px}}@media (width<=900px){.join{--bar-h:calc(var(--u) * 8);--t-question:28px;--t-display:36px;--t-lead:19px;--t-body:16px;flex-direction:column;height:auto;min-height:100svh;display:flex;overflow:visible}.join__visual{display:none}.join__bar{padding-inline:max(var(--gutter), calc((100% - var(--col)) / 2))}.join__panel{flex:1;height:auto;min-height:0}.join__stage{padding-bottom:calc(var(--u) * 6);overflow:visible}.join__steps{overflow:hidden}.join__step,.join__step.is-behind{transform:none}.join__mark{width:38px;height:19px}.join__wordmark{font-size:18px}.join__option span{min-height:calc(var(--u) * 6.5)}.join__actions{gap:calc(var(--u) * 2.5)}.join__next{height:calc(var(--u) * 6.5);padding-inline:calc(var(--u) * 4)}}@media (prefers-reduced-motion:reduce){.join__step,.join__steps{transition:none}.join__step{transform:none}.join__visual img{animation:none}}