.join{min-height:100svh;color:var(--creme);padding:clamp(84px,10vh,108px) 0 90px;position:relative;overflow:hidden}.join:before{content:"";pointer-events:none;background:radial-gradient(60% 50% at 85% 20%, color-mix(in srgb, var(--org) 9%, transparent), transparent 60%), radial-gradient(50% 40% at 10% 90%, color-mix(in srgb, var(--mag) 7%, transparent), transparent 60%);position:absolute;inset:0}.join .wrap{position:relative}.join-hero{text-align:center;flex-direction:column;align-items:center;gap:clamp(10px,2vh,20px);display:flex}.join-copy{flex-direction:column;align-items:center;display:flex}.join-h1{letter-spacing:-.035em;max-width:14ch;margin:14px 0 10px;font-size:clamp(44px,5.6vw,84px);line-height:.95}.join h1 em,.join h2 em{color:var(--mag);font-style:normal}.join-lede{max-width:62ch;color:var(--mut-d);margin:0;font-size:clamp(1.05rem,1.4vw,1.3rem);line-height:1.45}.join-lede strong{color:var(--creme);font-weight:500}.join-chips{grid-template-columns:repeat(4,1fr);gap:16px;margin:clamp(32px,4vh,44px) 0 0;display:grid}.join-chips span{--chip:var(--creme);border:1px solid var(--chip);white-space:nowrap;text-align:center;min-width:0;color:var(--chip);background:0 0;border-radius:999px;justify-content:center;align-items:center;padding:16px 14px;font-size:clamp(.72rem,.95vw,.9rem);font-weight:500;line-height:1.3;display:flex}.join-chips span[data-colour=org]{--chip:var(--org)}.join-chips span[data-colour=mag]{--chip:var(--mag)}.join-chips span[data-colour=blu]{--chip:var(--blu)}.join-chips span[data-colour=creme]{--chip:var(--creme)}.join-band{aspect-ratio:1;width:min(20vw,230px);position:relative}.join-band canvas{width:100%;height:100%;position:absolute;inset:0}.join-grid{grid-template-columns:1fr 1fr;gap:16px;margin:clamp(32px,5vh,48px) 0 0;padding:0;list-style:none;display:grid}.join-card{background:color-mix(in srgb, var(--creme) 5%, transparent);border:1px solid color-mix(in srgb, var(--creme) 12%, transparent);border-radius:24px;transition:border-color .3s,transform .3s cubic-bezier(.2,.8,.2,1),background .3s;position:relative;box-shadow:inset 0 1px #ffffff0f}.join-card:hover{border-color:color-mix(in srgb, var(--creme) 28%, transparent);background:color-mix(in srgb, var(--creme) 7%, transparent);transform:translateY(-3px)}.join-open{width:100%;color:inherit;font:inherit;text-align:left;cursor:pointer;border-radius:inherit;background:0 0;border:0;flex-direction:column;align-items:flex-start;gap:8px;padding:clamp(30px,3.2vw,44px);display:flex}.join-open:focus-visible{outline:2px solid var(--creme);outline-offset:-6px}.join-open .sa{margin-bottom:14px;transition:transform .3s cubic-bezier(.2,.8,.2,1),background .3s}.join-card:hover .sa{transform:scale(1.05)}.join-meta{letter-spacing:.13em;text-transform:uppercase;color:color-mix(in srgb, var(--creme) 45%, transparent);font-size:11px;font-weight:500}.join-name{letter-spacing:-.025em;text-wrap:balance;font-size:clamp(1.4rem,2vw,1.9rem);font-weight:300;line-height:1.08}.join-line{max-width:44ch;color:var(--mut-d);font-size:.98rem;line-height:1.45}.join-watch{color:var(--creme);align-items:center;gap:8px;margin-top:10px;font-size:.92rem;font-weight:500;display:inline-flex}.join-watch .arr{font-weight:400;transition:transform .25s}.join-card:hover .join-watch .arr{transform:translate(5px)}.join-copy-btn{border:1px solid color-mix(in srgb, var(--creme) 18%, transparent);width:38px;height:38px;color:color-mix(in srgb, var(--creme) 60%, transparent);cursor:pointer;background:0 0;border-radius:50%;place-items:center;transition:border-color .2s,color .2s;display:grid;position:absolute;top:22px;right:22px}.join-copy-btn:hover{border-color:var(--creme);color:var(--creme)}.join-copy-btn svg{width:15px;height:15px}.join .rv{opacity:0;transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--i,0) * 90ms);transform:translateY(22px)}.join .rv[data-in]{opacity:1;transform:none}@media (max-width:1000px){.join-chips{grid-template-columns:1fr 1fr}}@media (max-width:860px){.join{padding-top:clamp(84px,13vh,110px)}.join-hero{gap:12px}.join-band{width:min(50vw,210px)}.join-h1{font-size:clamp(44px,12vw,64px)}.join-grid{grid-template-columns:1fr;gap:12px}.join-chips{grid-template-columns:1fr;gap:10px;margin-top:24px}.join-chips span{padding:12px;font-size:.82rem}.join-open .sa{--sz:56px;width:56px;height:56px;margin-bottom:10px}}@media (prefers-reduced-motion:reduce){.join .rv{opacity:1;transition:none;transform:none}}
