/* ------------------------------------------------------------------
   NYENDRA — landing screen
   Three visual systems, kept separate: wordmark / plexus / digital rain
------------------------------------------------------------------ */

:root{
  --ink: #ffffff;
  --void: #000000;
  --stroke-w: 1.15;
}

*{ box-sizing:border-box; }

html,body{
  margin:0; padding:0; height:100%;
  background:var(--void);
  overflow:hidden;
}

body{
  color:var(--ink);
  font-family: ui-monospace, "SF Mono", Consolas, "Courier New", monospace;
  -webkit-font-smoothing:antialiased;
}

.sr{
  position:absolute; width:1px; height:1px;
  margin:-1px; padding:0; border:0;
  clip:rect(0 0 0 0); clip-path:inset(50%);
  overflow:hidden; white-space:nowrap;
}

/* ---------- stage ---------- */

.scene{
  position:fixed; inset:0;
  background:#000;
  isolation:isolate;
}

.layer{
  position:absolute; inset:0;
  width:100%; height:100%;
  display:block;
  pointer-events:none;
}

/* ambient light sitting behind the animation — the "breathing" of the mark */
.glow{
  z-index:0;
  opacity:0;
  background:
    radial-gradient(58% 130% at 50% 50%,
      rgba(255,255,255,.055) 0%,
      rgba(255,255,255,.022) 38%,
      rgba(255,255,255,0)    72%);
  animation: glowIn 3.4s ease-out .3s forwards;
}
.glow::after{
  content:""; position:absolute; inset:0;
  background:radial-gradient(46% 120% at 50% 50%, rgba(255,255,255,.05), rgba(255,255,255,0) 70%);
  animation: breathe 13s ease-in-out 3s infinite;
}
@keyframes glowIn{ from{opacity:0} to{opacity:1} }
@keyframes breathe{ 0%,100%{opacity:.28} 50%{opacity:.85} }

#plexus{ z-index:1; }
#rain  { z-index:2; }

/* holds the edges of the frame down so the systems fade into darkness */
.vignette{
  z-index:3;
  background:
    radial-gradient(120% 100% at 50% 50%, rgba(0,0,0,0) 48%, rgba(0,0,0,.28) 80%, rgba(0,0,0,.62) 100%);
}

.mark{ z-index:4; }

/* ---------- wordmark ---------- */

.mark svg{
  position:absolute;
  left:50%; top:50%;
  transform:translate(-50%,-50%);
  overflow:visible;
  display:block;
}

/* parallax carrier — moved from JS */
.wm-depth{ will-change:transform; }

.wm path{
  fill:#000;
  fill-opacity:0;
  stroke:#fff;
  stroke-width:var(--stroke-w);
  stroke-linejoin:miter;
  stroke-opacity:.84;
  vector-effect:non-scaling-stroke;
  stroke-dasharray:1 1;
  stroke-dashoffset:1;
  transition:stroke-opacity 1.4s ease;
}

/* intro: trace the outlines into existence, then let the interiors close */
.trace .wm path{
  animation:
    wmTrace 1.35s cubic-bezier(.33,0,.2,1) var(--d) forwards,
    wmFill  1.20s ease-out calc(var(--d) + .9s) forwards;
}
@keyframes wmTrace{ from{stroke-dashoffset:1} to{stroke-dashoffset:0} }
@keyframes wmFill { from{fill-opacity:0}     to{fill-opacity:1}   }

/* reduced-motion / debug: already drawn */
.still .wm path{ stroke-dashoffset:0; fill-opacity:1; }

/* the rare travelling highlight */
.wm-flare path{
  fill:none;
  stroke:#fff;
  stroke-width:calc(var(--stroke-w) * 1.5);
  vector-effect:non-scaling-stroke;
  stroke-dasharray:.055 .945;
  stroke-opacity:.9;
}

/* whole-mark breathing: a couple of percent, nothing more */
.wm{ animation: markBreathe 15s ease-in-out 5s infinite; }
@keyframes markBreathe{ 0%,100%{opacity:.9} 50%{opacity:1} }

@media (prefers-reduced-motion: reduce){
  .glow::after{ animation:none; opacity:.4; }
  .wm{ animation:none; opacity:1; }
  .wm path{ transition:none; }
}