/* Launch form and dialog use the existing landing palette and typography. */
.wl { display: grid; gap: 18px; width: 100%; text-align: left; }
.wl-fields { display: grid; gap: 18px; }
.wl-field { display: grid; gap: 6px; min-width: 0; }
.wl-label { font-size: 14px; font-weight: 600; color: var(--ink); }
.optional, .wl-hint { color: var(--ink-soft); font-weight: 400; }
.wl-hint { font-size: 12px; }
.wl input {
  width: 100%; min-width: 0; min-height: 48px; font: inherit; font-size: 16px;
  color: var(--ink); background: #fff;
  border: 1px solid rgba(23, 54, 42, .22); border-radius: 10px;
  padding: 11px 14px; outline: none;
}
.wl input:focus-visible { border-color: var(--leaf); outline: 3px solid rgba(224, 106, 10, .25); outline-offset: 1px; }
.wl input[aria-invalid="true"] { border-color: var(--kumkum); }
.wl input[type="month"] { appearance: none; min-width: 0; }
.wl-phone { display: flex; }
.wl-cc {
  display: grid; place-items: center; padding: 0 12px; font-size: 15px;
  background: #f7f9f3; border: 1px solid rgba(23, 54, 42, .22); border-right: 0;
  border-radius: 10px 0 0 10px;
}
.wl-phone input { border-radius: 0 10px 10px 0; }
.wl-btn {
  font: inherit; font-size: 16px; font-weight: 600;
  border: 0; border-radius: 12px; padding: 13px 24px; min-height: 48px;
  background: linear-gradient(#2c6047, var(--leaf) 60%, #183c2b); color: #fbf7ec; cursor: pointer;
  box-shadow: 0 3px 0 #0f281c, 0 12px 22px -10px rgba(23, 54, 42, .4), inset 0 1px 0 rgba(255, 255, 255, .22);
}
.wl-btn:hover { filter: brightness(1.08); }
.wl-btn:active { transform: translateY(2px); }
.wl-btn:focus-visible, .dialog-close:focus-visible { outline: 3px solid var(--marigold); outline-offset: 4px; }
.wl-btn:disabled { opacity: .55; cursor: default; filter: none; transform: none; }
.wl-status, .wl-availability { font-size: 14px; line-height: 1.5; }
.wl-status:empty, .wl-availability:empty { display: none; }
.wl-status[data-state="error"] { color: var(--kumkum); }
.wl-status[data-state="success"] { color: var(--leaf); }
.wl-note { font-size: 12px; line-height: 1.5; color: var(--ink-soft); }
.wl-trap { display: none; }
.wl[data-done] .wl-fields, .wl[data-done] .wl-btn, .wl[data-done] .wl-note, .wl[data-done] .wl-availability { display: none; }
.wl[data-done] .wl-status { font-size: 18px; padding: 12px 0 24px; }
.signup-dialog {
  width: min(480px, calc(100% - 28px)); max-height: calc(100dvh - 28px);
  margin: auto; padding: 26px; overflow-y: auto; overscroll-behavior: contain;
  border: 1px solid rgba(23, 54, 42, .14); border-radius: 20px;
  background: #f8faf4; color: var(--ink); font: inherit;
}
.signup-dialog::backdrop { background: rgba(15, 35, 26, .52); backdrop-filter: blur(6px); }
.dialog-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 22px; }
.dialog-brand { display: block; width: min(190px, calc(100% - 60px)); height: auto; }
.dialog-close { display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgba(23, 54, 42, .06); color: var(--ink); cursor: pointer; }
.signup-dialog h2 { font-family: Fraunces, Georgia, serif; font-weight: 500; font-size: 34px; line-height: 1.15; }
.signup-dialog #signup-intro { margin: 10px 0 22px; color: var(--ink-soft); line-height: 1.5; }
@media (max-width: 400px) { .signup-dialog { padding: 20px; } .signup-dialog h2 { font-size: 30px; } }
