/* utilities.css — single-purpose helpers and JS-driven state classes */

.visually-hidden {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

/* Inline SVG sprite container — symbols stay referenceable */
.svg-sprite {
    position: absolute;
    inline-size: 0;
    block-size: 0;
    overflow: hidden;
}

/* Keep short units (e.g. year ranges) on one line */
.nowrap { white-space: nowrap; }

/* Body scroll lock while the mobile drawer is open */
.is-scroll-locked,
.is-scroll-locked body { overflow: hidden; }

/* Reveal-on-scroll (js/shared/animations.js). Only elements below the fold at load
   are hidden, so nothing flashes and content stays visible without JavaScript. */
.is-reveal-pending {
    opacity: 0;
    translate: 0 var(--reveal-distance);
}

.is-reveal-pending.is-revealed {
    opacity: 1;
    translate: 0 0;
    transition:
        opacity var(--duration-reveal) ease var(--reveal-delay, 0ms),
        translate var(--duration-reveal) ease var(--reveal-delay, 0ms);
}

/* 80 ms stagger inside a grid */
.reveal-group > :nth-child(2) { --reveal-delay: 80ms; }
.reveal-group > :nth-child(3) { --reveal-delay: 160ms; }
.reveal-group > :nth-child(4) { --reveal-delay: 240ms; }
.reveal-group > :nth-child(5) { --reveal-delay: 320ms; }
.reveal-group > :nth-child(6) { --reveal-delay: 400ms; }
.reveal-group > :nth-child(7) { --reveal-delay: 480ms; }
.reveal-group > :nth-child(8) { --reveal-delay: 560ms; }
.reveal-group > :nth-child(9) { --reveal-delay: 640ms; }