/* View Transitions — MPA cross-fade (Chrome 111+, no-op in Firefox/Safari) */
@view-transition {
  navigation: auto;
}

/* Named elements for cross-fade continuity */
.activity-hero-image {
  view-transition-name: activity-hero;
}

.site-logo {
  view-transition-name: site-logo;
}

/* Respect reduced-motion */
@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(*),
  ::view-transition-new(*) {
    animation: none !important;
  }
}

/* Accessible visually-hidden utility: present for screen readers / a11y
   landmarks (e.g. a single page <h1> on island pages) but off-screen.
   Defined globally here because plain Django templates use it outside the
   React bundle that scopes its own copy. */
.visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}