/* The landing contact block — the gallery at night. Split out of
   dubloons.css so the page shell has room to grow; loaded only by the
   landing page. The bronze edges keep the block legible when the whole
   page is already dark. */
.contact {
  background: var(--onyx); color: var(--ivory); padding: 3.5rem 0 4rem;
  border-top: var(--hairline) solid var(--bronze-smoke);
  border-bottom: var(--hairline) solid var(--bronze-smoke);
}
.contact h2 { color: var(--ivory); }
.contact-inner > p { color: #c6c0b3; margin-bottom: 2rem; }
.funnel-form { display: flex; flex-direction: column; gap: 1.1rem; max-width: 720px; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; }
/* Field chrome for the funnel: the contact block is always the gallery
   at night, so the fields carry their own light palette rather than the
   page's. ui-forms.css reads these. */
.funnel-form {
  --field-face: var(--ivory);
  --field-ink: var(--onyx);
  --field-edge: var(--bronze-smoke);
  --field-label: #6b6558;
  /* The funnel's fields are ivory in BOTH themes, so anything drawn on
     them needs a fixed light-surface accent — the page-level
     --accent-ink flips to bright brass in dark and lands at 1.9:1. */
  --field-accent: #7d5f28;
}
/* Fallback layout for labels ui.js has not enhanced (JS off). */
.funnel-form label:not(.field) {
  display: flex; flex-direction: column; gap: 0.35rem;
  font-size: 0.92rem; letter-spacing: 0.04em; color: #ded8cb;
}
.funnel-form .field-block > label { display: block; margin-bottom: 0.4rem; font-size: 0.92rem; letter-spacing: 0.04em; color: #ded8cb; }
.funnel-form label:not(.field) .opt,
.funnel-form .field-block .opt { color: #a8a294; font-size: 0.85em; }
.funnel-form .field-hint { margin-top: -0.6rem; font-size: 0.85rem; color: #a8a294; }
.funnel-form input, .funnel-form select, .funnel-form textarea {
  font-family: inherit; font-size: 1rem; padding: 0.65rem 0.8rem; width: 100%;
  background: var(--field-face); color: var(--field-ink);
  border: var(--hairline) solid var(--field-edge); border-radius: var(--radius-sm);
}
.funnel-form input:focus, .funnel-form select:focus, .funnel-form textarea:focus {
  outline: none; border-color: var(--brass); box-shadow: var(--ring);
}
.funnel-form textarea { resize: vertical; }
.funnel-form .btn { align-self: flex-start; }
.hp { position: absolute !important; left: -9999px !important; height: 0; width: 0; opacity: 0; }
#lead-status { min-height: 1.4em; font-size: 0.95rem; }
#lead-status.ok { color: #9fd7ae; }
#lead-status.err { color: #e6a9a9; }

@media (max-width: 640px) {
  .field-row { grid-template-columns: 1fr; }
}