/* React Bits SpotlightCard, adapted from the user-supplied CSS for native links. */
.card-spotlight {
  position:relative; border-radius:1.5rem; border:1px solid #222;
  background-color:#111; padding:2rem; overflow:hidden; isolation:isolate;
  --mouse-x:50%; --mouse-y:50%;
  --spotlight-color:rgba(255,255,255,.25);
}
.card-spotlight::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(circle at var(--mouse-x) var(--mouse-y),var(--spotlight-color),transparent 80%);
  opacity:0; transition:opacity .5s ease; pointer-events:none; z-index:0;
}
.card-spotlight > * { position:relative; z-index:1; }
.card-spotlight:focus-visible::before,
.card-spotlight:focus-within::before { opacity:.6; }
.card-spotlight:focus-visible { outline:3px solid #0787cf; outline-offset:5px; }
@media(hover:hover) and (pointer:fine) {
  .card-spotlight:hover::before { opacity:.6; }
}
@media(prefers-reduced-motion:reduce) {
  .card-spotlight::before { transition:none; }
}
