/* Hero */
.hero{position:relative;min-height:calc(100svh - 84px);display:flex;flex-direction:column;justify-content:space-between}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:32px;padding-top:72px;padding-bottom:56px;flex:1;align-items:center}
.hero h1{font-size:clamp(48px,6.2vw,80px);font-weight:650;line-height:1.02;letter-spacing:-.065em;margin:28px 0;text-shadow:0 0 40px #03040a}
.hero-copy>p:not(.eyebrow){max-width:380px;font-size:16px;line-height:1.8}
.actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:32px}
.primary-button{display:inline-flex;align-items:center;gap:20px;background:var(--lime);color:#10170a;border-radius:40px;padding:16px 24px;font-size:14px;font-weight:650;box-shadow:0 0 32px #b7f15a40}.primary-button:hover{background:#cef897;box-shadow:0 0 44px #b7f15a66}
.text-button{display:inline-flex;align-items:center;gap:14px;padding:16px;font-size:14px}.text-button:hover{color:var(--lime)}
.telemetry{display:grid;gap:10px;margin-top:44px;font-size:12px;color:var(--lavender)}
.telemetry p{display:flex;align-items:center;gap:12px;margin:0;color:inherit}
.telemetry p:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--lime);box-shadow:0 0 10px var(--lime);flex-shrink:0}
.telemetry output{color:var(--cream);font-variant-numeric:tabular-nums;font-weight:600}
.hero-visual{position:relative;min-width:0;display:flex;align-items:center}
.hero-label{position:absolute;right:8px;top:12px;color:var(--muted);font-size:11px;letter-spacing:.14em}
.hero-coordinate{position:absolute;bottom:0;left:16px;font-size:10px;letter-spacing:.14em;color:var(--lavender)}
.hero-coordinate:before{content:"";display:inline-block;width:32px;border-top:1px solid #777;margin-right:12px;vertical-align:middle}
.hero-caption{position:absolute;bottom:34px;right:12px;font-size:11px;color:var(--muted)}
.topic-strip{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--border);border-radius:16px;background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);margin-bottom:40px;overflow:hidden}
.topic-strip a{display:flex;align-items:center;gap:12px;padding:22px 18px;font-size:12px;border-left:1px solid var(--border)}.topic-strip a:first-child{border-left:0}
.topic-strip span{color:var(--lime);font-size:11px}.topic-strip svg{width:14px;margin-left:auto;color:var(--muted)}.topic-strip a:hover{color:var(--lime);background:#b7f15a0d}

/* Planets: a tilted, spinning sphere lit from the upper left */
.planet-visual{--planet-color:#dfc8a2;--tilt:-26.7deg;--spin:27s;--spin-dir:normal;--planet-surface:repeating-linear-gradient(180deg,#dac5a1 0%,#baa584 8%,#e6d5b3 15%,#c4ac89 21%,#d9c6a5 29%);width:100%;height:340px;position:relative;display:flex;align-items:center;justify-content:center;isolation:isolate}
.planet-glow{position:absolute;width:280px;height:280px;border-radius:50%;filter:blur(70px);background:var(--planet-color);opacity:.2;z-index:-1}
.planet-model{position:relative;width:210px;height:210px;flex-shrink:0}
.hero-visual .planet-model{width:290px;height:290px}
.planet-sphere{position:absolute;inset:0;z-index:2;border-radius:50%;overflow:hidden;transform:rotate(var(--tilt));background:#111}
.planet-surface{position:absolute;top:0;left:0;width:400%;height:100%;background:var(--planet-surface);background-size:50% 100%;animation:planet-spin var(--spin) linear infinite var(--spin-dir)}
@keyframes planet-spin{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.planet-shade{position:absolute;inset:0;z-index:3;border-radius:50%;pointer-events:none;background:radial-gradient(circle at 30% 28%,#ffffff2e,transparent 32%),radial-gradient(circle at 34% 30%,transparent 24%,#00000066 40%,#000000d0 54%,#000000f7 68%);box-shadow:inset 6px 3px 14px #fff4dc29,0 0 26px -4px var(--planet-color),0 0 70px #c7a7ff14}
.ring{position:absolute;width:190%;height:68%;left:-45%;top:16%;border-radius:50%;transform:rotate(var(--tilt));background:radial-gradient(ellipse,transparent 44%,#8b806b 46%,#d6c9ac 48%,#b3a58d 51%,#e3d4b6 53%,#9d917e 56%,#302e2b 58%,#c2b59b 60%,#8f8675 63%,transparent 65%)}
.ring-back{z-index:1;opacity:.82}
.ring-front{z-index:4;clip-path:polygon(0 50%,100% 50%,100% 100%,0 100%)}
.moon{position:absolute;left:50%;top:50%;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;background:radial-gradient(circle at 32% 30%,#f4d9a0,#c2924f 50%,#3b2a16 85%);box-shadow:0 0 12px #f4c47a55;z-index:5}
