/* PAN Engineers - Scroll reveal (see assets/js/scroll-fx.js)
 * Only active when the script adds html.fx-on, so without JavaScript everything stays visible.
 * Every class below is removed from an element once its animation finishes. */
html.fx-on section { overflow-x: clip; }   /* sliding blocks never create a horizontal scrollbar */

html.fx-on .fx {
    opacity: 0 !important;
    transition: opacity .85s cubic-bezier(.22, 1, .36, 1), transform .85s cubic-bezier(.22, 1, .36, 1) !important;
    transition-delay: var(--fx-d, 0ms) !important;
    will-change: transform, opacity;
}
html.fx-on .fx.fx-l { transform: translate3d(-96px, 0, 0) !important; }
html.fx-on .fx.fx-r { transform: translate3d(96px, 0, 0) !important; }
html.fx-on .fx.fx-b { transform: translate3d(0, 60px, 0) !important; }
html.fx-on .fx.fx-in { opacity: 1 !important; transform: none !important; }
html.fx-on .fx.fx-instant { transition: none !important; }

@media (max-width: 768px) {
    html.fx-on .fx.fx-l { transform: translate3d(-44px, 0, 0) !important; }
    html.fx-on .fx.fx-r { transform: translate3d(44px, 0, 0) !important; }
    html.fx-on .fx.fx-b { transform: translate3d(0, 36px, 0) !important; }
}
@media (prefers-reduced-motion: reduce) {
    html.fx-on .fx { opacity: 1 !important; transform: none !important; transition: none !important; }
}