:root{
  --fx-border:linear-gradient(var(--surface),var(--surface)) padding-box,conic-gradient(from var(--angle),rgba(96,165,250,.18),var(--cyan-light),var(--blue-light),rgba(96,165,250,.18)) border-box;
}

@property --angle{
  syntax:"<angle>";
  initial-value:0deg;
  inherits:false;
}

@keyframes rotateBorder{
  to{--angle:360deg}
}

@keyframes loaderSpin{
  to{transform:rotate(360deg)}
}

@keyframes loaderPulse{
  0%,100%{opacity:.55}
  50%{opacity:1}
}

.card,.proof,.review,.hero-panel,.tool,.nav-submenu{
  border:1px solid transparent;
  background:var(--fx-border);
  animation:rotateBorder 9s linear infinite;
}

.card:nth-child(2n),.proof:nth-child(2n),.review:nth-child(2n),.tool:nth-child(2n){
  animation-duration:12s;
}

.page-loader{
  position:fixed;
  inset:0;
  z-index:9999;
  display:grid;
  place-items:center;
  gap:1rem;
  background:radial-gradient(ellipse 70% 55% at 50% 40%,rgba(37,99,235,.18),transparent 60%),var(--bg);
  opacity:1;
  visibility:visible;
  transition:opacity .32s ease,visibility .32s ease;
}

.page-loader.is-hidden{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

.page-loader-inner{
  display:grid;
  place-items:center;
  gap:1rem;
}

.page-loader img{
  width:88px;
  height:auto;
  animation:loaderSpin 1.1s linear infinite;
  filter:drop-shadow(0 0 24px rgba(96,165,250,.35));
}

.page-loader span{
  font-family:'JetBrains Mono',monospace;
  font-size:.78rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--cyan-light);
  animation:loaderPulse 1.4s ease-in-out infinite;
}

.cursor-orb,.cursor-ring{
  position:fixed;
  top:0;
  left:0;
  z-index:9998;
  pointer-events:none;
  border-radius:999px;
  transform:translate3d(-50%,-50%,0);
  opacity:0;
  transition:opacity .18s ease, width .18s ease, height .18s ease, border-color .18s ease;
}

.cursor-orb{
  width:8px;
  height:8px;
  background:var(--cyan-light);
  box-shadow:0 0 20px rgba(34,211,238,.8);
}

.cursor-ring{
  width:34px;
  height:34px;
  border:1px solid rgba(96,165,250,.7);
  box-shadow:0 0 28px rgba(37,99,235,.22);
}

.cursor-active .cursor-orb,.cursor-active .cursor-ring{opacity:1}
.cursor-hover .cursor-ring{
  width:54px;
  height:54px;
  border-color:var(--cyan-light);
}

@media (pointer:fine){
  body.cursor-active,body.cursor-active a,body.cursor-active button{cursor:none}
}

@media (prefers-reduced-motion:reduce){
  .card,.proof,.review,.hero-panel,.tool,.nav-submenu{animation:none}
  .page-loader img,.page-loader span{animation:none}
  .cursor-orb,.cursor-ring{display:none}
}

@media (pointer:coarse){
  .cursor-orb,.cursor-ring{display:none}
}