.hero-interactive{min-height:max(860px,96svh)}
.hero-interactive .hero-content{padding-top:165px;padding-bottom:145px}
.hero-interactive .hero-media{overflow:hidden}
.hero-interactive .hero-media img{position:absolute;inset:-8px;width:calc(100% + 16px);height:calc(100% + 16px);max-width:none;transform:translate(var(--hero-x,0px),var(--hero-y,0px)) scale(1.025);transition:transform .8s ease-out;object-fit:cover}
.hero-worlds{display:flex;flex-wrap:wrap;gap:10px;margin-top:34px;max-width:700px}
.hero-worlds button{border:1px solid #c6deef55;border-radius:99px;padding:11px 18px;min-height:44px;color:#e2edf5;background:#08203866;font-size:13px;font-weight:400;backdrop-filter:blur(12px);transition:background .25s,color .25s,border-color .25s}
.hero-worlds button:hover{border-color:#d2eafa;background:#215578aa}
.hero-worlds button[aria-selected=true]{background:#deeffa;color:#10344e;border-color:#deeffa}
.hero-world-panel{max-width:570px}.hero-world-panel .hero-description{font-size:18px;line-height:1.7;min-height:3.4em;margin-top:22px;font-weight:400;max-width:550px}.hero-world-panel .button{margin-top:22px}
.hero-world-status{display:block;font-size:12px;color:#f1d9cb}.hero-world-status:empty{display:none}
.hero-connections{position:absolute;pointer-events:none;z-index:-1;right:0;top:20%;width:43%;opacity:.4;transform:translate(var(--hero-x,0px),var(--hero-y,0px));transition:opacity .5s,transform .8s}
.hero-connections svg{display:block;width:100%}.hero-connections path{stroke:#abd9ee;stroke-width:.8}.hero-connections circle{fill:#d7f1ff;filter:drop-shadow(0 0 7px #94d9ff)}
.hero-interactive:hover .hero-connections{opacity:.75}
@media(max-width:960px){.hero-interactive .hero-content{padding-top:150px}.hero-interactive h1{font-size:clamp(48px,7vw,68px)}}
@media(max-width:640px){.hero-interactive{min-height:830px}.hero-interactive .hero-content{padding-top:125px;padding-bottom:125px}.hero-interactive h1{font-size:clamp(34px,9.2vw,54px)}.hero-worlds{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:26px}.hero-worlds button{padding:10px 8px;font-size:12px}.hero-world-panel .hero-description{font-size:16px;min-height:5.1em;max-width:none;margin-top:20px}.hero-world-panel .button{font-size:13px;gap:16px}.hero-connections{width:80%;top:38%;right:-30%;opacity:.25}.hero-interactive:hover .hero-connections{opacity:.25}}
@media(prefers-reduced-motion:reduce){.hero-interactive .hero-media img,.hero-connections{transform:none}}