/* ── Background floating animations for welcome page ── */

@keyframes float-1 { 0%, 100% { transform: translate(0, 0) rotate(-12deg); } 50% { transform: translate(8px, -14px) rotate(-10deg); } }
@keyframes float-2 { 0%, 100% { transform: translate(0, 0) rotate(8deg); } 50% { transform: translate(-10px, -10px) rotate(10deg); } }
@keyframes float-3 { 0%, 100% { transform: translate(0, 0) rotate(-20deg); } 50% { transform: translate(6px, 12px) rotate(-18deg); } }
@keyframes float-4 { 0%, 100% { transform: translate(0, 0) rotate(15deg); } 50% { transform: translate(-8px, 8px) rotate(17deg); } }
@keyframes float-5 { 0%, 100% { transform: translate(0, 0) rotate(25deg); } 50% { transform: translate(6px, -6px) rotate(27deg); } }
@keyframes float-6 { 0%, 100% { transform: translate(0, 0) rotate(-30deg); } 50% { transform: translate(-5px, 10px) rotate(-28deg); } }
@keyframes float-7 { 0%, 100% { transform: translate(0, 0) rotate(40deg); } 50% { transform: translate(9px, -8px) rotate(42deg); } }
@keyframes float-8 { 0%, 100% { transform: translate(0, 0) rotate(-10deg); } 50% { transform: translate(-6px, -9px) rotate(-8deg); } }
@keyframes float-9 { 0%, 100% { transform: translate(0, 0) rotate(-15deg); } 50% { transform: translate(10px, -12px) rotate(-13deg); } }
@keyframes float-10 { 0%, 100% { transform: translate(0, 0) rotate(20deg); } 50% { transform: translate(-9px, 6px) rotate(22deg); } }
@keyframes float-11 { 0%, 100% { transform: translate(0, 0) rotate(-8deg); } 50% { transform: translate(4px, -10px) rotate(-6deg); } }
@keyframes float-12 { 0%, 100% { transform: translate(0, 0) rotate(25deg); } 50% { transform: translate(-7px, -5px) rotate(27deg); } }
@keyframes float-13 { 0%, 100% { transform: translate(0, 0) rotate(-20deg); } 50% { transform: translate(6px, 9px) rotate(-18deg); } }
@keyframes float-14 { 0%, 100% { transform: translate(0, 0) rotate(-5deg); } 50% { transform: translate(-4px, -11px) rotate(-3deg); } }
@keyframes float-15 { 0%, 100% { transform: translate(0, 0) rotate(30deg); } 50% { transform: translate(10px, 5px) rotate(32deg); } }
@keyframes float-16 { 0%, 100% { transform: translate(0, 0) rotate(0deg); } 50% { transform: translate(-5px, -8px) rotate(2deg); } }
@keyframes float-17 { 0%, 100% { transform: translate(0, 0) rotate(-12deg); } 50% { transform: translate(8px, 10px) rotate(-10deg); } }
@keyframes float-18 { 0%, 100% { transform: translate(0, 0) rotate(15deg); } 50% { transform: translate(-10px, -6px) rotate(17deg); } }
@keyframes float-19 { 0%, 100% { transform: translate(0, 0) rotate(-25deg); } 50% { transform: translate(4px, 8px) rotate(-23deg); } }
@keyframes float-20 { 0%, 100% { transform: translate(0, 0) rotate(10deg); } 50% { transform: translate(-6px, -10px) rotate(12deg); } }
@keyframes float-dot-1 { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(12px, -8px); } }
@keyframes float-dot-2 { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(-10px, 10px); } }
@keyframes float-dot-3 { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(8px, 12px); } }
@keyframes float-dot-4 { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(-12px, -6px); } }

.bg-float { animation-duration: 7s; animation-iteration-count: infinite; animation-timing-function: ease-in-out; will-change: transform; }
.bg-float-slow { animation-duration: 11s; animation-iteration-count: infinite; animation-timing-function: ease-in-out; will-change: transform; }
.bg-float-slower { animation-duration: 15s; animation-iteration-count: infinite; animation-timing-function: ease-in-out; will-change: transform; }

/* ── Mouse orb effect ── */
.m-orb {
    position: fixed;
    pointer-events: none;
    z-index: 9999;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}