/* Contact page; brand, navigation and footer are shared with the home page. */
.page-contact .primary-nav { gap: 27px; margin-left: 12px; }
.contact-hero { position: relative; isolation: isolate; overflow: hidden; background: var(--navy); color: white; }
.contact-hero-photo { position: absolute; inset: -2% -1% -2% 31%; z-index: -2; background: url('../img/contact-hero-photo.jpg') center / cover no-repeat; mask-image: linear-gradient(90deg, transparent, #000 19%); }
.contact-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, #00243d 10%, #00243df0 30%, #00243d4d 48%, transparent 62%); }
.contact-hero-inner { min-height: 360px; padding-block: 62px 34px; }
.contact-hero h1 { font-family: var(--body); font-size: 57px; font-weight: 800; letter-spacing: -1.7px; }
.contact-hero-lead { font-size: 27px; font-weight: 600; line-height: 1.2; margin-top: 14px; }
.contact-hero-description { font-size: 18px; line-height: 1.4; margin-top: 19px; }
.contact-content { margin-block: 18px; }
.contact-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; }
.contact-card { background: #eff6fb; border-radius: 4px; padding: 17px 16px 23px; text-align: center; }
.contact-disc { width: 61px; height: 61px; display: grid; place-items: center; margin: 0 auto 10px; border-radius: 50%; background: var(--navy); color: white; }
.contact-disc .icon { width: 37px; height: 37px; }
.contact-card h2 { font: 700 22px/1.2 var(--body); text-transform: none; margin-bottom: 9px; }
.contact-value { display: block; font-size: 22px; font-weight: 700; line-height: 1.2; }
.contact-card p:not(.contact-value) { font-size: 18px; line-height: 1.3; margin-top: 11px; }
.contact-card a.contact-value:hover { color: var(--red); text-decoration: underline; }
.contact-social-icons { display: flex; gap: 15px; justify-content: center; }
.contact-social-icons .contact-disc { margin-inline: 0; }
.contact-social-icons a:hover { background: var(--red); }
.contact-main-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-top: 20px; align-items: stretch; }
.contact-map-column { min-width: 0; grid-column: 1; grid-row: 1 / 3; display: flex; }
.contact-map-column .live-map { flex: 1; display: flex; flex-direction: column; }
.contact-map-column #location-map { flex: 1; min-height: 315px; }
.contact-main-grid > .locations-copy { grid-column: 2; grid-row: 1; padding-top: 0; }
.contact-main-grid > .contact-message-panel { grid-column: 2; grid-row: 2; }
.live-map { border: 1px solid #dbe3eb; border-radius: 5px; overflow: hidden; background: #edf3f7; }
.map-legend { display: flex; flex-wrap: wrap; gap: 10px 20px; padding: 15px; background: #f0f7fc; font-size: 15px; font-weight: 600; }
.map-legend span { display: flex; align-items: center; gap: 7px; }
.map-dot { width: 11px; height: 11px; border-radius: 50%; background: currentColor; }
#location-map { display: block; position: relative; isolation: isolate; z-index: 0; border: 0; width: 100%; height: 315px; font-family: var(--body); }
.map-fallback { padding: 24px; font-size: 16px; line-height: 1.5; }
.venue-pin { background: none; border: 0; }
.venue-pin svg { width: 34px; height: 42px; filter: drop-shadow(0 2px 2px #0005); }
.venue-label { color: var(--ink); font: 700 14px var(--body); border: 0; padding: 6px 10px; box-shadow: 0 2px 8px #00243d26; }
#location-map .leaflet-popup-content { font: 16px/1.5 var(--body); }
#location-map .leaflet-popup-content a { color: var(--ink); text-decoration: underline; }
.locations-copy { padding: 21px 8px 3px; }
.locations-copy h2, .contact-message-panel h2 { font: 700 26px/1.2 var(--body); text-transform: none; letter-spacing: -.6px; }
.locations-copy .red-rule, .contact-message-panel .red-rule { width: 38px; height: 4px; margin-block: 10px 16px; }
.location-entry { display: flex; align-items: flex-start; gap: 14px; margin-top: 17px; }
.location-entry > .icon { width: 34px; height: 38px; }
.location-red { color: var(--red); }.location-green { color: #237949; }
.location-entry h3 { font-size: 18px; line-height: 1.2; margin-bottom: 4px; }
.location-entry address { font-style: normal; font-size: 16px; line-height: 1.35; }
.location-entry p { font-size: 14px; margin-top: 4px; }
.location-entry a { display: inline-block; font-size: 14px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; margin-top: 6px; }
.location-entry a:hover { color: var(--red); }
.contact-message-panel { display: flex; flex-direction: column; border: 1px solid #dee5eb; border-radius: 5px; padding: 24px; background: #f8fbfd; }
.contact-message-panel > p { font-size: 17px; line-height: 1.4; margin-bottom: 22px; }
#contact-form { display: flex; flex-direction: column; gap: 18px; flex: 1; }
.contact-field label { display: block; font-size: 16px; margin-bottom: 6px; }
.contact-field label span { color: var(--red); font-weight: 700; }
.contact-field input, .contact-field textarea { width: 100%; min-width: 0; border: 1px solid #c9d2dc; background: white; border-radius: 3px; padding: 10px 12px; color: var(--ink); font: 16px/1.4 var(--body); }
.contact-field input { min-height: 44px; }
.contact-field input:focus, .contact-field textarea:focus { outline: 2px solid #2466a3; outline-offset: 1px; border-color: #2466a3; }
.contact-message-field { flex: 1; display: flex; flex-direction: column; }
.contact-field textarea { flex: 1; resize: vertical; min-height: 180px; }
.contact-field textarea::placeholder { color: #73808c; opacity: 1; }
.contact-submit { border: 0; width: 100%; cursor: pointer; min-height: 54px; font-size: 23px; }
.contact-submit .icon { width: 27px; height: 27px; }
.contact-form-status { background: #e9f2f9; border-left: 3px solid var(--navy); padding: 12px; font-size: 15px; }
.contact-form-status[hidden] { display: none; }
.contact-banner { color: white; background: var(--navy); position: relative; isolation: isolate; overflow: hidden; }
.contact-banner::before { content: ''; position: absolute; z-index: -2; inset: -4% -1% -4% 25%; background: url('../img/contact-bottom-cta.jpg') center 58% / cover; }
.contact-banner::after { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg,#00243def 8%,#00243d9c 35%,transparent 70%); }
.contact-banner .wrap { padding-block: 30px; min-height: 175px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.banner-title { font-size: 39px; font-weight: 700; font-style: italic; line-height: 1.2; }
.banner-subtitle { font-size: 26px; font-weight: 600; font-style: italic; margin-top: 6px; }
.banner-stroke { display: block; width: 190px; height: 6px; background: var(--red); transform: rotate(-8deg); margin: 10px 0 0 290px; clip-path: polygon(0 40%,100% 0,92% 65%,0 100%); }
@media(max-width:1150px) {
  .page-contact .primary-nav { gap: 21px; margin-left: 0; }.page-contact .header-inner { gap: 19px; }.page-contact .header-cta { min-width: 142px; }
  .contact-hero-inner { min-height: 335px; padding-block: 53px 30px; }.contact-hero h1 { font-size: 49px; }.contact-hero-lead { font-size: 24px; }.contact-hero-description { font-size: 17px; }
  .contact-card { padding: 15px 12px 20px; }.contact-card h2 { font-size: 20px; }.contact-value { font-size: 19px; }.contact-card p:not(.contact-value) { font-size: 16px; }.contact-disc { width: 55px; height: 55px; }.contact-disc .icon { width: 33px; height: 33px; }
  .contact-main-grid { gap: 18px; }.contact-message-panel { padding: 20px; }.locations-copy h2, .contact-message-panel h2 { font-size: 24px; }.location-entry h3 { font-size: 17px; }.banner-title { font-size: 35px; }.banner-subtitle { font-size: 23px; }
}
@media(min-width:701px) and (max-width:950px) {
  .page-contact .primary-nav { gap: 15px; margin-left: auto; }.page-contact .header-cta { display: none; }
  .contact-cards { grid-template-columns: repeat(2,minmax(0,1fr)); }.contact-main-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
  .contact-hero-photo { left: 20%; }.contact-hero::after { background: linear-gradient(90deg,#00243d 5%,#00243df0 33%,#00243d45 65%,transparent); }
  .contact-hero h1 { font-size: 44px; }.contact-hero-description { max-width: 420px; }.contact-hero-description .desktop-break { display: none; }
}
@media(max-width:700px) {
  .contact-map-column, .contact-main-grid > .locations-copy, .contact-main-grid > .contact-message-panel { grid-column: auto; grid-row: auto; }
  .contact-map-column #location-map { flex: none; min-height: 300px; height: 300px; }
  .page-contact .primary-nav { gap: 0; margin-left: 0; }
  .contact-hero-photo { inset: -2% -2% -2% -30%; background-position: 63% center; mask-image: none; }.contact-hero::after { background: linear-gradient(0deg,#00243df7 5%,#00243dce 40%,#00243d00 95%); }
  .contact-hero-inner { min-height: 490px; padding-block: 215px 30px; }.contact-hero h1 { font-size: clamp(32px,8.6vw,48px); letter-spacing: -1px; }.contact-hero-lead { font-size: 23px; }.contact-hero-description { font-size: 16px; }
  .contact-content { margin-block: 16px; }.contact-cards { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }.contact-card { padding: 16px 10px 20px; }.contact-card h2 { font-size: 17px; }.contact-value { font-size: 16px; overflow-wrap: anywhere; }.contact-card p:not(.contact-value) { font-size: 14px; }.contact-disc { width: 46px; height: 46px; }.contact-disc .icon { width: 28px; height: 28px; }.contact-social-icons { gap: 9px; }
  .contact-main-grid { grid-template-columns: 1fr; gap: 23px; }.map-legend { font-size: 14px; gap: 10px 16px; }#location-map { height: 300px; }.locations-copy { padding: 21px 2px 0; }.location-entry { gap: 10px; }.location-entry h3 { font-size: 17px; }.location-entry address { font-size: 15px; }
  .contact-message-panel { padding: 22px 17px; }.contact-message-panel h2 { font-size: 23px; }.contact-message-panel > p { font-size: 16px; }.contact-field textarea { min-height: 160px; }.contact-submit { font-size: 22px; }
  .contact-banner::before { inset: -4% -30% -4% -10%; }.contact-banner::after { background: linear-gradient(90deg,#00243ddc,#00243d65); }.contact-banner .wrap { min-height: 168px; }.banner-title { font-size: 27px; }.banner-subtitle { font-size: 19px; }.banner-stroke { width: 140px; margin-left: 140px; }
  .page-contact .footer-bottom nav { flex-wrap: wrap; justify-content: flex-start; row-gap: 12px; }.page-contact .footer-bottom nav a+a { margin-left: 10px; padding-left: 10px; }
}
@media(max-width:370px) { .contact-cards { grid-template-columns: 1fr; }.contact-value { font-size: 20px; }.contact-card p:not(.contact-value) { font-size: 16px; }.contact-message-panel h2 { font-size: 22px; }.banner-title { font-size: 24px; }.banner-subtitle { font-size: 17px; }.banner-stroke { margin-left: 105px; } }
