:root{
  --brand:#0b0f14;
  --brand-2:#151d27;
  --accent:#b8ff2c;
  --bg:#eef1f4;
  --surface:rgba(255,255,255,.72);
  --surface-2:rgba(246,248,250,.86);
  --text:#07090c;
  --muted:#626b76;
  --border:rgba(9,14,20,.12);
  --grad:linear-gradient(135deg,#111820 0%,#26323f 56%,#b8ff2c 140%);
  --font-sans:"Segoe UI",system-ui,-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  --font-display:"Segoe UI",system-ui,-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  --glass:rgba(255,255,255,.58);
  --glass-dark:rgba(11,15,20,.72);
  --ink:#07090c;
  --lime:#b8ff2c;
  --shadow-glass:0 34px 100px rgba(6,11,18,.22);
  --shadow-lift:0 24px 70px rgba(7,9,12,.16);
}

*{box-sizing:border-box}

html{
  scroll-behavior:smooth;
  scroll-padding-top:96px;
}

body{
  margin:0;
  font-family:var(--font-sans);
  color:var(--text);
  background:
    radial-gradient(circle at 10% 4%, rgba(184,255,44,.32), transparent 28rem),
    radial-gradient(circle at 82% 12%, rgba(255,255,255,.92), transparent 30rem),
    linear-gradient(180deg,#e9edf1 0%,#f7f8f9 44%,#e8ebee 100%);
  overflow-x:hidden;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  opacity:.42;
  background-image:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 220 220' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;
}

img{
  max-width:100%;
  display:block;
}

a{
  color:inherit;
  text-decoration:none;
}

.container{
  width:min(100% - 32px, 1180px);
  margin-inline:auto;
}

.section{
  padding:clamp(72px,9vw,116px) 0;
}

.site-header{
  position:sticky;
  top:14px;
  z-index:50;
  margin-top:14px;
}

.header-inner{
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:10px 12px 10px 14px;
  border:1px solid rgba(255,255,255,.54);
  border-radius:999px;
  background:rgba(255,255,255,.56);
  box-shadow:0 18px 58px rgba(7,9,12,.13), inset 0 1px 0 rgba(255,255,255,.72);
  backdrop-filter:blur(22px) saturate(150%);
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}

.brand-mark{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#0a0d10;
  background:var(--lime);
  font-weight:900;
  letter-spacing:-.07em;
  box-shadow:0 12px 34px rgba(184,255,44,.42);
}

.brand