/* Visible focus ring (only on keyboard navigation, not mouse clicks) */
:focus-visible {
  outline: 2px solid #C4542E;
  outline-offset: 3px;
  border-radius: 3px;
}
button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid #C4542E !important;
  outline-offset: 3px !important;
}

/* Skip-to-main-content link — visually hidden until focused */
.bh-skip {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 9999;
  padding: 10px 16px;
  background: #1A1108;
  color: #F5EFE3;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  border-radius: 4px;
  transform: translateY(-200%);
  transition: transform 0.2s;
}
.bh-skip:focus {
  transform: translateY(0);
}

/* Respect reduced-motion preferences globally */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  /* Reveal elements: skip the fade and translate entirely so content
     is visible even before the IntersectionObserver fires. Without this,
     reduced-motion users would see opacity:0 elements during Babel-in-
     browser compile cold-start. */
  .reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  /* Boffin character animations: stop fully (not mid-frame). The
     character is decorative — freezing it on its first paint pose
     reads as a static illustration, which is the correct reduced-
     motion behaviour. */
  .boffin-stage,
  .boffin-body,
  .boffin-arm-r,
  .boffin-eye-left,
  .boffin-eye-right,
  .boffin-pencil,
  .boffin-sparkle,
  .boffin-orbit-1,
  .boffin-orbit-2,
  .boffin-orbit-3,
  .pulse-dot,
  .blink {
    animation: none !important;
  }
}