/* =================================================
FONTS
================================================= */

@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500;700;900&family=Rajdhani:wght@400;500;700&display=swap');


/* =================================================
GLOBAL
================================================= */

*{
box-sizing:border-box;
}

html,body{
margin:0;
padding:0;
}

body{
font-family:'Rajdhani', sans-serif;
background:#000;
color:#fff;
overflow-x:hidden;
min-height:100vh;
position:relative;
letter-spacing:.5px;
}


/* =================================================
STARFIELD BACKGROUND
================================================= */

.starfield{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:#000;
z-index:-3;
overflow:hidden;
pointer-events:none;
transition:transform .2s ease-out;
will-change:transform;
}

.star{
position:absolute;
border-radius:50%;
animation:twinkle 3s infinite alternate;
}

.star.small{
width:1px;
height:1px;
background:#fff;
opacity:.7;
}

.star.medium{
width:2px;
height:2px;
background:#cfe9ff;
opacity:.85;
}

.star.large{
width:4px;
height:4px;
background:#8fd3ff;
box-shadow:0 0 10px #8fd3ff;
}

@keyframes twinkle{
from{opacity:.3;transform:scale(.9);}
to{opacity:1;transform:scale(1.2);}
}


/* =================================================
GALAXY LAYER
================================================= */

#galaxies{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
z-index:-4;
pointer-events:none;
overflow:hidden;
}

.galaxy{
position:absolute;
width:600px;
height:600px;
background:radial-gradient(circle, rgba(140,80,255,.35), rgba(0,0,0,0) 70%);
border-radius:50%;
filter:blur(60px);
opacity:.6;
animation:spinGalaxy linear infinite;
}

@keyframes spinGalaxy{
from{transform:rotate(0deg);}
to{transform:rotate(360deg);}
}


/* =================================================
SHOOTING STARS
================================================= */

.shooting-star{
position:fixed;
width:3px;
height:3px;
background:white;
box-shadow:0 0 10px white;
border-radius:50%;
z-index:-2;
animation:shoot 2s linear forwards;
pointer-events:none;
}

@keyframes shoot{
0%{transform:translate(0,0);opacity:1;}
100%{transform:translate(-800px,400px);opacity:0;}
}


/* =================================================
NEBULA
================================================= */

.nebula{
position:fixed;
width:900px;
height:900px;
filter:blur(120px);
pointer-events:none;
z-index:-3;
animation:nebulaDrift 120s linear infinite alternate;
}

.nebula.one{
top:-220px;
left:-220px;
background:radial-gradient(circle, rgba(120,0,255,.3), transparent 70%);
}

.nebula.two{
bottom:-220px;
right:-220px;
background:radial-gradient(circle, rgba(255,0,200,.25), transparent 70%);
}

@keyframes nebulaDrift{
0%{transform:translate(0,0);}
50%{transform:translate(80px,-60px);}
100%{transform:translate(-60px,80px);}
}


/* =================================================
HEADER
================================================= */

.header{
background:rgba(5,5,10,.85);
border-bottom:1px solid rgba(100,140,255,.25);
backdrop-filter:blur(6px);
position:relative;
z-index:20;
}

.header-inner{
max-width:1200px;
margin:auto;
display:flex;
justify-content:space-between;
align-items:center;
padding:22px;
}

.logo a{
font-family:'Orbitron', sans-serif;
color:#9ecbff;
font-size:22px;
letter-spacing:2px;
text-decoration:none;
text-shadow:0 0 10px rgba(100,160,255,.6);
}

.main-nav{
display:flex;
gap:22px;
}

.main-nav a{
color:#d6e8ff;
text-decoration:none;
font-size:16px;
}

.main-nav a:hover{
color:#9ecbff;
}


/* =================================================
HERO
================================================= */

.hero{
text-align:center;
padding:80px 20px 30px;
max-width:900px;
margin:auto;
}

.hero h1{
font-family:'Orbitron', sans-serif;
font-size:48px;
letter-spacing:3px;
text-shadow:0 0 14px rgba(120,180,255,.7);
}

.subtitle{
color:#fff;
font-size:18px;
line-height:1.6;
max-width:900px;
margin:0 auto 10px;
}

.back-button{
display:inline-block;
margin-top:18px;
padding:10px 18px;
border:1px solid rgba(120,180,255,.4);
border-radius:10px;
text-decoration:none;
color:#d6e8ff;
background:rgba(10,20,40,.45);
transition:all .25s ease;
}

.back-button:hover{
color:#9ecbff;
border-color:#9ecbff;
box-shadow:0 0 18px rgba(120,180,255,.25);
}


/* =================================================
SOLAR SYSTEM (UNCHANGED)
================================================= */

.solar-section{
display:flex;
justify-content:center;
align-items:center;
padding:40px 20px;
}

.universe{
position:relative;
width:920px;
height:920px;
margin:auto;
z-index:5;
}

.sun{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
z-index:6;
}

.sun img{
width:240px;
filter:drop-shadow(0 0 60px orange);
}

.orbit{
position:absolute;
top:50%;
left:50%;
border:1px solid rgba(255,255,255,.06);
border-radius:50%;
transform:translate(-50%,-50%);
z-index:1;
}

.orbit1{width:400px;height:400px;}
.orbit2{width:520px;height:520px;}
.orbit3{width:640px;height:640px;}
.orbit4{width:760px;height:760px;}
.orbit5{width:840px;height:840px;}
.orbit6{width:920px;height:920px;}

.planet{
position:absolute;
transform:translate(-50%,-50%);
z-index:10;
cursor:pointer;
width:170px;
height:170px;
display:flex;
align-items:center;
justify-content:center;
text-decoration:none;
border-radius:50%;
transition:transform .25s ease;
}

.planet img{
width:100%;
display:block;
filter:drop-shadow(0 0 20px rgba(255,255,255,.45));
transition:transform .3s ease, filter .3s ease;
}

.planet:hover img{
transform:scale(1.18);
filter:drop-shadow(0 0 30px rgba(120,180,255,.9));
}


/* =================================================
TERMINAL CONSOLE (1.75x SIZE + CURSOR)
================================================= */

./* =================================================
TERMINAL CONSOLE (BIGGER + BOLD — DOES NOT TOUCH PORTAL TEXT)
================================================= */

.wealth-intro{
padding:20px 20px 40px;
}

.terminal-box{
max-width:900px;
margin:auto;
padding:40px;

background:#020617;

border:1px solid rgba(255,255,255,.15);
border-radius:12px;

font-family:monospace;

font-size:30px; /* bigger */

line-height:1.7;
color:#fff;

box-shadow:0 0 30px rgba(120,180,255,.25);

min-height:260px;

position:relative;
}

/* ONLY the typing text */

#typedText{
font-size:34px;
font-weight:700; /* bold */
letter-spacing:1px;

color:#e6f2ff;

text-shadow:
0 0 10px rgba(120,180,255,.8),
0 0 20px rgba(120,180,255,.5),
0 0 40px rgba(120,180,255,.3);
}

/* blinking cursor */

#typedText::after{
content:"_";
margin-left:6px;
animation:terminalBlink 1s infinite;
}

@keyframes terminalBlink{
0%,50%,100%{opacity:1;}
25%,75%{opacity:0;}
}

/* =================================================
PLANET PORTAL PAGES
================================================= */

.planet-page-wrap{
display:flex;
justify-content:center;
padding:80px 20px;
}

.planet-grid{
display:flex;
flex-direction:column;
align-items:center;
gap:80px;
max-width:720px;
width:100%;
margin:auto;
}

.planet-grid a{
display:flex;
flex-direction:column;
align-items:center;
text-align:center;

background:linear-gradient(
145deg,
rgba(20,25,50,.9),
rgba(10,12,30,.95)
);

border-radius:18px;

padding:45px;

width:100%;
max-width:620px;

border:1px solid rgba(120,180,255,.35);

box-shadow:
0 0 40px rgba(120,180,255,.25),
inset 0 0 20px rgba(120,180,255,.08);

text-decoration:none;
color:#fff;

height:auto;

transition:.35s ease;

animation:portalFloat 6s ease-in-out infinite;
}

.planet-grid a:hover{

transform:translateY(-12px) scale(1.05);

box-shadow:
0 0 80px rgba(120,180,255,.85),
0 0 140px rgba(80,160,255,.35),
inset 0 0 30px rgba(120,180,255,.2);

border-color:#7db9ff;

}

.planet-grid a::before{
content:"";
position:absolute;
top:-50%;
left:-120%;
width:60%;
height:200%;

background:linear-gradient(
120deg,
transparent,
rgba(120,180,255,.35),
transparent
);

transform:rotate(25deg);

animation:holoSweep 7s linear infinite;
}

@keyframes holoSweep{
0%{left:-120%;}
100%{left:150%;}
}

@keyframes portalFloat{
0%{transform:translateY(0);}
50%{transform:translateY(-6px);}
100%{transform:translateY(0);}
}

.planet-grid img{
width:260px;
max-width:90%;
height:auto;
margin-bottom:20px;
border-radius:10px;
}

.planet-grid h3{
font-size:30px;
margin:10px 0;
font-family:'Orbitron', sans-serif;
}

.planet-grid p{
font-size:18px;
line-height:1.6;
max-width:500px;
}


/* =================================================
FOOTER
================================================= */

.footer{
background:rgba(10,10,20,.9);
text-align:center;
padding:30px 20px;
border-top:1px solid rgba(100,140,255,.2);
margin-top:40px;
}

.footer-inner{
max-width:1000px;
margin:0 auto;
text-align:center;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
}


/* =================================================
RESPONSIVE
================================================= */

@media (max-width:900px){

.universe{
width:600px;
height:600px;
}

.planet-grid{
gap:40px;
}

}

@media (max-width:600px){

.hero h1{
font-size:34px;
}

.universe{
width:420px;
height:420px;
}

.planet-page-wrap{
padding:70px 20px;
}

.planet-grid{
gap:30px;
}

.planet-grid a{
padding:30px 20px;
}

.planet-grid img{
max-width:320px;
}

.planet-grid h3{
font-size:24px;
}

.planet-grid p{
font-size:16px;
}

}