.pbx-effects {
    --pbx-motion-duration: 900ms;
    --pbx-motion-delay: 0ms;
    --pbx-motion-easing: cubic-bezier(.22, 1, .36, 1);
    --pbx-hover-strength: 8px;
    --pbx-hover-grow: 1.08;
    --pbx-hover-shrink: .943;
    backface-visibility: hidden;
    will-change: auto;
}

.pbx-effects.is-pbx-animated,
.pbx-effects[data-pbx-hover] {
    transition-duration: var(--pbx-motion-duration);
    transition-property: opacity, transform, filter, box-shadow;
    transition-timing-function: var(--pbx-motion-easing);
}

.pbx-effects.is-pbx-animated {
    transition-delay: var(--pbx-motion-delay);
    will-change: opacity, transform, filter;
}

.pbx-effects.is-pbx-animated:not(.is-pbx-visible) {
    opacity: 0;
}

.pbx-effects[data-pbx-entrance="fade-up"]:not(.is-pbx-visible),
.pbx-effects[data-pbx-entrance="blur-up"]:not(.is-pbx-visible) {
    transform: translate3d(0, 48px, 0);
}

.pbx-effects[data-pbx-entrance="fade-down"]:not(.is-pbx-visible) {
    transform: translate3d(0, -48px, 0);
}

.pbx-effects[data-pbx-entrance="fade-start"]:not(.is-pbx-visible) {
    transform: translate3d(48px, 0, 0);
}

.pbx-effects[data-pbx-entrance="fade-end"]:not(.is-pbx-visible) {
    transform: translate3d(-48px, 0, 0);
}

.pbx-effects[data-pbx-entrance="zoom-in"]:not(.is-pbx-visible) {
    transform: scale(.84);
}

.pbx-effects[data-pbx-entrance="zoom-out"]:not(.is-pbx-visible) {
    transform: scale(1.16);
}

.pbx-effects[data-pbx-entrance="flip-x"]:not(.is-pbx-visible) {
    transform: perspective(900px) rotateX(55deg);
}

.pbx-effects[data-pbx-entrance="flip-y"]:not(.is-pbx-visible) {
    transform: perspective(900px) rotateY(55deg);
}

.pbx-effects[data-pbx-entrance="blur-up"]:not(.is-pbx-visible) {
    filter: blur(16px);
}

.pbx-effects.is-pbx-visible {
    opacity: 1;
    filter: none;
    transform: none;
}

.pbx-effects[data-pbx-hover="lift"]:hover {
    transform: translate3d(0, calc(var(--pbx-hover-strength) * -1), 0);
}

.pbx-effects[data-pbx-hover="grow"]:hover {
    transform: scale(var(--pbx-hover-grow));
}

.pbx-effects[data-pbx-hover="shrink"]:hover {
    transform: scale(var(--pbx-hover-shrink));
}

.pbx-effects[data-pbx-hover="glow"]:hover {
    box-shadow: 0 18px 54px color-mix(in srgb, currentColor 28%, transparent);
    filter: brightness(1.06);
}

.pbx-effects[data-pbx-hover="float"]:hover {
    animation: pbx-float 1.8s ease-in-out infinite;
}

.pbx-effects[data-pbx-hover="tilt"] {
    transform-style: preserve-3d;
}

.pbx-effects.is-pbx-motion-disabled {
    animation: none !important;
    filter: none !important;
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    translate: none !important;
}

@keyframes pbx-float {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(0, calc(var(--pbx-hover-strength) * -1), 0); }
}

@media (prefers-reduced-motion: reduce) {
    .pbx-effects {
        animation: none !important;
        filter: none !important;
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
        translate: none !important;
    }
}

/*
    An entrance effect is a scroll affordance, and printing has no scroll. Without this the
    printed page — and every "save as PDF" — comes out with the sections the reader never
    scrolled past left blank, which is a far worse outcome than losing the animation.
*/
@media print {
    .pbx-effects {
        opacity: 1 !important;
        transform: none !important;
        translate: none !important;
        filter: none !important;
        transition: none !important;
    }
}