/* Only the contact page navy banner. Existing height/image are untouched. */
body[data-page="contact"] main > section.page-hero .mapsa-contact-call-wrap {
  position:relative; display:inline-block; max-width:100%; direction:rtl;
}
body[data-page="contact"] main > section.page-hero .mapsa-contact-call-trigger {
  font:inherit; font-size:inherit; line-height:inherit; color:#fff;
  background:rgba(0,17,43,.52); border:1px solid rgba(130,217,224,.7);
  border-radius:14px; padding:12px 26px; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center; gap:12px;
  max-width:100%; transition:background .2s,border-color .2s;
}
body[data-page="contact"] main > section.page-hero .mapsa-contact-call-trigger:hover,
body[data-page="contact"] main > section.page-hero .mapsa-contact-call-trigger:focus-visible {
  background:rgba(0,34,69,.88); border-color:#72dedc;
}
body[data-page="contact"] main > section.page-hero .mapsa-contact-call-trigger svg {
  width:27px; height:27px; flex:none; stroke:#71dedc; fill:none; stroke-width:1.8;
}
body[data-page="contact"] main > section.page-hero .mapsa-contact-call-panel[hidden] {display:none!important}
body[data-page="contact"] main > section.page-hero .mapsa-contact-call-panel {
  position:absolute; top:calc(100% + 12px); right:0; z-index:12;
  box-sizing:border-box; width:min(320px,calc(100vw - 32px));
  background:#061d3a; border:1px solid #5fbfca; border-radius:12px;
  box-shadow:0 12px 32px rgba(0,0,0,.3); padding:18px; color:#fff;
  font:500 15px/1.8 Tahoma,sans-serif; text-align:center;
}
body[data-page="contact"] main > section.page-hero .mapsa-contact-call-panel strong {
  display:block; direction:ltr; unicode-bidi:plaintext; font:700 21px/1.7 Arial,sans-serif;
  letter-spacing:.3px; margin:4px auto 12px;
}
body[data-page="contact"] main > section.page-hero .mapsa-contact-call-dial {
  display:block; padding:9px 18px; color:#001c37; background:#81e3df;
  border-radius:8px; font-weight:700; text-decoration:none;
}
body[data-page="contact"] main > section.page-hero .mapsa-contact-call-dial:hover {background:#a5f2ef}
body[data-page="contact"] main > section.page-hero .mapsa-contact-call-dial[hidden] {display:none!important}
@media(max-width:700px){
  body[data-page="contact"] main > section.page-hero .mapsa-contact-call-trigger {padding:8px 15px; gap:7px}
  body[data-page="contact"] main > section.page-hero .mapsa-contact-call-trigger svg {width:22px;height:22px}
  body[data-page="contact"] main > section.page-hero .mapsa-contact-call-panel {right:50%;transform:translateX(50%)}
}
