/* ============================================================
   23-totop — "Back to top" button, fixed bottom-right on every page
   (markup lives at the end of 14-footer.html). Appears after the
   first screenful; sits above the mobile Call/Book bar (<=820px)
   and below the nav and its mobile overlay. Scoped under .sec-23-totop.
   ============================================================ */

.sec-23-totop {
  position: fixed;
  right: clamp(16px, 2.5vw, 28px);
  bottom: clamp(16px, 2.5vw, 28px);
  z-index: 170; /* under the mobile bar (180) and nav (200/210) */
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  padding: 0;
  border-radius: 50%;
  border: 1.5px solid hsl(0 0% 100% / 0.4);
  background: var(--accent);
  color: var(--accent-on);
  /* dark shadow + light rim keep it visible on both ink and bone sections */
  box-shadow: 0 10px 26px hsl(210 45% 8% / 0.35), 0 0 0 1px hsl(210 45% 8% / 0.12);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);
  transition: opacity 300ms var(--ease-out), transform 300ms var(--ease-out),
    visibility 300ms, background-color 200ms var(--ease-out), bottom 300ms var(--ease-out);
}

.sec-23-totop.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.sec-23-totop:hover,
.sec-23-totop:focus-visible {
  background: var(--accent-strong);
}
.sec-23-totop.is-visible:hover {
  transform: translateY(-2px);
}

.sec-23-totop:focus-visible {
  outline: 3px solid hsl(0 0% 100% / 0.95);
  outline-offset: 3px;
  box-shadow: 0 0 0 7px var(--accent), 0 10px 26px hsl(210 45% 8% / 0.35);
}

/* Mobile/tablet: lift above the sticky Call | Book bar (56px + safe area) */
@media (max-width: 820px) {
  .sec-23-totop {
    right: 14px;
    bottom: calc(56px + env(safe-area-inset-bottom) + 14px);
    width: 44px;
    height: 44px;
  }
  /* When the bar slides away (booking in view), drop back to the corner */
  body:has(.sec-17-mobilebar.is-hidden) .sec-23-totop {
    bottom: calc(14px + env(safe-area-inset-bottom));
  }
}

/* Never float over the open mobile menu */
body.sec-01-nav-lock .sec-23-totop {
  opacity: 0;
  visibility: hidden;
}

@media (prefers-reduced-motion: reduce) {
  .sec-23-totop { transition: none; }
}
html.reduced-motion .sec-23-totop { transition: none; transform: none; }
