/* Lead form dialog. Every surface, color and radius below is taken from the home:
   card = .preview-reasons article, fields = .ps-language, close = .ps-login,
   buttons = .ps-primary-cta / .ps-explore-cta, texts = .ph-why-cta-*. */
html.pf-lead-open { overflow: hidden; }

.pf-lead {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  color: #eff6ff;
  font-family: Sora, system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
  color-scheme: dark;
}
.pf-lead[hidden] { display: none; }
.pf-lead *, .pf-lead *::before, .pf-lead *::after { box-sizing: border-box; }

.pf-lead-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5, 8, 14, 0.8);
  opacity: 0;
  transition: opacity 0.22s ease;
}

.pf-lead-panel {
  position: relative;
  width: min(560px, 100%);
  max-height: calc(100dvh - 40px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 34px 32px 30px;
  border: 1px solid #283d5b;
  border-radius: 22px;
  /* .preview-reasons article gradient, composited over the page background #080c15 */
  background: linear-gradient(150deg, #0f1827, #0b1422);
  box-shadow: 0 40px 90px rgba(0, 0, 0, 0.55);
  opacity: 0;
  transform: translate3d(0, 12px, 0);
  transition: opacity 0.22s ease, transform 0.26s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.pf-lead-panel:focus { outline: none; }
.pf-lead.is-visible .pf-lead-backdrop { opacity: 1; }
.pf-lead.is-visible .pf-lead-panel { opacity: 1; transform: none; }

.pf-lead-close {
  position: absolute;
  top: 16px;
  right: 16px;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 1px solid #2b3b52;
  border-radius: 12px;
  background: transparent;
  color: #e4ecfa;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
}
.pf-lead-close:hover { background: #142137; border-color: #6583ad; }
.pf-lead-close svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; }

.pf-lead .ph-why-cta-kicker { margin-right: 52px; }
.pf-lead-title {
  margin: 0 52px 0 0;
  color: #eff6ff;
  font-size: clamp(24px, 2.4vw, 30px);
  line-height: 1.25;
  letter-spacing: -1.15px;
  font-weight: 500;
  text-wrap: balance;
  outline: none;
}

.pf-lead-form { display: grid; gap: 16px; margin-top: 26px; }
.pf-lead-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.pf-lead-field { display: grid; gap: 8px; }
.pf-lead-field > span { color: #9caec8; font-size: 12px; line-height: 1.4; }
.pf-lead-field em { font-style: normal; color: #626f89; }
.pf-lead-field input,
.pf-lead-field textarea {
  width: 100%;
  min-width: 0;
  padding: 0 16px;
  border: 1px solid #263449;
  border-radius: 12px;
  background: #0d1521;
  color: #e5efff;
  font: 400 14px/1.5 Sora, system-ui, sans-serif;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.pf-lead-field input { height: 48px; }
.pf-lead-field textarea { min-height: 116px; padding: 13px 16px; resize: vertical; }
.pf-lead-field input::placeholder,
.pf-lead-field textarea::placeholder { color: #626f89; }
.pf-lead-field input:hover,
.pf-lead-field textarea:hover { border-color: #30496d; }
.pf-lead-field input:focus,
.pf-lead-field textarea:focus {
  outline: none;
  border-color: #5b72de;
  box-shadow: 0 0 0 4px #5b72de26;
}
.pf-lead-field input:-webkit-autofill {
  -webkit-text-fill-color: #e5efff;
  box-shadow: 0 0 0 40px #0d1521 inset;
  caret-color: #e5efff;
}

.pf-lead-honeypot {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.pf-lead-status { margin: 0; font-size: 12px; line-height: 1.6; color: #9caec8; }
.pf-lead-status:empty { display: none; }
.pf-lead-status.is-error { color: #ffa4a4; }
.pf-lead-status a { color: #d2e4ff; text-decoration: underline; text-underline-offset: 2px; }

/* Same size as the closing CTA of the home (.ph-why-demo). */
.pf-lead .ps-primary-cta,
.pf-lead .ps-explore-cta {
  width: 100%;
  height: 54px;
  padding: 0 26px;
  font-size: 14px;
  cursor: pointer;
}
.pf-lead .ps-primary-cta:disabled { cursor: progress; opacity: 0.75; transform: none; }
.pf-lead .ps-cta-label { overflow: hidden; text-overflow: ellipsis; }

.pf-lead-consent {
  margin: 0;
  color: #8ea1bd;
  font-size: 11px;
  line-height: 1.6;
  text-align: center;
}
.pf-lead-consent a { color: #d2e4ff; text-decoration: underline; text-underline-offset: 2px; }

.pf-lead-check {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  margin-bottom: 22px;
  border: 1px solid #283d5b;
  border-radius: 50%;
  background: #0d1521;
  color: #9bbfee;
}
.pf-lead-check svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.pf-lead-actions { display: grid; gap: 12px; margin-top: 26px; }

@media (max-width: 700px) {
  .pf-lead { align-items: flex-end; padding: 0; }
  .pf-lead-panel {
    width: 100%;
    max-height: 92dvh;
    padding: 28px 20px calc(22px + env(safe-area-inset-bottom, 0px));
    border-width: 1px 0 0;
    border-radius: 22px 22px 0 0;
    transform: translate3d(0, 24px, 0);
  }
  .pf-lead-row { grid-template-columns: 1fr; }
  .pf-lead-title { font-size: 24px; }
  /* iOS Safari zooms into inputs below 16px */
  .pf-lead-field input,
  .pf-lead-field textarea { font-size: 16px; }
  .pf-lead .ps-primary-cta,
  .pf-lead .ps-explore-cta { height: 48px; }
}

@media (prefers-reduced-motion: reduce) {
  .pf-lead-backdrop,
  .pf-lead-panel { transition: none; }
}