/* assets/css/styles.css */
.nl-body{
  min-height: 100%;
  background: var(--nl-grad-1), var(--nl-bg);
}

.nl-topline{
  background: rgba(255,255,255,.04);
  border-bottom: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(10px);
}

.nl-toplink{
  text-decoration: none;
  color: var(--nl-muted);
}
.nl-toplink:hover{ color: #fff; }

.nl-spark{
  width: 10px; height: 10px; border-radius: 999px;
  background: radial-gradient(circle at 30% 30%, var(--nl-b), var(--nl-a));
  box-shadow: 0 0 0 4px rgba(30,230,168,.10);
}

.nl-nav{
  background: rgba(7,10,18,.72);
  border-bottom: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(14px);
}

.navbar .nav-link{
  color: rgba(255,255,255,.78);
  border-radius: 999px;
  padding: .55rem .9rem;
}
.navbar .nav-link:hover{
  color: #fff;
  background: rgba(255,255,255,.06);
}
.navbar .nav-link.active{
  color: #fff;
  background: linear-gradient(135deg, rgba(124,92,255,.20), rgba(30,230,168,.12));
  border: 1px solid rgba(255,255,255,.10);
}

.nl-mark{
  display:inline-grid;
  place-items:center;
  width: 38px; height: 38px;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(124,92,255,.25), rgba(30,230,168,.14));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
}

.nl-muted{ color: var(--nl-muted); }

.nl-hero{
  position: relative;
  overflow: hidden;
  padding-top: 1rem;
}
.nl-hero-tight{ padding-top: .25rem; }

.nl-orb{
  position: absolute;
  filter: blur(26px);
  opacity: .9;
  border-radius: 999px;
  pointer-events: none;
}
.nl-orb-a{
  width: 420px; height: 420px;
  left: -120px; top: -80px;
  background: radial-gradient(circle at 30% 30%, rgba(124,92,255,.55), transparent 60%);
}
.nl-orb-b{
  width: 420px; height: 420px;
  right: -120px; top: -60px;
  background: radial-gradient(circle at 35% 35%, rgba(30,230,168,.45), transparent 60%);
}

.nl-gridline{
  position:absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(circle at 50% 35%, rgba(0,0,0,1), rgba(0,0,0,0) 70%);
  opacity: .55;
  pointer-events: none;
}

.nl-wave{
  position:absolute;
  left: 0; right: 0;
  bottom: -1px;
  width: 100%;
  height: 80px;
  fill: rgba(255,255,255,.04);
}

.nl-section{
  padding: 70px 0;
}
.nl-section-last{
  padding-bottom: 90px;
}

.nl-card{
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--nl-radius);
  padding: 28px;
  box-shadow: var(--nl-shadow);
  position: relative;
  overflow: hidden;
}
.nl-card::before{
  content:"";
  position:absolute;
  inset:-2px;
  background: var(--nl-grad-2);
  opacity: .10;
  pointer-events:none;
  mask-image: radial-gradient(circle at 20% 10%, rgba(0,0,0,1), rgba(0,0,0,0) 60%);
}

.nl-divider{
  height: 1px;
  background: rgba(255,255,255,.10);
}

.nl-mini{
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: var(--nl-radius-sm);
  padding: 16px 16px;
}

.nl-check{
  list-style: none;
  padding-left: 0;
}
.nl-check li{
  position: relative;
  padding-left: 26px;
  margin-bottom: .55rem;
}
.nl-check li::before{
  content:"";
  position:absolute;
  left: 0; top: .35rem;
  width: 14px; height: 14px;
  border-radius: 5px;
  background: linear-gradient(135deg, rgba(124,92,255,.85), rgba(30,230,168,.75));
  box-shadow: 0 0 0 3px rgba(124,92,255,.10);
}

.nl-note{
  background: rgba(255,209,92,.10);
  border: 1px solid rgba(255,209,92,.20);
  border-radius: 14px;
  padding: 12px 14px;
  color: rgba(255,255,255,.82);
}

.nl-side{
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: var(--nl-radius);
  box-shadow: 0 18px 50px rgba(0,0,0,.25);
  position: sticky;
  top: 110px;
}

.nl-badge{
  font-size: 12px;
  padding: .25rem .55rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.05);
  color: rgba(255,255,255,.82);
}
.nl-ico{
  display:inline-grid;
  place-items:center;
  width: 34px; height: 34px;
  border-radius: 12px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
}

.nl-pill{
  border-radius: 999px !important;
}

.nl-table{
  color: rgba(255,255,255,.86);
  --bs-table-bg: transparent;
  --bs-table-border-color: rgba(255,255,255,.10);
}
.nl-table thead th{
  color: rgba(255,255,255,.92);
}

.nl-footer{
  border-top: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  padding: 44px 0;
}
.nl-ftitle{
  font-weight: 600;
  margin-bottom: .6rem;
}
.nl-flinks a{
  display: inline-block;
  padding: .2rem 0;
  color: rgba(255,255,255,.76);
  text-decoration: none;
}

/* Slightly increase vertical spacing for section blocks site-wide */
[class*="-section"] {
  margin-top: 3.5rem;
}
.nl-flinks a:hover{ color: #fff; text-decoration: underline; }
.nl-footline{
  border-top: 1px dashed rgba(255,255,255,.14);
  padding-top: 14px;
}

.nl-form-status{
  display:none;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
}
.nl-form-status.nl-ok{
  border-color: rgba(30,230,168,.28);
  background: rgba(30,230,168,.10);
}
.nl-form-status.nl-err{
  border-color: rgba(255,77,141,.28);
  background: rgba(255,77,141,.10);
}

.nl-thx{
  padding: 12px 0 4px;
}
.nl-thx-icon{
  width: 74px; height: 74px;
  margin: 0 auto;
  border-radius: 22px;
  display:grid;
  place-items:center;
  font-weight: 700;
  font-size: 30px;
  background: linear-gradient(135deg, rgba(124,92,255,.25), rgba(30,230,168,.18));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 18px 50px rgba(0,0,0,.35);
}

@media (max-width: 991.98px){
  .nl-side{ position: static; top: auto; }
}

.table>:not(caption)>*>*{
  color: rgba(255,255,255,.86);
}