.contact-page { background: #fff; }
.contact-page .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.contact-hero { position: relative; min-height: 1317px; padding: clamp(4rem, 5vw, 9rem) clamp(1.5rem, 8vw, 10rem) 0; background: #e7e4dc url("../../开发打包/切图/05-联系我们/01-背景大图.jpg") center top / cover no-repeat; background-position-y: -16vw; }
.contact-hero__intro { color: #292929; transition: opacity .18s ease; }
.contact-hero__intro h1 { margin: 0; font-size: clamp(2rem, 3.45vw, 4.15rem); font-weight: 800; letter-spacing: .03em; line-height: 1.08; text-shadow: clamp(-2rem, -1.9vw, -1.15rem) clamp(1.15rem, 1.72vw, 2.05rem) 0 rgba(42, 42, 42, .12); }
.contact-hero__intro p { margin: clamp(1rem, 2vw, 2rem) 0 0; font-size: clamp(1.2rem, 1.8vw, 2.15rem); font-style: italic; line-height: 1.2; text-shadow: clamp(-2rem, -1.9vw, -1.15rem) clamp(1rem, 1.5vw, 1.75rem) 0 rgba(42, 42, 42, .12); }
.contact-panel { width: min(100%, 1500px); margin: clamp(8rem, 7vw, 31rem) auto 0; padding: clamp(3rem, 4vw, 6rem) clamp(2rem, 2.4vw, 3rem); background: rgba(255, 255, 255, .89); transition: opacity .18s ease; }
.contact-panel__lead { margin: 0 0 clamp(6rem, 6vw, 12rem); text-align: center; color: #414141; font-size: clamp(1.45rem, 2vw, 2.45rem); }
.contact-panel .contact-form { display: block; margin: 0; }
.contact-panel .contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 4.5vw, 5.5rem); }
.contact-panel .contact-grid > .contact-column { display: flex; flex-direction: column; }
.contact-panel .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-panel .contact-fields { display: grid; gap: clamp(0.75rem, 1.35vw, 1.6rem); }
.contact-panel .contact-form input, .contact-panel .contact-form select, .contact-panel .contact-form 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-panel .contact-form input, .contact-panel .contact-form select { height: clamp(2.2rem, 3vw, 3.55rem); padding: 0 .65rem; }
.contact-panel .contact-form select { display: block; width: 100%; font-weight: inherit; }
.contact-panel .contact-form textarea { display: block; height: clamp(8rem, 11vw, 14rem); padding: .65rem; resize: vertical; line-height: 1.25; }
.contact-panel .contact-form input::placeholder, .contact-panel .contact-form textarea::placeholder { color: #666; opacity: 1; }
.contact-panel .contact-requirement .wechat-field-group { margin: clamp(.75rem, 1.1vw, 1.2rem) 0 0; }
.contact-panel .contact-requirement .wechat-field-group h3 { margin-bottom: clamp(0.7rem, 1vw, 1.2rem); }
.contact-panel .contact-form textarea.wechat-field { height: clamp(3.8rem, 5vw, 5.9rem); min-height: 0; margin: 0; font-size: clamp(0.68rem, 0.9vw, 1.05rem); }
.contact-panel .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-panel .contact-submit:hover { background: #990000; }
.contact-page .form-message { min-height: 1.4rem; margin: 1rem 0 0; color: #006600; font-size: .95rem; }
.contact-page .form-message[data-state="error"] { color: #b00020; }
.partner-map { margin: 0; background: #eff7fc; }
.partner-map img { display: block; width: 100%; height: auto; }
@media (min-width: 801px) {
  /* Keep the WeChat box ending at the same baseline as Country. */
  .contact-panel .contact-grid > .contact-requirement { align-self: start; }
  .contact-panel .contact-requirement .wechat-field-group { margin: clamp(.75rem, 1.1vw, 1.2rem) 0 0; }
.contact-panel .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-panel input:focus::placeholder,
.contact-panel textarea:focus::placeholder {
  opacity: 0;
}
@media (max-width: 800px) { .contact-hero { min-height: 0; padding: 3rem 1rem; background-position: 58% top; } .contact-hero__intro h1 { font-size: 1.8rem; } .contact-panel { margin-top: 16rem; padding: 2rem 1rem; } .contact-panel__lead { margin-bottom: 3rem; text-align: left; } .contact-panel .contact-grid { grid-template-columns: 1fr; gap: 2rem; } .contact-panel .contact-form textarea { height: 10rem; } }

.contact-page--hero-loading .contact-hero__intro,
.contact-page--hero-loading .contact-panel {
  opacity: 0;
  pointer-events: none;
  animation: contact-hero-content-failsafe 0s linear 5s forwards;
}

@keyframes contact-hero-content-failsafe {
  to {
    opacity: 1;
    pointer-events: auto;
  }
}
