/* ============================================================
   GO TO TOP BUTTON (same behaviour as medarch.com)
   ============================================================ */
#gotoTop {
  position: fixed;
  right: 24px;
  bottom: 24px;
  width: 44px;
  height: 44px;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: #1F578F;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);
  transition: opacity .25s ease, transform .25s ease, background .25s ease, visibility .25s;
  z-index: 1050; /* above sticky nav (1040) and offcanvas (1045) */
}

#gotoTop.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

#gotoTop:hover,
#gotoTop:focus {
  background: #163D65;
  outline: none;
}

#gotoTop:focus-visible {
  box-shadow: 0 0 0 3px rgba(31, 87, 143, 0.4);
}

@media (max-width: 576px) {
  #gotoTop {
    right: 16px;
    bottom: 16px;
    width: 40px;
    height: 40px;
  }
}

@media (prefers-reduced-motion: reduce) {
  #gotoTop { transition: opacity .15s ease, visibility .15s; transform: none; }
  #gotoTop.is-visible { transform: none; }
}

/* Keep the Go-to-top button clear of the sticky CTA bar,
   which is fixed to the bottom of the viewport below 992px. */
@media (max-width: 991.98px) {
  #gotoTop { bottom: 86px; }
}