/* ===========================================================
   ShiftPress — Waitlist form + success/referral states
   Uses the design tokens already defined in each page's :root.
   =========================================================== */

.waitlist{max-width:480px}
.cta .waitlist{max-width:520px;margin:0 auto}

/* invited banner (when arriving via ?ref=) */
.wl-invited{display:none;align-items:center;gap:.55em;margin:0 0 12px;font-size:.9rem;
  color:var(--moss);font-weight:500}
.wl-invited.show{display:flex}
.cta .wl-invited{color:var(--gold-soft);justify-content:center}
.wl-invited svg{flex:none}

/* form */
.waitlist-form .url-input-wrap svg{flex:none;color:var(--sage)}
.waitlist-form input[type=email]{
  flex:1;border:0;background:transparent;font-family:var(--sans);font-size:1rem;
  color:var(--ink);padding:.85em .2em;outline:none;min-width:0;
}
.waitlist-form input[type=email]::placeholder{color:var(--sage)}
.cta-form.waitlist-form input[type=email]{color:var(--cream)}
.cta-form.waitlist-form input[type=email]::placeholder{color:rgba(243,239,229,.5)}
.waitlist-form button[disabled]{opacity:.6;cursor:progress}

/* inline message (errors) */
.wl-msg{display:none;margin-top:12px;font-size:.9rem;color:#9a3b2c}
.wl-msg.show{display:block}
.cta .wl-msg{color:var(--gold-soft);text-align:center}

/* success card */
.wl-success{display:none}
.wl-success.show{display:block;animation:wlIn .5s cubic-bezier(.2,.7,.2,1)}
@keyframes wlIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

.wl-card{background:var(--cream);border:1px solid var(--line);border-radius:16px;
  padding:26px 26px 24px;box-shadow:var(--shadow);text-align:left}
.cta .wl-card{background:rgba(251,249,242,.10);border-color:rgba(243,239,229,.25);
  backdrop-filter:blur(6px);color:var(--cream);text-align:center}

.wl-badge{display:inline-flex;align-items:center;gap:.5em;font-family:var(--mono);
  font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500;
  color:var(--moss);background:rgba(46,94,78,.10);border:1px solid var(--line);
  border-radius:100px;padding:.4em .9em;margin-bottom:14px}
.cta .wl-badge{color:var(--gold-soft);background:rgba(231,201,136,.12);border-color:rgba(231,201,136,.35)}

.wl-card h3{font-family:var(--serif);font-size:1.5rem;margin-bottom:.35em;color:var(--ink)}
.cta .wl-card h3{color:var(--cream)}
.wl-card h3 b{color:var(--moss)}
.cta .wl-card h3 b{color:var(--gold-soft)}
.wl-card .wl-lead{font-size:.98rem;color:var(--ink-soft);margin-bottom:.4em}
.wl-card .wl-sub{font-size:.9rem;color:var(--sage);margin-bottom:1.1em}
.cta .wl-card .wl-lead{color:rgba(243,239,229,.85)}
.cta .wl-card .wl-sub{color:rgba(243,239,229,.6)}

/* share link row */
.wl-share-row{display:flex;gap:8px;align-items:center;background:var(--paper-2);
  border:1px solid var(--line);border-radius:12px;padding:6px 6px 6px 14px}
.cta .wl-share-row{background:rgba(21,33,27,.25);border-color:rgba(243,239,229,.2)}
.wl-share-row input{flex:1;border:0;background:transparent;font-family:var(--mono);
  font-size:.82rem;color:var(--ink-soft);outline:none;min-width:0}
.cta .wl-share-row input{color:rgba(243,239,229,.85)}
.wl-copy{flex:none;font-family:var(--sans);font-weight:600;font-size:.85rem;
  padding:.6em 1.1em;border-radius:8px;border:0;cursor:pointer;
  background:var(--pine);color:var(--cream);transition:background .2s,transform .15s}
.wl-copy:hover{background:#16332a;transform:translateY(-1px)}
.wl-copy.done{background:var(--moss)}
.cta .wl-copy{background:var(--gold);color:var(--ink)}
.cta .wl-copy:hover{background:var(--gold-soft)}

/* share buttons */
.wl-share-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.wl-share-btns a{display:inline-flex;align-items:center;gap:.45em;font-size:.82rem;font-weight:600;
  color:var(--ink-soft);border:1px solid var(--line-strong);border-radius:100px;
  padding:.5em 1em;transition:border-color .2s,color .2s,transform .15s}
.wl-share-btns a:hover{border-color:var(--moss);color:var(--moss);transform:translateY(-1px)}
.cta .wl-share-btns{justify-content:center}
.cta .wl-share-btns a{color:rgba(243,239,229,.85);border-color:rgba(243,239,229,.3)}
.cta .wl-share-btns a:hover{border-color:var(--gold-soft);color:var(--gold-soft)}

.wl-refs{margin-top:14px;font-size:.86rem;color:var(--sage)}
.wl-refs b{color:var(--ink)}
.cta .wl-refs b{color:var(--cream)}
