.voices{--mx:72%;--my:42%;position:relative;isolation:isolate;min-height:86vh;overflow:hidden;background:#04050a;border-block:1px solid var(--line)}
@media(hover:hover) and (pointer:fine){.voices:not(.voices-static){cursor:none}}
.voices-defs{position:absolute}
.voices-chamber{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:58% 48%;opacity:.28;filter:saturate(.7) brightness(.45);z-index:0;pointer-events:none}
.voices-ghosts,.voices-reveal{position:absolute;inset:0;z-index:1}
.voices-ghosts{opacity:.09;filter:blur(2px) saturate(.35);pointer-events:none}
.voices-reveal{
  z-index:2;
  -webkit-mask-image:radial-gradient(ellipse 14rem 12rem at var(--mx) var(--my),#000 0 28%,rgba(0,0,0,.7) 48%,transparent 78%);
  mask-image:radial-gradient(ellipse 14rem 12rem at var(--mx) var(--my),#000 0 28%,rgba(0,0,0,.7) 48%,transparent 78%);
  filter:url(#voice-ripple);
}
.voice-figure{
  position:absolute;left:var(--x);top:var(--y);width:clamp(160px,20vw,320px);
  transform:translate(-50%,-50%) scale(var(--s,1));display:block;color:inherit;
  -webkit-mask-image:radial-gradient(ellipse 46% 58% at 50% 40%,#000 0 38%,rgba(0,0,0,.55) 58%,transparent 78%);
  mask-image:radial-gradient(ellipse 46% 58% at 50% 40%,#000 0 38%,rgba(0,0,0,.55) 58%,transparent 78%);
  mix-blend-mode:lighten;filter:contrast(1.08) saturate(1.05);
}
.voices-reveal .voice-figure{transition:transform .25s var(--ease),filter .25s}
.voices-reveal .voice-figure:focus-visible{outline:2px solid var(--accent);outline-offset:10px}
.voice-figure img,.voice-figure video{
  width:100%;aspect-ratio:3/4;object-fit:cover;object-position:50% 16%;
  background:transparent;border:0;border-radius:0;box-shadow:none;display:block;
}
.voice-figure video{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none}
.voice-figure video.idle,.voice-figure.is-near video.speaking,.voice-figure.in-window:not(.is-near) video.idle{opacity:1}
.voice-figure.is-near video.idle{opacity:0}
.voice-figure.is-near{transform:translate(-50%,-50%) scale(calc(var(--s,1)*1.05));z-index:2;filter:contrast(1.12) saturate(1.1)}
.voices-window{position:absolute;z-index:3;width:28rem;height:24rem;left:var(--mx);top:var(--my);transform:translate(-50%,-50%);pointer-events:none;border-radius:50%;background:radial-gradient(circle,transparent 38%,rgba(8,10,16,.12) 72%);box-shadow:inset 0 0 90px rgba(183,154,255,.08)}
.voices-window::before,.voices-window::after{content:'';position:absolute;inset:12%;border-radius:50%;border:1px solid rgba(183,154,255,.1);animation:voice-ring 5.4s ease-in-out infinite}
.voices-window::after{inset:22%;animation-delay:-1.8s;opacity:.55}
.voices-hud{position:relative;z-index:4;padding:36px 0 40px;pointer-events:none;max-width:520px}
.voices-hud .text-link{pointer-events:auto}
.voices-hud .mono{color:#b7a8d8;font-size:11px;letter-spacing:.14em;margin-bottom:10px}
.voices-hud strong{display:block;font-family:'Space Grotesk',Arial,sans-serif;font-size:clamp(28px,4vw,48px);letter-spacing:-.05em;min-height:1.1em}
.voices-hud span{display:block;color:var(--muted);margin:8px 0 18px;font-size:15px}
.voices.has-voice .voices-window{box-shadow:inset 0 0 110px rgba(183,154,255,.14)}
.voices-static .voices-reveal,.motion-off .voices-reveal{
  -webkit-mask-image:radial-gradient(ellipse 72% 62% at 52% 44%,#000 10%,transparent 78%);
  mask-image:radial-gradient(ellipse 72% 62% at 52% 44%,#000 10%,transparent 78%);
  filter:none;
}
.voices-static .voices-ghosts,.motion-off .voices-ghosts{opacity:.08;filter:blur(3px)}
.voices-static .voices-window,.motion-off .voices-window{display:none}
.voices-static,.motion-off .voices{cursor:auto}
@keyframes voice-ring{0%,100%{transform:scale(.94);opacity:.18}50%{transform:scale(1.03);opacity:.45}}
@media(max-width:760px){
  .voices{min-height:70vh;cursor:auto}
  .voices-reveal{-webkit-mask-image:radial-gradient(ellipse 10rem 9rem at var(--mx) var(--my),#000 0 36%,transparent 80%);mask-image:radial-gradient(ellipse 10rem 9rem at var(--mx) var(--my),#000 0 36%,transparent 80%)}
  .voices-window{width:17rem;height:15rem}
  .voice-figure{width:clamp(130px,38vw,210px)}
  .voices-hud{padding:24px 0}
}
@media(prefers-reduced-motion:reduce){
  .voices-reveal{-webkit-mask-image:radial-gradient(ellipse 72% 62% at 52% 44%,#000 10%,transparent 78%);mask-image:radial-gradient(ellipse 72% 62% at 52% 44%,#000 10%,transparent 78%);filter:none}
  .voices-ghosts{opacity:.08;filter:blur(3px)}
  .voices-window{display:none}
  .voices{cursor:auto}
}
