/* Sorex opening animation (website, web app, desktop). */
.sx-intro { position: fixed; inset: 0; z-index: 9999; display: grid; place-items: center; background: #050506; overflow: hidden; pointer-events: none; }
.sx-intro::before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 50% 46%, rgba(34,197,94,.12), transparent 42%); opacity: 0; animation: sxGlow 1.6s .15s ease-out forwards; }
.sx-intro-inner { position: relative; display: flex; flex-direction: column; align-items: center; gap: 22px; }
.sx-intro-mark { position: relative; width: 92px; height: 92px; display: grid; place-items: center; }
.sx-intro-mark img { width: 84px; height: auto; opacity: 0; transform: scale(.82); filter: blur(10px) drop-shadow(0 0 0 rgba(34,197,94,0)); animation: sxMark 1s cubic-bezier(.2,.8,.2,1) .1s forwards; }
.sx-intro-mark::after { content: ''; position: absolute; inset: -18px; border-radius: 50%; border: 1px solid rgba(74,222,128,.55); opacity: 0; transform: scale(.6); animation: sxRing 1.1s cubic-bezier(.2,.8,.2,1) .45s forwards; }
.sx-intro-word { height: 18px; width: auto; clip-path: inset(0 100% 0 0); animation: sxWipe .7s cubic-bezier(.6,0,.2,1) .7s forwards; }
.sx-intro-bar { width: 120px; height: 2px; border-radius: 2px; background: rgba(255,255,255,.06); overflow: hidden; opacity: 0; animation: sxFade .3s 1.1s forwards; }
.sx-intro-bar i { display: block; width: 40%; height: 100%; background: linear-gradient(90deg, transparent, #4ade80, transparent); animation: sxSlide 1s ease-in-out infinite; }
.sx-intro.out { animation: sxOut .55s cubic-bezier(.6,0,.2,1) forwards; }
.sx-intro.out .sx-intro-inner { animation: sxZoom .55s cubic-bezier(.6,0,.2,1) forwards; }
@keyframes sxMark { to { opacity: 1; transform: none; filter: blur(0) drop-shadow(0 0 22px rgba(34,197,94,.45)); } }
@keyframes sxRing { 40% { opacity: .8; } to { opacity: 0; transform: scale(1.6); } }
@keyframes sxWipe { to { clip-path: inset(0 0 0 0); } }
@keyframes sxGlow { to { opacity: 1; } }
@keyframes sxFade { to { opacity: 1; } }
@keyframes sxSlide { from { transform: translateX(-100%); } to { transform: translateX(250%); } }
@keyframes sxOut { to { opacity: 0; visibility: hidden; } }
@keyframes sxZoom { to { transform: scale(1.08); filter: blur(6px); } }
@media (prefers-reduced-motion: reduce) { .sx-intro, .sx-intro * { animation-duration: .01s !important; animation-delay: 0s !important; } }