/* ─────────────────────────────────────────────
   Contact Section
   Mirrors the original contact3 global-class layout.
───────────────────────────────────────────── */

.contactSection.brxe-section,
.contactSectionNestable.brxe-section {
  padding-top: var(--section-default-padding);
  padding-bottom: var(--section-default-padding);
}

.contactSection-wrap.brxe-container {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  column-gap: 10%;
  row-gap: var(--default-container-row-gap);
  width: 100%;
}

.contactSection-col.brxe-div {
  width: 100%;
}

.contactSection-col1.brxe-div {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--gap-m);
  max-width: 58rem;
}

/* Form card — background-color injected as element-scoped CSS by Bricks (formBgColor control) */
.contactSection-form.brxe-shortcode {
  padding: var(--padding-s);
  background-color: #e5f3e9;
  border-radius: var(--border-radius-m);
  width: 100%;
}

/* ── Responsive ── */
@media (max-width: 991px) {
  .contactSection-wrap.brxe-container {
    flex-direction: column;
    row-gap: var(--default-flex-row-gap);
  }
}