/* Waitlist block — heading, subtitle and CTA match the other section blocks
   (.cards-heading, .pricing-cta); colours come from theme tokens, so the
   same rules serve body.theme-dark and body.theme-light. */
.waitlist-section { padding: 4rem 1rem; }
.waitlist-section .container { max-width: 42rem; margin-inline: auto; }

.waitlist-heading {
  text-align: center;
  font-size: 2rem;
  margin-bottom: 1rem;
  overflow-wrap: anywhere;
}
.waitlist-heading::after {
  content: '';
  display: block;
  width: 70px;
  height: 1px;
  background: var(--color-text-darker);
  margin: 15px auto 0;
}
.waitlist-subtitle {
  text-align: center;
  color: var(--color-muted);
  font-size: 1.1rem;
  max-width: 700px;
  margin: 0 auto 1.5rem;
}
.waitlist-countdown {
  text-align: center;
  font-size: 1.5rem;
  font-variant-numeric: tabular-nums;
  color: var(--color-text);
}

.waitlist-form {
  display: grid;
  gap: 1rem;
  max-width: 520px;
  margin: 2rem auto 0;
  color: var(--color-text);
}
.waitlist-form label { font-size: .9rem; }
.waitlist-form input[type="email"] {
  width: 100%;
  box-sizing: border-box;
  padding: .85rem 1rem;
  border: 1px solid var(--border-strong);
  border-radius: 10px;
  font: inherit;
  color: var(--color-text);
  background: var(--color-bg-elevated);
  transition: border-color .2s ease, box-shadow .2s ease;
}
.waitlist-form input[type="email"]:focus {
  outline: none;
  border-color: var(--color-brand);
  box-shadow: 0 0 0 3px rgba(var(--color-brand-rgb), .25);
}
.waitlist-form .waitlist-consent { display: flex; align-items: flex-start; gap: .7rem; font-size: .9rem; color: var(--color-muted); }
.waitlist-consent input {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin-top: .2rem;
  accent-color: var(--color-brand);
}
.waitlist-consent input:focus-visible { outline: 2px solid var(--color-brand); outline-offset: 2px; }
.waitlist-privacy { margin: 0; font-size: .9rem; }
.waitlist-form a { text-decoration: underline; color: var(--color-brand-bright); }
.waitlist-form a:focus-visible { outline: 2px solid var(--color-brand); outline-offset: 2px; }

/* Same as the highlighted .pricing-cta */
.waitlist-submit {
  display: block;
  width: 100%;
  padding: 14px 24px;
  border: 2px solid transparent;
  border-radius: 10px;
  background: linear-gradient(135deg, var(--color-brand), var(--color-brand-dark));
  color: var(--color-bg);
  font: inherit;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: all .2s ease;
}
.waitlist-submit:hover {
  background: linear-gradient(135deg, var(--color-brand-bright), var(--color-brand));
  transform: translateY(-1px);
}
.waitlist-submit:focus-visible { outline: 2px solid var(--color-brand-bright); outline-offset: 3px; }
.waitlist-submit:disabled { opacity: .6; cursor: wait; transform: none; }

.waitlist-result { margin: 0; text-align: center; overflow-wrap: anywhere; color: var(--color-success); }
.waitlist-result[data-error="true"] { color: var(--color-error-text); }
