.particles{position:absolute;inset:0;overflow:hidden;pointer-events:none}.particle{position:absolute;width:3px;height:3px;background:var(--blue);opacity:.35;animation:drift var(--duration,8s) linear var(--delay,0s) infinite}.particle.sparkle-particle{width:auto;height:auto;background:none;font-size:11px}.particle.sparkle-particle::before{content:"✦"}.spark{animation:twinkle 3.6s ease-in-out infinite}.s2{animation-delay:-1.3s}.s3{animation-delay:-2.1s}

/* The content is uncovered by a crisp vertical edge, matching the original Sparkle concept. */
.reveal,body[class] .reveal{position:relative;opacity:0;transform:none;clip-path:inset(0 100% 0 0);transition:clip-path .95s cubic-bezier(.77,0,.18,1),opacity .12s linear;transition-delay:var(--reveal-delay,0s);will-change:clip-path}
.reveal::after,body[class] .reveal::after{content:"";position:absolute;z-index:12;top:0;bottom:0;left:0;width:2px;pointer-events:none;background:linear-gradient(180deg,transparent 0,var(--blue) 10%,var(--ice) 50%,var(--blue) 90%,transparent 100%);box-shadow:0 0 10px rgba(169,214,245,.5);opacity:1;transition:left .95s cubic-bezier(.77,0,.18,1),opacity .14s linear .86s;transition-delay:var(--reveal-delay,0s),calc(var(--reveal-delay,0s) + .81s)}
.reveal.visible,body[class] .reveal.visible{opacity:1;transform:none;clip-path:inset(0 0 0 0)}
.reveal.visible::after,body[class] .reveal.visible::after{left:calc(100% - 2px);opacity:0}

.hero-art svg{animation:visualFloat 6s ease-in-out infinite}.orbit-one{animation:glowPulse 5s ease-in-out infinite}.orbit-two{animation:glowPulse 5s ease-in-out -2.5s infinite}.card h3,.card p{transition:color .3s}.card:hover h3{color:var(--blue)}.site-header{transition:background .3s,box-shadow .3s}.site-header.scrolled{background:rgba(8,14,21,.98);box-shadow:0 12px 35px #0004}@keyframes drift{0%{transform:translate(0,25px) rotate(0);opacity:0}15%{opacity:.35}85%{opacity:.35}100%{transform:translate(12px,-40px) rotate(90deg);opacity:0}}@keyframes twinkle{0%,100%{opacity:.18;transform:scale(.7) rotate(0)}50%{opacity:.7;transform:scale(1.15) rotate(22deg)}}@keyframes visualFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes glowPulse{0%,100%{opacity:.35;transform:scale(.96)}50%{opacity:.7;transform:scale(1.04)}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.particle,.spark,.hero-art svg,.orbit{animation:none!important}.reveal,body[class] .reveal{opacity:1;clip-path:none;transition:none;will-change:auto}.reveal::after,body[class] .reveal::after{display:none}}