/* Contact-only layout: preserve CMS content and the shared Kimono theme. */
#contact-us {
  --contact-surface: #141617;
  --contact-input: #0e1416;
  --contact-border: #344249;
  --contact-text: #edf2f3;
  --contact-muted: #bac7cd;
  --contact-accent: #51c4e1;
  --contact-focus: #73d4eb;
  padding: 32px 0 0;
  color: var(--contact-muted);
  color-scheme: dark;
}
#contact-us > .container { width: 100%; max-width: 1600px; margin: 0 auto; padding: 0 clamp(16px, 3vw, 48px); }
#contact-us .locations-section { padding: 0 0 24px; }
#contact-us .contact-us-form-section { padding: 24px 0 80px; }
#contact-us .sec-heading { width: 100%; max-width: none; height: auto; min-height: 0; margin: 0 0 48px; padding: 0; text-align: center; }
#contact-us .sec-heading .content-area { margin: 0; padding: 0; }
#contact-us .sec-heading .title { margin: 0; padding: 0; font-size: clamp(26px, 3vw, 40px); line-height: 1.3; text-transform: none; letter-spacing: -.02em; text-wrap: balance; color: var(--contact-text); text-shadow: none; }
#contact-us .contact-info-panel, #contact-us .info-section { margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
#contact-us .info-section > .row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 0; }
#contact-us .info-section > .row > div { width: auto; min-width: 0; margin: 0; padding: 0; }
#contact-us .info-panel { display: flex; flex-direction: column; height: 100%; min-height: 332px; margin: 0; padding: 32px 16px; border: 1px solid var(--contact-border); border-top: 3px solid #387b8b; border-radius: 12px; background: linear-gradient(145deg, #182125, var(--contact-surface) 70%); box-shadow: inset 0 1px 0 rgb(255 255 255 / 3%); }
#contact-us .location-title { margin: 0 0 8px; font-size: 24px; line-height: 1.3; color: var(--contact-text); }
#contact-us .line-on-side { width: 64px; height: 2px; margin: 0 0 32px; background: var(--contact-accent); }
#contact-us .contact-detail-item { display: flex; align-items: flex-start; gap: 12px; margin: 0 0 16px; font-size: 16px; line-height: 1.6; }
#contact-us .contact-detail-item:last-child { margin-bottom: 0; }
#contact-us .contact-detail-icon { display: flex; align-items: center; justify-content: center; flex: 0 0 38px; width: 38px; height: 38px; border: 1px solid #30515b; border-radius: 6px; background: rgb(81 196 225 / 7%); color: var(--contact-accent); font-size: 18px; line-height: 1; }
#contact-us .contact-detail-link, #contact-us .contact-detail-content { min-width: 0; padding-top: 5px; overflow-wrap: anywhere; color: var(--contact-muted); }
#contact-us .contact-detail-link:hover { color: var(--contact-focus); text-decoration: underline; text-underline-offset: 4px; }
#contact-us .contact-detail-label { display: block; margin-bottom: 8px; font-weight: 600; }
#contact-us .contact-hours-list { display: grid; gap: 6px; }
#contact-us .contact-hours-row { display: grid; grid-template-columns: 82px minmax(0, 1fr); gap: 7px; font-size: 14px; }
#contact-us .contact-form-panel { padding: 32px; border: 1px solid var(--contact-border); border-radius: 12px; background: linear-gradient(145deg, #192327, var(--contact-surface) 58%); box-shadow: inset 0 1px 0 rgb(255 255 255 / 4%), 0 16px 40px rgb(0 0 0 / 18%); }
#contact-us .contact-form-panel .sec-heading { margin-bottom: 32px; }
#contact-us .custom-form-area, #contact-us .main-form { padding: 0; margin: 0; }
#contact-us .main-form > .row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin: 0; }
#contact-us .main-form > .row > div { min-width: 0; width: auto; padding: 0; margin: 0; grid-column: 1 / -1; }
#contact-us .main-form > .row > .col-lg-6 { grid-column: auto; }
#contact-us .input-wrapper { margin: 0; padding: 0; }
#contact-us .text-input, #contact-us .security-question-input { display: block; width: 100%; min-width: 0; height: 54px; margin: 0; padding: 14px 16px; border: 1px solid var(--contact-border); border-radius: 8px; background: var(--contact-input); color: var(--contact-text); font: inherit; line-height: 24px; box-sizing: border-box; caret-color: var(--contact-focus); box-shadow: inset 0 1px 2px rgb(0 0 0 / 12%); transition: border-color .16s ease, background-color .16s ease; }
#contact-us textarea.text-input { height: 160px; min-height: 160px; resize: vertical; }
#contact-us .input-label { position: static; display: block; margin: 8px 0 0; color: var(--contact-muted); font-size: 15px; font-weight: 600; line-height: 1.35; letter-spacing: 0; text-transform: none; transform: none; }
#contact-us .input-label .req { color: var(--contact-focus); }
#contact-us .b-border { display: none; }
#contact-us .text-input:hover, #contact-us .security-question-input:hover { border-color: #52666e; }
#contact-us .text-input:focus, #contact-us .security-question-input:focus { border-color: var(--contact-accent); background: #121c20; outline: 2px solid var(--contact-focus); outline-offset: 2px; }
#contact-us .text-input::placeholder, #contact-us .security-question-input::placeholder { color: #95a8b1; opacity: 1; }
#contact-us input.text-input:-webkit-autofill, #contact-us input.security-question-input:-webkit-autofill { -webkit-text-fill-color: var(--contact-text); -webkit-box-shadow: 0 0 0 1000px var(--contact-input) inset; }
#contact-us .text-input[aria-invalid="true"], #contact-us .security-question-input[aria-invalid="true"] { border-color: #dfa697; }
#contact-us .security-question-field { display: grid; gap: 12px; margin: 0; }
#contact-us .security-question-box { display: flex; align-items: center; gap: 14px; padding: 16px; background: #111a1e; border: 1px solid var(--contact-border); border-radius: 8px; }
#contact-us .security-question-badge { display: grid; place-items: center; flex: 0 0 36px; height: 36px; border-radius: 50%; background: rgb(81 196 225 / 9%); color: var(--contact-accent); font-weight: 700; }
#contact-us .security-question-copy { min-width: 0; }
#contact-us .security-question-copy strong { font-size: 14px; color: var(--contact-muted); }
#contact-us .security-question-expression { margin-top: 4px; font-size: 18px; font-weight: 600; color: var(--contact-text); }
#contact-us .submit-wrapper { display: flex; justify-content: flex-end; }
#contact-us .submit-wrapper .btn-solid { display: inline-flex; align-items: center; justify-content: center; min-width: 220px; min-height: 54px; margin: 0; padding: 12px 36px; border: 1px solid #3e8fa4; border-radius: 8px; background: linear-gradient(135deg, #147792, #12657e); color: #fff; font: inherit; font-weight: 600; line-height: 1.5; cursor: pointer; text-shadow: none; box-shadow: inset 0 1px 0 rgb(255 255 255 / 10%), 0 4px 12px rgb(0 0 0 / 15%); transition: border-color .16s ease, box-shadow .16s ease; }
#contact-us .submit-wrapper .btn-solid::before, #contact-us .submit-wrapper .btn-solid::after { display: none; }
#contact-us .submit-wrapper .btn-solid:hover { background: linear-gradient(135deg, #116b83, #10596f); border-color: var(--contact-accent); transform: none; }
#contact-us .submit-wrapper .btn-solid:disabled { opacity: .65; cursor: wait; }
#contact-us a:focus-visible, #contact-us button:focus-visible { outline: 2px solid var(--contact-focus); outline-offset: 4px; }
#contact-us-form { scroll-margin-top: 110px; }
@media (max-width: 991px) {
  #contact-us > .container { max-width: 1600px; padding: 0 clamp(16px, 3vw, 48px); }
  #contact-us .info-section > .row { grid-template-columns: 1fr; }
  #contact-us .info-panel { min-height: 0; padding: 24px; }
  #contact-us .sec-heading { margin-bottom: 32px; }
}
@media (max-width: 575px) {
  #contact-us > .container { padding: 0 16px; }
  #contact-us .contact-form-panel { padding: 24px 16px; }
  #contact-us .main-form > .row { grid-template-columns: 1fr; gap: 20px; }
  #contact-us .submit-wrapper .btn-solid { width: 100%; min-width: 0; }
  #contact-us .contact-us-form-section { padding-bottom: 48px; }
}
@media (prefers-reduced-motion: reduce) {
  #contact-us .text-input, #contact-us .security-question-input, #contact-us .submit-wrapper .btn-solid { transition: none; }
}

/* Contact phone: appointment country data and mask, scoped to this form. */
#contact-us .contact-international-phone { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 10px; min-width: 0; }
#contact-us .contact-international-phone select.text-input { padding: 14px 10px; min-height: 44px; }
#contact-us .contact-international-phone input.text-input { min-width: 0; }
/* Keep the long country list within a usable, scrollable viewport. */
#contact-us .contact-international-phone .nice-select.open { z-index: 20; }
#contact-us .contact-international-phone .nice-select .list { max-height: min(240px, 40vh); overflow-y: auto; overscroll-behavior: contain; }