.features { grid-template-columns: 1fr; }
@media (min-width: 768px) { .features { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1024px) { .features { grid-template-columns: repeat(3,1fr); } }
.feature { display: grid; gap: 6px; }
.feature__icon { width: 44px; height: 44px; border-radius: 12px; display: inline-grid; place-items: center; background: #161b2a; color: #c6cbff; margin-bottom: 8px; }

:root{
    --bg-1:#0f0a1f; --bg-2:#241a46; --bg-3:#3a2a6b; --text:#ffffff; --muted:#c9c6d9; --grad-start:#f540fa; --grad-mid:#7a64fb; --grad-end:#4c65fe;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  body{font-family:Inter,system-ui,sans-serif;color:var(--text);}
  .features{padding:80px 0;max-width:1120px;margin:auto;text-align:center;}
  .features__title{font-size:clamp(28px,4vw,48px);font-weight:800;margin-bottom:50px;}
  .features__title span{background:linear-gradient(90deg,var(--grad-start),var(--grad-mid),var(--grad-end));-webkit-background-clip:text;background-clip:text;color:transparent;}
  .features__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;}
  .feature-card{background:rgba(255,255,255,.05);border-radius:16px;padding:32px;text-align:left;position:relative;box-shadow:0 0 0 1px rgba(255,255,255,.05);}
  .feature-icon{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,var(--grad-start),var(--grad-end));display:flex;align-items:center;justify-content:center;position:absolute;top:-24px;left:24px;box-shadow:0 4px 12px rgba(0,0,0,.4);}
  .feature-icon svg{width:24px;height:24px;stroke:#fff;fill:none;stroke-width:2;}
  .feature-title{font-weight:700;margin:24px 0 8px;font-size:18px;}
  .feature-desc{color:var(--muted);font-size:15px;line-height:1.5;margin-bottom:16px;}
  .feature-link{color:#fff;font-size:14px;text-decoration:none;transition:opacity .2s;}
  .feature-link:hover{opacity:.8;}