.apex-contact-form{display:grid;gap:12px;margin-top:22px}.apex-contact-form label{font-weight:600}.apex-contact-form input,.apex-contact-form select,.apex-contact-form textarea{width:100%;padding:12px;border:1px solid #b5a77a;border-radius:5px;background:#111;color:#fff;font:inherit}.apex-contact-form textarea{resize:vertical}.apex-contact-form button{justify-self:start}.form-honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}#form-status{min-height:1.5em}

/* Contact page layout: more room for the form, narrower resources column. */
.contact-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.75fr) minmax(260px, 1fr);
  gap: 22px;
  align-items: start;
}
.contact-layout > * { min-width: 0; }
.contact-info { overflow-wrap: anywhere; }
.contact-info-item + .contact-info-item { margin-top: 25px; }
.contact-info-item h3 { margin-bottom: 7px; }
.contact-info-item p { margin: 0 0 8px; }
.contact-info-item a { color: var(--bright, #c9a34e); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 800px) {
  .contact-layout { grid-template-columns: minmax(0, 1fr); }
}

/* Make every visible contact field fill the available form column. */
.apex-contact-form { grid-template-columns: minmax(0, 1fr); width: 100%; }
.apex-contact-form input:not([name="website"]),
.apex-contact-form select,
.apex-contact-form textarea {
  display: block;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

/* Contact-only composition and balanced spacing. */
.contact-hero { padding-bottom: 10px; }
.contact-hero p { margin-bottom: 0; }
.contact-section { padding-top: 12px; }
.contact-layout { align-items: stretch; }
.contact-layout > .panel {
  /* Let CSS Grid assign a shared row height; 100% height can overflow it. */
  height: auto;
  min-height: 0;
  align-self: stretch;
}
.contact-form-panel {
  align-items: stretch;
  text-align: left;
}
.contact-form-panel > h2,
.contact-form-panel > p { text-align: center; }
.contact-form-panel > p { margin-bottom: 0; }
.apex-contact-form {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: space-between;
  gap: 18px;
  margin-top: 24px;
}
.contact-field { display: grid; gap: 8px; }
.contact-field label { text-align: left; }
.contact-form-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  padding-top: 12px;
}
.contact-form-actions #contact-turnstile {
  margin-top: 34px;
}
.contact-form-actions #form-status {
  margin-top: 12px;
}
.apex-contact-form .contact-form-actions button {
  align-self: center;
  justify-self: auto;
}
#contact-turnstile { max-width: 100%; }
#form-status { margin: 0; text-align: center; }
.contact-info {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 0;
}
.contact-info > h2,
.contact-info > .contact-info-item {
  flex: 0 0 auto;
}
.contact-info > h2 { margin-bottom: 0; }
.contact-info-item + .contact-info-item { margin-top: 0; }
@media (max-width: 800px) {
  .contact-info { gap: 24px; }
  .apex-contact-form { gap: 18px; }
}
@media (max-width: 650px) {
  .contact-hero { padding-bottom: 8px; }
  .contact-section { padding-top: 8px; }
}

/* Contact page hero: eliminate extra top whitespace and center intro. */
.contact-hero { padding-top: 12px; text-align: center; }
.contact-hero h1 { margin-top: 0; margin-inline: auto; }
.contact-hero p { margin-inline: auto; text-align: center; }
@media (max-width: 650px) {
  .contact-hero { padding-top: 8px; }
}