.contact-section {
  display: block;
  padding: clamp(2.5rem, 5.2vw, 6.25rem) clamp(1rem, 4.2vw, 5rem);
  background: #fff;
  color: #5b5b5b;
}

.contact-wrap { max-width: 1520px; margin: 0 auto; }

.contact-heading h2 {
  margin: 0;
  color: #5d5d5d;
  font-family: Arial, sans-serif;
  font-size: clamp(2rem, 3.1vw, 3.75rem);
  font-weight: 700;
  line-height: 1;
}

.contact-heading p {
  margin: 0.35rem 0 0;
  font-size: clamp(0.78rem, 1vw, 1.2rem);
  letter-spacing: 0.08em;
}

.contact-form { display: block; margin-top: clamp(2rem, 4vw, 4.75rem); }
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 4.5vw, 5.5rem); }
.contact-grid > .contact-column { display: flex; flex-direction: column; }
.contact-column h3 { margin: 0 0 clamp(0.9rem, 1.4vw, 1.6rem); color: #555; font-size: clamp(1.05rem, 1.45vw, 1.75rem); font-weight: 400; }
.contact-fields { display: grid; gap: clamp(0.75rem, 1.35vw, 1.6rem); }

.contact-section input,
.contact-section select,
.contact-section textarea {
  width: 100%;
  border: 1px solid #999;
  border-radius: 0;
  background: #fff;
  color: #555;
  font-family: Arial, sans-serif;
  font-size: clamp(0.72rem, 0.95vw, 1.12rem);
  outline-color: #bd0000;
}

.contact-section input,
.contact-section select { height: clamp(2.2rem, 3vw, 3.55rem); padding: 0 0.65rem; }
.contact-section select { display: block; width: 100%; font-weight: inherit; }
.contact-section textarea { height: clamp(8rem, 11vw, 14rem); padding: 0.65rem; resize: vertical; line-height: 1.25; }
.contact-section input::placeholder, .contact-section textarea::placeholder { color: #666; opacity: 1; }
.contact-section input:focus::placeholder, .contact-section textarea:focus::placeholder { opacity: 0; }

.contact-requirement .wechat-field-group { margin: auto 0 0; }
.contact-requirement .wechat-field-group h3 { margin-bottom: clamp(0.7rem, 1vw, 1.2rem); }
.contact-requirement .wechat-field { height: clamp(3.8rem, 5vw, 5.9rem); min-height: 0; margin: 0; font-size: clamp(0.68rem, 0.9vw, 1.05rem); }
.contact-submit { width: clamp(10rem, 15vw, 18rem); height: clamp(2.4rem, 3.5vw, 4.2rem); margin-top: clamp(1.5rem, 2.5vw, 3rem); border: 0; background: #bd0000; color: #fff; font-size: clamp(0.85rem, 1.15vw, 1.35rem); font-weight: 400; }
.contact-submit:hover { background: #990000; }
.contact-form .form-message { margin: 1rem 0 0; color: #006600; font-size: 0.9rem; }
.contact-form .form-message[data-state="error"] { color: #b00020; }

@media (min-width: 801px) {
  /* Keep the WeChat box ending at the same baseline as Country. */
  .contact-section .contact-grid > .contact-requirement { align-self: start; }
  .contact-requirement .wechat-field-group { margin: clamp(.75rem, 1.1vw, 1.2rem) 0 0; }
  .contact-section .contact-form .contact-requirement > textarea[name="requirement"] {
    height: calc(5 * clamp(2.2rem, 3vw, 3.55rem) + 4 * clamp(.75rem, 1.35vw, 1.6rem) - clamp(.75rem, 1.1vw, 1.2rem) - clamp(3.8rem, 5vw, 5.9rem));
  }
  .contact-section .contact-requirement > p:not(.form-message) {
    margin: auto 0 calc(clamp(1.5rem, 2.5vw, 3rem) + clamp(2.4rem, 3.5vw, 4.2rem));
  }
}

@media (max-width: 800px) {
  .contact-grid { grid-template-columns: 1fr; }
  .contact-section { padding: 2.5rem 1.25rem; }
  .contact-section textarea { height: 10rem; }
}
