/* features.css */
.features-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:1px; background:var(--border); border-radius:var(--r2); overflow:hidden; }
.feature-card { background:var(--bg2); padding:2rem; position:relative; overflow:hidden; transition:background 0.3s; }
.feature-card:hover { background:var(--bg3); }
.feature-icon { width:48px; height:48px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:1.4rem; margin-bottom:1.2rem; position:relative; z-index:1; }
.fi-green  { background:rgba(74,222,128,0.15); }
.fi-blue   { background:rgba(96,165,250,0.15); }
.fi-purple { background:rgba(167,139,250,0.15); }
.fi-gold   { background:rgba(251,191,36,0.15); }
.fi-coral  { background:rgba(251,113,133,0.15); }
.fi-teal   { background:rgba(45,212,191,0.15); }
.feature-title { font-size:1.1rem; font-weight:700; margin-bottom:0.6rem; }
.feature-desc  { font-size:0.875rem; color:var(--text2); line-height:1.6; margin-bottom:1rem; }
.feature-tags  { display:flex; flex-wrap:wrap; gap:6px; }
.tag { padding:4px 10px; border-radius:100px; font-size:0.7rem; font-weight:600; background:var(--surface2); color:var(--text2); border:1px solid var(--border); }
.feature-glow { position:absolute; width:200px; height:200px; border-radius:50%; top:-50px; right:-50px; pointer-events:none; opacity:0; transition:opacity 0.4s; }
.feature-card:hover .feature-glow { opacity:1; }