/* Put the RFQ form on a predictable two-column desktop / one-column mobile grid. */
#rfqForm {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: 18px 20px !important;
}

#rfqForm > .home-field-pair {
  display: grid !important;
  grid-column: 1 / -1 !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: 16px 20px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  flex: none !important;
}

#rfqForm > .home-field-pair > label,
#rfqForm > label:not(.rfq-honeypot) {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
}

#rfqForm label :is(input:not([type="hidden"]), select, textarea) {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

#rfqForm > p.small,
#rfqForm > .inquiry-actions {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

#rfqForm > p.small {
  margin: 0 !important;
}

#rfqForm > .inquiry-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  gap: 12px !important;
}

@media (max-width: 600px) {
  #rfqForm {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 16px !important;
  }

  #rfqForm > .home-field-pair {
    grid-column: 1 / -1 !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
  }

  #rfqForm > .home-field-pair > label,
  #rfqForm > label:not(.rfq-honeypot) {
    grid-column: 1 / -1 !important;
  }
}