// Minimal geometric icons for the service cards — line-based, no slop SVG.
const Icon = {
  Chip: ({ size = 28 }) => (
    <svg width={size} height={size} viewBox="0 0 28 28" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round" strokeLinejoin="round">
      <rect x="7" y="7" width="14" height="14" rx="2"/>
      <rect x="11" y="11" width="6" height="6" rx="0.5"/>
      <path d="M11 4v3M14 4v3M17 4v3"/>
      <path d="M11 21v3M14 21v3M17 21v3"/>
      <path d="M4 11h3M4 14h3M4 17h3"/>
      <path d="M21 11h3M21 14h3M21 17h3"/>
    </svg>
  ),
  Code: ({ size = 28 }) => (
    <svg width={size} height={size} viewBox="0 0 28 28" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round" strokeLinejoin="round">
      <path d="M9 8 4 14l5 6"/>
      <path d="M19 8l5 6-5 6"/>
      <path d="M16 5l-4 18"/>
    </svg>
  ),
  Device: ({ size = 28 }) => (
    <svg width={size} height={size} viewBox="0 0 28 28" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round" strokeLinejoin="round">
      <rect x="6" y="3"  width="10" height="18" rx="2"/>
      <path d="M11 18h0.01"/>
      <rect x="14" y="9" width="10" height="16" rx="2"/>
      <path d="M19 22h0.01"/>
    </svg>
  ),
  Arrow: ({ size = 14, className = "" }) => (
    <svg className={className} width={size} height={size} viewBox="0 0 14 14" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round">
      <path d="M2 7h10M8 3l4 4-4 4"/>
    </svg>
  ),
};
window.Icon = Icon;