/* v7.5.4 — Mobile header centering + Contact buttons alignment */

/* --- Mobile header: center hospital name, keep menu toggle on the right --- */
@media (max-width: 768px){
  /* common gradient/brand bars we used in earlier builds */
  .brand-gradient, .brand-strip, .header-brandbar, .brandbar, .header-gradient {
    display:flex; align-items:center; justify-content:center; position:relative;
    min-height:56px;
  }
  .brand-gradient h1, .brand-gradient .brand-title, .brand-strip h1, .brandbar h1, .header-brandbar .brand-title, .site-name, .header-title{
    text-align:center; margin:0; line-height:1.2;
  }
  /* mobile nav toggle kept to the right without pushing title */
  .menu-toggle, #navToggle, .mobile-menu-toggle{
    position:absolute; right:12px; top:50%; transform:translateY(-50%);
  }
}

/* --- Contact page buttons row --- */
.contact-page .cta-row{
  display:flex; gap:12px; flex-wrap:wrap;
}
.contact-page .btn-cta{
  flex:1 1 32%;
  display:flex; align-items:center; justify-content:center;
  min-height:48px; padding:10px 14px; border-radius:14px;
  font-weight:700; text-decoration:none; cursor:pointer;
  border:1.5px solid var(--brand); background:#fff; color:#0f172a;
}
.contact-page .btn-cta.primary{ background:var(--brand); color:#fff }
.contact-page .btn-cta.ghost{ background:#fff; color:var(--brand) }

@media (max-width: 640px){
  .contact-page .container{ padding-left:16px; padding-right:16px }
  .contact-page .btn-cta{ flex:1 1 100% } /* stack full width on small phones */
}

/* prevent overlap with sticky bottom bar on mobile */
@media (max-width: 640px){
  .contact-page .page-wrap{ padding-bottom:90px }
}