/* ── Back-to-top button: bottom-right, shown after one screen of scrolling; sits above the capacity pill when that is switched on ── */
.back-to-top {
  position: fixed;
  right: 1.5rem;
  bottom: 1.5rem;
  z-index: 90; /* under the mobile menu (99+) and the lightbox (200) */
  width: 2.75rem;
  height: 2.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid var(--stone);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.92);
  color: var(--charcoal);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity 0.3s ease, transform 0.3s ease, visibility 0s linear 0.3s, background 0.2s ease, color 0.2s ease;
}
.back-to-top[hidden] { display: none; }
.back-to-top.visible { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.back-to-top:hover { background: var(--warm); border-color: var(--warm); color: #fff; }
.back-to-top:focus-visible { outline: 2px solid var(--warm); outline-offset: 3px; }
.back-to-top svg { width: 1.25rem; height: 1.25rem; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }

body:has(.capacity-pill) .back-to-top { bottom: 5.25rem; }

@media (max-width: 768px) {
  body:has(.capacity-pill) .back-to-top { bottom: calc(8.25rem + env(safe-area-inset-bottom)); }
  /* raised to clear the Netlify "Powered by" badge in the bottom-right corner */
  .back-to-top { right: 1rem; bottom: calc(4.5rem + env(safe-area-inset-bottom)); width: 2.5rem; height: 2.5rem; }
}