/* Base reveal state */
.reveal {
  opacity: 0;
  transform: translateY(12px) scale(0.98);
  transition: opacity .5s ease, transform .6s cubic-bezier(.22,.61,.36,1);
  will-change: opacity, transform;
}

/* When in view */
.reveal.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* Make sure keyboard users can see focus */
:focus {
  outline: 3px solid #0a7; /* adjust to brand color w/ 3:1 contrast against background */
  outline-offset: 3px;
}

/* Hide skip links until focused, but keep them for screen readers */
.skip-link {
  position: absolute;
  top: -40px;
  left: 0;
  background: #fff;
  padding: .5rem .75rem;
  box-shadow: 0 2px 8px rgba(0,0,0,.15);
  border-radius: .5rem;
}
.skip-link:focus {
  top: .5rem;
}

/* Respect users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
  .reveal {
    transition: none;
    transform: none !important;
    opacity: 1 !important;
  }
}