class ServiceCard extends HTMLElement { connectedCallback() { const icon = this.getAttribute('icon') || 'code'; const title = this.getAttribute('title') || 'Service'; const description = this.getAttribute('description') || 'Professional service description'; const link = this.getAttribute('link'); const target = this.getAttribute('target') || '_self'; const content = `

${title}

${description}

`; this.attachShadow({ mode: 'open' }); this.shadowRoot.innerHTML = ` ${link ? `${content}` : content} `; // Initialize feather icons after component is rendered setTimeout(() => { if (this.shadowRoot.querySelector('i')) { feather.replace(); } }, 100); } } customElements.define('service-card', ServiceCard);