/* Shared motion styles for the 3D designs. Tint with --cur (cursor) and --cur-hot. */
.has-cursor, .has-cursor a, .has-cursor button { cursor: none; }
.cur-dot, .cur-ring { position: fixed; top: 0; left: 0; z-index: 2000; pointer-events: none; border-radius: 50%; }
.cur-dot { width: 6px; height: 6px; margin: -3px 0 0 -3px; background: var(--cur, #fff); }
.cur-ring { width: 38px; height: 38px; margin: -19px 0 0 -19px; border: 1.5px solid var(--cur, #fff); transition: width .25s, height .25s, margin .25s, background .25s, border-color .25s; mix-blend-mode: difference; }
.cur-ring.is-hot { width: 74px; height: 74px; margin: -37px 0 0 -37px; background: var(--cur-hot, rgba(255, 255, 255, .9)); border-color: transparent; }
.pf-lb-open .cur-dot, .pf-lb-open .cur-ring { z-index: 2001; }

/* Word reveal: add data-split to a text element; it animates when it (or an ancestor) gets .is-in. */
[data-split] .w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .08em; margin-bottom: -.08em; }
[data-split] .wi { display: inline-block; transform: translateY(105%) rotate(6deg); transform-origin: 0 100%; transition: transform .9s cubic-bezier(.2, .8, .2, 1); transition-delay: calc(var(--i) * 45ms); }
.is-in[data-split] .wi, .is-in [data-split] .wi { transform: none; }

.mag { transition: transform .35s cubic-bezier(.2, .8, .2, 1); will-change: transform; }

.rm [data-split] .wi { transform: none; transition: none; }
@media (prefers-reduced-motion: reduce) { [data-split] .wi { transform: none; transition: none; } }
