#features{position:relative;padding-top:200px}

/* ── Features Grid ── */
.features-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:20px;
}
@keyframes featBorderShimmer{
  0%{opacity:.6;transform:rotate(0deg)}
  50%{opacity:1;transform:rotate(180deg)}
  100%{opacity:.6;transform:rotate(360deg)}
}
.feat-card{
  position:relative;
  padding:28px 24px;border-radius:20px;
  background:transparent;
  border:none;
  transition:transform .2s;
}
.feat-card::before{
  content:'';
  position:absolute;
  inset:-2px;
  border-radius:22px;
  background:conic-gradient(from 0deg,transparent 0%,rgba(167,139,250,.5) 25%,rgba(244,114,182,.6) 50%,rgba(167,139,250,.5) 75%,transparent 100%);
  animation:featBorderShimmer 3s ease-in-out infinite;
  z-index:0;
  pointer-events:none;
}
.feat-card::after{
  content:'';
  position:absolute;
  inset:2px;
  border-radius:18px;
  background:var(--surface);
  z-index:1;
  pointer-events:none;
  transition:box-shadow .2s;
}
.feat-card:hover{transform:translateY(-3px)}
.feat-card:hover::after{box-shadow:0 0 0 1px rgba(167,139,250,.35)}
.feat-card > *{position:relative;z-index:2}
.feat-card:nth-child(1)::before{animation-delay:0s}
.feat-card:nth-child(2)::before{animation-delay:.35s}
.feat-card:nth-child(3)::before{animation-delay:.7s}
.feat-card:nth-child(4)::before{animation-delay:1.05s}
.feat-card:nth-child(5)::before{animation-delay:1.4s}
.feat-card:nth-child(6)::before{animation-delay:1.75s}
.feat-card:nth-child(7)::before{animation-delay:2.1s}
.feat-card:nth-child(8)::before{animation-delay:2.45s}
.feat-card:nth-child(9)::before{animation-delay:2.8s}
.feat-icon{
  width:44px;height:44px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:16px;
  background:rgba(167,139,250,.12);
}
.feat-card h3{font-size:16px;font-weight:800;margin-bottom:8px}
.feat-card p{font-size:13px;color:var(--text-dim);line-height:1.6}