:root{
  --violet: #8B5CF6;
  --orange: #F97316;
  --bg: #070A12;
  --card: rgba(17,27,62,.55);
  --stroke: rgba(148,163,184,.16);
}

html{ scroll-behavior: smooth; }
body{ background: var(--bg); }

.section-anchor{ scroll-margin-top: 88px; }

.holo-grid{
  background-image:
    radial-gradient(circle at 20% 10%, rgba(139,92,246,.15), transparent 35%),
    radial-gradient(circle at 85% 30%, rgba(249,115,22,.12), transparent 38%),
    linear-gradient(to bottom, rgba(255,255,255,.05), transparent 35%),
    linear-gradient(to right, rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size: auto, auto, auto, 72px 72px, 72px 72px;
  background-position: center, center, center, center, center;
}

.noise{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='260' height='260' filter='url(%23n)' opacity='.28'/%3E%3C/svg%3E");
  mix-blend-mode: overlay;
  opacity: .25;
}

.glow-border{
  position: relative;
}
.glow-border::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius: inherit;
  padding:1px;
  background: linear-gradient(120deg, rgba(139,92,246,.55), rgba(34,211,238,.25), rgba(249,115,22,.55));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: .75;
  pointer-events:none;
}
.glow-hover{
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.glow-hover:hover{
  transform: translateY(-3px);
  box-shadow: 0 0 0 1px rgba(139,92,246,.35), 0 0 40px rgba(139,92,246,.25);
}

.reveal{
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 2s ease, transform 6s ease;
}
.reveal.is-in{
  opacity: 1;
  transform: translateY(0);
}

kbd{
  border: 1px solid rgba(148,163,184,.18);
  background: rgba(255,255,255,.05);
  border-radius: .5rem;
  padding: .15rem .4rem;
  font-size: .8em;
}