@charset "utf-8";

/* =========================================================================
   GENIE hero — solid white wordmark + agents on the original frames.
   ========================================================================= */


.genie-wordmark-solid{
  font-family:'Eudoxus Sans', system-ui, sans-serif;
  font-weight:900;
  font-size:clamp(46px, 7vw, 104px);
  line-height:1; letter-spacing:-.01em;
  color:#fff; margin:0;
  text-shadow:0 2px 34px rgba(150,160,255,.4);
}

/* (orbital container styles below are no longer used by the hero — the original
   concentric frames were restored — but kept harmless for reference) */

.genie-orbital{ position:relative; width:min(94vw,960px); aspect-ratio:960 / 480; margin:8px auto 0; }
.genie-orbital .orbit-rings{ position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }

/* central genie orb (the existing video mnemonic) */
.gn-core{
  position:absolute; left:50%; top:52%; transform:translate(-50%,-50%);
  width:clamp(108px,15vw,150px); aspect-ratio:1; border-radius:50%; overflow:hidden; z-index:5;
  box-shadow:0 0 70px 10px rgba(120,92,255,.55), inset 0 -10px 30px rgba(20,8,80,.5);
}
.gn-core video{ width:100%; height:100%; object-fit:cover; transform:scale(1.25); }

/* agent orbs — the .gn-agent box is exactly the orb, so its centre sits ON the ring */
.gn-agent{ position:absolute; } /* transform:translate(-50%,-50%); width:var(--s,46px); height:var(--s,46px); z-index:6;  */
.gn-agent.back{ z-index:2; }
.gn-orb{
  width:var(--s,46px); height:var(--s,46px); border-radius:50%;
  background:#6E63E9;
  border:1px solid rgba(184,174,255,.5);
  box-shadow:0 0 14px 1px rgba(110,99,233,.28);
  display:flex; align-items:center; justify-content:center;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
}
.gn-orb svg{ width:55%; height:55%; stroke:#fff; fill:none; stroke-width:1.7; }
.gn-agent.back .gn-orb{ opacity:.85; box-shadow:0 0 11px 1px rgba(110,99,233,.2); }
/* label floats free of the orb (absolute) so it never shifts the orb off the ring */
.gn-lbl{ position:absolute; left:50%; top:calc(100% + 9px); transform:translateX(-50%);
  font-size:clamp(11px,1vw,13px); font-weight:500; color:#D7DAFF; white-space:nowrap;
  text-shadow:0 1px 8px rgba(8,6,30,.85); }
/* upper agents: label above the orb so it never crosses the rings */
.gn-agent.top .gn-lbl{ top:auto; bottom:calc(100% + 9px); }

/* cursor-driven light-up — no auto motion */
.gn-agent:hover .gn-orb{
  transform:scale(1.1);
  background:#7d72f5;
  box-shadow:0 0 24px 5px rgba(140,120,255,.55);
}

@media (max-width:768px){
  .gn-lbl{ font-size:10px; }
  .genie-orbital{ width:96vw; }
}