/* ============================================================
   DevToolsIndia — index.css
   Page-specific styles for index.html
   ============================================================ */

body.has-glow::after{content:'';position:fixed;top:-200px;left:50%;transform:translateX(-50%);width:800px;height:500px;background:radial-gradient(ellipse,rgba(247,129,102,.12) 0%,transparent 70%);pointer-events:none;z-index:0;will-change:transform}
  .hero{position:relative;z-index:1;text-align:center;padding:100px 2rem 80px;max-width:900px;margin:0 auto;animation:fadeUp .6s ease both}
  .hero-eyebrow{display:inline-flex;align-items:center;gap:6px;font-family:'JetBrains Mono',monospace;font-size:.75rem;color:var(--accent);background:rgba(247,129,102,.08);border:1px solid rgba(247,129,102,.2);padding:4px 14px;border-radius:999px;margin-bottom:28px;letter-spacing:.08em;text-transform:uppercase}
  .hero h1{font-size:clamp(2.5rem,7vw,5rem);font-weight:800;line-height:1.05;letter-spacing:-.04em;margin-bottom:20px}
  .hero h1 .highlight{background:linear-gradient(135deg,var(--accent),var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
  .hero p{font-size:1.1rem;color:var(--text2);max-width:500px;margin:0 auto 40px;line-height:1.7;font-weight:400}
  .hero-stats{display:flex;justify-content:center;gap:40px;flex-wrap:wrap}
  .stat{text-align:center}
  .stat-num{font-size:1.8rem;font-weight:800;letter-spacing:-.03em}
  .stat-num.accent{background:linear-gradient(135deg,var(--accent),var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
  .stat-label{font-size:.75rem;color:var(--text3);font-family:'JetBrains Mono',monospace;letter-spacing:.05em;text-transform:uppercase;margin-top:2px}
  .ad-banner-wrap{position:relative;z-index:1;max-width:var(--site-width);width:100%;margin:0 auto 20px;padding:0 2rem}
  .tools-section{position:relative;z-index:1;max-width:var(--site-width);width:100%;margin:0 auto;padding:0 2rem 100px;animation:fadeUp .6s .2s ease both}
  .tools-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1px;background:var(--border);border:1px solid var(--border);border-radius:12px;overflow:hidden}
  .tool-card{background:var(--bg2);padding:28px;text-decoration:none;color:var(--text);display:flex;flex-direction:column;gap:14px;transition:background .15s;position:relative;overflow:hidden}
  .tool-card::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,var(--glow),transparent);opacity:0;transition:opacity .2s}
  .tool-card:hover{background:var(--bg3)}
  .tool-card:hover::before{opacity:1}
  .tool-icon{width:44px;height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
  .tool-card h3{font-size:1rem;font-weight:700;letter-spacing:-.02em}
  .tool-card p{font-size:.85rem;color:var(--text2);line-height:1.6;font-weight:400}
  .tool-tag{display:inline-flex;font-family:'JetBrains Mono',monospace;font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;padding:2px 8px;border-radius:4px;align-self:flex-start;margin-top:auto}
  .tag-ready{color:var(--green);background:rgba(63,185,80,.1);border:1px solid rgba(63,185,80,.2)}
  .tag-soon{color:var(--text3);background:rgba(72,79,88,.2);border:1px solid var(--border)}
  .arrow{position:absolute;top:28px;right:28px;color:var(--text3);font-size:18px;transition:transform .2s,color .2s}
  .tool-card:hover .arrow{transform:translate(3px,-3px);color:var(--accent)}
  .tool-card.soon{pointer-events:none;opacity:.5}
  @media(max-width:600px){.hero{padding:60px 1rem 50px}.tools-section{padding:0 1rem 60px}.tools-grid{grid-template-columns:1fr}.hero-stats{gap:24px}.stat-num{font-size:1.4rem}}