/* COMMIT · "Join the beta" dialog (behaviour: beta-modal.js).
   V9CTA from src/src-08-3ec30482.jsx in a dialog: same copy, field order,
   signature pad, validation messages and success state. Needs the tokens and
   .cx-btn / .cx-meta from site-chrome.css, which loads first. */
.cx-modal{
  --cx-bg:#FAFAF3; --cx-bg2:#EFEFE5; --cx-surface:#FFFFFF;
  --cx-ink:#14140F; --cx-ink70:rgba(20,20,15,0.70); --cx-ink45:rgba(20,20,15,0.45);
  --cx-line:rgba(20,20,15,0.14); --cx-hl:#BEFF50; --cx-em:#3C6300; --cx-err:#C0392B;
  --cx-display:"Funnel Display",system-ui,sans-serif; --cx-ui:"Plus Jakarta Sans",system-ui,sans-serif;
  --cx-serif:"Instrument Serif",Georgia,serif; --cx-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,monospace;
}
.cx-modal *{box-sizing:border-box;}
.cx-modal :where(a,button,canvas):focus-visible{outline:3px solid var(--cx-em);outline-offset:3px;}
/* ── BETA MODAL (V9CTA in a dialog) ─────────────────────────────── */
html.cx-modal-open{overflow:hidden;}
.cx-modal{position:fixed;inset:0;z-index:100;display:flex;align-items:flex-start;justify-content:center;
  padding:clamp(12px,4vh,48px) 12px;overflow-y:auto;overscroll-behavior:contain;
  background:rgba(20,20,15,.72);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
  opacity:0;transition:opacity .2s ease;}
.cx-modal.is-in{opacity:1;}
.cx-modal[hidden]{display:none;}
.cx-card{position:relative;margin:auto 0;width:min(640px,100%);background:linear-gradient(160deg,var(--cx-surface),var(--cx-bg2));
  color:var(--cx-ink);border-radius:16px;border:2px solid var(--cx-hl);box-shadow:10px 10px 0 var(--cx-hl);
  padding:clamp(30px,5vw,48px) clamp(18px,5vw,44px) clamp(24px,4vw,36px);text-align:center;display:flex;
  flex-direction:column;align-items:center;gap:16px;font-family:var(--cx-ui);
  transform:translateY(12px) scale(.98);transition:transform .32s cubic-bezier(.2,.85,.2,1);}
.cx-modal.is-in .cx-card{transform:none;}
.cx-x{position:absolute;top:12px;right:12px;width:40px;height:40px;border-radius:11px;cursor:pointer;
  appearance:none;-webkit-appearance:none;background:var(--cx-surface);border:2px solid var(--cx-ink);
  display:grid;place-items:center;padding:0;color:var(--cx-ink);}
.cx-x:hover{background:var(--cx-hl);}
.cx-eyebrow{font-family:var(--cx-mono);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  display:inline-flex;align-items:center;gap:8px;white-space:nowrap;color:var(--cx-em);background:rgba(20,20,15,.03);
  border:1px solid rgba(20,20,15,.12);border-radius:999px;padding:6px 13px;}
.cx-eyebrow .dot{width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0;
  box-shadow:0 0 8px currentColor;animation:cxBlinkDot 1.1s ease-in-out infinite;}
@keyframes cxBlinkDot{0%,100%{opacity:1;}50%{opacity:.4;}}
.cx-card h2{font-family:var(--cx-display);font-weight:800;margin:0;font-size:clamp(32px,6.4vw,54px);
  line-height:.98;letter-spacing:-0.035em;text-wrap:balance;color:var(--cx-ink);}
.cx-em{font-family:var(--cx-serif);font-style:italic;font-weight:400;color:var(--cx-em);letter-spacing:0;}
.cx-card .lede{margin:0;max-width:520px;color:var(--cx-ink70);font-size:16.5px;line-height:1.5;}
.cx-form{width:min(520px,100%);display:flex;flex-direction:column;gap:12px;margin-top:6px;text-align:left;}
.cx-row{display:flex;gap:10px;flex-wrap:wrap;}
.cx-field{width:100%;padding:13px 15px;border-radius:12px;border:2px solid var(--cx-ink);background:var(--cx-bg);
  font-family:var(--cx-ui);font-size:16px;color:var(--cx-ink);outline:none;transition:border-color .15s;margin:0;}
.cx-field:focus,.cx-field:focus-visible{border-color:var(--cx-em);outline:none;box-shadow:0 0 0 3px rgba(60,99,0,.18);}
.cx-field:disabled{opacity:.7;}
.cx-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:-1px;padding:0;border:0;}
.cx-sig{position:relative;border-radius:14px;border:2px solid var(--cx-ink);background:var(--cx-bg);overflow:hidden;}
.cx-sig svg.line{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;}
.cx-sig svg.x{position:absolute;left:8px;bottom:0;height:100%;width:32px;pointer-events:none;}
.cx-sig canvas{position:relative;width:100%;height:92px;display:block;touch-action:none;cursor:crosshair;}
.cx-sig .ph{position:absolute;left:0;right:0;top:40%;text-align:center;font-family:var(--cx-serif);font-style:italic;
  font-size:18px;color:var(--cx-ink45);pointer-events:none;}
.cx-sig .clr{position:absolute;top:8px;right:10px;appearance:none;background:transparent;border:none;cursor:pointer;
  font-family:var(--cx-mono);font-size:9.5px;letter-spacing:.1em;color:var(--cx-ink45);text-transform:uppercase;padding:4px;}
.cx-sig-meta{display:flex;justify-content:space-between;margin-top:7px;}
.cx-err{color:var(--cx-err);font-size:13.5px;font-weight:800;min-height:0;margin:0;}
.cx-err:empty{display:none;}
.cx-submit{min-height:54px;width:100%;border-radius:12px;box-shadow:3px 3px 0 var(--cx-ink);font-size:15px;}
.cx-submit:not(:disabled):hover{transform:translate(-2px,-2px);box-shadow:3px 3px 0 var(--cx-ink);}
.cx-submit[aria-busy="true"]{cursor:wait;opacity:.92;}
.cx-fine{display:flex;gap:10px 14px;flex-wrap:wrap;justify-content:center;margin-top:2px;}
.cx-fine .sep{color:var(--cx-line);}

/* success state — same two cards as the homepage */
.cx-ok{width:min(560px,100%);display:grid;gap:14px;margin-top:6px;grid-template-columns:1fr;}
@media(min-width:560px){.cx-ok{grid-template-columns:1.18fr .82fr;}}
.cx-ok-card{text-align:left;background:var(--cx-surface);border:2px solid var(--cx-ink);border-radius:18px;padding:16px;
  box-shadow:6px 6px 0 var(--cx-hl);display:flex;flex-direction:column;gap:12px;min-height:178px;
  animation:cxIn .45s cubic-bezier(.2,.85,.2,1) both;}
.cx-ok-card strong{font-family:var(--cx-display);font-size:26px;line-height:1;color:var(--cx-ink);overflow-wrap:anywhere;}
.cx-ok-card .mail{color:var(--cx-ink70);font-size:14px;overflow-wrap:anywhere;}
.cx-ok-card .sigrow{margin-top:auto;min-height:54px;border-top:1px solid var(--cx-line);padding-top:8px;position:relative;}
.cx-ok-card .sigrow img{display:block;width:min(230px,72%);height:54px;object-fit:contain;object-position:left center;}
.cx-ok-card .sigrow span{position:absolute;right:0;bottom:2px;font-size:12px;font-weight:900;letter-spacing:.12em;
  color:var(--cx-ink70);text-transform:uppercase;}
.cx-ok-panel{background:var(--cx-hl);color:var(--cx-ink);border:2px solid var(--cx-ink);border-radius:18px;padding:18px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:178px;
  box-shadow:6px 6px 0 var(--cx-ink);animation:cxIn .45s cubic-bezier(.2,.85,.2,1) .08s both;}
.cx-ok-panel .chk{width:68px;height:68px;border-radius:50%;background:var(--cx-ink);display:grid;place-items:center;
  box-shadow:0 0 0 7px rgba(250,250,243,.4);animation:cxPop .68s cubic-bezier(.18,.9,.25,1.25) .18s both;}
.cx-ok-panel p{margin:0;font-weight:900;font-size:17px;line-height:1.25;text-align:center;}
@keyframes cxIn{from{opacity:0;transform:translateY(12px) scale(.98);}to{opacity:1;transform:none;}}
@keyframes cxPop{0%{opacity:0;transform:scale(.45) rotate(-12deg);}48%{opacity:1;transform:scale(1.16) rotate(5deg);}72%{transform:scale(.96) rotate(-2deg);}100%{opacity:1;transform:none;}}

@media(prefers-reduced-motion:reduce){
  .cx-modal,.cx-card{transition:none !important;}
  .cx-eyebrow .dot,.cx-ok-card,.cx-ok-panel,.cx-ok-panel .chk{animation:none !important;}
  .cx-submit:hover{transform:none;}
}