/* Reference-led home composition; the original 3D logo renderer is unchanged. */
.stg-celestial{margin:0;background:#f0edf7;color:#68558b}
.stg-celestial .stg-clouds{inset:0;width:100%;height:100svh;object-fit:cover;object-position:center;opacity:1;transform:none;z-index:-2}
.stg-celestial .stg-topbar-simple{position:absolute;justify-content:flex-end;padding:40px clamp(24px,2.5vw,48px);background:transparent;border:0;backdrop-filter:none}
.stg-celestial .stg-nav{gap:clamp(24px,2.6vw,46px)}
.stg-celestial .stg-nav a{color:#665186;font-size:11px;font-weight:500;letter-spacing:.24em}
.stg-celestial .stg-nav a:hover{color:#9c75e7}
.stg-celestial .stg-hero{height:100svh;min-height:650px}
.stg-celestial .stg-headline{top:24.5%;left:0;width:100%;text-align:center;font-family:Georgia,'Times New Roman',serif;font-size:14px;font-weight:600;letter-spacing:.6em;line-height:1.5;color:#665186;padding-left:.6em}
.stg-celestial .stg-center{position:absolute;top:49%;left:50%;transform:translate(-50%,-50%);width:100%;gap:0;padding:0 16px}
.stg-celestial .stg-hero-lockup{width:clamp(320px,40vw,670px);height:clamp(280px,39vh,390px)}
.stg-celestial .stg-tagline{display:block;font-family:Inter,sans-serif;font-size:clamp(14px,1.12vw,19px);font-weight:300;text-transform:uppercase;letter-spacing:.23em;line-height:1.6;color:#665186;margin-top:-8px}
.stg-celestial .stg-scroll-cue{bottom:6%;color:#665186;opacity:1;animation:none;font-family:Inter,sans-serif;font-size:10px;font-weight:500;letter-spacing:.28em;display:flex;flex-direction:column;align-items:center;gap:24px}
.stg-celestial .stg-scroll-cue:after{content:'';display:block;width:1px;height:38px;background:#80719c;opacity:.75}
@media(max-width:600px){.stg-celestial .stg-topbar-simple{padding:28px 24px}.stg-celestial .stg-nav{gap:25px}.stg-celestial .stg-nav a{font-size:10px;letter-spacing:.2em}.stg-celestial .stg-headline{font-size:10px;letter-spacing:.43em;top:25%}.stg-celestial .stg-hero-lockup{width:94vw;height:310px}.stg-celestial .stg-tagline{font-size:13px;letter-spacing:.16em}.stg-celestial .stg-clouds{object-position:50% 50%}.stg-celestial .stg-scroll-cue{bottom:6%;font-size:9px}}

/* Larger lockup: keep camera framing proportional to width, with vertical room for the symbol. */
.stg-celestial .stg-center{top:46%}
.stg-celestial .stg-hero-lockup{width:clamp(640px,80vw,1340px);height:clamp(560px,78svh,900px);max-width:calc(100vw - 32px)}
@media(max-width:600px){.stg-celestial .stg-center{top:47%}.stg-celestial .stg-hero-lockup{width:calc(100vw - 24px);max-width:calc(100vw - 24px);height:68svh;min-height:460px}.stg-celestial .stg-tagline{margin-top:-18px}}

/* Living sky shares the original background layer; dust and the logo stay in front. */
.stg-celestial #bg-canvas{z-index:-2;pointer-events:none}

.stg-celestial .stg-scroll-cue:focus-visible{outline:1px solid #8d70bd;outline-offset:8px}

.stg-celestial .stg-world-section{padding:0;overflow:hidden;isolation:isolate}
#ground-world{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;background:transparent}

.mobile-welcome{position:fixed;inset:auto;top:50%;left:50%;transform:translate(-50%,-50%);margin:0;box-sizing:border-box;max-width:340px;width:calc(100% - 48px);padding:28px;border:1px solid #c4afe0;border-radius:18px;background:#faf6fff5;color:#624681;text-align:center;font:400 15px/1.6 Inter,sans-serif;box-shadow:0 18px 80px #50396c33}
.mobile-welcome::backdrop{background:#e9dff0a8}
.mobile-welcome-detail{font-size:12px;color:#806a98}
.mobile-welcome button{margin-top:12px;padding:13px 24px;border:1px solid #9a79bd;border-radius:30px;background:#7857a0;color:white;font:400 12px Inter,sans-serif;letter-spacing:.05em;min-height:46px}
