@keyframes logoSpin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes slideUpFade { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
@keyframes sacredSpin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes glowPulse { 0%,100% { opacity: .65; } 50% { opacity: 1; } }
.animate-in { animation: slideUpFade .7s cubic-bezier(.22,1,.36,1) both; }
.stagger-2 { animation-delay: .12s; }
#particle-canvas { position: fixed; inset: 0; width: 100%; height: 100%; z-index: -2; pointer-events: none; }
.preloader { position: fixed; inset: 0; z-index: 9999; display: grid; place-items: center; background: #04060f; transition: opacity .6s ease, visibility .6s ease; }
.preloader.hidden { opacity: 0; visibility: hidden; pointer-events: none; }
.preloader-ring { width: 56px; height: 56px; border: 2px solid rgba(124,77,170,.25); border-top-color: #00c9b1; border-radius: 50%; animation: sacredSpin 1.1s linear infinite; }
.preloader-text { position: absolute; margin-top: 96px; font-family: var(--font-heading); font-size: .7rem; letter-spacing: .3em; text-transform: uppercase; color: rgba(232,232,255,.45); animation: glowPulse 2s ease-in-out infinite; }