/* Minimal, modern, responsive layout */
    :root{
      --accent:#0f62fe;
      --muted:#6b7280;
      --card:#ffffff;
      --bg:#f7f8fb;
      --radius:12px;
      --max:1100px;
    }
    html,body{height:100%;margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:var(--bg);color:#111}
    .wrap{max-width:var(--max);margin:32px auto;padding:20px;}
    header{display:flex;gap:20px;align-items:center;justify-content:space-between}
    .brand{display:flex;gap:12px;align-items:center}
    .logo{width:42px;height:42px;background:linear-gradient(135deg,var(--accent),#6b21a8);border-radius:10px;display:inline-block}
    .brand h1{font-size:18px;margin:0}
    nav a{color:var(--muted);text-decoration:none;margin-left:12px;font-size:14px}
    .hero{display:grid;grid-template-columns:1fr;gap:20px;align-items:center;margin-top:18px}
    @media(min-width:860px){ .hero{grid-template-columns:58% 40%} }
    .hero-left h2{font-size:28px;margin:0 0 12px 0;line-height:1.05}
    .sub{color:var(--muted);margin-bottom:18px}
    .price-row{display:flex;gap:12px;align-items:center;margin:14px 0}
    .price{font-size:24px;color:#0b6623;font-weight:700}
    .cta{background:var(--accent);color:#fff;padding:14px 18px;border-radius:10px;text-decoration:none;display:inline-block;font-weight:600}
    .secondary{background:transparent;border:1px solid #e6e9f2;padding:12px 16px;border-radius:10px;color:var(--muted);text-decoration:none;margin-left:8px}
    .card{background:var(--card);border-radius:var(--radius);padding:18px;box-shadow:0 6px 18px rgba(16,24,40,0.06)}
    .product-image{width:100%;height:320px;border-radius:10px;object-fit:cover;background:#eee;display:block}
    .features{display:grid;grid-template-columns:repeat(1,1fr);gap:12px;margin-top:18px}
    @media(min-width:700px){ .features{grid-template-columns:repeat(3,1fr)} }
    .feature{padding:14px;border-radius:10px;background:linear-gradient(180deg,#fff,#fbfdff);border:1px solid #eef2ff}
    .feature h4{margin:0 0 6px 0;font-size:15px}
    .testimonials{margin-top:20px;display:grid;gap:12px}
    .testimonial{padding:12px;border-radius:10px;background:#0f1724;color:#fff}
    .logos{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:14px}
    .logo-badge{height:32px;opacity:0.8}
    .faq{margin-top:20px}
    footer{margin-top:28px;padding:18px 0;color:var(--muted);font-size:13px;text-align:center}
    small{color:var(--muted);display:block;margin-top:8px}

    
.features {
  display: grid;
  gap: 1.2rem;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  margin-top: 1rem;
}

.features a {
  text-decoration: none;
  color: inherit; /* don’t mess with text color */
  display: block; /* so the whole card is clickable */
}

.feature {
  background: #f9f9f9;
  border-radius: 12px;
  padding: 16px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.feature a {
    text-decoration: none;
}

.feature:hover {
  transform: translateY(-4px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}