/* Waitlist page. Shares tokens, header and footer with style.css and the email row with contact.css. */
.waitlist{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);grid-template-areas:"intro form" "handled form";column-gap:6vw;row-gap:40px;align-items:start;max-width:1500px;margin:0 auto;padding:12px 4.5vw 56px}
.waitlist-intro{grid-area:intro}
.waitlist-intro .eyebrow{display:flex;align-items:center;gap:13px;margin-bottom:24px}
.waitlist h1{font-size:clamp(52px,5.4vw,96px);isolation:isolate}
.waitlist h1 em:after{bottom:4px;height:9px}
.waitlist .standfirst{max-width:500px;margin:22px 0 0}

.handled{grid-area:handled}
.handled-title{font-size:19px;font-weight:550;letter-spacing:-.025em;line-height:1.3;margin-bottom:16px}
.handled ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.handled li{background:var(--surface);border-radius:20px;padding:15px 18px 17px;display:grid;align-content:start;gap:3px}
.handled li>span{font-size:10px;letter-spacing:.08em;color:var(--muted);margin-bottom:6px}
.handled li strong{font-size:16px;font-weight:550;letter-spacing:-.02em}
.handled li p{font-size:12px;line-height:1.45;color:var(--muted)}
.handled .nowrap{white-space:nowrap}
.portal-note{display:flex;align-items:center;gap:12px;margin-top:10px;padding:15px 18px;border-radius:20px;background:var(--field);color:var(--accent-ink);font-size:14px;line-height:1.45}
.portal-note span{font-size:18px;line-height:1}

.waitlist-card{grid-area:form;background:var(--surface);border-radius:30px;padding:34px 32px 28px;margin-top:8px}
.waitlist-card h2{font-size:clamp(36px,3.1vw,50px);letter-spacing:-.055em;isolation:isolate}
.waitlist-card h2 em{position:relative}
.waitlist-card h2 em:after{content:'';position:absolute;left:0;right:0;bottom:2px;height:7px;background:var(--accent);z-index:-1}
.list-choice{border:0;margin:26px 0 0;padding:0;min-width:0;display:grid;gap:10px}
.list-choice legend{font-size:11px;font-weight:550;letter-spacing:.12em;padding:0;margin-bottom:12px}
.choice{position:relative;display:block;margin:0;cursor:pointer}
.choice input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.choice-body{display:grid;grid-template-columns:18px 1fr;column-gap:14px;row-gap:4px;padding:16px 18px;border:1px solid var(--line);border-radius:20px;transition:background .3s,border-color .3s}
.choice-body:before{content:'';grid-row:1/3;width:18px;height:18px;margin-top:1px;border-radius:50%;border:1px solid var(--muted);background:var(--surface);box-shadow:inset 0 0 0 4px var(--surface);transition:background .2s,border-color .2s}
.choice-body strong,.choice-body small{grid-column:2}
.choice-body strong{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:16px;font-weight:550;letter-spacing:-.02em}
.choice-body i{font-style:normal;font-size:9px;font-weight:550;letter-spacing:.1em;padding:5px 9px;border-radius:100px;background:var(--field);color:var(--accent-ink)}
.choice-body small{font-size:12.5px;line-height:1.5;color:var(--muted)}
.choice:hover input:not(:checked)+.choice-body{border-color:rgba(24,27,38,.42)}
.choice input:checked+.choice-body i{background:var(--surface)}
.choice input:checked+.choice-body{background:var(--wash);border-color:var(--ink)}
.choice input:checked+.choice-body:before{background:var(--ink);border-color:var(--ink)}
.choice input:focus-visible+.choice-body{outline:2px solid var(--ink);outline-offset:3px}
.list-choice.is-missing .choice-body{border-color:#b3261e}
.email-label{display:block;font-size:12px;line-height:1.5;color:var(--muted);margin:22px 0 10px}
.waitlist-card .email-row{border-radius:100px}
.waitlist-card .email-row input{padding:12px 14px;border-radius:100px}
.waitlist-card .email-row button{border-radius:100px;padding:13px 20px}
.waitlist-card .contact-status,.waitlist-card .contact-consent{margin-left:15px}
.waitlist-card .contact-consent{font-size:10px}

/* Review round, 2026-10-14: messages, success state, focus and contrast. */
.waitlist-page .waitlist-card .contact-status{margin-top:10px;font-size:12px;line-height:1.3}
.waitlist-page .waitlist-card .contact-status:empty{display:block;height:0;margin:0;overflow:hidden}
.waitlist-page .waitlist-card .contact-status a{text-decoration:underline;text-underline-offset:2px}
.waitlist-page .waitlist-card .contact-status:focus{outline:none}
.waitlist-page .contact-status:not(:empty)~.contact-consent{display:none}
.waitlist-page .waitlist-card form.is-done .email-label,.waitlist-page .waitlist-card form.is-done .email-row{display:none}
.waitlist-page .waitlist-card form.is-done .contact-status{margin:16px 0 0;padding:14px 20px;border-radius:100px;background:var(--field);color:var(--accent-ink);font-size:14px;line-height:1.45}
.waitlist-card .email-row input:focus-visible{outline-color:var(--ink)}
.waitlist-card .email-row input::placeholder{color:var(--muted);opacity:1}
.waitlist-card .email-row button[aria-disabled=true]{opacity:.6;cursor:wait}
.handled-title{text-wrap:balance}
.handled li p,.choice-body small{text-wrap:pretty}
.waitlist-page .nav a[aria-current=page]{text-decoration:underline 3px var(--accent);text-underline-offset:8px}

footer .legal-links{display:flex;gap:22px;font-size:10px;letter-spacing:.06em}
footer .legal-links a{text-decoration:underline;text-underline-offset:3px;color:var(--muted)}

/* One screen, no scroll (founder, 2026-10-11): the page fills the viewport and the footer sits at the bottom. */
.waitlist-page{min-height:100vh;min-height:100svh;display:flex;flex-direction:column}
.waitlist-page main{flex:1 0 auto;width:100%}
.waitlist-page .nav{height:78px}
.waitlist-page footer{padding:18px 4.5vw 20px}
.waitlist-page footer .wordmark{font-size:24px}
.waitlist-page .waitlist{padding:0 4.5vw 22px;row-gap:26px}
.waitlist-page .waitlist h1{font-size:clamp(48px,4.4vw,84px)}
.waitlist-page .waitlist-intro .eyebrow{margin-bottom:16px}
.waitlist-page .waitlist .standfirst{margin-top:14px;font-size:16px}
.waitlist-page .handled-title{margin-bottom:12px}
.waitlist-page .handled li{padding:12px 16px 14px}
.waitlist-page .handled li>span{margin-bottom:3px}
.waitlist-page .portal-note{padding:12px 16px}
.waitlist-page .waitlist-card{padding:28px 28px 22px;margin-top:0}
.waitlist-page .list-choice{margin-top:20px}
.waitlist-page .list-choice legend{margin-bottom:10px}
.waitlist-page .choice-body{padding:13px 16px}
.waitlist-page .email-label{margin:16px 0 8px}
/* Laptops: the form card runs the full height of the left column, so its bottom lines up with the portal box (founder, 2026-10-11).
   The rows keep their natural height and the block sits centred between header and footer; the email field moves to the card's foot. */
@media(min-width:901px){
.waitlist-page .waitlist{align-content:center}
.waitlist-page .waitlist-card{align-self:stretch;display:flex;flex-direction:column}
.waitlist-page .waitlist-card form{flex:1;display:flex;flex-direction:column}
.waitlist-page .email-label{margin-top:0;padding-top:16px}
/* The two options share the spare height, so no empty band opens between them and the email field. */
.waitlist-page .list-choice{flex:1;grid-auto-rows:auto}
.waitlist-page .handled{align-self:end}
.waitlist-page .choice-body{height:100%;align-content:center}
.waitlist-page .waitlist-card form.is-done .contact-status{margin-top:16px}
}

@media(min-width:901px) and (max-height:700px){
.waitlist-page .nav{height:64px}
.waitlist-page .waitlist h1{font-size:clamp(44px,3.9vw,64px)}
.waitlist-page .waitlist .standfirst{margin-top:10px}
.waitlist-page .handled li{padding:10px 14px 12px}
.waitlist-page .waitlist-card{padding:22px 24px 18px}
.waitlist-page .choice-body{padding:11px 14px}
.waitlist-page .list-choice{margin-top:16px}
.waitlist-page .waitlist-card h2{font-size:clamp(32px,2.7vw,40px)}
}

@media(max-width:900px){
.waitlist{grid-template-columns:minmax(0,1fr);grid-template-areas:"intro" "form" "handled";row-gap:28px}
.waitlist-card{margin-top:0;max-width:560px}
}
@media(max-width:650px){
.waitlist{padding:4px 22px 8px;row-gap:24px}
.waitlist-intro .eyebrow{display:none}
.waitlist h1{font-size:clamp(44px,12.4vw,60px)}
.waitlist .standfirst{margin-top:14px;font-size:14px}
.waitlist-card{padding:24px 18px 20px;border-radius:24px}
.waitlist-card h2{font-size:34px}
.list-choice{margin-top:18px;gap:8px}
.list-choice legend{font-size:9px;margin-bottom:10px}
.choice-body{padding:13px 14px;column-gap:12px;border-radius:16px}
.choice-body strong{font-size:15px}
.choice-body small{font-size:12px}
.email-label{margin:16px 0 8px}
.handled-title{font-size:17px;margin-bottom:12px}
.handled ol{gap:8px}
.handled li{padding:11px 12px 13px;border-radius:16px}
.handled li>span{display:none}
.handled ol{grid-template-columns:repeat(3,minmax(0,1fr))}
.handled li strong{font-size:13.5px;line-height:1.25}
.handled li p{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.portal-note{font-size:13px;padding:13px 14px;border-radius:16px}
footer .legal-links{width:100%}
.waitlist-page footer{padding:24px 22px}
}

/* Phones: one screen. The intro sentence and the two option descriptions step aside (founder, 2026-10-11). */
@media(max-width:650px){
.waitlist-page .nav{height:44px}
.waitlist-page .nav .wordmark{font-size:24px}
.waitlist-page .waitlist{padding:0 18px 8px;row-gap:10px}
.waitlist-page .waitlist h1{font-size:clamp(26px,7.6vw,32px)}
.waitlist-page .waitlist h1 br{display:none}
.waitlist-page .waitlist .standfirst{display:none}
.waitlist-page .waitlist-card{padding:14px 14px 10px;border-radius:22px}
.waitlist-page .waitlist-card h2{font-size:26px}
.waitlist-page .list-choice{margin-top:12px;gap:8px}
.waitlist-page .list-choice legend{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.waitlist-page .choice-body{padding:8px 12px;align-items:center}
.waitlist-page .choice-body:before{grid-row:1;margin-top:0}
.waitlist-page .choice-body small{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.waitlist-page .email-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.waitlist-page .waitlist-card .email-row{margin-top:10px;padding:4px}
.waitlist-page .waitlist-card .email-row input{padding:9px 12px}
.waitlist-page .waitlist-card .email-row button{padding:9px 14px}
.waitlist-page .waitlist-card .contact-consent{margin-top:6px}
.waitlist-page .handled-title{font-size:15px;margin-bottom:6px}
.waitlist-page .handled ol{gap:6px}
.waitlist-page .handled li{padding:8px 10px 9px;border-radius:14px}
.waitlist-page .handled li strong{font-size:13px}
.waitlist-page .portal-note{font-size:12.5px;padding:9px 12px;margin-top:6px;border-radius:14px}
.waitlist-page .waitlist{align-content:space-evenly}
.waitlist-page .waitlist-card .contact-status{margin-top:6px}
.waitlist-page .waitlist-card form.is-done .contact-status{margin-top:10px;padding:9px 16px;font-size:13px;border-radius:20px}
.waitlist-page footer{padding:6px 18px 9px;gap:7px 16px;align-items:baseline}
.waitlist-page footer .wordmark{width:auto;font-size:16px}
.waitlist-page footer p{font-size:8px}
.waitlist-page footer .legal-links{width:auto}
}
