body{isolation:isolate;background:#060c1b}main,footer{position:relative;z-index:1}#galaxy-sky{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}.galaxy-nebula{position:fixed;inset:-15%;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 78% 23%,#544dcc20,transparent 34%),radial-gradient(ellipse at 20% 68%,#2169a31e,transparent 38%),radial-gradient(ellipse at 60% 90%,#63ba6a0b,transparent 30%);animation:nebula-drift 24s ease-in-out infinite alternate;will-change:transform}.hero-art{background:radial-gradient(ellipse at 50% 50%,#19314765,transparent 68%)}.how-section{background:#0b1425bd}.principles{background:#080f2038}.market-card{background:linear-gradient(130deg,#152037eb,#0d172aee);backdrop-filter:blur(5px)}.sky-toggle{position:fixed;right:17px;bottom:17px;width:32px;height:32px;border:1px solid #45577b;border-radius:50%;background:#0c1729db;color:#b9c8e6;z-index:12;display:grid;place-items:center;font-size:13px;backdrop-filter:blur(8px)}.sky-toggle:hover{border-color:var(--lime);color:var(--lime)}.sky-paused .galaxy-nebula{animation-play-state:paused}@keyframes nebula-drift{from{transform:translate(-1%,-1%) rotate(-3deg) scale(1)}to{transform:translate(3%,2%) rotate(3deg) scale(1.08)}}@media(prefers-reduced-motion:reduce){.galaxy-nebula{animation:none}}@media(min-width:701px) and (max-width:950px){.hero h1{font-size:clamp(43px,6.4vw,60px);letter-spacing:-2.7px}}@media(max-width:700px){.hero h1{font-size:clamp(45px,8.7vw,64px)}}

/* The collateral illustration floats like a small constellation. */
.galaxy-nebula{background:radial-gradient(ellipse at 83% 18%,rgba(120,65,236,.27),transparent 38%),radial-gradient(ellipse at 15% 43%,rgba(25,126,202,.22),transparent 36%),radial-gradient(ellipse at 65% 73%,rgba(22,169,170,.17),transparent 36%),radial-gradient(ellipse at 90% 90%,rgba(206,62,154,.17),transparent 34%),radial-gradient(ellipse at 33% 95%,rgba(101,70,226,.21),transparent 38%)}
.galaxy-nebula::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 60% 35%,rgba(221,100,193,.1),transparent 28%),radial-gradient(ellipse at 42% 62%,rgba(87,147,255,.1),transparent 32%);animation:nebula-ribbon 19s ease-in-out infinite alternate}
@keyframes nebula-ribbon{from{transform:translate(-3%,-2%) rotate(-12deg);opacity:.65}to{transform:translate(4%,3%) rotate(9deg);opacity:1}}
.sky-paused .galaxy-nebula::after{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.galaxy-nebula::after{animation:none}}
.core{position:relative;animation:collateral-float 7s ease-in-out infinite;will-change:transform}
.core::before{content:'';position:absolute;inset:-1px;border:1px solid #befd7970;border-radius:inherit;pointer-events:none;box-shadow:0 0 24px #befd7930,inset 0 0 20px #befd7910;animation:collateral-aura 4s ease-in-out infinite}
.core img{animation:shield-glow 4s ease-in-out infinite;position:relative}
.coin-eth{animation:eth-float 6s ease-in-out infinite;will-change:transform}
.coin-dollar{animation:dollar-float 7s ease-in-out -2s infinite;will-change:transform}
.float-top{animation:label-float 8s ease-in-out -2s infinite}
.float-bottom{animation:label-float 8s ease-in-out -6s infinite}
.orbit-one{animation:orbit-drift-one 22s ease-in-out infinite alternate}
.orbit-two{animation:orbit-drift-two 26s ease-in-out infinite alternate}
.orbit-one::before,.orbit-two::after{animation:star-beacon 3s ease-in-out infinite}
@keyframes collateral-float{0%,100%{transform:translateY(4px) rotate(-11deg)}50%{transform:translateY(-12px) rotate(-5deg)}}
@keyframes collateral-aura{0%,100%{opacity:.4}50%{opacity:1}}
@keyframes shield-glow{0%,100%{box-shadow:0 0 18px #befd7925;transform:rotate(9deg) scale(1)}50%{box-shadow:0 0 40px #befd7960;transform:rotate(9deg) scale(1.035)}}
@keyframes eth-float{0%,100%{transform:translateY(0) rotate(-12deg)}50%{transform:translateY(-13px) rotate(-4deg)}}
@keyframes dollar-float{0%,100%{transform:translateY(0) rotate(12deg)}50%{transform:translateY(11px) rotate(4deg)}}
@keyframes label-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes orbit-drift-one{from{transform:rotate(-38deg) scaleY(.66)}to{transform:rotate(-16deg) scaleY(.72)}}
@keyframes orbit-drift-two{from{transform:rotate(29deg) scaleY(.66)}to{transform:rotate(48deg) scaleY(.7)}}
@keyframes star-beacon{0%,100%{opacity:.4;box-shadow:0 0 7px var(--lime)}50%{opacity:1;box-shadow:0 0 20px var(--lime)}}
.sky-paused .hero-art *,.sky-paused .hero-art *::before,.sky-paused .hero-art *::after{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.hero-art *,.hero-art *::before,.hero-art *::after{animation:none!important}}
