/* Constellation hero map (orbital nav). Sections reuse resonance.css. */
.cmap-wrap { position: relative; width: 100%; height: 100vh; overflow: hidden; }
.cstars { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.cstars i { position: absolute; width: 2px; height: 2px; border-radius: 50%; background: #cdd6ff; animation: ctw 5s ease-in-out infinite; }
@keyframes ctw { 0%,100%{opacity:.12} 50%{opacity:.6} }

.cmap { position: absolute; inset: 0; z-index: 1; }
.crings { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); pointer-events: none; }
.crings circle { fill: none; stroke: var(--hairline); stroke-width: 1; }
.crings .dash { stroke: var(--hairline-2); stroke-dasharray: 2 8; }
.csweep { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); border-radius: 50%;
  pointer-events: none; mix-blend-mode: screen;
  background: conic-gradient(from 0deg, rgba(25,227,194,0) 0deg, rgba(25,227,194,0) 300deg, rgba(25,227,194,.16) 350deg, rgba(84,255,228,.42) 360deg); }
.clinks { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.clinks line { stroke: var(--teal); stroke-width: 1; opacity: 0; transition: opacity .3s; }

.chub { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 128px; height: 128px;
  border-radius: 50%; display: grid; place-items: center; z-index: 5;
  background: radial-gradient(circle at 50% 40%, rgba(25,227,194,.14), rgba(8,8,16,.92) 70%); border: 1px solid var(--hairline-2); }
.chub::before, .chub::after { content:''; position:absolute; inset:-10px; border-radius:50%; border:1px solid var(--teal); opacity:0; animation: chp 3s var(--ease-out) infinite; }
.chub::after { animation-delay: 1.5s; }
@keyframes chp { 0%{opacity:.5;transform:scale(.96)} 100%{opacity:0;transform:scale(1.5)} }
.chub .mk { width: 62px; height: 40px; color: var(--ink); display:inline-block; }

.cfield { position: absolute; left: 50%; top: 50%; z-index: 4; }
.cnode { position: absolute; left: 0; top: 0; width: 15px; height: 15px; margin: -7.5px 0 0 -7.5px; cursor: pointer; z-index: 4; }
.cnode .dot { width: 15px; height: 15px; border-radius: 50%; transition: transform .3s var(--ease-spring); }
.cnode .halo { position: absolute; inset: -8px; border-radius: 50%; border: 1px solid currentColor; opacity: .35; }
.cnode:hover .dot { transform: scale(1.9); }

.ctip { position: fixed; z-index: 40; pointer-events: none; opacity: 0; transform: translateY(6px); transition: opacity .22s, transform .22s;
  min-width: 200px; max-width: 250px; background: rgba(12,12,22,.92); backdrop-filter: blur(10px); border: 1px solid var(--hairline-2);
  border-radius: 14px; padding: 14px 16px; }
.ctip.on { opacity: 1; transform: translateY(0); }
.ctip .ty { color: var(--teal); margin-bottom: 7px; }
.ctip .ti { font-family: var(--font-display); font-weight: 700; font-size: 18px; line-height: 1.05; }
.ctip .ds { color: var(--ink-soft); font-size: 12.5px; line-height: 1.5; margin-top: 7px; font-weight: 300; }
.ctip .go { color: var(--teal); font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; margin-top: 9px; }

.chead-hero { position: absolute; left: 0; right: 0; top: 21%; text-align: center; width: auto; z-index: 6; pointer-events: none; padding: 0 20px; }
.chead-hero .k { margin: 0 0 10px; color: var(--ink-soft); text-shadow: 0 1px 10px rgba(4,4,10,.9); }
.chead-hero h1 { font-family: var(--font-display); font-weight: 800; letter-spacing: -.02em; line-height: .9;
  font-size: clamp(40px,7vw,92px); margin: 0;
  background: linear-gradient(100deg, var(--teal-hi), #7aa8ff 55%, var(--magenta)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.clegend { position: absolute; left: 50%; bottom: 8%; transform: translateX(-50%); z-index: 6; display: flex; gap: 18px; flex-wrap: wrap; justify-content: center; }
.clegend span { display: flex; align-items: center; gap: 7px; }
.clegend .sw { width: 9px; height: 9px; border-radius: 50%; }
@media (max-width: 640px){ .clegend { display: none; } }