/* Visitor forms in a pop-up: order / quote (homepage) and "Share a memory" (memorial pages).
   Needs tokens.css and base.css. Behaviour in scripts/forms.js. */
.modal{margin:auto;width:min(520px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:0;border:0;background:none;color:var(--ink);overflow:visible}
.modal::backdrop{background:rgba(8,7,6,.82);backdrop-filter:blur(6px)}
.modal [hidden]{display:none!important}
.modal__card{position:relative;display:grid;gap:16px;padding:32px 28px 28px;border:1px solid rgba(212,162,76,.35);border-radius:20px;
  background:linear-gradient(180deg,#1d1710,#120f0b);max-height:calc(100dvh - 32px);overflow:auto}
.modal__title{font-family:var(--serif);font-weight:500;font-size:clamp(28px,5vw,36px);line-height:1.1;padding-right:36px}
.modal__title em{font-style:italic;color:var(--gold)}
.modal__lede{font-size:15px;line-height:1.55;color:var(--muted)}
.modal label{display:grid;gap:6px;font-size:13px;font-weight:500}
.modal input,.modal select,.modal textarea{width:100%;font:inherit;font-size:16px;color:var(--ink);background:#0e0c0a;border:1px solid var(--line);border-radius:12px;padding:12px 14px;transition:border-color .2s}
.modal textarea{resize:vertical;line-height:1.5}
.modal input:focus,.modal select:focus,.modal textarea:focus{outline:none;border-color:var(--gold)}
.modal input::placeholder,.modal textarea::placeholder{color:rgba(184,173,156,.45)}
.modal .btn{justify-content:center;width:100%;border:0;font-family:inherit;cursor:pointer}
.modal .btn--ghost{border:1px solid var(--line);background:none;color:var(--ink)}
.modal .btn:disabled{opacity:.6;cursor:default;transform:none}
.modal__close{position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:none;color:var(--ink);font-size:22px;line-height:1;cursor:pointer}
.modal__close:hover{border-color:var(--gold)}
.modal__err{min-height:0;font-size:14px;color:#f0a090}
.modal__err:empty{display:none}
.modal__done{text-align:center}
.modal__done .modal__title{padding:0 36px}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;opacity:0}
