.orbit { padding-block:clamp(3.5rem,6vw,6rem); position:relative; isolation:isolate; }
.orbit-layout { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(17rem,.85fr); gap:clamp(2rem,4vw,4rem); align-items:center; }
.orbit-visual { grid-column:1; grid-row:1; width:100%; min-width:0; }
.orbit-copy { grid-column:2; grid-row:1; }
.orbit-copy h2 { font-size:clamp(2.3rem,3.4vw,3.6rem); }
.orbit-copy > p:last-child { max-width:36ch; margin-top:1.25rem; color:var(--muted); }
.orbit-stage { position:relative; }
.orbit-stage canvas { display:none; width:100%; height:100%; }
.orbit-stage.is-live { aspect-ratio:1.08; }
.orbit-stage.is-live canvas { display:block; }
.orbit-core { display:none; }
.orbit-stage.is-live .orbit-core { display:grid; place-content:center; position:absolute; z-index:1; inset:0; margin:0; color:#dcf5e4; font:600 clamp(.6rem,1vw,.8rem)/1 var(--display); letter-spacing:.04em; pointer-events:none; }
.orbit-labels { display:flex; flex-wrap:wrap; gap:.35rem 1.1rem; margin-top:1.25rem; }
.orbit-stage.is-live .orbit-labels { position:absolute; inset:0; z-index:2; display:block; margin:0; pointer-events:none; }
.orbit-label { display:inline-flex; align-items:center; min-height:44px; padding-inline:.15rem; color:var(--muted); font:500 clamp(.6875rem,1vw,.8125rem)/1 var(--display); letter-spacing:-.02em; white-space:nowrap; transition:color 220ms; pointer-events:auto; }
.orbit-stage.is-live .orbit-label { position:absolute; left:0; top:0; }
.orbit-label.is-lit,.orbit-label:hover { color:#e6ce95; }
.orbit-label:focus-visible { outline:2px solid var(--mint); outline-offset:4px; border-radius:3px; }
.orbit-motion { position:absolute; bottom:0; right:0; display:grid; place-items:center; width:44px; height:44px; border:1px solid var(--line); border-radius:50%; background:transparent; color:var(--muted); font-size:.85rem; z-index:3; transition:color 180ms,border-color 180ms; }
.orbit-motion:hover { color:var(--mint); border-color:var(--mint); }
.orbit-motion[hidden] { display:none; }
.orbit-route { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:.35rem .7rem; margin:1.5rem 0 0; color:var(--muted); font-size:.75rem; }
.orbit-route strong { color:var(--mint); font-weight:500; }
.orbit-route span { color:var(--quiet); }
@media(max-width:900px) {
  .orbit-layout { grid-template-columns:1fr; gap:1.25rem; }
  .orbit-copy,.orbit-visual { grid-column:1; grid-row:auto; }
  .orbit-copy { max-width:40rem; }
  .orbit-visual { width:min(100%,640px); justify-self:center; }
}
@media(max-width:480px) {
  .orbit-stage.is-live { aspect-ratio:.92; }
  .orbit-label { font-size:.625rem; }
  .orbit-route { font-size:.65rem; gap:.3rem .45rem; }
  .orbit-motion { bottom:-.4rem; width:36px; height:36px; }
}
@media(prefers-reduced-motion:reduce) { .orbit-label,.orbit-motion { transition:none; } }
