/* 08. STATES / REVEALS / DECORATION */
@layer states {
/* States */
.reveal-up{opacity:0;transform:translateY(50px);transition:opacity var(--duration-slower) var(--ease-out),transform var(--duration-slower) var(--ease-out)}.reveal-up.visible{opacity:1;transform:translateY(0)}.reveal-fade{opacity:0;transition:opacity 1s var(--ease-out)}.reveal-fade.visible{opacity:1}.stagger-children>*{opacity:0;transform:translateY(30px);transition:opacity var(--duration-slow) var(--ease-out),transform var(--duration-slow) var(--ease-out)}.stagger-children.visible>*{opacity:1;transform:translateY(0)}.stagger-children.visible>*:nth-child(1){transition-delay:50ms}.stagger-children.visible>*:nth-child(2){transition-delay:100ms}.stagger-children.visible>*:nth-child(3){transition-delay:150ms}.stagger-children.visible>*:nth-child(4){transition-delay:200ms}.stagger-children.visible>*:nth-child(5){transition-delay:250ms}.stagger-children.visible>*:nth-child(6){transition-delay:300ms}.stagger-children.visible>*:nth-child(7){transition-delay:350ms}.stagger-children.visible>*:nth-child(8){transition-delay:400ms}.stagger-children.visible>*:nth-child(9){transition-delay:450ms}.stagger-children.visible>*:nth-child(10){transition-delay:500ms}.stagger-children.visible>*:nth-child(11){transition-delay:550ms}.stagger-children.visible>*:nth-child(12){transition-delay:600ms}.split-text{display:inline-block;overflow:hidden}.split-text .char{display:inline-block;transform:translateY(110%);opacity:0;transition:transform var(--duration-slower) var(--ease-out),opacity var(--duration-slow) var(--ease-out)}.split-text.in .char{transform:translateY(0);opacity:1}.mask-reveal{display:inline-block;overflow:hidden}.mask-reveal>span{display:inline-block;transform:translateY(100%);transition:transform .9s var(--ease-out)}.mask-reveal.in>span{transform:translateY(0)}.deco-symbol{position:absolute;pointer-events:none;color:var(--accent-primary);opacity:.15;font-family:var(--font-display);font-style:italic;animation:rotateSlow 30s linear infinite}
}
/* 09. KEYFRAMES  */
@layer motion {
@keyframes orbFloat1{0%,100%{transform:translate3d(0,0,0) scale(1)}33%{transform:translate3d(-40px,30px,0) scale(1.1)}66%{transform:translate3d(30px,-20px,0) scale(.95)}}@keyframes orbFloat2{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(60px,-40px,0)}}@keyframes orbFloat3{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(-30px,50px,0) scale(1.15)}}@keyframes heroReveal{to{transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes spinReverse{to{transform:rotate(-360deg)}}@keyframes marqueeScroll{to{transform:translateX(-50%)}}@keyframes logoPulse{to{box-shadow:0 0 20px var(--accent-primary),0 0 40px var(--accent-secondary)}}@keyframes statusPulse{0%{box-shadow:0 0 0 0 rgba(200,255,0,.6)}70%{box-shadow:0 0 0 10px rgba(200,255,0,0)}100%{box-shadow:0 0 0 0 rgba(200,255,0,0)}}@keyframes techSpin{to{transform:rotate(360deg)}}@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes rotateSlow{to{transform:rotate(360deg)}}
}