/* Shared responsive behaviour for every public page. */
html { overflow-x: clip; }
body { min-width: 0; }
.site-nav-shell { position: relative; }
.site-mobile-menu-button { display: none; width: 2.75rem; height: 2.75rem; align-items: center; justify-content: center; flex: 0 0 auto; border: 1px solid rgba(118,118,129,.22); border-radius: .75rem; color: #021451; background: rgba(255,255,255,.78); transition: background-color 200ms ease, transform 200ms ease; }
.site-mobile-menu-button:active { transform: scale(.96); }
.site-mobile-menu-button:focus-visible, .site-mobile-menu a:focus-visible { outline: 3px solid rgba(0,105,109,.35); outline-offset: 2px; }
.site-mobile-menu { display: none; }

@media (max-width: 1279px) {
  .site-mobile-menu-button { display: inline-flex; }
  .site-mobile-menu { position: absolute; top: calc(100% + .5rem); right: 1.5rem; left: 1.5rem; display: grid; gap: .25rem; max-height: calc(100dvh - 6rem); padding: .75rem; overflow-y: auto; border: 1px solid rgba(198,197,209,.45); border-radius: 1rem; background: rgba(255,255,255,.97); box-shadow: 0 1.5rem 3rem rgba(11,28,48,.14); opacity: 0; visibility: hidden; transform: translateY(-.5rem); transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease; }
  .site-mobile-menu.is-open { opacity: 1; visibility: visible; transform: translateY(0); }
  .site-mobile-menu a { display: flex; min-height: 2.75rem; align-items: center; padding: .65rem .8rem; border-radius: .65rem; color: #334155; font-size: .95rem; font-weight: 500; }
  .site-mobile-menu a:hover, .site-mobile-menu a.is-active { color: #021451; background: #eff4ff; }
  .site-mobile-menu .site-mobile-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .5rem; margin-top: .5rem; padding-top: .75rem; border-top: 1px solid rgba(198,197,209,.35); }
  .site-mobile-menu .site-mobile-actions a { justify-content: center; text-align: center; }
}

@media (max-width: 767px) {
  body:has(> .md\:hidden.fixed.bottom-0) { padding-bottom: 4.5rem; }
  nav.fixed.top-0 > .site-nav-shell { min-height: 4.25rem; padding: .7rem 1rem !important; gap: .75rem; }
  nav.fixed.top-0 .site-brand { max-width: calc(100vw - 5.5rem); overflow: hidden; font-size: 1.15rem !important; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
  nav.fixed.top-0 .site-nav-actions > a { display: none; }
  .site-mobile-menu { right: .75rem; left: .75rem; }
  .site-mobile-menu .site-mobile-actions { grid-template-columns: 1fr; }
  main.pt-20, main.pt-24, main.pt-32 { padding-top: 4.25rem !important; }
  .px-8 { padding-right: 1rem !important; padding-left: 1rem !important; }
  .p-8, .p-10, .p-12 { padding: 1.5rem !important; }
  .py-20, .py-24 { padding-top: 4rem !important; padding-bottom: 4.25rem !important; }
  .mb-20, .mb-24 { margin-bottom: 4rem !important; }
  .gap-12, .gap-16, .gap-20 { gap: 2rem !important; }
  .text-5xl, .text-6xl, .text-7xl { font-size: clamp(2.35rem,11vw,3rem) !important; line-height: 1.08 !important; letter-spacing: -.035em; }
  h1 br { display: none; }
  section[class*="min-h-["] { min-height: auto !important; padding-top: 3.5rem; padding-bottom: 4rem; }
  .h-\[400px\], .h-\[500px\] { height: min(22rem,105vw) !important; }
  .rounded-\[2rem\], .rounded-\[3rem\] { border-radius: 1.25rem !important; }
  #obstetrics > div.absolute.inset-0 { opacity: 1 !important; background: linear-gradient(to top,rgba(2,20,81,.9),rgba(2,20,81,.08)) !important; }
  #obstetrics > div.absolute.bottom-0 { padding: 1.5rem !important; color: white !important; }
  #obstetrics .opacity-0 { opacity: 1 !important; }
  #obstetrics a { color: white !important; }
  a.group.flex.items-center.justify-between, a.group.bg-secondary, a.bg-primary.flex.items-center.justify-between { align-items: flex-start !important; gap: 1rem; }
  a.group.bg-secondary > div.flex { align-items: flex-start; gap: 1rem; }
  footer .grid { gap: 2rem !important; }
}

@media (prefers-reduced-motion: reduce) {
  .site-mobile-menu, .site-mobile-menu-button { transition: none; }
}

@media (max-width: 767px) {
  [class~="-right-8"], [class~="-right-10"], [class~="-right-20"] { right: 0 !important; }
  [class~="-left-8"], [class~="-left-10"], [class~="-left-20"] { left: 0 !important; }
}

@media (max-width: 767px) {
  [class~="-inset-4"] { inset: 0 !important; }
}

@media (max-width: 1279px) {
  [class~="-right-8"], [class~="-right-10"], [class~="-right-20"] { right: 0 !important; }
  [class~="-left-8"], [class~="-left-10"], [class~="-left-20"] { left: 0 !important; }
}
