.main { position:relative; isolation:isolate; overflow:clip; color:#eef8f6; background:#031116; }
.world { position:fixed; z-index:0; inset:0; height:100svh; pointer-events:auto; }
.spectralWash { position:fixed; z-index:1; inset:0; pointer-events:none; background:linear-gradient(90deg,#031116e8 0,#0311168c 42%,transparent 71%),radial-gradient(circle at 74% 48%,transparent 0 21%,#03111638 45%,#031116c7 86%); }
.hero { position:relative; display:flex; min-height:calc(100svh - 82px); width:min(1440px,calc(100% - 48px)); margin:0 auto; flex-direction:column; justify-content:center; padding:100px clamp(30px,7vw,100px) 90px; pointer-events:none; }
.heroRail { position:absolute; top:10%; bottom:10%; left:0; display:flex; width:1px; flex-direction:column; align-items:center; color:#7d9ca0; background:linear-gradient(transparent,#78bfc955 12%,#78bfc955 88%,transparent); font:600 .52rem/1 var(--font-geist-mono); letter-spacing:.12em; writing-mode:vertical-rl; }.heroRail i { flex:1; width:1px; margin:18px 0; background:#b7dce144; }
.heroCopy { position:relative; z-index:2; width:min(800px,68%); }
.heroCopy > * { animation:rise .9s cubic-bezier(.2,.8,.2,1) both; }.heroCopy > :nth-child(2){animation-delay:.08s}.heroCopy > :nth-child(3){animation-delay:.16s}.heroCopy > :nth-child(4){animation-delay:.24s}
.eyebrow { display:flex; align-items:center; gap:9px; margin-bottom:30px; color:#e7c66f; font:650 .66rem/1 var(--font-geist-mono); letter-spacing:.18em; }
.hero h1 { font:300 clamp(4.7rem,9.5vw,9.4rem)/.78 var(--font-physics); letter-spacing:-.07em; text-shadow:0 12px 55px #000; }.hero h1 em { color:#96edf0; font-weight:300; text-shadow:0 0 45px #59dfe355; }
.lead { max-width:590px; margin-top:40px; color:#a5c1c1; font-size:clamp(1rem,1.5vw,1.18rem); line-height:1.75; }
.heroActions { position:absolute; z-index:5; bottom:7%; left:clamp(30px,7vw,100px); display:flex; flex-wrap:wrap; gap:12px; pointer-events:auto; }.heroActions a { display:inline-flex; min-height:50px; align-items:center; gap:10px; padding:0 21px; border:1px solid #70ced3; border-radius:999px; font-weight:600; backdrop-filter:blur(14px); }.heroActions a:first-child { color:#052027; background:#9ce8e9; box-shadow:0 0 35px #6ce5e33d; }.heroActions a:last-child { background:#061d258c; }
.equation { position:absolute; top:19%; right:3%; display:grid; gap:10px; justify-items:end; color:#b9ecec; font:300 clamp(1.3rem,2.2vw,2rem)/1 var(--font-physics); }.equation small { color:#e7c66f; font:600 .5rem/1 var(--font-geist-mono); letter-spacing:.15em; }
.scrollCue { position:absolute; right:3%; bottom:38px; display:flex; align-items:center; gap:12px; color:#8aa6a7; font:600 .58rem/1 var(--font-geist-mono); letter-spacing:.12em; text-transform:uppercase; }.scrollCue svg{animation:drift 1.8s ease-in-out infinite}
.observatory { position:relative; z-index:2; width:min(1220px,calc(100% - 48px)); margin:0 auto; padding:80px 0 130px; }.observatory::before { position:absolute; z-index:-1; inset:-5% -20% -4%; content:""; background:radial-gradient(ellipse at 50% 20%,#07303cd9,#03151be8 48%,#031116 78%); }
.observations { display:grid; grid-template-columns:repeat(3,1fr); margin-bottom:100px; border-top:1px solid #7ab5b64c; border-bottom:1px solid #7ab5b64c; background:#08242c60; backdrop-filter:blur(14px); }.observations p { display:grid; min-height:190px; grid-template-rows:auto 1fr auto; gap:15px; padding:28px; }.observations p+p{border-left:1px solid #7ab5b64c}.observations small { color:#6c979a; font:600 .56rem/1 var(--font-geist-mono); letter-spacing:.14em; }.observations strong { align-self:center; color:#a6f3f1; font:300 clamp(2.8rem,5vw,5.5rem)/1 var(--font-physics); letter-spacing:-.05em; }.observations span { color:#849fa0; font-size:.72rem; text-transform:uppercase; letter-spacing:.1em; }
.searchPanel { margin-bottom:120px; padding:clamp(26px,4vw,48px); background:linear-gradient(135deg,#0b3540bd,#071d25b5); border:1px solid #85c9cb4d; border-radius:32px; box-shadow:0 35px 100px #0008,inset 0 1px #dfffff24; backdrop-filter:blur(24px); }
.visuallyHidden { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; }
.searchBox { display:grid; grid-template-columns:auto 1fr auto; min-height:66px; align-items:center; overflow:hidden; padding-left:22px; color:#8cdde0; background:#031318a6; border:1px solid #67a9ab85; border-radius:999px; }.searchBox input{min-width:0;padding:0 16px;color:#eef8f6;background:transparent;border:0;outline:0}.searchBox input::placeholder{color:#648185}.searchBox button{display:grid;width:64px;height:64px;place-items:center;color:#052027;background:#a5e9e7;border:0;border-radius:50%;cursor:pointer}.searchBox:focus-within{border-color:#a5e9e7;box-shadow:0 0 0 4px #75e1e11e}
.collections { padding-bottom:40px; }.sectionTitle{margin-bottom:60px;font:300 clamp(3.8rem,7vw,7rem)/.86 var(--font-physics);letter-spacing:-.065em}.collectionGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px;perspective:1200px}
.collectionCard { --card-accent:#8de6e7; position:relative; display:flex; min-height:320px; overflow:hidden; flex-direction:column; justify-content:center; padding:28px;color:#eef8f6;background:linear-gradient(145deg,#0b3039c7,#061b22bd);border:1px solid #78b8ba55;border-radius:25px;box-shadow:0 28px 80px #0008,inset 0 1px #dff4f324;transform:perspective(1200px) rotateX(var(--rx)) rotateY(var(--ry));transform-style:preserve-3d;transition:transform .18s ease-out,border-color .25s,box-shadow .25s;backdrop-filter:blur(20px)}.collectionCard:hover{border-color:#99eeefaa;box-shadow:0 38px 100px #000a,0 0 55px #53d8d51f,inset 0 1px #fff4}
.cardGlow{position:absolute;inset:0;opacity:0;pointer-events:none;background:radial-gradient(400px circle at var(--mx) var(--my),#80e4e33d,transparent 43%);transition:opacity .25s}.collectionCard:hover .cardGlow{opacity:1}.cardIcon{position:absolute;top:48%;right:-3%;width:62%;height:62%;color:#84dde0;opacity:.095;transform:translateY(-50%) translateZ(18px);stroke-width:.55}.cardText{position:relative;z-index:2;transform:translateZ(32px)}.cardText h3{max-width:430px;font:300 clamp(2.8rem,4.5vw,4.8rem)/.88 var(--font-physics);letter-spacing:-.055em}.cardArrow{position:absolute;right:28px;bottom:28px;color:#92d7d8}
@keyframes rise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}@keyframes drift{50%{transform:translateY(7px)}}
@media(max-width:760px){.hero{width:calc(100% - 32px);min-height:calc(100svh - 68px);padding:82px 9px 75px 24px}.heroCopy{width:100%}.hero h1{font-size:clamp(4rem,20vw,5.8rem);line-height:.8}.lead{max-width:91%;margin-top:34px}.equation{top:24px;right:0;font-size:1.15rem}.heroRail{left:2px}.scrollCue{right:0;bottom:24px}.observatory{width:calc(100% - 32px);padding-top:60px}.observations{grid-template-columns:1fr;margin-bottom:80px}.observations p{min-height:145px}.observations p+p{border-top:1px solid #7ab5b64c;border-left:0}.observations strong{font-size:3.7rem}.searchPanel{grid-template-columns:1fr;gap:40px;margin-bottom:100px;padding:30px 22px;border-radius:24px}.searchPanel label{font-size:3.5rem}.searchBox{min-height:58px;padding-left:17px}.searchBox button{width:56px;height:56px}.sectionHeading{grid-template-columns:1fr;margin-bottom:45px}.sectionHeading h2{font-size:3.8rem}.collectionGrid{grid-template-columns:1fr;gap:18px}.collectionCard{min-height:360px;padding:24px}.cardText h3{font-size:3rem}}
@media(prefers-reduced-motion:reduce){.heroCopy>*,.scrollCue svg{animation:none}.collectionCard{transform:none}}

/* Focused planetary light system */
.main { color:#102c37; background:#f7f3e8; }
.spectralWash { background:radial-gradient(circle at 50% 48%,transparent 0 35%,#f7f3e81f 60%,#dce9e35e 100%); }
.heroActions a { color:#164951; background:#fffdf0c7; border-color:#4e8d91; box-shadow:0 10px 35px #315c5e20; }.heroActions a:first-child { color:#fffdf5; background:#176b77; box-shadow:0 12px 35px #176b7735; }
.observatory::before { background:radial-gradient(ellipse at 50% 18%,#eef5f0f3,#f7f3e8ed 58%,#f7f3e8 84%); }
.searchPanel { background:linear-gradient(135deg,#e0eee9dc,#f7f3e8d4); border-color:#5f8e8d61; box-shadow:0 28px 70px #315b5e24,inset 0 1px #fff; }
.searchBox { color:#176b77; background:#fffdf3e8; border-color:#658e8d8c; }.searchBox input { color:#102c37; }.searchBox input::placeholder { color:#68817e; }.searchBox button { color:#fffdf5; background:#176b77; }
.sectionTitle { color:#102c37; }
.collectionCard { color:#102c37; background:linear-gradient(145deg,#fffdf2dc,#e2efebcf); border-color:#63888663; box-shadow:0 24px 65px #315b5e24,inset 0 1px #fff; }.collectionCard:hover { border-color:#2b858d99; box-shadow:0 30px 75px #315b5e30,0 0 50px #58bfc523,inset 0 1px #fff; }
.cardText h3 { color:#103740; }.cardIcon { color:#176b77; opacity:.11; }.cardArrow { color:#176b77; }.cardGlow { background:radial-gradient(400px circle at var(--mx) var(--my),#67cdd347,transparent 44%); }
.satelliteNav { position:absolute; z-index:3; inset:0; pointer-events:none; }
.satellite { position:absolute; display:flex; align-items:center; gap:10px; color:#153f45; pointer-events:auto; font:500 clamp(.72rem,1vw,.9rem)/1.2 var(--font-physics); transition:transform .2s ease,color .2s ease; }
.satellite span { display:grid; width:46px; height:46px; place-items:center; color:#f8f4e9; background:linear-gradient(145deg,#268893,#0c6170); border:5px solid #f7f3e8b8; border-radius:50%; box-shadow:0 8px 24px #1d5a5e35,0 0 0 1px #356f7380; }
.satellite svg { width:17px; height:17px; }.satellite b { max-width:135px; padding:7px 11px; background:#f7f3e8c9; border:1px solid #7598956b; border-radius:999px; box-shadow:0 6px 20px #456d6b17; font-weight:500; backdrop-filter:blur(9px); }
.satellite:hover,.satellite:focus-visible { color:#0d687c; transform:scale(1.06); }.satellite[data-orbit="1"] { top:22%; left:15%; }.satellite[data-orbit="2"] { top:26%; right:12%; }.satellite[data-orbit="3"] { right:10%; bottom:24%; }.satellite[data-orbit="4"] { bottom:21%; left:17%; }
.observatory { padding-top:55px; padding-bottom:85px; }.searchPanel { width:min(900px,100%); margin:0 auto; }
@media(max-width:760px){.satellite { gap:6px; font-size:.67rem }.satellite span { width:38px; height:38px; border-width:4px }.satellite b { max-width:112px; padding:6px 8px }.satellite[data-orbit="1"]{top:16%;left:3%}.satellite[data-orbit="2"]{top:27%;right:2%}.satellite[data-orbit="3"]{right:2%;bottom:22%}.satellite[data-orbit="4"]{bottom:15%;left:3%}.heroActions{align-self:center;margin-top:auto;margin-bottom:12%;}.observatory{padding-top:38px;padding-bottom:65px}}
@media(max-width:760px){.heroActions{left:50%;bottom:4%;width:max-content;margin:0;transform:translateX(-50%)}.observatory{padding-top:38px;padding-bottom:65px}}