/* Waitlist pieces the app's landing page doesn't have: the founders offer,
   the signup dialog, spot counter and the A/B guard. */
html { scroll-behavior: smooth; }
body { margin: 0; }
.lp [id] { scroll-margin-top: 80px; }
.lp-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Until the A/B variant is decided (max ~1s), the hero copy stays hidden so
   nobody sees A flip to B */
.ab-pending [data-ab] { visibility: hidden; }

.lp-topbar-link { border: none; cursor: pointer; font-family: inherit; }
.lp-hero h1 em, .lp-founders h2 em { font-style: normal; }
.lp-persona-chip[hidden], .lp-hero-success[hidden], .lp-cta-success[hidden], [data-spots][hidden] { display: none; }
.lp-hero-form[hidden], .lp-cta-form[hidden] { display: none; }

/* Founder spots counter */
.lp-spots { max-width: 360px; margin: 18px auto 0; text-align: center; font-size: 0.85rem; color: var(--gray-600); }
.lp-spots strong { color: var(--purple); }
.lp-spots-bar { height: 8px; margin-top: 8px; border-radius: 999px; background: var(--purple-100); overflow: hidden; }
.lp-spots-bar span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--purple-light), var(--purple)); transition: width 0.8s ease; }

/* Success state after joining */
.lp-hero-success, .lp-cta-success { display: block; max-width: 480px; margin: 0 auto; }
.lp-joined strong { display: block; font-size: 1.05rem; margin-bottom: 4px; }
.lp-joined p { margin: 0 0 12px; font-size: 0.92rem; font-weight: 500; }
.lp-joined button {
  border: none; border-radius: 999px; padding: 6px 14px; background: #fff; color: var(--purple);
  font-weight: 700; font-size: 0.8rem; cursor: pointer; font-family: inherit; box-shadow: 0 1px 3px rgba(0,0,0,.08);
}

/* Founders offer section */
.lp-founders { background: linear-gradient(135deg, #12002b 0%, #3a0080 100%); color: #fff; }
.lp-founders .lp-tag { background: rgba(255,255,255,0.12); color: #e9d5ff; }
.lp-founders .lp-title { color: #fff; }
.lp-founders .lp-sub { color: rgba(255,255,255,0.75); }
.lp-founders-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin: 48px 0 40px; }
.lp-founders-card { padding: 22px; border-radius: 16px; background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.12); }
.lp-founders-card .icon { font-size: 1.6rem; }
.lp-founders-card h3 { margin: 10px 0 6px; font-size: 1.05rem; font-weight: 800; }
.lp-founders-card p { margin: 0; font-size: 0.9rem; color: rgba(255,255,255,0.7); line-height: 1.55; }
.lp-founders .lp-spots { color: rgba(255,255,255,0.75); }
.lp-founders .lp-spots strong { color: #fff; }
.lp-founders .lp-spots-bar { background: rgba(255,255,255,0.15); }
.lp-founders-cta { text-align: center; }
.lp-btn-light {
  display: inline-block; padding: 15px 30px; border: none; border-radius: 10px; background: #fff; color: var(--purple);
  font-size: 1rem; font-weight: 800; font-family: inherit; cursor: pointer; transition: transform .15s, box-shadow .15s;
}
.lp-btn-light:hover { transform: translateY(-1px); box-shadow: 0 8px 24px rgba(0,0,0,.25); }

/* Pricing with the founder price */
.lp-plan-btn { border: none; font-family: inherit; cursor: pointer; width: 100%; }
.lp-plan-btn-outline { border: 1.5px solid var(--purple); }
.lp-plan-was { margin-left: 6px; font-size: 1rem; color: var(--gray-400); text-decoration: line-through; }
.lp-founder-price { display: inline-block; margin-top: 6px; padding: 2px 10px; border-radius: 999px; background: #ecfdf5; color: #047857; font-size: 0.75rem; font-weight: 700; }

/* Desktop download buttons: not released yet */
.lp-download-btn small { display: block; }
.lp-soon { display: inline-block; margin-top: 14px; font-size: 0.85rem; color: var(--gray-500); }

/* Waitlist dialog */
.lp-jm {
  width: min(460px, calc(100vw - 32px)); padding: 0; border: none; border-radius: 20px;
  box-shadow: 0 30px 80px rgba(17,24,39,.3); font-family: 'Inter', system-ui, sans-serif; color: #111827;
}
.lp-jm::backdrop { background: rgba(17,24,39,.55); backdrop-filter: blur(3px); }
.lp-jm[open] { animation: ppIn .3s cubic-bezier(0.2, 0.9, 0.3, 1.15); }
.lp-jm-inner { position: relative; padding: 32px 28px 24px; text-align: center; }
.lp-jm-close { position: absolute; top: 12px; right: 12px; border: none; background: none; font-size: 18px; color: #9ca3af; cursor: pointer; padding: 6px 9px; border-radius: 8px; }
.lp-jm-close:hover { background: #f3f4f6; color: #374151; }
.lp-jm-badge { display: inline-block; padding: 4px 12px; border-radius: 999px; background: #f5eeff; color: #8800ff; font-size: .75rem; font-weight: 700; }
.lp-jm-title { margin: 12px 0 8px; font-size: 1.45rem; font-weight: 800; letter-spacing: -.4px; line-height: 1.25; }
.lp-jm-sub { margin: 0 0 18px; font-size: .95rem; color: #6b7280; line-height: 1.6; }
.lp-jm .lp-hero-form { flex-direction: column; }
.lp-jm .lp-hero-form input[type="email"] { width: 100%; }
.lp-jm-trust { list-style: none; margin: 16px 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 14px; font-size: .8rem; color: #6b7280; }
.lp-jm-trust li::before { content: '✓ '; color: #10b981; font-weight: 700; }

.pp-card[hidden] { display: none; }
.pp-count { margin: 10px 0 0; font-size: 12px; font-weight: 600; color: #8800ff; text-align: center; }

@media (max-width: 768px) {
  .lp-nav-cta .lp-btn-primary { padding: 8px 14px; font-size: 0.85rem; }
}

/* Double opt-in: "check your inbox" after signing up, and the page the
   confirmation link lands on */
.lp-joined-hint { font-size: 0.8rem !important; opacity: .75; }
.st-confirmed { text-align: center; }
.st-confirmed-icon { font-size: 3rem; margin-bottom: 8px; }
.st-confirmed-lead { font-size: 1.1rem; }
.st-confirmed .lp-hero-btn { display: inline-block; text-decoration: none; border: none; cursor: pointer; font-family: inherit; }
.st-confirmed [hidden] { display: none; }