@import url('/neon-motion.css');
@font-face { font-family: 'Russo One'; src: url('/assets/neon/RussoOne-Regular.ttf') format('truetype'); font-display: swap; }
.neon-canvas { position: absolute; width: 1165px; height: 778px; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(var(--neon-scale, 1)); transform-origin: center; }
.neon-canvas img { position: absolute; display: block; max-width: none; }
.neon-layer, .neon-mask, .neon-ambient { position: absolute; inset: 0; width: 1165px; height: 778px; }
.neon-ambient { filter: blur(7.5px); opacity: .43; }
.neon-ambient img, .neon-lights img { mix-blend-mode: screen; }
.neon-capsule { position: absolute; left: 155px; top: 192px; width: 860px; height: 407px; border-radius: 203.5px; box-sizing: border-box; }
.neon-lights { background: black; overflow: hidden; }
.neon-mask { mask-mode: alpha; mask-repeat: no-repeat; }
.neon-mask-left { mask-image: url('/assets/neon/img10.svg'); mask-size: 1409.5px 778px; mask-position: -600px 0; }
/* The mask extends beyond the canvas in Figma. Keep its full 1700px extent:
   after moving 450px left, its right edge must still cover the full contact. */
.neon-mask-right { width: 1700px; mask-image: url('/assets/neon/img1579040330511.svg'); mask-size: 890.5px 778px; mask-position: 809.5px 0; }
.neon-contact { position: absolute; left: 535px; top: 355px; display: flex; flex-direction: column; gap: 14px; font-family: 'Russo One', sans-serif; letter-spacing: -.6px; color: #f1f1f1; white-space: nowrap; }
.neon-contact span { font-size: 23px; line-height: 26.45px; }
.neon-contact strong { font-size: 48px; line-height: 55px; font-weight: 400; }
.neon-halo { filter: blur(9.5px); border: 17px solid #9ed1ff; opacity: .35; }
.neon-soft { filter: blur(2px); border: 6px solid #9ed1ff; opacity: .67; }
.neon-outline { border: 2.6px solid #9ed1ff; opacity: .95; }
.neon-core { border: .9px solid #9ed1ff; opacity: .7; }
.neon-phone { position: absolute; left: 671px; top: 258px; width: 277px; height: 277px; }
.neon-paused *, .neon-paused { animation-play-state: paused !important; }
@media (prefers-reduced-motion: reduce) {
  .neon-canvas * { animation: none !important; }
  .word-solve, .word-repair { opacity: 0; }
}