:root{
  --purple:#9b6dff;
  --purple-dim:#5f3fb8;
  --blue:#4fc3ff;
  --pink:#ff6ec7;
  --text:#e9e4ff;
  --text-dim:#9c93c4;
  --card-bg:rgba(20,15,40,0.55);
  --card-border:rgba(155,109,255,0.25);
}
*{box-sizing:border-box; margin:0; padding:0;}
html,body{
  background:#07050f;
  color:var(--text);
  font-family:'Sora',sans-serif;
  overflow-x:hidden;
}

*, *::before, *::after {
  cursor: none;
}

/* ---- background video (assets/img/background/rwyn_nebula_extended.mp4) keep the file name otherwise breaks, until i replace it ---- */
video.bg-video{
  position:fixed; inset:0; width:100%; height:100%;
  object-fit:cover; z-index:0;
}
.bg-tint{
  position:fixed; inset:0; z-index:0;
  background:linear-gradient(180deg, rgba(5,3,15,.55) 0%, rgba(5,3,15,.25) 35%, rgba(5,3,15,.75) 100%);
}
canvas#field{ position:fixed; inset:0; width:100%; height:100%; z-index:1; mix-blend-mode:screen; opacity:.8; }

.cursor-glow{
  position:fixed; top:0; left:0; width:26px; height:26px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(155,109,255,0.85), rgba(79,195,255,0.18) 60%, transparent 70%);
  pointer-events:none; z-index:9999;
  transform:translate(-50%,-50%);
  mix-blend-mode:screen;
}
@media(hover:none){ .cursor-glow{display:none;} }

nav.main-nav ul{list-style:none; display:flex; gap:26px; flex-wrap:wrap;}
nav.main-nav a{
  color:var(--text-dim); text-decoration:none; font-size:14.5px;
  font-family:'JetBrains Mono',monospace; letter-spacing:.04em;
  padding-bottom:4px; border-bottom:1px solid transparent;
  transition:color .3s ease, border-color .3s ease;
}
nav.main-nav a:hover, nav.main-nav a.active{ color:var(--text); border-color:var(--purple); }

section h2.section-title{
  font-size:13px; font-family:'JetBrains Mono',monospace;
  letter-spacing:.16em; text-transform:uppercase;
  color:var(--text-dim); margin-bottom:20px;
  display:flex; align-items:center; gap:10px;
}
section h2.section-title::after{content:''; flex:1; height:1px; background:linear-gradient(90deg,var(--card-border),transparent);}

.brand{display:flex; align-items:center; gap:12px;}
.brand img{width:40px; height:40px; border-radius:9px; opacity:.9;}
.brand h1, h1.page-title{
  font-size:clamp(38px,6.5vw,56px);
  font-weight:600; letter-spacing:-.02em;
  background:linear-gradient(120deg,#fff 0%, var(--purple) 55%, var(--blue) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* ---- shared site footer, injected on every page by site.js so it only needs editing in one place ---- */
.site-footer{
  position:relative; z-index:2; text-align:center; padding:22px 6vw 30px;
  font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--text-dim); opacity:.55;
  letter-spacing:.03em;
}
.site-footer a{ color:var(--text-dim); text-decoration:none; transition:color .3s ease; }
.site-footer a:hover{ color:var(--purple); }