*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{--void:#0B0A1A;--mid:#1A0B2E;--deep:#0E1A2E;--violet:#8B5CF6;--lavender:#E2D9F3;--muted:#A89BC4;--gold:#F59E0B}
body{background:var(--void);background:linear-gradient(180deg,var(--void) 0%,var(--mid) 40%,var(--deep) 100%);color:var(--muted);font-family:'Inter',sans-serif;font-weight:300;font-size:15px;line-height:1.8;-webkit-font-smoothing:antialiased;overflow-x:hidden;min-height:300vh}
.mist{position:fixed;top:0;left:-50%;width:200%;height:100%;pointer-events:none;z-index:0}
.mist-1{background:radial-gradient(ellipse at 30% 50%,rgba(139,92,246,0.03) 0%,transparent 60%);animation:mistDrift 30s ease-in-out infinite}
.mist-2{background:radial-gradient(ellipse at 70% 40%,rgba(14,26,46,0.08) 0%,transparent 60%);animation:mistDrift 30s ease-in-out infinite reverse}
@keyframes mistDrift{0%,100%{transform:translateX(0)}50%{transform:translateX(10%)}}
.star-field{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0}
.hero{position:relative;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:1}
.orb-svg{width:300px;height:300px}
.orbit{stroke-dasharray:600;stroke-dashoffset:0}
.glyph-1{animation:revolve1 40s linear infinite;transform-origin:150px 150px}
.glyph-2{animation:revolve2 55s linear infinite;transform-origin:150px 150px}
.glyph-3{animation:revolve3 70s linear infinite;transform-origin:150px 150px}
@keyframes revolve1{to{transform:rotate(360deg)}}
@keyframes revolve2{to{transform:rotate(-360deg)}}
@keyframes revolve3{to{transform:rotate(360deg)}}
.hero-title{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:56px;color:var(--lavender);letter-spacing:0.04em;margin-top:24px}
.hero-sub{font-family:'Cormorant Garamond',serif;font-weight:600;font-style:italic;font-size:20px;color:var(--violet);margin-top:8px}
.predictions{position:relative;z-index:1;max-width:1000px;margin:0 auto;padding:80px 32px;display:flex;gap:24px;justify-content:center;flex-wrap:wrap}
.pred-card{position:relative;flex:1;min-width:260px;max-width:320px;padding:32px;border-radius:24px;background:radial-gradient(ellipse at center,rgba(139,92,246,0.06) 0%,rgba(0,0,0,0) 70%);border:1px solid rgba(139,92,246,0.15);box-shadow:inset 0 0 40px rgba(139,92,246,0.05);transition:opacity 0.6s,transform 0.6s,filter 0.6s}
.card-left{transform:rotate(-3deg)}
.card-center{transform:rotate(0deg)}
.card-right{transform:rotate(3deg)}
.card-reveal{opacity:0.4;filter:blur(4px)}
.card-reveal.in-view{opacity:1;filter:blur(0px)}
.card-left.in-view{transform:rotate(-3deg) translateY(0)}
.card-center.in-view{transform:rotate(0deg) translateY(0)}
.card-right.in-view{transform:rotate(3deg) translateY(0)}
.pred-icon{width:40px;height:40px;margin-bottom:12px}
.pred-label{font-family:'Inter',sans-serif;font-weight:400;font-size:11px;letter-spacing:0.1em;text-transform:uppercase;color:var(--violet);display:block;margin-bottom:8px}
.pred-card h2{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:28px;color:var(--lavender);letter-spacing:0.04em;margin-bottom:12px}
.prophecy{font-family:'Cormorant Garamond',serif;font-weight:600;font-style:italic;font-size:18px;color:var(--violet);margin-bottom:12px;line-height:1.5}
.timeline{position:relative;z-index:1;max-width:800px;margin:80px auto;padding:0 32px}
.timeline-line{position:absolute;left:50%;top:0;width:1px;height:100%;background:rgba(139,92,246,0.4);animation:linePulse 4s ease-in-out infinite}
@keyframes linePulse{0%,100%{box-shadow:0 0 0px rgba(139,92,246,0.4)}50%{box-shadow:0 0 4px rgba(139,92,246,0.6)}}
.tl-entry{position:relative;width:45%;margin-bottom:60px;padding:24px;border-radius:24px;background:radial-gradient(ellipse at center,rgba(139,92,246,0.04) 0%,transparent 70%);border:1px solid rgba(139,92,246,0.12);transition:opacity 0.5s,transform 0.5s}
.tl-left{margin-right:auto}
.tl-right{margin-left:auto}
.tl-entry.card-reveal{opacity:0.4}
.tl-entry.card-reveal.in-view{opacity:1}
.tl-left.card-reveal{transform:translateX(-40px)}
.tl-left.card-reveal.in-view{transform:translateX(0)}
.tl-right.card-reveal{transform:translateX(40px)}
.tl-right.card-reveal.in-view{transform:translateX(0)}
.tl-label{font-size:11px;letter-spacing:0.1em;text-transform:uppercase;color:var(--violet);display:block;margin-bottom:8px}
.tl-label.gold{color:var(--gold)}
.tl-entry h2{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:28px;color:var(--lavender);letter-spacing:0.04em;margin-bottom:8px}
.footer{position:relative;z-index:1;text-align:center;padding:80px 32px;color:var(--muted);font-size:13px}
.footer-name{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:24px;color:var(--lavender);display:block;margin-bottom:8px}
@media(max-width:600px){.hero-title{font-size:40px}.predictions{flex-direction:column;align-items:center}.pred-card{transform:none!important}.pred-card.in-view{transform:none!important}.timeline-line{left:16px}.tl-entry{width:calc(100% - 40px);margin-left:40px}}
@media(prefers-reduced-motion:reduce){.mist,.glyph-1,.glyph-2,.glyph-3{animation:none}.timeline-line{animation:none}}