/* Contact page only. Shared navigation, footer and brand tokens live in styles.css. */
.contact-page { background: #fff; }
.contact-heading { padding: 32px 0 52px; background: #f2f6fa; border-bottom: 1px solid #e4ebf2; }
.contact-breadcrumb { display: flex; gap: 12px; color: #637385; font-size: .78rem; margin-bottom: 28px; }
.contact-breadcrumb a:hover { color: #185d96; }
.contact-heading h1 { color: #112d46; font-size: clamp(3.8rem, 7.5vw, 6.5rem); letter-spacing: -.025em; overflow-wrap: anywhere; }
.contact-heading h1 > span { color: #2875af; }
.contact-content { padding-top: 64px; padding-bottom: 88px; }
.contact-columns { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(36px, 5.5vw, 88px); align-items: start; }
.contact-columns .eyebrow { font-size: .68rem; margin-bottom: 14px; }
.contact-columns h2 { font-family: "Manrope", Arial, sans-serif; font-size: clamp(1.5rem, 2.4vw, 2rem); line-height: 1.3; letter-spacing: -.045em; font-weight: 800; }
.contact-introduction { color: #5b6d7e; line-height: 1.85; margin: 20px 0 30px; max-width: 480px; }
.contact-cards { display: grid; gap: 16px; }
.contact-info-card { display: flex; align-items: flex-start; gap: 18px; padding: 25px 24px; border: 1px solid #e6edf3; border-radius: 16px; background: #fff; box-shadow: 0 6px 24px rgb(18 47 73 / 5%); }
.contact-card-icon { width: 46px; height: 46px; flex: 0 0 46px; display: grid; place-items: center; font-size: 1.2rem; color: #185d96; border-radius: 13px; background: #eaf3fa; }
.contact-info-card h3 { font-size: .85rem; letter-spacing: 0; margin: 1px 0 7px; font-weight: 800; }
.contact-info-card p, .contact-info-card a { font-size: .89rem; line-height: 1.7; overflow-wrap: anywhere; }
.contact-info-card p { color: #5b6d7e; }
.contact-info-card a { color: #183f60; font-weight: 650; }
.contact-info-card a:hover { color: #185d96; text-decoration: underline; }
.inquiry-panel { background: #f5f8fb; border: 1px solid #e7edf3; border-radius: 22px; padding: clamp(24px, 3vw, 42px); }
.inquiry-intro { color: #5b6d7e; font-size: .86rem; margin: 12px 0 26px; }
.inquiry-panel fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.inquiry-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 20px; }
.inquiry-full { grid-column: 1 / -1; }
.inquiry-field { min-width: 0; }
.inquiry-field label { display: block; margin-bottom: 7px; font-size: .8rem; font-weight: 750; color: #243f55; }
.inquiry-field label > span:not(.field-optional) { color: #185d96; }
.inquiry-field .field-optional { color: #647687; font-weight: 400; font-size: .73rem; }
.inquiry-field input, .inquiry-field textarea, #inquiry-draft { width: 100%; min-width: 0; border: 1px solid #d7e1eb; background: #fff; color: #172c42; border-radius: 9px; padding: 11px 13px; font: inherit; font-size: .9rem; line-height: 1.6; transition: border-color .15s, box-shadow .15s; }
.inquiry-field input { min-height: 48px; }
.inquiry-field textarea { min-height: 145px; resize: vertical; }
.inquiry-field input:focus, .inquiry-field textarea:focus, #inquiry-draft:focus { outline: none; border-color: #2875af; box-shadow: 0 0 0 3px rgb(40 117 175 / 13%); }
.inquiry-field input[aria-invalid="true"] { border-color: #a82331; }
.inquiry-code-row { display: flex; align-items: center; gap: 10px; }
.inquiry-code-row input { flex: 1; width: 0; text-transform: uppercase; letter-spacing: .1em; }
#valid-code-image { width: 160px; height: 52px; flex: 0 0 160px; border: 1px solid #d7e1eb; border-radius: 9px; background: #e5eef5; }
#refresh-code { width: 44px; height: 48px; flex: 0 0 44px; border: 1px solid #d7e1eb; border-radius: 9px; background: #fff; color: #185d96; }
#refresh-code:hover { background: #eaf3fa; }
.inquiry-code-help { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 4px 16px; margin-top: 7px; font-size: .7rem; color: #647687; }
#show-code { padding: 0; border: 0; background: none; color: #185d96; text-decoration: underline; }
.code-alternative { font-size: .85rem; margin-top: 8px; letter-spacing: .12em; }
.inquiry-error { color: #a82331; font-size: .8rem; line-height: 1.5; margin-top: 6px; }
.inquiry-error:empty { display: none; }
.inquiry-mail-note { display: flex; align-items: flex-start; gap: 10px; margin: 23px 0 20px; color: #566c7f; font-size: .72rem; line-height: 1.75; }
.inquiry-mail-note > i { margin-top: 4px; }
.inquiry-mail-note a { text-decoration: underline; overflow-wrap: anywhere; }
.inquiry-result[data-state="success"] { border:1px solid #82c89e; background:#edf9f1; }
.inquiry-result[data-state="error"] { border:1px solid #e8b69c; background:#fff7f1; }
#inquiry-native { margin:0 0 14px; }
.inquiry-send { display: inline-flex; justify-content: center; align-items: center; gap: 45px; min-height: 50px; padding: 12px 27px; border: 0; border-radius: 9px; background: #185d96; color: #fff; font-size: .8rem; font-weight: 800; letter-spacing: .08em; transition: background .15s, transform .15s; }
.inquiry-send:hover { background: #124b7c; transform: translateY(-1px); }
.inquiry-send:disabled { opacity: .5; cursor: not-allowed; }
.inquiry-result { margin-top: 24px; padding: 20px; border: 1px solid #b8d2e8; border-radius: 12px; background: #fff; color: #243f55; }
.inquiry-result p, .inquiry-result summary { font-size: .8rem; }
.inquiry-result-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px; margin: 16px 0; font-size: .78rem; }
.inquiry-result-actions a { color: #185d96; text-decoration: underline; }
#copy-inquiry { border: 1px solid #d7e1eb; border-radius: 7px; padding: 7px 12px; background: #f5f8fb; color: #185d96; }
.inquiry-result summary { cursor: pointer; }
#inquiry-draft { margin-top: 12px; resize: vertical; font-size: .78rem; }
@media (max-width: 899px) {
  .contact-columns { grid-template-columns: 1fr; gap: 40px; }
  .contact-introduction { max-width: 660px; }
}
@media (max-width: 575px) {
  .contact-heading { padding: 22px 0 32px; }
  .contact-breadcrumb { margin-bottom: 20px; }
  .contact-content { padding-top: 36px; padding-bottom: 60px; }
  .contact-info-card { padding: 20px 18px; gap: 14px; }
  .inquiry-panel { padding: 25px 18px; border-radius: 16px; }
  .inquiry-form-grid { grid-template-columns: 1fr; gap: 17px; }
  .inquiry-field input, .inquiry-field textarea { font-size: 16px; }
  .inquiry-code-row { gap: 7px; }
  #valid-code-image { width: 128px; height: 42px; flex-basis: 128px; }
  #refresh-code { width: 40px; flex-basis: 40px; }
  .inquiry-send { width: 100%; justify-content: space-between; }
}
@media (prefers-reduced-motion: reduce) { .inquiry-send, .inquiry-field input, .inquiry-field textarea { transition: none; } }

.contact-whatsapp-card .contact-card-icon { background: #e8f9ee; color: #127a40; }
.inquiry-honeypot { display: none !important; }
.contact-wechat-card .contact-card-icon { background: #e9f8ef; color: #148751; }
.contact-show-qr { display: inline-block; padding: 3px 0; margin-top: 5px; border: 0; color: #185d96; background: none; font: inherit; font-size: .8rem; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.contact-qr-gallery { margin-top: 28px; }
.contact-qr-gallery > h3 { margin: 0 0 14px; font-size: 1rem; font-weight: 800; }
.contact-scan-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.contact-scan-card { display: flex; flex-direction: column; align-items: center; min-width: 0; padding: 12px 9px; border: 1px solid #e0eaf1; border-radius: 12px; background: #fff; color: #17394b; font: inherit; cursor: pointer; }
.contact-scan-card:hover { border-color: #84b3ce; box-shadow: 0 5px 18px #17394b0d; }
.contact-scan-card:focus-visible, .contact-show-qr:focus-visible { outline: 3px solid #76bbdf; outline-offset: 3px; }
.contact-scan-image { display: block; width: 100%; max-width: 190px; border-radius: 7px; overflow: hidden; }
.contact-scan-card strong { margin-top: 6px; font-size: .85rem; }
.contact-scan-card > span:not(.contact-scan-image) { font-size: .7rem; overflow-wrap: anywhere; }
.contact-scan-card small { margin-top: 8px; font-size: .65rem; color: #5d7e92; }
.contact-whatsapp-card p { margin-top: 6px; }
.contact-info-card :is(a[href^="tel:"], a[href^="mailto:"], [data-contact-whatsapp-number]) { direction: ltr; unicode-bidi: isolate; display: inline-block; }