/* Pearl motion background — SafeVault landing */
:root {
  --sv-x: 0px;
  --sv-y: 0px;
  --sv-blue: 37, 99, 235;
}

.sv-crypto {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.sv-scene{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;isolation:isolate;background:#f8fafc}
.sv-art{position:absolute;inset:-18px;background-image:url('../assets/images/sv-pearl.png');background-size:cover;background-position:center;transform:translate3d(var(--sv-x),var(--sv-y),0);transition:transform 1.8s cubic-bezier(.2,.7,.2,1);will-change:transform}
.sv-wash{position:absolute;inset:0;background:linear-gradient(90deg,#f8fafcf2 0%,#f8fafc9c 29%,#f8fafc00 64%),linear-gradient(0deg,#f8fafc80,transparent 30%)}
.sv-glow{position:absolute;right:-12%;top:5%;width:65vw;height:65vw;border-radius:50%;background:radial-gradient(circle,rgba(var(--sv-blue),.24),#91bfff20 44%,transparent 68%);animation:sv-breathe 7s ease-in-out infinite alternate}
.sv-shimmer{position:absolute;right:-15%;top:-45%;width:75%;height:190%;background:linear-gradient(105deg,transparent 43%,#ffffff00 46%,#ffffffa3 49%,#fff 50%,#ffffff80 51%,transparent 55%);opacity:0;transform:translateX(-40%) rotate(12deg);mix-blend-mode:screen;animation:sv-sweep 9s ease-in-out infinite}
.sv-orbits{position:absolute;right:-11%;top:49%;width:min(70vw,1050px);aspect-ratio:1;transform:translateY(-50%) rotate(-25deg);opacity:.8}
.sv-orbit{position:absolute;inset:0;border:1px solid #6299df65;border-radius:50%;animation:sv-rotate 34s linear infinite}.sv-orbit:before{content:"";position:absolute;width:8px;height:8px;border-radius:50%;top:14.3%;left:14.3%;background:#eef9ff;box-shadow:0 0 0 5px #5c9ffb20,0 0 25px #458ffeb0}.sv-orbit:nth-child(2){inset:7%;animation-duration:47s;animation-direction:reverse;transform:rotate(70deg)}.sv-orbit:nth-child(3){inset:13%;border-color:#ffffff40;animation-duration:62s}
.sv-spark{position:absolute;left:var(--x);top:var(--y);width:5px;height:5px;border-radius:50%;background:#fff;box-shadow:0 0 16px #3b86edd0;opacity:0;animation:sv-drift var(--duration) ease-in-out infinite;animation-delay:var(--delay)}
.sv-edge{position:absolute;inset:0;background:linear-gradient(180deg,#ffffff77,transparent 22%,transparent 80%,#f8fafcc9)}
@keyframes sv-breathe{from{opacity:.3;transform:scale(.9) translate3d(0,0,0)}to{opacity:.8;transform:scale(1.08) translate3d(-2%,3%,0)}}
@keyframes sv-sweep{0%,25%{opacity:0;transform:translateX(-50%) rotate(12deg)}38%{opacity:.85}65%{opacity:0;transform:translateX(55%) rotate(12deg)}100%{opacity:0;transform:translateX(55%) rotate(12deg)}}
@keyframes sv-rotate{to{transform:rotate(360deg)}}
@keyframes sv-drift{0%,100%{opacity:0;transform:translate3d(0,0,0)}40%,65%{opacity:.95}90%{opacity:0;transform:translate3d(25px,-68px,0)}}
.sv-paused .sv-scene *{animation-play-state:paused!important}.sv-paused .sv-art{transform:none;transition:none}
@media(max-width:700px){.sv-art{background-position:64% center;opacity:.75}.sv-wash{background:linear-gradient(90deg,#f8fafcfa,#f8fafca6 47%,#f8fafc20),linear-gradient(0deg,#f8fafc,transparent 40%)}.sv-orbits{width:130vw;right:-70%;opacity:.5}.sv-glow{width:120vw;height:120vw;right:-55%}.sv-shimmer{width:120%;right:-40%}}
@media(prefers-reduced-motion:reduce){.sv-scene *{animation:none!important;transition:none!important}.sv-art{transform:none!important}}

/* Brighter moving light ribbons and floating vector crypto emblems. */
.sv-energy{position:absolute;right:-12%;top:15%;width:60vw;height:65vh;border-radius:50%;border:1px solid #80b4fb57;box-shadow:0 0 22px #4f9cff15,inset 0 0 22px #4f9cff10;transform:rotate(-28deg);animation:sv-energy 8s ease-in-out infinite alternate}
.sv-energy.second{top:30%;right:-16%;animation-delay:-4s;animation-duration:11s;border-color:#9edcff80}
@keyframes sv-energy{from{opacity:.3;transform:rotate(-28deg) scale(.92)}to{opacity:.85;transform:rotate(-19deg) scale(1.08)}}
.sv-coin{position:absolute;left:var(--cx);top:var(--cy);width:var(--size,66px);height:var(--size,66px);animation:sv-coin-float var(--speed,14s) ease-in-out infinite;animation-delay:var(--offset,0s);will-change:transform}
.sv-coin-face{position:relative;display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:linear-gradient(140deg,#fff,#ffffffd9 44%,#e5f0ffce);border:1px solid #fff;box-shadow:inset 0 0 0 4px #fff8,inset -3px -5px 10px #abc7e84d,0 12px 28px #3c6ba629,0 0 0 1px #94b9e13b;transform:rotate(var(--tilt,-10deg));overflow:hidden}
.sv-coin-face:after{content:"";position:absolute;inset:-60%;background:linear-gradient(110deg,transparent 44%,#fff9 49%,transparent 55%);animation:sv-coin-shine 8s ease-in-out infinite;animation-delay:var(--offset,0s)}
.sv-coin svg{width:57%;height:57%;filter:drop-shadow(0 2px 2px #16375416)}
@keyframes sv-coin-float{0%,100%{transform:translate3d(0,0,0) rotate(-5deg)}25%{transform:translate3d(18px,-24px,0) rotate(5deg)}50%{transform:translate3d(-9px,-43px,0) rotate(-3deg)}75%{transform:translate3d(-20px,-14px,0) rotate(6deg)}}
@keyframes sv-coin-shine{0%,15%{transform:translateX(-65%);opacity:0}35%{opacity:.85}65%,100%{transform:translateX(65%);opacity:0}}
.sv-paused .sv-scene *:after{animation-play-state:paused!important}
@media(max-width:700px){.sv-coin{width:calc(var(--size,66px)*.72);height:calc(var(--size,66px)*.72);left:var(--mx);top:var(--my)}.sv-coin:nth-child(n+5){display:none}.sv-energy{right:-50%;width:105vw}.sv-energy.second{right:-65%}}
@media(prefers-reduced-motion:reduce){.sv-scene *:after{animation:none!important}}