/* The contact page keeps practical details and the enquiry form in one place. */
.contact-page .k-phead.contact-banner {
  background-image: linear-gradient(rgba(7, 28, 43, .56), rgba(7, 28, 43, .56)), var(--banner-image);
  background-position: center, center var(--banner-y, 50%);
}

.contact-page .contact-details {
  padding: clamp(52px, 6vw, 82px) 0;
  background: #eaf4f8 url('/images/contact-form-backdrop.webp') center center / cover no-repeat;
  border-top: 1px solid #d8e7ed;
}
.contact-page .contact-panel {
  display: grid;
  grid-template-columns: minmax(0, .94fr) minmax(0, 1.06fr);
  gap: clamp(32px, 4vw, 54px);
  align-items: start;
  padding: clamp(32px, 4vw, 52px);
  border: 1px solid #d4e3eb;
  border-radius: 7px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 16px 44px rgba(26, 60, 79, .09);
}
.contact-page .contact-panel-info,
.contact-page .contact-panel-form { min-width: 0; }
.contact-page .contact-panel-form { padding-left: clamp(32px, 4vw, 54px); border-left: 1px solid #d6e2e7; }
.contact-page #write-to-us { scroll-margin-top: 112px; }
.contact-page .contact-panel .eyebrow { margin: 0 0 14px; color: #925a33; font-size: 11px; letter-spacing: .1em; }
.contact-page .contact-panel .eyebrow::before { background: #b27a4c; }
.contact-page .contact-panel h2 { margin: 0 0 10px; color: #102c3b; font-family: var(--font-display); font-size: clamp(30px, 2.6vw, 36px); line-height: 1.17; }
.contact-page .contact-panel-lede,
.contact-page .contact-form-lede { max-width: 46ch; margin: 0 0 24px; color: #526775; font-size: 16px; line-height: 1.55; }
.contact-page .contact-routes { margin: 0; }
.contact-page .contact-routes > div { display: grid; grid-template-columns: 118px minmax(0, 1fr); gap: 14px; padding: 16px 0; border-top: 1px solid #dce8ed; }
.contact-page .contact-routes dt { color: #687d88; font-size: 11px; font-weight: 600; letter-spacing: .07em; line-height: 1.5; text-transform: uppercase; }
.contact-page .contact-routes dd { min-width: 0; margin: 0; color: #183342; font-size: 15px; line-height: 1.5; }
.contact-page .contact-routes a,
.contact-page .contact-map-link { color: #164d63; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.contact-page .contact-routes a:hover,
.contact-page .contact-map-link:hover { color: #8f2438; }
.contact-page .contact-panel-map { overflow: hidden; margin-top: 20px; border: 1px solid #d6e2e7; border-radius: 5px; background: #dce9ed; }
.contact-page .contact-panel-map iframe { display: block; width: 100%; height: 218px; border: 0; }
.contact-page .contact-map-link { display: inline-block; margin-top: 11px; font-size: 14px; }
.contact-page .contact-panel .enquiry-fields { gap: 20px 18px; }
.contact-page .contact-panel .enquiry-field label { margin-bottom: 8px; color: #183342; font-size: 14px; }
.contact-page .enquiry-field input,
.contact-page .enquiry-field select,
.contact-page .enquiry-field textarea { min-height: 52px; border-color: #b7cbd5; border-radius: 5px; background: #fff; color: #17313f; }
.contact-page .enquiry-field textarea { min-height: 174px; }
.contact-page .enquiry-field input:focus-visible,
.contact-page .enquiry-field select:focus-visible,
.contact-page .enquiry-field textarea:focus-visible { border-color: #216eaa; }
.contact-page .enquiry-privacy { margin: 14px 0 0; color: #607480; font-size: 13px; line-height: 1.5; }
.contact-page .enquiry-submit { flex-wrap: wrap; margin-top: 22px; }
.contact-page .enquiry-submit button { border-radius: 4px; }
.contact-page .enquiry-submit button:disabled,
.contact-page .enquiry-submit button:disabled:hover { border-color: #82949b; background: #82949b; color: #fff; cursor: not-allowed; opacity: .72; }
.contact-page .enquiry-submit p { color: #607480; }
.contact-page .contact-panel .enquiry-feedback { margin: 12px 0 0; padding: 9px 12px; border-left: 3px solid #b7cbd5; color: #34505d; font-size: 13px; line-height: 1.45; }
.contact-page .contact-panel .enquiry-feedback p { margin: 0; }
.contact-page .contact-panel .enquiry-feedback a { display: inline-block; margin-top: 6px; font-weight: 600; text-underline-offset: 3px; }
.contact-page .contact-panel .enquiry-feedback a[hidden] { display: none; }
.contact-page .contact-panel .enquiry-feedback[hidden] { display: none; }
.contact-page .contact-panel .enquiry-feedback[data-state="success"] { border-left-color: #38775d; background: #eef7f1; color: #245b42; }
.contact-page .contact-panel .enquiry-feedback[data-state="error"] { border-left-color: #a33849; background: #fdf1f2; color: #842b39; }

.contact-page .contact-directory { padding: 72px 0 76px; background: #fff; }
.contact-page .contact-directory-heading { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 40px; align-items: end; margin-bottom: 32px; }
.contact-page .contact-directory-heading .eyebrow { grid-column: 1 / -1; color: #8f2438; }
.contact-page .contact-directory-heading h2 { margin: 0; color: #102c3b; font-size: clamp(30px, 2.6vw, 38px); }
.contact-page .contact-directory-heading > p:last-child { margin: 0 0 3px; color: #5c6b70; font-size: 15px; line-height: 1.5; }
.contact-page .contact-directory .phones { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin: 0; padding: 0; list-style: none; }
.contact-page .contact-directory .phones li { display: flex; flex-direction: row; justify-content: flex-start; align-items: center; gap: 16px; min-width: 0; min-height: 122px; padding: 22px 18px 22px 0; border: 0; border-bottom: 1px solid #dce5e9; }
.contact-page .contact-directory .phones li:nth-child(3n+2),
.contact-page .contact-directory .phones li:nth-child(3n+3) { padding-left: 20px; }
.contact-page .contact-directory .phones li:nth-child(3n+1),
.contact-page .contact-directory .phones li:nth-child(3n+2) { border-right: 1px solid #dce5e9; }
.contact-page .contact-directory .contact-icon { display: grid; place-items: center; flex: 0 0 56px; width: 56px; height: 56px; margin: 0; border-radius: 50%; background: #eaf4f8; color: #205765; }
.contact-page .contact-directory .contact-card:nth-child(even) .contact-icon,
.contact-page .contact-directory .contact-note-item:nth-child(even) .contact-icon { background: #fff3e6; color: #9c6b2f; }
.contact-page .contact-directory .contact-icon svg { display: block; width: 26px; height: 26px; stroke: currentColor; }
.contact-page .contact-directory .contact-card-copy { display: block; min-width: 0; }
.contact-page .contact-directory .phones .contact-card-copy > span { display: block; margin: 0 0 5px; color: #526775; font-size: 14px; font-weight: 500; line-height: 1.35; }
.contact-page .contact-directory .phones .contact-card-copy > div { display: flex; flex-wrap: wrap; gap: 2px 14px; }
.contact-page .contact-directory .phones a { color: #205765; font-family: var(--font-display); font-size: 21px; font-weight: 600; line-height: 1.3; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; white-space: nowrap; }
.contact-page .contact-directory .phones a:hover,
.contact-page .contact-directory-note a:hover { color: #8f2438; }
.contact-page .contact-directory .phones .contact-card--hours .contact-card-label { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.contact-page .contact-directory .phones .contact-card--hours p { margin: 0; color: #526168; font-size: 15px; line-height: 1.45; }
.contact-page .contact-directory-note { display: grid; grid-template-columns: 1fr; gap: 0; margin: 0; padding-top: 22px; }
.contact-page .contact-directory-note .contact-note-item { display: flex; align-items: flex-start; gap: 16px; min-width: 0; padding: 0 18px 0 0; }
.contact-page .contact-directory-note .contact-note-item + .contact-note-item { padding-left: 20px; border-left: 1px solid #dce5e9; }
.contact-page .contact-directory-note .contact-note-item > div { min-width: 0; }
.contact-page .contact-directory-note .contact-note-label { display: block; margin: 0 0 5px; color: #526775; font-size: 11px; font-weight: 600; line-height: 1.4; letter-spacing: .08em; text-transform: uppercase; }
.contact-page .contact-directory-note p { margin: 0; color: #526168; font-size: 14px; line-height: 1.5; }
.contact-page .contact-directory-note a { color: #205765; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }

.contact-page .findus { padding: 64px 0 70px; background: #f1f6f6; }
.contact-page .findus-heading { display: block; margin-bottom: 26px; }
.contact-page .findus-heading .eyebrow { color: #587078; }
.contact-page .findus-heading h2 { margin: 0; font-size: clamp(30px, 2.6vw, 38px); }
.contact-page .findus-points { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; }
.contact-page .findus-points li,
.contact-page .findus-points li + li { min-width: 0; padding: 18px 0 0; border: 0; border-top: 2px solid #c5d7d8; background: transparent; }
.contact-page .findus-points a { color: #205765; }

@media (max-width: 900px) {
  .contact-page .contact-panel { width: calc(100% - 48px); grid-template-columns: minmax(0, 1fr); gap: 34px; padding: 38px; }
  .contact-page .contact-panel-form { padding: 34px 0 0; border-left: 0; border-top: 1px solid #d6e2e7; }
  .contact-page .contact-panel-map iframe { height: 240px; }
  .contact-page .contact-directory .phones { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contact-page .contact-directory .phones li { padding-left: 0 !important; }
  .contact-page .contact-directory .phones li:nth-child(odd) { border-right: 1px solid #dce5e9; }
  .contact-page .contact-directory .phones li:nth-child(even) { padding-left: 20px !important; border-right: 0; }
  .contact-page .contact-directory-note { grid-template-columns: 1fr; gap: 18px; }
  .contact-page .contact-directory-note .contact-note-item + .contact-note-item { padding: 18px 0 0; border-left: 0; border-top: 1px solid #dce5e9; }
}
@media (max-width: 760px) {
  .contact-page .k-phead.contact-banner {
    display: block;
    min-height: 0;
    padding: 240px 0 42px;
    background-color: #0c263b;
    background-image: var(--banner-image);
    background-position: left top;
    background-size: auto 240px;
    background-repeat: no-repeat;
  }
  .contact-page .k-phead.contact-banner .wrap { padding-top: 28px; }
  .contact-page .contact-details { background-position: 25% center; }
}
@media (max-width: 540px) {
  .contact-page .contact-details { padding: 34px 0 48px; background-position: 17% center; }
  .contact-page .contact-panel { width: calc(100% - clamp(24px, 8vw, 32px)); gap: 28px; padding: 26px 22px 30px; }
  .contact-page .contact-panel-form { padding-top: 28px; }
  .contact-page .contact-panel h2 { font-size: 31px; }
  .contact-page .contact-panel-lede,
  .contact-page .contact-form-lede { margin-bottom: 20px; }
  .contact-page .contact-routes > div { grid-template-columns: 1fr; gap: 4px; padding: 13px 0; }
  .contact-page .contact-panel-map iframe { height: 220px; }
  .contact-page .contact-panel .enquiry-fields { gap: 17px; }
  .contact-page .contact-directory { padding: 50px 0; }
  .contact-page .contact-directory-heading { display: block; margin-bottom: 22px; }
  .contact-page .contact-directory-heading h2 { margin: 0 0 12px; font-size: 31px; }
  .contact-page .contact-directory .phones { grid-template-columns: 1fr; }
  .contact-page .contact-directory .phones li,
  .contact-page .contact-directory .phones li:nth-child(even) { min-height: 0; padding: 15px 0 !important; border-right: 0; }
  .contact-page .contact-directory .phones li:nth-child(odd) { border-right: 0; }
  .contact-page .contact-directory .contact-icon { flex-basis: 48px; width: 48px; height: 48px; }
  .contact-page .contact-directory .contact-icon svg { width: 23px; height: 23px; }
  .contact-page .contact-directory .phones a { font-size: 19px; }
  .contact-page .contact-directory-note { padding-top: 20px; }
  .contact-page .findus { padding: 48px 0 54px; }
  .contact-page .findus-points { grid-template-columns: 1fr; gap: 18px; }
}
