/* =============================================================================
 * Critical above-fold CSS — render-blocking, loaded before the main bundle.
 * Prevents two FOUC issues:
 *   1. The skip-link briefly appearing at the top of the page before the
 *      main stylesheet positions it off-screen.
 *   2. `.reveal` elements popping in when the IntersectionObserver fires
 *      after first paint.
 * Keep this file minimal — only first-paint essentials.
 * ============================================================================= */

.skip-link {
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(-120%);
    z-index: 1000;
}
.skip-link:focus,
.skip-link:focus-visible {
    transform: translateY(0);
}

/* Reveal-on-scroll initial state. Items become visible via JS adding
 * `.is-visible`. Above-fold items are pre-marked visible by main.js,
 * so they never flicker. */
.reveal {
    opacity: 0;
    transform: translateY(28px);
}
.reveal.is-visible {
    opacity: 1;
    transform: none;
}

/* If the user has reduced motion or JS is disabled, show everything. */
@media (prefers-reduced-motion: reduce) {
    .reveal { opacity: 1; transform: none; }
}
@media (scripting: none) {
    .reveal { opacity: 1; transform: none; }
}
