/* Waitlist page. Loads after landing.css and club.css. */
button.button{border:0}
button.nav-cta{background:transparent;color:inherit}
button.nav-cta:hover{color:var(--lime)}

/* First fold: grows with its content so the facts are never clipped. */
.hero.wrap{height:auto;min-height:max(800px,100svh);padding-bottom:90px}
.hero-copy button{pointer-events:auto}
.hero-concept{position:absolute;right:4vw;bottom:28px;z-index:3;margin:0;font:8px var(--mono);letter-spacing:1px;color:#fffbedcc}
.hero-facts{list-style:none;margin:44px auto 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));max-width:880px;border-block:1px solid #fffbed55;background:#0d1d1266}
.hero-facts li{display:flex;flex-direction:column;align-items:center;gap:6px;padding:20px 14px;text-align:center}
.hero-facts li+li{border-left:1px solid #fffbed33}
.fact-icon{width:26px;height:26px;margin-bottom:4px;fill:none;stroke:var(--lime);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.fact-label{font:9px var(--mono);letter-spacing:2px;text-transform:uppercase;color:#fffbedcc}
.hero-facts strong{font:26px/1.1 var(--serif);font-weight:500;color:#fffbed}
.hero-facts small{font-size:10px;line-height:1.5;color:#fffbedcc}

/* Categories */
.section-aside{max-width:360px;display:flex;flex-direction:column;align-items:flex-start;gap:22px}
.section-aside p{margin:0;font-size:13px;line-height:1.8;color:var(--muted)}
.category-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:28px}
.category-list li{border-top:1px solid #a2b28e;padding-top:22px}
.category-number{font:9px var(--mono);letter-spacing:1px;color:var(--muted)}
.category-list h3{font:31px/1.05 var(--serif);font-weight:400;letter-spacing:-.5px;margin:18px 0 10px}
.category-list p{margin:0;font-size:12px;line-height:1.7;color:var(--muted)}
.category-note{margin:34px 0 0;font-size:12px;color:var(--muted)}

/* Pop-up */
.interest-dialog{width:min(640px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);overflow:auto;border:0}
.interest-dialog-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:28px 32px 0}
.interest-dialog-head h2{font-size:42px;margin:10px 0 0}
.dialog-close{flex:none;width:40px;height:40px;border:1px solid #b3bda7;border-radius:50%;background:transparent;color:var(--ink);font-size:20px;line-height:1}
.dialog-close:hover{background:#eef2dc}
.interest-dialog-body{padding:14px 32px 32px}
.interest-dialog-intro{margin:0 0 24px;font-size:13px;line-height:1.8;color:var(--muted)}
.interest-dialog[data-state=sending] .interest-dialog-intro,
.interest-dialog[data-state=done] .interest-dialog-intro,
.interest-dialog[data-state=done] #interest-dialog-title{display:none}

/* Form */
.interest-form{display:grid;gap:24px}
.interest-form[hidden]{display:none}
.field{display:grid;gap:8px;margin:0;padding:0;border:0;min-width:0}
.field label,.field legend{font-size:12px;font-weight:600}
.field legend{padding:0;margin-bottom:10px}
.optional{font-weight:400;color:var(--muted)}
.text-input{width:100%;font:15px Inter,system-ui,sans-serif;color:var(--ink);background:#fffdf6;border:1px solid #b3bda7;border-radius:0;padding:13px 14px}
.text-input::placeholder{color:#7d8676}
.text-input:focus-visible,.category-option input:focus-visible{outline:3px solid #37794f;outline-offset:2px}
.text-input[aria-invalid=true]{border-color:#9b2c1f}
.field-hint{margin:0;font-size:11px;line-height:1.6;color:var(--muted)}
.field-error{margin:0;font-size:12px;font-weight:500;color:#9b2c1f}
.category-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.category-option{display:flex;gap:12px;align-items:flex-start;border:1px solid #c9d0bd;background:#fffdf6;padding:13px 14px;cursor:pointer}
.category-option:has(input:checked){border-color:var(--deep);background:#eef2dc}
.category-option:has(input[aria-invalid=true]){border-color:#9b2c1f}
.category-option input{accent-color:var(--deep);width:17px;height:17px;margin:1px 0 0;flex:none}
.category-option strong{display:block;font-size:13px;font-weight:600}
.category-option small{display:block;font:10px var(--mono);color:var(--muted);margin-top:5px}
.trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.form-footer{display:flex;align-items:center;justify-content:space-between;gap:18px 24px;flex-wrap:wrap}
.form-note{margin:0;font-size:11px;line-height:1.6;color:var(--muted);max-width:260px}
.form-status{margin:0;font-size:12px;line-height:1.6}
.form-status:empty{display:none}

/* Sending: a tennis ball rallies across a small court. */
.interest-sending{display:flex;flex-direction:column;align-items:center;gap:26px;padding:56px 0 44px;text-align:center;outline:none}
.interest-sending[hidden]{display:none}
.interest-sending p{margin:0;font:10px var(--mono);letter-spacing:2px;text-transform:uppercase;color:var(--muted)}
.send-court{position:relative;width:180px;height:96px;border:1px solid #b3bda7;background:linear-gradient(90deg,transparent calc(50% - .5px),#b3bda7 calc(50% - .5px),#b3bda7 calc(50% + .5px),transparent calc(50% + .5px)),#eef2dc}
.send-court:after{content:'';position:absolute;left:-12px;right:-12px;top:50%;border-top:1px solid #b3bda7}
.send-rally{position:absolute;left:14px;top:30px;width:34px;height:34px;z-index:1;animation:send-rally 1.1s ease-in-out infinite alternate}
.send-rally .tennis-ball{width:34px;height:34px;box-shadow:3px 6px 6px #23412c26;animation:send-bounce .55s ease-in-out infinite alternate}
.send-rally .tennis-ball:before,.send-rally .tennis-ball:after{border-width:2px}

/* Confirmation */
.interest-done{display:flex;flex-direction:column;align-items:center;padding:30px 0 6px;text-align:center;outline:none}
.interest-done[hidden]{display:none}
.done-badge{position:relative;width:76px;height:76px;margin-bottom:14px}
.done-circle{position:absolute;inset:0;border-radius:50%;background:var(--deep);animation:done-pop .45s cubic-bezier(.3,1.5,.6,1) both}
.done-check{position:absolute;inset:21px;fill:none;stroke:#fffbed;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.done-check path{stroke-dasharray:22;stroke-dashoffset:22;animation:done-draw .4s ease .35s forwards}
.done-badge .tennis-ball{position:absolute;width:28px;height:28px;right:-12px;top:-8px;box-shadow:2px 4px 5px #23412c33;animation:done-drop .8s cubic-bezier(.25,1.35,.5,1) .15s both}
.done-badge .tennis-ball:before,.done-badge .tennis-ball:after{border-width:2px}
.interest-done .eyebrow{margin:0;animation:done-rise .5s ease .45s both}
.interest-done h3{font:40px/1.08 var(--serif);font-weight:400;letter-spacing:-1px;margin:14px 0 14px;animation:done-rise .5s ease .55s both}
.done-lines{max-width:440px;animation:done-rise .5s ease .65s both}
.done-lines p{margin:0;font-size:13px;line-height:1.8;color:var(--muted);overflow-wrap:anywhere}
.done-lines p+p{margin-top:6px}
.done-lines p:last-child{color:var(--ink)}
.interest-done .button{margin-top:28px;animation:done-rise .5s ease .75s both}

@keyframes send-rally{to{transform:translateX(118px)}}
@keyframes send-bounce{from{transform:translateY(-24px) rotate(-30deg)}to{transform:translateY(12px) rotate(30deg)}}
@keyframes done-pop{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}
@keyframes done-draw{to{stroke-dashoffset:0}}
@keyframes done-drop{0%{opacity:0;transform:translate(-46px,-70px) rotate(-140deg)}55%{opacity:1}100%{opacity:1;transform:none}}
@keyframes done-rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* Entrance: on the first visit a tennis ball bounces onto a court, then the page fades in. */
.entrance{display:none}
.entrance.is-playing{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;background:#1d3527;color:#f4f1e2;pointer-events:none;animation:entrance-away .5s ease 1.7s forwards}
.entrance-court{position:relative;width:200px;height:110px;border:1px solid #b8c69c66;background:linear-gradient(90deg,transparent calc(50% - .5px),#b8c69c66 calc(50% - .5px),#b8c69c66 calc(50% + .5px),transparent calc(50% + .5px));animation:entrance-court .45s ease both}
.entrance-court:after{content:'';position:absolute;left:-12px;right:-12px;top:50%;border-top:1px solid #b8c69c66}
.entrance-ball,.entrance-shadow{position:absolute;left:50%;top:50%}
.entrance-ball{width:40px;height:40px;margin:-20px 0 0 -20px;z-index:1;animation:entrance-hop 1.1s .15s both}
.entrance-ball .tennis-ball{width:40px;height:40px;box-shadow:none;transform-origin:50% 100%;animation:entrance-squash 1.1s .15s both}
.entrance-ball .tennis-ball:before,.entrance-ball .tennis-ball:after{border-width:2px}
.entrance-shadow{width:34px;height:8px;margin:16px 0 0 -17px;border-radius:50%;background:#0000004d;animation:entrance-shadow 1.1s .15s both}
.entrance-wordmark{margin:0;font:48px/1 var(--serif);letter-spacing:-1px;animation:entrance-rise .6s ease .9s both}
.entrance-label{margin:0;font:8px var(--mono);letter-spacing:3px;color:var(--lime);animation:entrance-rise .6s ease 1.05s both}
.entrance.is-playing ~ .site-header{animation:entrance-page .8s ease 1.85s both}
.entrance.is-playing ~ main .hero-copy{animation:entrance-page .9s ease 1.75s both}
@keyframes entrance-hop{
0%{transform:translate(-150px,-90px) rotate(-240deg);animation-timing-function:ease-in}
35%{transform:translate(-60px,0) rotate(-120deg);animation-timing-function:ease-out}
55%{transform:translate(-12px,-34px) rotate(-60deg);animation-timing-function:ease-in}
72%{transform:translate(18px,0) rotate(-20deg);animation-timing-function:ease-out}
84%{transform:translate(30px,-12px) rotate(-6deg);animation-timing-function:ease-in}
100%{transform:translate(38px,0) rotate(0)}
}
@keyframes entrance-squash{0%,33%,40%,70%,78%,100%{transform:none}35%{transform:scale(1.2,.8)}72%{transform:scale(1.1,.9)}}
@keyframes entrance-shadow{
0%{opacity:0;transform:translateX(-150px) scale(.3);animation-timing-function:ease-in}
35%{opacity:1;transform:translateX(-60px) scale(1);animation-timing-function:ease-out}
55%{transform:translateX(-12px) scale(.6);animation-timing-function:ease-in}
72%{transform:translateX(18px) scale(1);animation-timing-function:ease-out}
84%{transform:translateX(30px) scale(.85);animation-timing-function:ease-in}
100%{opacity:1;transform:translateX(38px) scale(1)}
}
@keyframes entrance-court{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}
@keyframes entrance-rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes entrance-away{to{opacity:0;visibility:hidden}}
@keyframes entrance-page{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media(max-width:760px){.entrance-wordmark{font-size:40px}}
@media(prefers-reduced-motion:reduce){.entrance{display:none}}

footer a{text-decoration:underline;text-underline-offset:3px}

@media(max-width:1050px){
.category-list{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:760px){
.hero.wrap{height:auto;min-height:max(760px,100svh);max-height:none;padding-bottom:70px}
.hero-concept{right:auto;left:22px;bottom:22px;font-size:6px}
.hero-facts{grid-template-columns:1fr 1fr;margin-top:32px}
.hero-facts li{padding:16px 10px}
.hero-facts li:nth-child(3){border-left:0}
.hero-facts li:nth-child(n+3){border-top:1px solid #fffbed33}
.hero-facts strong{font-size:22px}
.section-aside{margin-top:20px}
.category-list{grid-template-columns:1fr 1fr;gap:22px}
.category-list h3{font-size:26px}
.interest-dialog-head{padding:22px 20px 0}
.interest-dialog-head h2{font-size:34px}
.interest-dialog-body{padding:12px 20px 24px}
.category-options{grid-template-columns:1fr}
.interest-done h3{font-size:34px}
}
@media(prefers-reduced-motion:reduce){
.send-rally,.send-rally .tennis-ball,.done-circle,.done-check path,.done-badge .tennis-ball,.interest-done .eyebrow,.interest-done h3,.done-lines,.interest-done .button{animation:none}
.send-rally{transform:translateX(59px)}
.done-check path{stroke-dashoffset:0}
}

/* Keep each desktop section within a viewport without clipping its content. */
@media(min-width:761px){
.hero.wrap{min-height:100svh;height:auto;padding:110px 30px 50px}.hero-copy{margin-top:0}.hero h1{font-size:clamp(86px,15vh,160px);margin:14px 0 20px}.hero-powered{margin:14px 0}.hero .actions{margin-top:20px}.hero-facts{margin-top:26px}.hero-facts li{padding:14px}.site-header{height:84px}
#categories.section{padding-block:40px}#categories .section-heading{margin-bottom:28px}#categories h2{font-size:44px}.category-list{gap:20px}.category-list h3{font-size:28px}.category-note{margin-top:22px}
}

/* Categories occupy a complete fold, with content centred vertically. */
#categories.section{min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding-block:56px}
#categories .section-heading{margin-bottom:48px}
#categories .category-note{margin-top:32px}
@media(max-width:760px){#categories.section{padding-block:40px}#categories .section-heading{margin-bottom:28px}}