/* HPL: reveal each content block once, without changing its layout. */
:root { --hpl-reveal-ready: 1; }

@media (prefers-reduced-motion: no-preference) {
    .hpl-reveal-pending {
        opacity: 0;
        translate: 0 28px;
    }

    .hpl-reveal-pending.hpl-reveal-visible {
        opacity: 1;
        translate: 0 0;
        transition: opacity 900ms cubic-bezier(.22, 1, .36, 1),
                    translate 900ms cubic-bezier(.22, 1, .36, 1);
        transition-delay: var(--hpl-reveal-delay, 0ms);
    }
}

@media print {
    .hpl-reveal-pending {
        opacity: 1 !important;
        translate: none !important;
        transition: none !important;
    }
}