.container{
  width:min(var(--container), calc(100% - 2rem));
  margin-inline:auto;
}
.section{
  position:relative;
  padding:6.5rem 0;
}
.section--tight{padding:4.5rem 0}
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  width:max-content;
  max-width:100%;
  border:1px solid var(--line);
  border-radius:999px;
  padding:.45rem .8rem;
  background:rgba(15,23,42,.58);
  color:var(--primary);
  font-family:var(--font-en);
  font-size:.82rem;
  letter-spacing:.02em;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.eyebrow::before{
  content:"";
  width:.55rem;
  height:.55rem;
  border-radius:.2rem;
  background:var(--primary);
  box-shadow:0 0 18px var(--primary);
}
.section-heading{
  margin:1.1rem 0 .8rem;
  font-size:clamp(2rem, 5vw, 4.5rem);
  line-height:1.1;
  letter-spacing:-.04em;
}
.section-heading span,
.gradient-text{
  background:linear-gradient(90deg, var(--primary), var(--violet), var(--orange));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.section-lead{
  margin:0;
  max-width:740px;
  color:var(--muted);
  font-size:1.06rem;
}
.grid{
  display:grid;
  gap:1.15rem;
}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{
  position:relative;
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.018)),
    rgba(11,17,32,.78);
  box-shadow:var(--shadow);
  overflow:hidden;
}
.card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(57,245,200,.12), transparent 34%, rgba(168,85,247,.1));
  opacity:0;
  transition:opacity .28s ease;
  pointer-events:none;
}
.card:hover::after{opacity:1}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.6rem;
  border:1px solid transparent;
  border-radius:999px;
  min-height:3.1rem;
  padding:.7rem 1.2rem;
  font-weight:800;
  transition:transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn--primary{
  background:linear-gradient(135deg, var(--primary), var(--violet));
  color:#020617;
  box-shadow:0 20px 46px rgba(57,245,200,.18);
}
.btn--ghost{
  border-color:var(--line);
  background:rgba(15,23,42,.64);
  color:var(--text);
}
.btn--ghost:hover{border-color:var(--line-strong)}
.btn--small{
  min-height:2.55rem;
  padding:.55rem .95rem;
  font-size:.9rem;
}
.mono{
  font-family:var(--font-en);
  direction:ltr;
  unicode-bidi:embed;
}
.pixel-border{
  box-shadow:
    0 0 0 1px rgba(255,255,255,.06),
    0 0 0 5px rgba(57,245,200,.04),
    var(--shadow);
}
.kicker-dot{
  width:.58rem;
  height:.58rem;
  border-radius:.16rem;
  background:var(--primary);
  display:inline-block;
  box-shadow:0 0 18px var(--primary);
}
.hidden{display:none!important}
.noise{
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:.17;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size:32px 32px;
  mask-image:linear-gradient(to bottom, #000, transparent 82%);
}