{"id":14,"date":"2026-07-08T19:15:29","date_gmt":"2026-07-08T19:15:29","guid":{"rendered":"https:\/\/kladsoft.com\/?page_id=14"},"modified":"2026-07-08T22:34:24","modified_gmt":"2026-07-08T22:34:24","slug":"home","status":"publish","type":"page","link":"https:\/\/kladsoft.com\/","title":{"rendered":"Home"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"14\" class=\"elementor elementor-14\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5f34374 e-con e-atomic-element e-flexbox-base e-5beef15 \" data-id=\"5f34374\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"5f34374\" data-e-type=\"e-flexbox\" data-id=\"5f34374\">\n    \t\t<div class=\"elementor-element elementor-element-170b604 elementor-widget elementor-widget-html\" data-id=\"170b604\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     KladSoft \u2014 Hero Section (rebuilt)\r\n     Left: text content | Right: code editor widget\r\n     Paste into Elementor HTML widget\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n\r\n<section class=\"kh-section\" id=\"home\">\r\n\r\n  <!-- subtle grid background -->\r\n  <div class=\"kh-grid-bg\" aria-hidden=\"true\"><\/div>\r\n\r\n  <div class=\"kh-inner\">\r\n\r\n    <!-- \u2500\u2500 LEFT \u2500\u2500 -->\r\n    <div class=\"kh-left\">\r\n\r\n      <!-- Available badge -->\r\n      <div class=\"kh-badge\">\r\n        <span class=\"kh-badge-dot\"><\/span>\r\n        Available for new projects\r\n      <\/div>\r\n\r\n      <!-- Heading -->\r\n      <h1 class=\"kh-title\">\r\n        Top Tier Web Design<br>\r\n        <span class=\"kh-title-accent\">and Development<\/span>\r\n      <\/h1>\r\n\r\n      <!-- Description -->\r\n      <p class=\"kh-desc\">\r\n        Welcome to KladSoft \u2014 a specialist web design and development agency focused on custom work within <strong>WordPress<\/strong>, <strong>WooCommerce<\/strong>, and <strong>Shopify<\/strong>. We build websites that perform.\r\n      <\/p>\r\n\r\n      <!-- CTAs -->\r\n      <div class=\"kh-actions\">\r\n        <a href=\"\/contact\/\" class=\"kh-btn-primary\">\r\n          Start a Project\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M7 17L17 7M7 7h10v10\"\/><\/svg>\r\n        <\/a>\r\n        <a href=\"#contact\" class=\"kh-btn-ghost\">\r\n          Schedule a Call\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M22 16.92v3a2 2 0 01-2.18 2 19.79 19.79 0 01-8.63-3.07A19.5 19.5 0 013.07 10a19.79 19.79 0 01-3.07-8.67A2 2 0 012 .84h3a2 2 0 012 1.72c.127.96.361 1.903.7 2.81a2 2 0 01-.45 2.11L6.09 8.91a16 16 0 006 6l1.27-1.27a2 2 0 012.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0122 16.92z\"\/><\/svg>\r\n        <\/a>\r\n      <\/div>\r\n\r\n      <!-- Trust strip -->\r\n      <div class=\"kh-trust\">\r\n        <div class=\"kh-trust-item\">\r\n          <svg viewBox=\"0 0 24 24\"><polyline points=\"20 6 9 17 4 12\"\/><\/svg>\r\n          400+ Projects Delivered\r\n        <\/div>\r\n        <div class=\"kh-trust-sep\"><\/div>\r\n        <div class=\"kh-trust-item\">\r\n          <svg viewBox=\"0 0 24 24\"><polyline points=\"20 6 9 17 4 12\"\/><\/svg>\r\n          8 Years Experience\r\n        <\/div>\r\n        <div class=\"kh-trust-sep\"><\/div>\r\n        <div class=\"kh-trust-item\">\r\n          <svg viewBox=\"0 0 24 24\"><polyline points=\"20 6 9 17 4 12\"\/><\/svg>\r\n          99% Satisfaction\r\n        <\/div>\r\n      <\/div>\r\n\r\n    <\/div><!-- \/kh-left -->\r\n\r\n    <!-- \u2500\u2500 RIGHT: CODE EDITOR \u2500\u2500 -->\r\n    <div class=\"kh-right\">\r\n      <div class=\"kh-editor\">\r\n\r\n        <!-- Title bar -->\r\n        <div class=\"kh-editor-bar\">\r\n          <div class=\"kh-editor-dots\">\r\n            <span class=\"kh-dot kh-dot--red\"><\/span>\r\n            <span class=\"kh-dot kh-dot--yellow\"><\/span>\r\n            <span class=\"kh-dot kh-dot--green\"><\/span>\r\n          <\/div>\r\n          <div class=\"kh-editor-filename\">kladsoft.js<\/div>\r\n          <div class=\"kh-editor-badge\">\r\n            <span class=\"kh-live-dot\"><\/span>\r\n            live\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- Code body -->\r\n        <div class=\"kh-editor-body\">\r\n          <div class=\"kh-code\">\r\n\r\n            <div class=\"kh-line\">\r\n              <span class=\"kh-ln\">1<\/span>\r\n              <span class=\"kh-kw\">const<\/span>\r\n              <span class=\"kh-var\"> KladSoft <\/span>\r\n              <span class=\"kh-op\">= {<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"kh-line\">\r\n              <span class=\"kh-ln\">2<\/span>\r\n              <span class=\"kh-indent\">\r\n                <span class=\"kh-prop\">  role<\/span>\r\n                <span class=\"kh-op\">: <\/span>\r\n                <span class=\"kh-str\">\"Web Design &amp; Development Agency\"<\/span>\r\n                <span class=\"kh-op\">,<\/span>\r\n              <\/span>\r\n            <\/div>\r\n\r\n            <div class=\"kh-line\">\r\n              <span class=\"kh-ln\">3<\/span>\r\n              <span class=\"kh-indent\">\r\n                <span class=\"kh-prop\">  stack<\/span>\r\n                <span class=\"kh-op\">: <\/span>\r\n                <span class=\"kh-op\">[<\/span>\r\n                <span class=\"kh-str\">\"Shopify\"<\/span>\r\n                <span class=\"kh-op\">, <\/span>\r\n                <span class=\"kh-str\">\"WordPress\"<\/span>\r\n                <span class=\"kh-op\">, <\/span>\r\n                <span class=\"kh-str\">\"WooCommerce\"<\/span>\r\n                <span class=\"kh-op\">]<\/span>\r\n                <span class=\"kh-op\">,<\/span>\r\n              <\/span>\r\n            <\/div>\r\n\r\n            <div class=\"kh-line\">\r\n              <span class=\"kh-ln\">4<\/span>\r\n              <span class=\"kh-indent\">\r\n                <span class=\"kh-prop\">  builds<\/span>\r\n                <span class=\"kh-op\">: <\/span>\r\n                <span class=\"kh-op\">[<\/span>\r\n                <span class=\"kh-str\">\"themes\"<\/span>\r\n                <span class=\"kh-op\">, <\/span>\r\n                <span class=\"kh-str\">\"plugins\"<\/span>\r\n                <span class=\"kh-op\">, <\/span>\r\n                <span class=\"kh-str\">\"stores\"<\/span>\r\n                <span class=\"kh-op\">, <\/span>\r\n                <span class=\"kh-str\">\"apps\"<\/span>\r\n                <span class=\"kh-op\">]<\/span>\r\n                <span class=\"kh-op\">,<\/span>\r\n              <\/span>\r\n            <\/div>\r\n\r\n            <div class=\"kh-line\">\r\n              <span class=\"kh-ln\">5<\/span>\r\n              <span class=\"kh-indent\">\r\n                <span class=\"kh-prop\">  projects<\/span>\r\n                <span class=\"kh-op\">: <\/span>\r\n                <span class=\"kh-num\">400<\/span>\r\n                <span class=\"kh-op\">,<\/span>\r\n              <\/span>\r\n            <\/div>\r\n\r\n            <div class=\"kh-line\">\r\n              <span class=\"kh-ln\">6<\/span>\r\n              <span class=\"kh-indent\">\r\n                <span class=\"kh-prop\">  clients<\/span>\r\n                <span class=\"kh-op\">: <\/span>\r\n                <span class=\"kh-num\">200<\/span>\r\n                <span class=\"kh-op\">,<\/span>\r\n              <\/span>\r\n            <\/div>\r\n\r\n            <div class=\"kh-line\">\r\n              <span class=\"kh-ln\">7<\/span>\r\n              <span class=\"kh-indent\">\r\n                <span class=\"kh-prop\">  years<\/span>\r\n                <span class=\"kh-op\">: <\/span>\r\n                <span class=\"kh-num\">8<\/span>\r\n                <span class=\"kh-op\">,<\/span>\r\n              <\/span>\r\n            <\/div>\r\n\r\n            <div class=\"kh-line\">\r\n              <span class=\"kh-ln\">8<\/span>\r\n              <span class=\"kh-indent\">\r\n                <span class=\"kh-prop\">  based<\/span>\r\n                <span class=\"kh-op\">: <\/span>\r\n                <span class=\"kh-str\">\"kladsoft.com\"<\/span>\r\n                <span class=\"kh-op\">,<\/span>\r\n              <\/span>\r\n            <\/div>\r\n\r\n            <div class=\"kh-line\">\r\n              <span class=\"kh-ln\">9<\/span>\r\n              <span class=\"kh-indent\">\r\n                <span class=\"kh-prop\">  status<\/span>\r\n                <span class=\"kh-op\">: <\/span>\r\n                <span class=\"kh-str\">\"open to work\"<\/span>\r\n                <span class=\"kh-op\">,<\/span>\r\n              <\/span>\r\n            <\/div>\r\n\r\n            <div class=\"kh-line\">\r\n              <span class=\"kh-ln\">10<\/span>\r\n              <span class=\"kh-op\">};<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"kh-line kh-line--empty\">\r\n              <span class=\"kh-ln\">11<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"kh-line\">\r\n              <span class=\"kh-ln\">12<\/span>\r\n              <span class=\"kh-op\">$ <\/span>\r\n              <span class=\"kh-var\">KladSoft<\/span>\r\n              <span class=\"kh-op\">.<\/span>\r\n              <span class=\"kh-fn\">build<\/span>\r\n              <span class=\"kh-op\">(<\/span>\r\n              <span class=\"kh-prop\">yourIdea<\/span>\r\n              <span class=\"kh-op\">)<\/span>\r\n              <span class=\"kh-cursor\"><\/span>\r\n            <\/div>\r\n\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- Status bar -->\r\n        <div class=\"kh-editor-status\">\r\n          <span>JavaScript<\/span>\r\n          <span>UTF-8<\/span>\r\n          <span>Ln 12<\/span>\r\n          <span class=\"kh-status-live\">\u25cf Live<\/span>\r\n        <\/div>\r\n\r\n      <\/div><!-- \/kh-editor -->\r\n    <\/div><!-- \/kh-right -->\r\n\r\n  <\/div><!-- \/kh-inner -->\r\n<\/section>\r\n\r\n<style>\r\n\/* \u2500\u2500 Reset \u2500\u2500 *\/\r\n.kh-section, .kh-section * { box-sizing: border-box; margin: 0; padding: 0; }\r\n.kh-section a { text-decoration: none !important; }\r\n\r\n\/* \u2500\u2500 SECTION \u2500\u2500 *\/\r\n.kh-section {\r\n  background: #F0F4FA;\r\n  min-height: 100vh;\r\n  display: flex; align-items: center;\r\n  padding: 120px 28px 80px;\r\n  position: relative; overflow: hidden;\r\n}\r\n\r\n\/* Subtle dot grid background *\/\r\n.kh-grid-bg {\r\n  position: absolute; inset: 0; pointer-events: none;\r\n  background-image: radial-gradient(circle, #C7D5E8 1px, transparent 1px);\r\n  background-size: 28px 28px;\r\n  opacity: 0.45;\r\n}\r\n\r\n\/* \u2500\u2500 INNER 2-COL \u2500\u2500 *\/\r\n.kh-inner {\r\n  max-width: 1180px; margin: 0 auto; width: 100%;\r\n  display: grid; grid-template-columns: 1fr 1fr;\r\n  gap: 64px; align-items: center;\r\n  position: relative; z-index: 1;\r\n}\r\n\r\n\/* \u2500\u2500 LEFT \u2500\u2500 *\/\r\n.kh-badge {\r\n  display: inline-flex; align-items: center; gap: 8px;\r\n  background: #fff;\r\n  border: 1px solid #D1DCF0;\r\n  color: #334155;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.8rem; font-weight: 600;\r\n  padding: 7px 14px; border-radius: 100px;\r\n  margin-bottom: 28px;\r\n  box-shadow: 0 1px 4px rgba(15,23,42,0.06);\r\n}\r\n.kh-badge-dot {\r\n  width: 7px; height: 7px; border-radius: 50%;\r\n  background: #22C55E; flex-shrink: 0;\r\n  box-shadow: 0 0 0 2px rgba(34,197,94,0.25);\r\n  animation: kh-pulse 2s ease-out infinite;\r\n}\r\n@keyframes kh-pulse {\r\n  0%   { box-shadow: 0 0 0 0 rgba(34,197,94,0.5); }\r\n  70%  { box-shadow: 0 0 0 7px rgba(34,197,94,0); }\r\n  100% { box-shadow: 0 0 0 0 rgba(34,197,94,0); }\r\n}\r\n\r\n.kh-title {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: clamp(2.2rem, 4vw, 3.4rem);\r\n  font-weight: 800; color: #0B1C40;\r\n  letter-spacing: -0.03em; line-height: 1.1;\r\n  margin-bottom: 20px;\r\n}\r\n.kh-title-accent {\r\n  color: #38BDF8;\r\n}\r\n\r\n.kh-desc {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 1rem; color: #475569;\r\n  line-height: 1.8; margin-bottom: 32px;\r\n  max-width: 480px;\r\n}\r\n.kh-desc strong { color: #0B1C40; font-weight: 700; }\r\n\r\n\/* CTAs *\/\r\n.kh-actions {\r\n  display: flex; align-items: center; gap: 12px;\r\n  flex-wrap: wrap; margin-bottom: 36px;\r\n}\r\n.kh-btn-primary {\r\n  display: inline-flex; align-items: center; gap: 7px;\r\n  background: #0B1C40; color: #fff !important;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.9rem; font-weight: 700;\r\n  padding: 13px 24px; border-radius: 100px;\r\n  transition: background .2s, transform .15s, box-shadow .2s; line-height: 1;\r\n}\r\n.kh-btn-primary svg { width: 14px; height: 14px; fill: none; stroke: #fff; stroke-width: 2.5; stroke-linecap: round; flex-shrink: 0; }\r\n.kh-btn-primary:hover { background: #38BDF8; transform: translateY(-2px); box-shadow: 0 8px 24px rgba(56,189,248,0.3); }\r\n\r\n.kh-btn-ghost {\r\n  display: inline-flex; align-items: center; gap: 7px;\r\n  background: #fff; color: #334155 !important;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.9rem; font-weight: 600;\r\n  padding: 12px 22px; border-radius: 100px;\r\n  border: 1.5px solid #D1DCF0;\r\n  transition: border-color .2s, color .2s, box-shadow .2s; line-height: 1;\r\n}\r\n.kh-btn-ghost svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; flex-shrink: 0; }\r\n.kh-btn-ghost:hover { border-color: #38BDF8; color: #38BDF8 !important; box-shadow: 0 4px 14px rgba(56,189,248,0.12); }\r\n\r\n\/* Trust strip *\/\r\n.kh-trust {\r\n  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;\r\n}\r\n.kh-trust-item {\r\n  display: flex; align-items: center; gap: 6px;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.8rem; font-weight: 600; color: #64748B;\r\n}\r\n.kh-trust-item svg { width: 14px; height: 14px; fill: none; stroke: #22C55E; stroke-width: 2.5; stroke-linecap: round; flex-shrink: 0; }\r\n.kh-trust-sep { width: 3px; height: 3px; border-radius: 50%; background: #CBD5E1; flex-shrink: 0; }\r\n\r\n\/* \u2500\u2500 RIGHT: CODE EDITOR \u2500\u2500 *\/\r\n.kh-right {\r\n  display: flex; justify-content: center; align-items: center;\r\n}\r\n.kh-editor {\r\n  width: 100%; max-width: 520px;\r\n  background: #1E2030;\r\n  border-radius: 14px;\r\n  overflow: hidden;\r\n  box-shadow:\r\n    0 0 0 1px rgba(255,255,255,0.06),\r\n    0 24px 64px rgba(11,28,64,0.22),\r\n    0 8px 24px rgba(0,0,0,0.15);\r\n}\r\n\r\n\/* Title bar *\/\r\n.kh-editor-bar {\r\n  display: flex; align-items: center; gap: 10px;\r\n  padding: 12px 16px;\r\n  background: #262840;\r\n  border-bottom: 1px solid rgba(255,255,255,0.06);\r\n}\r\n.kh-editor-dots { display: flex; gap: 6px; flex-shrink: 0; }\r\n.kh-dot { width: 12px; height: 12px; border-radius: 50%; display: block; flex-shrink: 0; }\r\n.kh-dot--red    { background: #FF5F57; }\r\n.kh-dot--yellow { background: #FEBC2E; }\r\n.kh-dot--green  { background: #28C840; }\r\n\r\n.kh-editor-filename {\r\n  flex: 1; text-align: center;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.75rem; color: #7C8DB0; font-weight: 500;\r\n}\r\n.kh-editor-badge {\r\n  display: flex; align-items: center; gap: 5px;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.7rem; font-weight: 700; color: #22C55E;\r\n  flex-shrink: 0;\r\n}\r\n.kh-live-dot {\r\n  width: 6px; height: 6px; border-radius: 50%;\r\n  background: #22C55E;\r\n  animation: kh-pulse 2s ease-out infinite;\r\n}\r\n\r\n\/* Code body *\/\r\n.kh-editor-body {\r\n  padding: 20px 20px 16px;\r\n  overflow-x: auto;\r\n}\r\n.kh-code { display: flex; flex-direction: column; gap: 2px; }\r\n\r\n\/* Lines *\/\r\n.kh-line {\r\n  display: flex; align-items: baseline;\r\n  font-family: 'JetBrains Mono', 'Fira Code', 'Cascadia Code', 'Courier New', monospace;\r\n  font-size: 0.82rem; line-height: 1.8; white-space: nowrap;\r\n}\r\n.kh-line--empty { height: 1.5rem; }\r\n.kh-ln {\r\n  width: 28px; flex-shrink: 0;\r\n  color: #3D4A6A; font-size: 0.72rem;\r\n  user-select: none; text-align: right;\r\n  padding-right: 14px;\r\n}\r\n.kh-indent { padding-left: 14px; }\r\n\r\n\/* Syntax colors \u2014 VS Code Dark+ inspired *\/\r\n.kh-kw   { color: #569CD6; }  \/* const, let \u2014 blue *\/\r\n.kh-var  { color: #9CDCFE; }  \/* variable names \u2014 light blue *\/\r\n.kh-prop { color: #9CDCFE; }  \/* property keys *\/\r\n.kh-str  { color: #CE9178; }  \/* strings \u2014 orange *\/\r\n.kh-num  { color: #B5CEA8; }  \/* numbers \u2014 green *\/\r\n.kh-fn   { color: #DCDCAA; }  \/* function names \u2014 yellow *\/\r\n.kh-op   { color: #D4D4D4; }  \/* operators, punctuation \u2014 white *\/\r\n.kh-comment { color: #6A9955; } \/* comments *\/\r\n\r\n\/* Blinking cursor *\/\r\n.kh-cursor {\r\n  display: inline-block;\r\n  width: 2px; height: 1em; background: #38BDF8;\r\n  margin-left: 1px; vertical-align: text-bottom;\r\n  animation: kh-blink 1.1s step-end infinite;\r\n}\r\n@keyframes kh-blink {\r\n  0%, 100% { opacity: 1; }\r\n  50% { opacity: 0; }\r\n}\r\n\r\n\/* Status bar *\/\r\n.kh-editor-status {\r\n  display: flex; align-items: center; gap: 16px;\r\n  padding: 7px 16px;\r\n  background: #0B1C40;\r\n  border-top: 1px solid rgba(255,255,255,0.05);\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.7rem; color: #4A5568;\r\n}\r\n.kh-status-live { color: #22C55E; margin-left: auto; font-weight: 700; }\r\n\r\n\/* \u2500\u2500 RESPONSIVE \u2500\u2500 *\/\r\n@media (max-width: 960px) {\r\n  .kh-inner { grid-template-columns: 1fr; gap: 48px; }\r\n  .kh-section { padding: 100px 24px 64px; }\r\n  .kh-editor { max-width: 100%; }\r\n  .kh-title { font-size: 2.4rem; }\r\n}\r\n@media (max-width: 480px) {\r\n  .kh-section { padding: 90px 16px 56px; }\r\n  .kh-actions { flex-direction: column; }\r\n  .kh-btn-primary, .kh-btn-ghost { width: 100%; justify-content: center; }\r\n  .kh-title { font-size: 2rem; }\r\n  .kh-line { font-size: 0.72rem; }\r\n}\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n  .kh-badge-dot, .kh-live-dot, .kh-cursor { animation: none; }\r\n}\r\n<\/style>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-b04de9b e-con e-atomic-element e-flexbox-base e-1a50fcc \" data-id=\"b04de9b\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"b04de9b\" data-e-type=\"e-flexbox\" data-id=\"b04de9b\">\n    \t\t<div class=\"elementor-element elementor-element-85ce7a3 elementor-widget elementor-widget-html\" data-id=\"85ce7a3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     KladSoft \u2014 Brands \/ Clients Marquee\r\n     Paste into Elementor HTML widget\r\n     3 rows \u00b7 alternating directions \u00b7 edge fade \u00b7 hover pause\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n\r\n<section class=\"ksb-section\">\r\n  <div class=\"ksb-layout\">\r\n\r\n    <!-- Header -->\r\n    <div class=\"ksb-header\">\r\n      <h2 class=\"ksb-title\">Brands we've built for<\/h2>\r\n      <p class=\"ksb-desc\">From fast-growing Shopify stores to enterprise WordPress sites \u2014 a snapshot of the businesses we've partnered with.<\/p>\r\n      <a href=\"\/portfolio\/\" class=\"ksb-cta\">\r\n        View our work\r\n        <span class=\"ksb-cta-arrow\">\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg>\r\n        <\/span>\r\n      <\/a>\r\n    <\/div>\r\n\r\n  <\/div>\r\n\r\n  <!-- \u2500\u2500 ROW 1 \u2014 scrolls RIGHT (left to right) \u2500\u2500 -->\r\n  <div class=\"ksb-row-wrap ksb-fade\">\r\n    <div class=\"ksb-track ksb-track--right\">\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#FFF7ED\"><span style=\"color:#EA580C;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">SA<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Shine Armor<\/span><span class=\"ksb-desc-tile\">Automotive care eCommerce on Shopify<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#F0FDF4\"><span style=\"color:#16A34A;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">PL<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Pleshy<\/span><span class=\"ksb-desc-tile\">Custom Shopify store with interactive product config<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#EFF6FF\"><span style=\"color:#2563EB;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">VB<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Vibe<\/span><span class=\"ksb-desc-tile\">Lifestyle brand Shopify store with custom theme<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#FDF2F8\"><span style=\"color:#BE185D;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">WL<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">With Love<\/span><span class=\"ksb-desc-tile\">Beauty brand with custom swatches & subscriptions<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#F5F3FF\"><span style=\"color:#7C3AED;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">OP<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Our Place<\/span><span class=\"ksb-desc-tile\">Premium cookware \u2014 60% faster, 34% more conversions<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#FFF1F2\"><span style=\"color:#E11D48;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">ND<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Nada<\/span><span class=\"ksb-desc-tile\">Fashion Shopify store with editorial layout<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#ECFDF5\"><span style=\"color:#059669;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">VX<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Vitavix<\/span><span class=\"ksb-desc-tile\">Health supplement store with bundle builder<\/span><\/div>\r\n      <\/div>\r\n\r\n      <!-- Duplicate for seamless loop -->\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#FFF7ED\"><span style=\"color:#EA580C;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">SA<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Shine Armor<\/span><span class=\"ksb-desc-tile\">Automotive care eCommerce on Shopify<\/span><\/div>\r\n      <\/div>\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#F0FDF4\"><span style=\"color:#16A34A;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">PL<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Pleshy<\/span><span class=\"ksb-desc-tile\">Custom Shopify store with interactive product config<\/span><\/div>\r\n      <\/div>\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#EFF6FF\"><span style=\"color:#2563EB;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">VB<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Vibe<\/span><span class=\"ksb-desc-tile\">Lifestyle brand Shopify store with custom theme<\/span><\/div>\r\n      <\/div>\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#FDF2F8\"><span style=\"color:#BE185D;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">WL<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">With Love<\/span><span class=\"ksb-desc-tile\">Beauty brand with custom swatches & subscriptions<\/span><\/div>\r\n      <\/div>\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#F5F3FF\"><span style=\"color:#7C3AED;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">OP<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Our Place<\/span><span class=\"ksb-desc-tile\">Premium cookware \u2014 60% faster, 34% more conversions<\/span><\/div>\r\n      <\/div>\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#FFF1F2\"><span style=\"color:#E11D48;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">ND<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Nada<\/span><span class=\"ksb-desc-tile\">Fashion Shopify store with editorial layout<\/span><\/div>\r\n      <\/div>\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#ECFDF5\"><span style=\"color:#059669;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">VX<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Vitavix<\/span><span class=\"ksb-desc-tile\">Health supplement store with bundle builder<\/span><\/div>\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- \u2500\u2500 ROW 2 \u2014 scrolls LEFT \u2500\u2500 -->\r\n  <div class=\"ksb-row-wrap ksb-fade\" style=\"margin-top:16px\">\r\n    <div class=\"ksb-track ksb-track--left\">\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#FFF7ED\"><span style=\"color:#C2410C;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">LL<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Luxe Liddy<\/span><span class=\"ksb-desc-tile\">Luxury beauty brand with custom Shopify theme<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#F0FDF4\"><span style=\"color:#15803D;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">7M<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">7 Mountains Coffee<\/span><span class=\"ksb-desc-tile\">Artisan coffee brand with subscription boxes<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#EFF6FF\"><span style=\"color:#1D4ED8;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">FT<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Finishing Touches<\/span><span class=\"ksb-desc-tile\">Interior design studio on custom WordPress<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#F0FDFA\"><span style=\"color:#0D9488;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">IH<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Infiniti Healthcare<\/span><span class=\"ksb-desc-tile\">Healthcare site with appointment booking system<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#FDF4FF\"><span style=\"color:#9333EA;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">MD<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Mr Draper<\/span><span class=\"ksb-desc-tile\">Menswear Shopify with stylist quiz<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#FFFBEB\"><span style=\"color:#D97706;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">HK<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Hanako<\/span><span class=\"ksb-desc-tile\">Shopify Plus migration \u2014 speed score 40 \u2192 92<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#FFF1F2\"><span style=\"color:#BE123C;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">BP<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Beauty Pillow<\/span><span class=\"ksb-desc-tile\">Wellness lifestyle brand with email capture flow<\/span><\/div>\r\n      <\/div>\r\n\r\n      <!-- Duplicate -->\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#FFF7ED\"><span style=\"color:#C2410C;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">LL<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Luxe Liddy<\/span><span class=\"ksb-desc-tile\">Luxury beauty brand with custom Shopify theme<\/span><\/div>\r\n      <\/div>\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#F0FDF4\"><span style=\"color:#15803D;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">7M<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">7 Mountains Coffee<\/span><span class=\"ksb-desc-tile\">Artisan coffee brand with subscription boxes<\/span><\/div>\r\n      <\/div>\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#EFF6FF\"><span style=\"color:#1D4ED8;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">FT<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Finishing Touches<\/span><span class=\"ksb-desc-tile\">Interior design studio on custom WordPress<\/span><\/div>\r\n      <\/div>\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#F0FDFA\"><span style=\"color:#0D9488;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">IH<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Infiniti Healthcare<\/span><span class=\"ksb-desc-tile\">Healthcare site with appointment booking system<\/span><\/div>\r\n      <\/div>\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#FDF4FF\"><span style=\"color:#9333EA;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">MD<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Mr Draper<\/span><span class=\"ksb-desc-tile\">Menswear Shopify with stylist quiz<\/span><\/div>\r\n      <\/div>\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#FFFBEB\"><span style=\"color:#D97706;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">HK<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Hanako<\/span><span class=\"ksb-desc-tile\">Shopify Plus migration \u2014 speed score 40 \u2192 92<\/span><\/div>\r\n      <\/div>\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#FFF1F2\"><span style=\"color:#BE123C;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">BP<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Beauty Pillow<\/span><span class=\"ksb-desc-tile\">Wellness lifestyle brand with email capture flow<\/span><\/div>\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- \u2500\u2500 ROW 3 \u2014 scrolls RIGHT \u2500\u2500 -->\r\n  <div class=\"ksb-row-wrap ksb-fade\" style=\"margin-top:16px\">\r\n    <div class=\"ksb-track ksb-track--right\" style=\"animation-duration:52s\">\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#F0FDF4\"><span style=\"color:#166534;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">PS<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Powerplant Solar<\/span><span class=\"ksb-desc-tile\">Solar provider with quote calculator & lead gen<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#F0F9FF\"><span style=\"color:#0369A1;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">CR<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">CraftRoots<\/span><span class=\"ksb-desc-tile\">Artisan WooCommerce store with subscriptions<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#FFF7ED\"><span style=\"color:#92400E;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">BT<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Bloom &amp; Thread<\/span><span class=\"ksb-desc-tile\">Fashion store redesign \u2014 +40% conversion rate<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#F5F3FF\"><span style=\"color:#6D28D9;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">ML<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Meridian Legal<\/span><span class=\"ksb-desc-tile\">Law firm WordPress site with client portal<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#F0FDFA\"><span style=\"color:#0F766E;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">IW<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Ironwood Fitness<\/span><span class=\"ksb-desc-tile\">Fitness brand on monthly maintenance plan<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#FEF9C3\"><span style=\"color:#A16207;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">GX<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">GreenBox Co.<\/span><span class=\"ksb-desc-tile\">Eco brand \u2014 Lighthouse score 48 \u2192 97<\/span><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksb-tile\">\r\n        <div class=\"ksb-logo\" style=\"background:#EFF6FF\"><span style=\"color:#1E40AF;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">SS<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">StackBridge SaaS<\/span><span class=\"ksb-desc-tile\">SaaS company WordPress with custom integrations<\/span><\/div>\r\n      <\/div>\r\n\r\n      <!-- Duplicate -->\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#F0FDF4\"><span style=\"color:#166534;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">PS<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Powerplant Solar<\/span><span class=\"ksb-desc-tile\">Solar provider with quote calculator & lead gen<\/span><\/div>\r\n      <\/div>\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#F0F9FF\"><span style=\"color:#0369A1;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">CR<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">CraftRoots<\/span><span class=\"ksb-desc-tile\">Artisan WooCommerce store with subscriptions<\/span><\/div>\r\n      <\/div>\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#FFF7ED\"><span style=\"color:#92400E;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">BT<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Bloom &amp; Thread<\/span><span class=\"ksb-desc-tile\">Fashion store redesign \u2014 +40% conversion rate<\/span><\/div>\r\n      <\/div>\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#F5F3FF\"><span style=\"color:#6D28D9;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">ML<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Meridian Legal<\/span><span class=\"ksb-desc-tile\">Law firm WordPress site with client portal<\/span><\/div>\r\n      <\/div>\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#F0FDFA\"><span style=\"color:#0F766E;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">IW<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">Ironwood Fitness<\/span><span class=\"ksb-desc-tile\">Fitness brand on monthly maintenance plan<\/span><\/div>\r\n      <\/div>\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#FEF9C3\"><span style=\"color:#A16207;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">GX<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">GreenBox Co.<\/span><span class=\"ksb-desc-tile\">Eco brand \u2014 Lighthouse score 48 \u2192 97<\/span><\/div>\r\n      <\/div>\r\n      <div class=\"ksb-tile\" aria-hidden=\"true\">\r\n        <div class=\"ksb-logo\" style=\"background:#EFF6FF\"><span style=\"color:#1E40AF;font-size:1.4rem;font-weight:800;letter-spacing:-0.04em\">SS<\/span><\/div>\r\n        <div class=\"ksb-meta\"><span class=\"ksb-name\">StackBridge SaaS<\/span><span class=\"ksb-desc-tile\">SaaS company WordPress with custom integrations<\/span><\/div>\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n<style>\r\n\/* \u2500\u2500 Reset \u2500\u2500 *\/\r\n.ksb-section, .ksb-section * { box-sizing: border-box; margin: 0; padding: 0; }\r\n.ksb-section a { text-decoration: none !important; }\r\n\r\n\/* \u2500\u2500 SECTION \u2500\u2500 *\/\r\n.ksb-section {\r\n  background: #fff;\r\n  padding: 88px 0;\r\n  overflow: hidden;\r\n}\r\n\r\n\/* \u2500\u2500 HEADER \u2500\u2500 *\/\r\n.ksb-layout {\r\n  max-width: 1180px; margin: 0 auto; padding: 0 28px;\r\n}\r\n.ksb-header {\r\n  text-align: center; margin-bottom: 52px;\r\n}\r\n.ksb-title {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: clamp(1.9rem, 3.5vw, 2.75rem);\r\n  font-weight: 800; color: #0F172A;\r\n  letter-spacing: -0.025em; line-height: 1.12;\r\n  margin-bottom: 12px;\r\n}\r\n.ksb-desc {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 1rem; color: #64748B; line-height: 1.7;\r\n  max-width: 520px; margin: 0 auto 20px;\r\n}\r\n.ksb-cta {\r\n  display: inline-flex; align-items: center; gap: 10px;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.9rem; font-weight: 700; color: #0F172A;\r\n  transition: color .2s;\r\n}\r\n.ksb-cta-arrow {\r\n  width: 30px; height: 30px; border-radius: 50%;\r\n  background: #38BDF8;\r\n  display: flex; align-items: center; justify-content: center;\r\n  transition: background .2s, transform .2s;\r\n}\r\n.ksb-cta-arrow svg {\r\n  width: 14px; height: 14px; fill: none; stroke: #fff;\r\n  stroke-width: 2.5; stroke-linecap: round;\r\n}\r\n.ksb-cta:hover { color: #38BDF8; }\r\n.ksb-cta:hover .ksb-cta-arrow { background: #0EA5E9; transform: translateX(3px); }\r\n\r\n\/* \u2500\u2500 ROW WRAPPER \u2014 edge fade \u2500\u2500 *\/\r\n.ksb-row-wrap {\r\n  position: relative; overflow: hidden;\r\n}\r\n.ksb-fade::before,\r\n.ksb-fade::after {\r\n  content: '';\r\n  position: absolute; top: 0; bottom: 0; z-index: 2;\r\n  width: 140px; pointer-events: none;\r\n}\r\n.ksb-fade::before {\r\n  left: 0;\r\n  background: linear-gradient(to right, #fff 0%, transparent 100%);\r\n}\r\n.ksb-fade::after {\r\n  right: 0;\r\n  background: linear-gradient(to left, #fff 0%, transparent 100%);\r\n}\r\n\r\n\/* \u2500\u2500 TRACK \u2500\u2500 *\/\r\n.ksb-track {\r\n  display: flex; gap: 14px; width: max-content;\r\n  padding: 8px 0; will-change: transform;\r\n}\r\n.ksb-track--right { animation: ksb-right 42s linear infinite; }\r\n.ksb-track--left  { animation: ksb-left  48s linear infinite; }\r\n\r\n@keyframes ksb-right {\r\n  from { transform: translateX(0); }\r\n  to   { transform: translateX(-50%); }\r\n}\r\n@keyframes ksb-left {\r\n  from { transform: translateX(-50%); }\r\n  to   { transform: translateX(0); }\r\n}\r\n\r\n\/* Pause on hover \u2014 desktop only *\/\r\n@media (min-width: 768px) {\r\n  .ksb-track--right:hover { animation-play-state: paused; }\r\n  .ksb-track--left:hover  { animation-play-state: paused; }\r\n}\r\n\r\n\/* \u2500\u2500 TILE \u2500\u2500 *\/\r\n.ksb-tile {\r\n  display: flex; align-items: center; gap: 14px;\r\n  background: #fff;\r\n  border: 1px solid #E2E8F0;\r\n  border-radius: 14px;\r\n  padding: 14px 18px;\r\n  min-width: 280px; max-width: 320px;\r\n  flex-shrink: 0;\r\n  transition: border-color .2s, box-shadow .2s, transform .2s;\r\n  cursor: default;\r\n}\r\n.ksb-tile:hover {\r\n  border-color: #BAE6FD;\r\n  box-shadow: 0 6px 24px rgba(15,23,42,0.07);\r\n  transform: translateY(-2px);\r\n}\r\n\r\n\/* Logo square *\/\r\n.ksb-logo {\r\n  width: 52px; height: 52px; border-radius: 12px;\r\n  flex-shrink: 0;\r\n  display: flex; align-items: center; justify-content: center;\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n}\r\n\r\n\/* Meta *\/\r\n.ksb-meta {\r\n  display: flex; flex-direction: column; gap: 3px; min-width: 0;\r\n}\r\n.ksb-name {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: 0.9rem; font-weight: 700; color: #0F172A;\r\n  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;\r\n  line-height: 1.2;\r\n}\r\n.ksb-desc-tile {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.76rem; color: #94A3B8;\r\n  line-height: 1.4;\r\n  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;\r\n}\r\n\r\n\/* \u2500\u2500 REDUCED MOTION \u2500\u2500 *\/\r\n@media (prefers-reduced-motion: reduce) {\r\n  .ksb-track--right,\r\n  .ksb-track--left { animation: none; }\r\n}\r\n<\/style>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-dd5ca29 e-con e-atomic-element e-flexbox-base e-f06e5a0 \" data-id=\"dd5ca29\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"dd5ca29\" data-e-type=\"e-flexbox\" data-id=\"dd5ca29\">\n    \t\t<div class=\"elementor-element elementor-element-cc70307 elementor-widget elementor-widget-html\" data-id=\"cc70307\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     KladSoft \u2014 Technology Expertise Section\r\n     Paste into Elementor HTML widget\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n\r\n<section class=\"kte-section\">\r\n  <div class=\"kte-inner\">\r\n\r\n    <!-- Header -->\r\n    <div class=\"kte-header\">\r\n      <div class=\"kte-eyebrow\">Our Stack<\/div>\r\n      <h2 class=\"kte-title\">Our Technology Expertise<\/h2>\r\n      <p class=\"kte-lead\">We work with the platforms and technologies that power the modern web \u2014 chosen because they're the best tools for the job, not because they're trendy.<\/p>\r\n    <\/div>\r\n\r\n    <!-- 3-column grid -->\r\n    <div class=\"kte-cols\">\r\n\r\n      <!-- Col 1: Web Development -->\r\n      <div class=\"kte-col\">\r\n        <div class=\"kte-col-header\">\r\n          <div class=\"kte-col-icon\" style=\"background:#E0F2FE\">\r\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#0369A1\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"16 18 22 12 16 6\"\/><polyline points=\"8 6 2 12 8 18\"\/><\/svg>\r\n          <\/div>\r\n          <h3 class=\"kte-col-title\">Web Development<\/h3>\r\n        <\/div>\r\n        <div class=\"kte-list\">\r\n\r\n          <div class=\"kte-item\">\r\n            <div class=\"kte-logo-wrap\">\r\n              <img decoding=\"async\" src=\"https:\/\/cdn.jsdelivr.net\/gh\/devicons\/devicon\/icons\/php\/php-plain.svg\" alt=\"PHP\" loading=\"lazy\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex'\">\r\n              <span class=\"kte-fallback\" style=\"display:none;background:#777BB4;color:#fff\">PHP<\/span>\r\n            <\/div>\r\n            <span class=\"kte-label\">PHP<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"kte-item\">\r\n            <div class=\"kte-logo-wrap\">\r\n              <img decoding=\"async\" src=\"https:\/\/cdn.jsdelivr.net\/gh\/devicons\/devicon\/icons\/javascript\/javascript-original.svg\" alt=\"JavaScript\" loading=\"lazy\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex'\">\r\n              <span class=\"kte-fallback\" style=\"display:none;background:#F7DF1E;color:#000\">JS<\/span>\r\n            <\/div>\r\n            <span class=\"kte-label\">JavaScript<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"kte-item\">\r\n            <div class=\"kte-logo-wrap\">\r\n              <img decoding=\"async\" src=\"https:\/\/cdn.jsdelivr.net\/gh\/devicons\/devicon\/icons\/html5\/html5-original.svg\" alt=\"HTML5\" loading=\"lazy\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex'\">\r\n              <span class=\"kte-fallback\" style=\"display:none;background:#E34F26;color:#fff\">H5<\/span>\r\n            <\/div>\r\n            <span class=\"kte-label\">HTML5<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"kte-item\">\r\n            <div class=\"kte-logo-wrap\">\r\n              <img decoding=\"async\" src=\"https:\/\/cdn.jsdelivr.net\/gh\/devicons\/devicon\/icons\/css3\/css3-original.svg\" alt=\"CSS3\" loading=\"lazy\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex'\">\r\n              <span class=\"kte-fallback\" style=\"display:none;background:#1572B6;color:#fff\">CSS<\/span>\r\n            <\/div>\r\n            <span class=\"kte-label\">CSS3<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"kte-item\">\r\n            <div class=\"kte-logo-wrap\">\r\n              <img decoding=\"async\" src=\"https:\/\/cdn.jsdelivr.net\/gh\/devicons\/devicon\/icons\/mysql\/mysql-original.svg\" alt=\"MySQL\" loading=\"lazy\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex'\">\r\n              <span class=\"kte-fallback\" style=\"display:none;background:#4479A1;color:#fff\">SQL<\/span>\r\n            <\/div>\r\n            <span class=\"kte-label\">MySQL<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"kte-item\">\r\n            <div class=\"kte-logo-wrap\">\r\n              <img decoding=\"async\" src=\"https:\/\/cdn.jsdelivr.net\/gh\/devicons\/devicon\/icons\/git\/git-original.svg\" alt=\"Git\" loading=\"lazy\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex'\">\r\n              <span class=\"kte-fallback\" style=\"display:none;background:#F05032;color:#fff\">Git<\/span>\r\n            <\/div>\r\n            <span class=\"kte-label\">Git<\/span>\r\n          <\/div>\r\n\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- Col 2: Web Design & Frontend -->\r\n      <div class=\"kte-col\">\r\n        <div class=\"kte-col-header\">\r\n          <div class=\"kte-col-icon\" style=\"background:#F5F3FF\">\r\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#5B21B6\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"12\" cy=\"12\" r=\"10\"\/><path d=\"M2 12h20M12 2a15.3 15.3 0 014 10 15.3 15.3 0 01-4 10 15.3 15.3 0 01-4-10 15.3 15.3 0 014-10z\"\/><\/svg>\r\n          <\/div>\r\n          <h3 class=\"kte-col-title\">Design &amp; Frontend<\/h3>\r\n        <\/div>\r\n        <div class=\"kte-list\">\r\n\r\n          <div class=\"kte-item\">\r\n            <div class=\"kte-logo-wrap\">\r\n              <img decoding=\"async\" src=\"https:\/\/cdn.jsdelivr.net\/gh\/devicons\/devicon\/icons\/figma\/figma-original.svg\" alt=\"Figma\" loading=\"lazy\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex'\">\r\n              <span class=\"kte-fallback\" style=\"display:none;background:#F24E1E;color:#fff\">Fig<\/span>\r\n            <\/div>\r\n            <span class=\"kte-label\">Figma<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"kte-item\">\r\n            <div class=\"kte-logo-wrap\">\r\n              <img decoding=\"async\" src=\"https:\/\/cdn.jsdelivr.net\/gh\/devicons\/devicon\/icons\/jquery\/jquery-original.svg\" alt=\"jQuery\" loading=\"lazy\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex'\">\r\n              <span class=\"kte-fallback\" style=\"display:none;background:#0769AD;color:#fff\">jQ<\/span>\r\n            <\/div>\r\n            <span class=\"kte-label\">jQuery<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"kte-item\">\r\n            <div class=\"kte-logo-wrap\">\r\n              <img decoding=\"async\" src=\"https:\/\/cdn.jsdelivr.net\/gh\/devicons\/devicon\/icons\/vuejs\/vuejs-original.svg\" alt=\"Vue.js\" loading=\"lazy\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex'\">\r\n              <span class=\"kte-fallback\" style=\"display:none;background:#4FC08D;color:#fff\">Vue<\/span>\r\n            <\/div>\r\n            <span class=\"kte-label\">Vue.js<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"kte-item\">\r\n            <div class=\"kte-logo-wrap\">\r\n              <img decoding=\"async\" src=\"https:\/\/cdn.jsdelivr.net\/gh\/devicons\/devicon\/icons\/react\/react-original.svg\" alt=\"React\" loading=\"lazy\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex'\">\r\n              <span class=\"kte-fallback\" style=\"display:none;background:#61DAFB;color:#000\">Re<\/span>\r\n            <\/div>\r\n            <span class=\"kte-label\">React<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"kte-item\">\r\n            <div class=\"kte-logo-wrap\">\r\n              <img decoding=\"async\" src=\"https:\/\/cdn.jsdelivr.net\/gh\/devicons\/devicon\/icons\/sass\/sass-original.svg\" alt=\"SASS\" loading=\"lazy\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex'\">\r\n              <span class=\"kte-fallback\" style=\"display:none;background:#CC6699;color:#fff\">Sass<\/span>\r\n            <\/div>\r\n            <span class=\"kte-label\">SASS \/ CSS<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"kte-item\">\r\n            <div class=\"kte-logo-wrap\">\r\n              <img decoding=\"async\" src=\"https:\/\/cdn.jsdelivr.net\/gh\/devicons\/devicon\/icons\/tailwindcss\/tailwindcss-original.svg\" alt=\"Tailwind\" loading=\"lazy\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex'\">\r\n              <span class=\"kte-fallback\" style=\"display:none;background:#06B6D4;color:#fff\">TW<\/span>\r\n            <\/div>\r\n            <span class=\"kte-label\">Tailwind CSS<\/span>\r\n          <\/div>\r\n\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- Col 3: eCommerce & CMS -->\r\n      <div class=\"kte-col\">\r\n        <div class=\"kte-col-header\">\r\n          <div class=\"kte-col-icon\" style=\"background:#ECFDF5\">\r\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#065F46\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"9\" cy=\"21\" r=\"1\"\/><circle cx=\"20\" cy=\"21\" r=\"1\"\/><path d=\"M1 1h4l2.68 13.39a2 2 0 002 1.61h9.72a2 2 0 002-1.61L23 6H6\"\/><\/svg>\r\n          <\/div>\r\n          <h3 class=\"kte-col-title\">eCommerce &amp; CMS<\/h3>\r\n        <\/div>\r\n        <div class=\"kte-list\">\r\n\r\n          <div class=\"kte-item\">\r\n            <div class=\"kte-logo-wrap\">\r\n              <img decoding=\"async\" src=\"https:\/\/cdn.jsdelivr.net\/gh\/devicons\/devicon\/icons\/shopify\/shopify-original.svg\" alt=\"Shopify\" loading=\"lazy\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex'\">\r\n              <span class=\"kte-fallback\" style=\"display:none;background:#96BF48;color:#fff\">Sh<\/span>\r\n            <\/div>\r\n            <span class=\"kte-label\">Shopify<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"kte-item\">\r\n            <div class=\"kte-logo-wrap\">\r\n              <img decoding=\"async\" src=\"https:\/\/cdn.jsdelivr.net\/gh\/devicons\/devicon\/icons\/wordpress\/wordpress-plain.svg\" alt=\"WordPress\" loading=\"lazy\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex'\">\r\n              <span class=\"kte-fallback\" style=\"display:none;background:#21759B;color:#fff\">WP<\/span>\r\n            <\/div>\r\n            <span class=\"kte-label\">WordPress<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"kte-item\">\r\n            <div class=\"kte-logo-wrap\">\r\n              <!-- WooCommerce doesn't have a devicon, use official CDN -->\r\n              <img decoding=\"async\" src=\"https:\/\/upload.wikimedia.org\/wikipedia\/commons\/thumb\/2\/2a\/WooCommerce_logo.svg\/120px-WooCommerce_logo.svg.png\" alt=\"WooCommerce\" loading=\"lazy\" style=\"object-fit:contain\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex'\">\r\n              <span class=\"kte-fallback\" style=\"display:none;background:#7F54B3;color:#fff\">Woo<\/span>\r\n            <\/div>\r\n            <span class=\"kte-label\">WooCommerce<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"kte-item\">\r\n            <div class=\"kte-logo-wrap\" style=\"background:#fff;border-radius:8px;padding:3px\">\r\n              <img decoding=\"async\" src=\"https:\/\/upload.wikimedia.org\/wikipedia\/commons\/thumb\/0\/0e\/Shopify_logo_2018.svg\/120px-Shopify_logo_2018.svg.png\" alt=\"Shopify Plus\" loading=\"lazy\" style=\"object-fit:contain\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex'\">\r\n              <span class=\"kte-fallback\" style=\"display:none;background:#96BF48;color:#fff\">S+<\/span>\r\n            <\/div>\r\n            <span class=\"kte-label\">Shopify Plus<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"kte-item\">\r\n            <div class=\"kte-logo-wrap\">\r\n              <img decoding=\"async\" src=\"https:\/\/cdn.jsdelivr.net\/gh\/devicons\/devicon\/icons\/elementor\/elementor-original.svg\" alt=\"Elementor\" loading=\"lazy\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex'\">\r\n              <span class=\"kte-fallback\" style=\"display:none;background:#92003B;color:#fff\">El<\/span>\r\n            <\/div>\r\n            <span class=\"kte-label\">Elementor<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"kte-item\">\r\n            <div class=\"kte-logo-wrap\">\r\n              <!-- Liquid \/ Shopify theme language \u2014 use Shopify icon -->\r\n              <div class=\"kte-custom-icon\" style=\"background:linear-gradient(135deg,#96BF48,#5a8a1f)\">\r\n                <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"2.5\" stroke-linecap=\"round\"><path d=\"M6 9H4.5a2.5 2.5 0 000 5H6\"\/><path d=\"M18 9h1.5a2.5 2.5 0 010 5H18\"\/><path d=\"M8 9h8\"\/><path d=\"M8 15h8\"\/><\/svg>\r\n              <\/div>\r\n              <span class=\"kte-fallback\" style=\"display:none\">Liq<\/span>\r\n            <\/div>\r\n            <span class=\"kte-label\">Liquid (Shopify)<\/span>\r\n          <\/div>\r\n\r\n        <\/div>\r\n      <\/div>\r\n\r\n    <\/div><!-- \/kte-cols -->\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\/* \u2500\u2500 Reset \u2500\u2500 *\/\r\n.kte-section, .kte-section * { box-sizing: border-box; margin: 0; padding: 0; }\r\n.kte-section a { text-decoration: none !important; }\r\n\r\n\/* \u2500\u2500 SECTION \u2014 light blue-grey surface matching reference \u2500\u2500 *\/\r\n.kte-section {\r\n  background: #EEF3F9;\r\n  padding: 96px 0;\r\n  position: relative;\r\n}\r\n\r\n\/* \u2500\u2500 INNER \u2500\u2500 *\/\r\n.kte-inner {\r\n  max-width: 1080px; margin: 0 auto; padding: 0 28px;\r\n}\r\n\r\n\/* \u2500\u2500 HEADER \u2500\u2500 *\/\r\n.kte-header {\r\n  text-align: center; margin-bottom: 64px;\r\n}\r\n.kte-eyebrow {\r\n  display: block; font-family: 'Inter', sans-serif;\r\n  font-size: 0.72rem; font-weight: 700;\r\n  letter-spacing: 0.1em; text-transform: uppercase;\r\n  color: #38BDF8; margin-bottom: 12px;\r\n}\r\n.kte-title {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: clamp(1.9rem, 3.5vw, 2.75rem);\r\n  font-weight: 800; color: #0B1C40;\r\n  letter-spacing: -0.025em; line-height: 1.12;\r\n  margin-bottom: 14px;\r\n}\r\n.kte-lead {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 1rem; color: #64748B; line-height: 1.75;\r\n  max-width: 560px; margin: 0 auto;\r\n}\r\n\r\n\/* \u2500\u2500 3-COL LAYOUT \u2500\u2500 *\/\r\n.kte-cols {\r\n  display: grid;\r\n  grid-template-columns: repeat(3, 1fr);\r\n  gap: 24px;\r\n}\r\n\r\n\/* \u2500\u2500 COLUMN \u2500\u2500 *\/\r\n.kte-col {\r\n  background: #fff;\r\n  border-radius: 20px;\r\n  padding: 32px 28px 28px;\r\n  border: 1px solid rgba(15,23,42,0.06);\r\n  box-shadow: 0 2px 16px rgba(15,23,42,0.04);\r\n}\r\n\r\n\/* Col header *\/\r\n.kte-col-header {\r\n  display: flex; align-items: center; gap: 12px;\r\n  margin-bottom: 28px;\r\n  padding-bottom: 20px;\r\n  border-bottom: 1px solid #F1F5F9;\r\n}\r\n.kte-col-icon {\r\n  width: 40px; height: 40px; border-radius: 10px;\r\n  flex-shrink: 0; display: flex; align-items: center; justify-content: center;\r\n}\r\n.kte-col-icon svg { width: 20px; height: 20px; }\r\n.kte-col-title {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: 0.975rem; font-weight: 800;\r\n  color: #0B1C40; line-height: 1.2;\r\n}\r\n\r\n\/* \u2500\u2500 SKILL LIST \u2500\u2500 *\/\r\n.kte-list {\r\n  display: flex; flex-direction: column; gap: 6px;\r\n}\r\n\r\n\/* \u2500\u2500 SKILL ITEM \u2500\u2500 *\/\r\n.kte-item {\r\n  display: flex; align-items: center; gap: 12px;\r\n  padding: 10px 14px;\r\n  background: #F8FAFC;\r\n  border: 1px solid #EEF3F9;\r\n  border-radius: 10px;\r\n  cursor: default;\r\n  transition: background .18s, border-color .18s, transform .18s;\r\n}\r\n.kte-item:hover {\r\n  background: #EFF6FF;\r\n  border-color: #BAE6FD;\r\n  transform: translateX(4px);\r\n}\r\n\r\n\/* Logo wrapper *\/\r\n.kte-logo-wrap {\r\n  width: 28px; height: 28px; flex-shrink: 0;\r\n  display: flex; align-items: center; justify-content: center;\r\n  border-radius: 6px; overflow: hidden;\r\n}\r\n.kte-logo-wrap img {\r\n  width: 26px; height: 26px;\r\n  object-fit: contain; display: block;\r\n}\r\n.kte-custom-icon {\r\n  width: 28px; height: 28px; border-radius: 6px;\r\n  display: flex; align-items: center; justify-content: center;\r\n  flex-shrink: 0;\r\n}\r\n\r\n\/* Fallback initials *\/\r\n.kte-fallback {\r\n  width: 28px; height: 28px; border-radius: 6px;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.55rem; font-weight: 800; letter-spacing: 0.02em;\r\n  text-align: center; line-height: 28px; flex-shrink: 0;\r\n}\r\n\r\n\/* Label *\/\r\n.kte-label {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.875rem; font-weight: 600;\r\n  color: #334155; line-height: 1;\r\n  transition: color .18s;\r\n}\r\n.kte-item:hover .kte-label { color: #0B1C40; }\r\n\r\n\/* \u2500\u2500 RESPONSIVE \u2500\u2500 *\/\r\n@media (max-width: 900px) {\r\n  .kte-cols { grid-template-columns: 1fr; gap: 16px; }\r\n  .kte-col { padding: 24px 20px 20px; }\r\n}\r\n@media (max-width: 580px) {\r\n  .kte-section { padding: 72px 0; }\r\n  .kte-inner { padding: 0 16px; }\r\n  .kte-header { margin-bottom: 40px; }\r\n}\r\n<\/style>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-b57f648 e-con e-atomic-element e-flexbox-base e-b57f648-424e207 \" data-id=\"b57f648\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"b57f648\" data-e-type=\"e-flexbox\" data-id=\"b57f648\">\n    \t\t<div class=\"elementor-element elementor-element-34c5fb6 elementor-widget elementor-widget-html\" data-id=\"34c5fb6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     KladSoft \u2014 Stacking Scroll Cards (Services)\r\n     Paste into Elementor HTML widget\r\n     Each card stacks on top of the previous as you scroll\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n\r\n<section class=\"ksc-section\">\r\n\r\n  <!-- Sticky header -->\r\n  <div class=\"ksc-head\">\r\n    <div class=\"ksc-eyebrow\">What We Offer<\/div>\r\n    <h2 class=\"ksc-title\">Everything your website needs,<br>done exceptionally well.<\/h2>\r\n    <p class=\"ksc-lead\">We don't try to do everything. We go deep on three platforms and make sure every project we ship is something we're proud of.<\/p>\r\n  <\/div>\r\n\r\n  <!-- Stacking cards container -->\r\n  <div class=\"ksc-cards-wrap\" id=\"kscCardsWrap\">\r\n\r\n    <!-- Card 1 \u2014 Dark Navy -->\r\n    <div class=\"ksc-card\" id=\"kscCard1\" style=\"--card-bg:#0B1C40; --card-top:80px\">\r\n      <div class=\"ksc-card-inner\">\r\n        <div class=\"ksc-card-left\">\r\n          <div class=\"ksc-card-num\" style=\"color:rgba(255,255,255,0.2)\">01<\/div>\r\n          <h3 class=\"ksc-card-title\" style=\"color:#fff\">Shopify Development<\/h3>\r\n          <p class=\"ksc-card-desc\" style=\"color:rgba(255,255,255,0.62)\">Custom Shopify stores built for conversion. From theme development and migrations to complex custom features \u2014 we turn Shopify into a serious sales engine that your customers actually enjoy using.<\/p>\r\n          <ul class=\"ksc-card-list\" style=\"--li-color:rgba(255,255,255,0.5);--dot-color:#38BDF8\">\r\n            <li>Custom theme development<\/li>\r\n            <li>Store redesign &amp; migration<\/li>\r\n            <li>Custom sections &amp; features<\/li>\r\n            <li>Conversion optimisation<\/li>\r\n          <\/ul>\r\n          <a href=\"\/shopify-development\/\" class=\"ksc-card-link\" style=\"color:#38BDF8\">\r\n            Learn more\r\n            <svg viewBox=\"0 0 24 24\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg>\r\n          <\/a>\r\n        <\/div>\r\n        <div class=\"ksc-card-right\">\r\n          <div class=\"ksc-visual\" style=\"background:rgba(56,189,248,0.08);border-color:rgba(56,189,248,0.15)\">\r\n            <!-- Shopify visual mockup -->\r\n            <div class=\"ksc-mock-header\" style=\"background:rgba(255,255,255,0.06);border-color:rgba(255,255,255,0.08)\">\r\n              <div class=\"ksc-mock-dots\"><span style=\"background:#FF5F57\"><\/span><span style=\"background:#FEBC2E\"><\/span><span style=\"background:#28C840\"><\/span><\/div>\r\n              <div class=\"ksc-mock-url\" style=\"background:rgba(255,255,255,0.06);color:rgba(255,255,255,0.35)\">yourstore.myshopify.com<\/div>\r\n            <\/div>\r\n            <div class=\"ksc-mock-body\">\r\n              <div class=\"ksc-mock-hero\" style=\"background:rgba(56,189,248,0.1);border-radius:10px;height:90px;display:flex;align-items:center;justify-content:center;margin-bottom:14px\">\r\n                <div style=\"text-align:center\">\r\n                  <div style=\"font-family:'Plus Jakarta Sans',sans-serif;font-size:0.95rem;font-weight:800;color:rgba(255,255,255,0.8);letter-spacing:-0.02em\">Premium Store<\/div>\r\n                  <div style=\"font-size:0.7rem;color:rgba(255,255,255,0.35);margin-top:3px\">Built on Shopify<\/div>\r\n                <\/div>\r\n              <\/div>\r\n              <div style=\"display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px\">\r\n                <div style=\"background:rgba(255,255,255,0.05);border-radius:8px;height:60px;border:1px solid rgba(255,255,255,0.07)\"><\/div>\r\n                <div style=\"background:rgba(56,189,248,0.12);border-radius:8px;height:60px;border:1px solid rgba(56,189,248,0.2)\"><\/div>\r\n                <div style=\"background:rgba(255,255,255,0.05);border-radius:8px;height:60px;border:1px solid rgba(255,255,255,0.07)\"><\/div>\r\n              <\/div>\r\n              <div style=\"margin-top:12px;background:#38BDF8;border-radius:8px;height:36px;display:flex;align-items:center;justify-content:center\">\r\n                <span style=\"font-family:'Inter',sans-serif;font-size:0.75rem;font-weight:700;color:#fff\">Add to Cart<\/span>\r\n              <\/div>\r\n            <\/div>\r\n          <\/div>\r\n          <div class=\"ksc-card-badge\" style=\"background:rgba(56,189,248,0.12);color:#38BDF8;border-color:rgba(56,189,248,0.2)\">\r\n            <svg viewBox=\"0 0 24 24\"><rect x=\"2\" y=\"3\" width=\"20\" height=\"14\" rx=\"2\"\/><path d=\"M8 21h8M12 17v4\"\/><\/svg>\r\n            Shopify\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- Card 2 \u2014 Sky Blue -->\r\n    <div class=\"ksc-card\" id=\"kscCard2\" style=\"--card-bg:#38BDF8; --card-top:100px\">\r\n      <div class=\"ksc-card-inner\">\r\n        <div class=\"ksc-card-left\">\r\n          <div class=\"ksc-card-num\" style=\"color:rgba(255,255,255,0.25)\">02<\/div>\r\n          <h3 class=\"ksc-card-title\" style=\"color:#fff\">WordPress Development<\/h3>\r\n          <p class=\"ksc-card-desc\" style=\"color:rgba(255,255,255,0.7)\">Scalable, fast, and easy-to-manage WordPress websites with clean code and a CMS your team will actually enjoy using. Built for long-term performance, not just launch day.<\/p>\r\n          <ul class=\"ksc-card-list\" style=\"--li-color:rgba(255,255,255,0.6);--dot-color:#0B1C40\">\r\n            <li>Custom WordPress themes<\/li>\r\n            <li>Website redesign<\/li>\r\n            <li>Custom functionality &amp; plugins<\/li>\r\n            <li>Speed optimisation<\/li>\r\n          <\/ul>\r\n          <a href=\"\/wordpress-development\/\" class=\"ksc-card-link\" style=\"color:#0B1C40\">\r\n            Learn more\r\n            <svg viewBox=\"0 0 24 24\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg>\r\n          <\/a>\r\n        <\/div>\r\n        <div class=\"ksc-card-right\">\r\n          <div class=\"ksc-visual\" style=\"background:rgba(255,255,255,0.12);border-color:rgba(255,255,255,0.2)\">\r\n            <div class=\"ksc-mock-header\" style=\"background:rgba(255,255,255,0.12);border-color:rgba(255,255,255,0.15)\">\r\n              <div class=\"ksc-mock-dots\"><span style=\"background:#FF5F57\"><\/span><span style=\"background:#FEBC2E\"><\/span><span style=\"background:#28C840\"><\/span><\/div>\r\n              <div class=\"ksc-mock-url\" style=\"background:rgba(255,255,255,0.15);color:rgba(255,255,255,0.5)\">yourbrand.com<\/div>\r\n            <\/div>\r\n            <div class=\"ksc-mock-body\">\r\n              <div style=\"display:grid;grid-template-columns:1fr 2fr;gap:10px;margin-bottom:10px\">\r\n                <div style=\"background:rgba(255,255,255,0.12);border-radius:8px;height:120px;border:1px solid rgba(255,255,255,0.15)\"><\/div>\r\n                <div>\r\n                  <div style=\"background:rgba(255,255,255,0.18);border-radius:6px;height:14px;margin-bottom:8px\"><\/div>\r\n                  <div style=\"background:rgba(255,255,255,0.1);border-radius:6px;height:10px;margin-bottom:6px;width:80%\"><\/div>\r\n                  <div style=\"background:rgba(255,255,255,0.1);border-radius:6px;height:10px;margin-bottom:6px;width:65%\"><\/div>\r\n                  <div style=\"background:rgba(255,255,255,0.1);border-radius:6px;height:10px;width:75%\"><\/div>\r\n                  <div style=\"margin-top:12px;background:#0B1C40;border-radius:6px;height:30px;width:90px;display:flex;align-items:center;justify-content:center\">\r\n                    <span style=\"font-size:0.65rem;font-weight:700;color:#fff;font-family:'Inter',sans-serif\">Read more \u2192<\/span>\r\n                  <\/div>\r\n                <\/div>\r\n              <\/div>\r\n              <div style=\"background:rgba(255,255,255,0.1);border-radius:6px;height:10px;margin-bottom:6px\"><\/div>\r\n              <div style=\"background:rgba(255,255,255,0.07);border-radius:6px;height:10px;width:85%\"><\/div>\r\n            <\/div>\r\n          <\/div>\r\n          <div class=\"ksc-card-badge\" style=\"background:rgba(255,255,255,0.2);color:#fff;border-color:rgba(255,255,255,0.3)\">\r\n            <svg viewBox=\"0 0 24 24\"><path d=\"M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5\"\/><\/svg>\r\n            WordPress\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- Card 3 \u2014 Deep Indigo -->\r\n    <div class=\"ksc-card\" id=\"kscCard3\" style=\"--card-bg:#1E1B4B; --card-top:120px\">\r\n      <div class=\"ksc-card-inner\">\r\n        <div class=\"ksc-card-left\">\r\n          <div class=\"ksc-card-num\" style=\"color:rgba(255,255,255,0.2)\">03<\/div>\r\n          <h3 class=\"ksc-card-title\" style=\"color:#fff\">WooCommerce Development<\/h3>\r\n          <p class=\"ksc-card-desc\" style=\"color:rgba(255,255,255,0.6)\">Full-featured eCommerce on WordPress \u2014 product configurators, subscription models, payment gateways, and custom checkout flows that convert browsers into buyers.<\/p>\r\n          <ul class=\"ksc-card-list\" style=\"--li-color:rgba(255,255,255,0.5);--dot-color:#A78BFA\">\r\n            <li>Custom product pages &amp; filters<\/li>\r\n            <li>Subscription &amp; bundle builders<\/li>\r\n            <li>Payment gateway integration<\/li>\r\n            <li>WooCommerce optimisation<\/li>\r\n          <\/ul>\r\n          <a href=\"\/woocommerce-development\/\" class=\"ksc-card-link\" style=\"color:#A78BFA\">\r\n            Learn more\r\n            <svg viewBox=\"0 0 24 24\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg>\r\n          <\/a>\r\n        <\/div>\r\n        <div class=\"ksc-card-right\">\r\n          <div class=\"ksc-visual\" style=\"background:rgba(167,139,250,0.08);border-color:rgba(167,139,250,0.18)\">\r\n            <div class=\"ksc-mock-header\" style=\"background:rgba(255,255,255,0.05);border-color:rgba(255,255,255,0.07)\">\r\n              <div class=\"ksc-mock-dots\"><span style=\"background:#FF5F57\"><\/span><span style=\"background:#FEBC2E\"><\/span><span style=\"background:#28C840\"><\/span><\/div>\r\n              <div class=\"ksc-mock-url\" style=\"background:rgba(255,255,255,0.05);color:rgba(255,255,255,0.3)\">yourshop.com\/cart<\/div>\r\n            <\/div>\r\n            <div class=\"ksc-mock-body\">\r\n              <div style=\"margin-bottom:8px;padding:10px;background:rgba(167,139,250,0.1);border-radius:8px;border:1px solid rgba(167,139,250,0.15);display:flex;align-items:center;gap:10px\">\r\n                <div style=\"width:40px;height:40px;border-radius:6px;background:rgba(167,139,250,0.2);flex-shrink:0\"><\/div>\r\n                <div style=\"flex:1\"><div style=\"background:rgba(255,255,255,0.15);border-radius:4px;height:8px;margin-bottom:4px;width:80%\"><\/div><div style=\"background:rgba(255,255,255,0.08);border-radius:4px;height:7px;width:50%\"><\/div><\/div>\r\n                <div style=\"font-family:'Plus Jakarta Sans',sans-serif;font-size:0.8rem;font-weight:700;color:#A78BFA\">$49<\/div>\r\n              <\/div>\r\n              <div style=\"margin-bottom:8px;padding:10px;background:rgba(255,255,255,0.04);border-radius:8px;border:1px solid rgba(255,255,255,0.06);display:flex;align-items:center;gap:10px\">\r\n                <div style=\"width:40px;height:40px;border-radius:6px;background:rgba(255,255,255,0.08);flex-shrink:0\"><\/div>\r\n                <div style=\"flex:1\"><div style=\"background:rgba(255,255,255,0.12);border-radius:4px;height:8px;margin-bottom:4px;width:70%\"><\/div><div style=\"background:rgba(255,255,255,0.06);border-radius:4px;height:7px;width:45%\"><\/div><\/div>\r\n                <div style=\"font-family:'Plus Jakarta Sans',sans-serif;font-size:0.8rem;font-weight:700;color:rgba(255,255,255,0.5)\">$29<\/div>\r\n              <\/div>\r\n              <div style=\"background:#A78BFA;border-radius:8px;height:36px;display:flex;align-items:center;justify-content:center\">\r\n                <span style=\"font-family:'Inter',sans-serif;font-size:0.75rem;font-weight:700;color:#fff\">Checkout Securely<\/span>\r\n              <\/div>\r\n            <\/div>\r\n          <\/div>\r\n          <div class=\"ksc-card-badge\" style=\"background:rgba(167,139,250,0.15);color:#A78BFA;border-color:rgba(167,139,250,0.25)\">\r\n            <svg viewBox=\"0 0 24 24\"><circle cx=\"9\" cy=\"21\" r=\"1\"\/><circle cx=\"20\" cy=\"21\" r=\"1\"\/><path d=\"M1 1h4l2.68 13.39a2 2 0 002 1.61h9.72a2 2 0 002-1.61L23 6H6\"\/><\/svg>\r\n            WooCommerce\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- Card 4 \u2014 Teal\/Emerald -->\r\n    <div class=\"ksc-card\" id=\"kscCard4\" style=\"--card-bg:#064E3B; --card-top:140px\">\r\n      <div class=\"ksc-card-inner\">\r\n        <div class=\"ksc-card-left\">\r\n          <div class=\"ksc-card-num\" style=\"color:rgba(255,255,255,0.2)\">04<\/div>\r\n          <h3 class=\"ksc-card-title\" style=\"color:#fff\">Website Maintenance<\/h3>\r\n          <p class=\"ksc-card-desc\" style=\"color:rgba(255,255,255,0.6)\">Your website, kept fast, secure, and up-to-date every month. Focus on running your business \u2014 we handle the technical side so nothing breaks, and nothing gets missed.<\/p>\r\n          <ul class=\"ksc-card-list\" style=\"--li-color:rgba(255,255,255,0.5);--dot-color:#34D399\">\r\n            <li>Security monitoring &amp; backups<\/li>\r\n            <li>Plugin &amp; theme updates<\/li>\r\n            <li>Performance monitoring<\/li>\r\n            <li>Content updates &amp; support<\/li>\r\n          <\/ul>\r\n          <a href=\"\/website-maintenance\/\" class=\"ksc-card-link\" style=\"color:#34D399\">\r\n            Learn more\r\n            <svg viewBox=\"0 0 24 24\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg>\r\n          <\/a>\r\n        <\/div>\r\n        <div class=\"ksc-card-right\">\r\n          <div class=\"ksc-visual\" style=\"background:rgba(52,211,153,0.07);border-color:rgba(52,211,153,0.15)\">\r\n            <div class=\"ksc-mock-header\" style=\"background:rgba(255,255,255,0.05);border-color:rgba(255,255,255,0.07)\">\r\n              <div class=\"ksc-mock-dots\"><span style=\"background:#FF5F57\"><\/span><span style=\"background:#FEBC2E\"><\/span><span style=\"background:#28C840\"><\/span><\/div>\r\n              <div class=\"ksc-mock-url\" style=\"background:rgba(255,255,255,0.05);color:rgba(255,255,255,0.3)\">Site Health Report<\/div>\r\n            <\/div>\r\n            <div class=\"ksc-mock-body\">\r\n              <div style=\"margin-bottom:8px\">\r\n                <div style=\"display:flex;justify-content:space-between;align-items:center;margin-bottom:4px\">\r\n                  <span style=\"font-family:'Inter',sans-serif;font-size:0.7rem;color:rgba(255,255,255,0.5)\">Security Score<\/span>\r\n                  <span style=\"font-family:'Plus Jakarta Sans',sans-serif;font-size:0.7rem;font-weight:700;color:#34D399\">98<\/span>\r\n                <\/div>\r\n                <div style=\"height:5px;background:rgba(255,255,255,0.08);border-radius:99px;overflow:hidden\">\r\n                  <div style=\"width:98%;height:100%;background:#34D399;border-radius:99px\"><\/div>\r\n                <\/div>\r\n              <\/div>\r\n              <div style=\"margin-bottom:8px\">\r\n                <div style=\"display:flex;justify-content:space-between;align-items:center;margin-bottom:4px\">\r\n                  <span style=\"font-family:'Inter',sans-serif;font-size:0.7rem;color:rgba(255,255,255,0.5)\">Performance<\/span>\r\n                  <span style=\"font-family:'Plus Jakarta Sans',sans-serif;font-size:0.7rem;font-weight:700;color:#34D399\">96<\/span>\r\n                <\/div>\r\n                <div style=\"height:5px;background:rgba(255,255,255,0.08);border-radius:99px;overflow:hidden\">\r\n                  <div style=\"width:96%;height:100%;background:#34D399;border-radius:99px\"><\/div>\r\n                <\/div>\r\n              <\/div>\r\n              <div style=\"margin-bottom:12px\">\r\n                <div style=\"display:flex;justify-content:space-between;align-items:center;margin-bottom:4px\">\r\n                  <span style=\"font-family:'Inter',sans-serif;font-size:0.7rem;color:rgba(255,255,255,0.5)\">Uptime<\/span>\r\n                  <span style=\"font-family:'Plus Jakarta Sans',sans-serif;font-size:0.7rem;font-weight:700;color:#34D399\">100%<\/span>\r\n                <\/div>\r\n                <div style=\"height:5px;background:rgba(255,255,255,0.08);border-radius:99px;overflow:hidden\">\r\n                  <div style=\"width:100%;height:100%;background:#34D399;border-radius:99px\"><\/div>\r\n                <\/div>\r\n              <\/div>\r\n              <div style=\"padding:8px 10px;background:rgba(52,211,153,0.1);border-radius:8px;border:1px solid rgba(52,211,153,0.2);display:flex;align-items:center;gap:8px\">\r\n                <div style=\"width:20px;height:20px;border-radius:50%;background:#34D399;display:flex;align-items:center;justify-content:center;flex-shrink:0\">\r\n                  <svg width=\"10\" height=\"10\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#064E3B\" stroke-width=\"3\" stroke-linecap=\"round\"><polyline points=\"20 6 9 17 4 12\"\/><\/svg>\r\n                <\/div>\r\n                <span style=\"font-family:'Inter',sans-serif;font-size:0.7rem;font-weight:600;color:rgba(255,255,255,0.7)\">All systems healthy<\/span>\r\n              <\/div>\r\n            <\/div>\r\n          <\/div>\r\n          <div class=\"ksc-card-badge\" style=\"background:rgba(52,211,153,0.12);color:#34D399;border-color:rgba(52,211,153,0.2)\">\r\n            <svg viewBox=\"0 0 24 24\"><path d=\"M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z\"\/><\/svg>\r\n            Maintenance\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- Card 5 \u2014 Slate Blue -->\r\n    <div class=\"ksc-card\" id=\"kscCard5\" style=\"--card-bg:#1E3A5F; --card-top:160px\">\r\n      <div class=\"ksc-card-inner\">\r\n        <div class=\"ksc-card-left\">\r\n          <div class=\"ksc-card-num\" style=\"color:rgba(255,255,255,0.2)\">05<\/div>\r\n          <h3 class=\"ksc-card-title\" style=\"color:#fff\">Performance Optimisation<\/h3>\r\n          <p class=\"ksc-card-desc\" style=\"color:rgba(255,255,255,0.6)\">Speed audits and targeted fixes that improve Lighthouse scores, reduce bounce rates, and directly impact conversions. Because slow websites cost you money every single day.<\/p>\r\n          <ul class=\"ksc-card-list\" style=\"--li-color:rgba(255,255,255,0.5);--dot-color:#60A5FA\">\r\n            <li>Full Lighthouse audit<\/li>\r\n            <li>Core Web Vitals fixes<\/li>\r\n            <li>Image &amp; asset optimisation<\/li>\r\n            <li>Caching &amp; CDN setup<\/li>\r\n          <\/ul>\r\n          <a href=\"\/performance-optimization\/\" class=\"ksc-card-link\" style=\"color:#60A5FA\">\r\n            Learn more\r\n            <svg viewBox=\"0 0 24 24\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg>\r\n          <\/a>\r\n        <\/div>\r\n        <div class=\"ksc-card-right\">\r\n          <div class=\"ksc-visual\" style=\"background:rgba(96,165,250,0.06);border-color:rgba(96,165,250,0.14)\">\r\n            <div class=\"ksc-mock-header\" style=\"background:rgba(255,255,255,0.05);border-color:rgba(255,255,255,0.07)\">\r\n              <div class=\"ksc-mock-dots\"><span style=\"background:#FF5F57\"><\/span><span style=\"background:#FEBC2E\"><\/span><span style=\"background:#28C840\"><\/span><\/div>\r\n              <div class=\"ksc-mock-url\" style=\"background:rgba(255,255,255,0.05);color:rgba(255,255,255,0.3)\">PageSpeed Insights<\/div>\r\n            <\/div>\r\n            <div class=\"ksc-mock-body\">\r\n              <div style=\"display:flex;gap:10px;margin-bottom:12px\">\r\n                <div style=\"flex:1;text-align:center\">\r\n                  <div style=\"width:52px;height:52px;border-radius:50%;border:3px solid #34D399;display:flex;align-items:center;justify-content:center;margin:0 auto 4px\">\r\n                    <span style=\"font-family:'Plus Jakarta Sans',sans-serif;font-size:0.85rem;font-weight:800;color:#34D399\">97<\/span>\r\n                  <\/div>\r\n                  <div style=\"font-size:0.6rem;color:rgba(255,255,255,0.35);font-family:'Inter',sans-serif\">Performance<\/div>\r\n                <\/div>\r\n                <div style=\"flex:1;text-align:center\">\r\n                  <div style=\"width:52px;height:52px;border-radius:50%;border:3px solid #34D399;display:flex;align-items:center;justify-content:center;margin:0 auto 4px\">\r\n                    <span style=\"font-family:'Plus Jakarta Sans',sans-serif;font-size:0.85rem;font-weight:800;color:#34D399\">100<\/span>\r\n                  <\/div>\r\n                  <div style=\"font-size:0.6rem;color:rgba(255,255,255,0.35);font-family:'Inter',sans-serif\">SEO<\/div>\r\n                <\/div>\r\n                <div style=\"flex:1;text-align:center\">\r\n                  <div style=\"width:52px;height:52px;border-radius:50%;border:3px solid #34D399;display:flex;align-items:center;justify-content:center;margin:0 auto 4px\">\r\n                    <span style=\"font-family:'Plus Jakarta Sans',sans-serif;font-size:0.85rem;font-weight:800;color:#34D399\">98<\/span>\r\n                  <\/div>\r\n                  <div style=\"font-size:0.6rem;color:rgba(255,255,255,0.35);font-family:'Inter',sans-serif\">Accessibility<\/div>\r\n                <\/div>\r\n              <\/div>\r\n              <div style=\"padding:8px 10px;background:rgba(255,255,255,0.04);border-radius:8px;border:1px solid rgba(255,255,255,0.06)\">\r\n                <div style=\"font-size:0.65rem;color:rgba(255,255,255,0.35);font-family:'Inter',sans-serif;margin-bottom:4px\">Load time<\/div>\r\n                <div style=\"font-family:'Plus Jakarta Sans',sans-serif;font-size:1.1rem;font-weight:800;color:#60A5FA\">0.8s <span style=\"font-size:0.65rem;font-weight:500;color:rgba(255,255,255,0.3)\">\u2193 from 4.2s<\/span><\/div>\r\n              <\/div>\r\n            <\/div>\r\n          <\/div>\r\n          <div class=\"ksc-card-badge\" style=\"background:rgba(96,165,250,0.12);color:#60A5FA;border-color:rgba(96,165,250,0.2)\">\r\n            <svg viewBox=\"0 0 24 24\"><path d=\"M13 2L3 14h9l-1 8 10-12h-9l1-8z\"\/><\/svg>\r\n            Performance\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- Card 6 \u2014 Warm Dark -->\r\n    <div class=\"ksc-card\" id=\"kscCard6\" style=\"--card-bg:#1C1917; --card-top:180px\">\r\n      <div class=\"ksc-card-inner\">\r\n        <div class=\"ksc-card-left\">\r\n          <div class=\"ksc-card-num\" style=\"color:rgba(255,255,255,0.2)\">06<\/div>\r\n          <h3 class=\"ksc-card-title\" style=\"color:#fff\">Custom Development<\/h3>\r\n          <p class=\"ksc-card-desc\" style=\"color:rgba(255,255,255,0.6)\">Bespoke features, third-party integrations, and tailored functionality when off-the-shelf plugins and themes won't cut it. Clean code, built to last.<\/p>\r\n          <ul class=\"ksc-card-list\" style=\"--li-color:rgba(255,255,255,0.5);--dot-color:#FB923C\">\r\n            <li>Custom plugin development<\/li>\r\n            <li>API &amp; third-party integrations<\/li>\r\n            <li>Headless &amp; custom builds<\/li>\r\n            <li>Legacy site modernisation<\/li>\r\n          <\/ul>\r\n          <a href=\"\/custom-development\/\" class=\"ksc-card-link\" style=\"color:#FB923C\">\r\n            Learn more\r\n            <svg viewBox=\"0 0 24 24\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg>\r\n          <\/a>\r\n        <\/div>\r\n        <div class=\"ksc-card-right\">\r\n          <div class=\"ksc-visual\" style=\"background:rgba(251,146,60,0.06);border-color:rgba(251,146,60,0.14)\">\r\n            <div class=\"ksc-mock-header\" style=\"background:rgba(255,255,255,0.04);border-color:rgba(255,255,255,0.06)\">\r\n              <div class=\"ksc-mock-dots\"><span style=\"background:#FF5F57\"><\/span><span style=\"background:#FEBC2E\"><\/span><span style=\"background:#28C840\"><\/span><\/div>\r\n              <div class=\"ksc-mock-url\" style=\"background:rgba(255,255,255,0.04);color:rgba(255,255,255,0.25)\">custom-integration.js<\/div>\r\n            <\/div>\r\n            <div class=\"ksc-mock-body\" style=\"font-family:'Inter',monospace\">\r\n              <div style=\"font-size:0.7rem;line-height:1.8;color:rgba(255,255,255,0.45)\">\r\n                <div><span style=\"color:#60A5FA\">const<\/span> <span style=\"color:#34D399\">integration<\/span> = <span style=\"color:#A78BFA\">await<\/span><\/div>\r\n                <div style=\"padding-left:16px\"><span style=\"color:#FB923C\">KladSoft<\/span>.<span style=\"color:#38BDF8\">build<\/span>({<\/div>\r\n                <div style=\"padding-left:32px\"><span style=\"color:rgba(255,255,255,0.35)\">platform:<\/span> <span style=\"color:#FCD34D\">'shopify'<\/span>,<\/div>\r\n                <div style=\"padding-left:32px\"><span style=\"color:rgba(255,255,255,0.35)\">feature:<\/span> <span style=\"color:#FCD34D\">'custom'<\/span>,<\/div>\r\n                <div style=\"padding-left:32px\"><span style=\"color:rgba(255,255,255,0.35)\">quality:<\/span> <span style=\"color:#34D399\">100<\/span><\/div>\r\n                <div style=\"padding-left:16px\">});<\/div>\r\n                <div style=\"margin-top:8px;color:#34D399\">\/\/ \u2713 Built &amp; deployed<\/div>\r\n                <div style=\"color:rgba(255,255,255,0.2)\">\/\/ Ready in production<\/div>\r\n              <\/div>\r\n            <\/div>\r\n          <\/div>\r\n          <div class=\"ksc-card-badge\" style=\"background:rgba(251,146,60,0.12);color:#FB923C;border-color:rgba(251,146,60,0.2)\">\r\n            <svg viewBox=\"0 0 24 24\"><polyline points=\"16 18 22 12 16 6\"\/><polyline points=\"8 6 2 12 8 18\"\/><\/svg>\r\n            Custom Dev\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n  <\/div><!-- \/ksc-cards-wrap -->\r\n\r\n<\/section>\r\n\r\n<style>\r\n\/* \u2500\u2500 Reset \u2500\u2500 *\/\r\n.ksc-section, .ksc-section * { box-sizing: border-box; margin: 0; padding: 0; }\r\n.ksc-section a { text-decoration: none !important; }\r\n\r\n\/* \u2500\u2500 SECTION \u2500\u2500 *\/\r\n.ksc-section {\r\n  background: #F8FAFC;\r\n  padding: 96px 0 0;\r\n}\r\n\r\n\/* \u2500\u2500 HEADER \u2500\u2500 *\/\r\n.ksc-head {\r\n  text-align: center;\r\n  max-width: 640px; margin: 0 auto 64px; padding: 0 24px;\r\n}\r\n.ksc-eyebrow {\r\n  display: block; font-family: 'Inter', sans-serif;\r\n  font-size: 0.72rem; font-weight: 700;\r\n  letter-spacing: 0.1em; text-transform: uppercase;\r\n  color: #38BDF8; margin-bottom: 12px;\r\n}\r\n.ksc-title {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: clamp(1.9rem, 3.5vw, 2.75rem);\r\n  font-weight: 800; color: #0F172A;\r\n  letter-spacing: -0.025em; line-height: 1.12; margin-bottom: 14px;\r\n}\r\n.ksc-lead {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 1rem; color: #64748B; line-height: 1.75;\r\n}\r\n\r\n\/* \u2500\u2500 CARDS WRAP \u2500\u2500 *\/\r\n.ksc-cards-wrap {\r\n  position: relative;\r\n  \/* total scroll height = number of cards * card scroll increment *\/\r\n  padding-bottom: 0;\r\n}\r\n\r\n\/* \u2500\u2500 INDIVIDUAL CARD \u2500\u2500 *\/\r\n.ksc-card {\r\n  position: sticky;\r\n  top: var(--card-top);\r\n  background: var(--card-bg);\r\n  border-radius: 24px;\r\n  margin: 0 24px 16px;\r\n  max-width: 1180px;\r\n  margin-left: auto; margin-right: auto;\r\n  overflow: hidden;\r\n  \/* Cards build shadow depth as they stack *\/\r\n  box-shadow: 0 -4px 0 rgba(0,0,0,0.15);\r\n  \/* Scale down slightly when buried *\/\r\n  transform-origin: top center;\r\n  transition: transform .1s;\r\n  \/* Ensure last card has bottom padding *\/\r\n  margin-bottom: 16px;\r\n}\r\n.ksc-card:last-child { margin-bottom: 0; }\r\n\r\n\/* \u2500\u2500 CARD INNER (2 columns) \u2500\u2500 *\/\r\n.ksc-card-inner {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 0;\r\n  min-height: 420px;\r\n}\r\n\r\n\/* Left: text *\/\r\n.ksc-card-left {\r\n  padding: 52px 48px 52px 52px;\r\n  display: flex; flex-direction: column; justify-content: center;\r\n}\r\n.ksc-card-num {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.72rem; font-weight: 700;\r\n  letter-spacing: 0.1em; margin-bottom: 14px;\r\n}\r\n.ksc-card-title {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: clamp(1.5rem, 2.5vw, 2rem);\r\n  font-weight: 800; line-height: 1.15;\r\n  letter-spacing: -0.025em; margin-bottom: 14px;\r\n}\r\n.ksc-card-desc {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.925rem; line-height: 1.75;\r\n  margin-bottom: 22px;\r\n}\r\n\r\n\/* Feature list *\/\r\n.ksc-card-list {\r\n  list-style: none;\r\n  display: flex; flex-direction: column; gap: 8px;\r\n  margin-bottom: 28px;\r\n}\r\n.ksc-card-list li {\r\n  display: flex; align-items: center; gap: 9px;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.875rem; color: var(--li-color);\r\n  line-height: 1;\r\n}\r\n.ksc-card-list li::before {\r\n  content: '';\r\n  width: 6px; height: 6px; border-radius: 50%;\r\n  background: var(--dot-color);\r\n  flex-shrink: 0;\r\n}\r\n\r\n\/* CTA link *\/\r\n.ksc-card-link {\r\n  display: inline-flex; align-items: center; gap: 6px;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.9rem; font-weight: 700;\r\n  transition: gap .2s;\r\n}\r\n.ksc-card-link svg {\r\n  width: 16px; height: 16px; fill: none;\r\n  stroke: currentColor; stroke-width: 2.2; stroke-linecap: round;\r\n  transition: transform .2s;\r\n}\r\n.ksc-card-link:hover { gap: 10px; }\r\n.ksc-card-link:hover svg { transform: translateX(3px); }\r\n\r\n\/* Right: visual *\/\r\n.ksc-card-right {\r\n  display: flex; flex-direction: column;\r\n  align-items: center; justify-content: center;\r\n  padding: 40px 48px 40px 24px;\r\n  position: relative;\r\n}\r\n\r\n\/* Visual mockup container *\/\r\n.ksc-visual {\r\n  width: 100%; border-radius: 16px;\r\n  border: 1px solid;\r\n  overflow: hidden;\r\n  box-shadow: 0 20px 60px rgba(0,0,0,0.3);\r\n}\r\n.ksc-mock-header {\r\n  display: flex; align-items: center; gap: 10px;\r\n  padding: 10px 14px;\r\n  border-bottom: 1px solid;\r\n}\r\n.ksc-mock-dots { display: flex; gap: 5px; flex-shrink: 0; }\r\n.ksc-mock-dots span { width: 9px; height: 9px; border-radius: 50%; display: block; }\r\n.ksc-mock-url {\r\n  flex: 1; text-align: center;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.65rem;\r\n  border-radius: 5px; padding: 3px 10px;\r\n}\r\n.ksc-mock-body { padding: 14px; }\r\n\r\n\/* Badge *\/\r\n.ksc-card-badge {\r\n  display: inline-flex; align-items: center; gap: 6px;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.72rem; font-weight: 700;\r\n  text-transform: uppercase; letter-spacing: 0.06em;\r\n  padding: 5px 12px; border-radius: 100px;\r\n  border: 1px solid;\r\n  margin-top: 14px; align-self: flex-start;\r\n}\r\n.ksc-card-badge svg {\r\n  width: 13px; height: 13px; fill: none;\r\n  stroke: currentColor; stroke-width: 2; stroke-linecap: round;\r\n}\r\n\r\n\/* \u2500\u2500 RESPONSIVE \u2500\u2500 *\/\r\n@media (max-width: 900px) {\r\n  .ksc-card-inner { grid-template-columns: 1fr; min-height: auto; }\r\n  .ksc-card-left { padding: 36px 28px 20px; }\r\n  .ksc-card-right { padding: 0 28px 36px; }\r\n  .ksc-visual { max-width: 400px; }\r\n  .ksc-card { margin: 0 16px 12px; }\r\n}\r\n@media (max-width: 580px) {\r\n  .ksc-section { padding: 72px 0 0; }\r\n  .ksc-card-left { padding: 28px 20px 16px; }\r\n  .ksc-card-right { padding: 0 20px 28px; }\r\n  .ksc-card { border-radius: 18px; margin: 0 12px 10px; }\r\n  .ksc-card-title { font-size: 1.4rem; }\r\n}\r\n\r\n\/* \u2500\u2500 REDUCED MOTION \u2500\u2500 *\/\r\n@media (prefers-reduced-motion: reduce) {\r\n  .ksc-card { transition: none; }\r\n}\r\n<\/style>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-8b14252 e-con e-atomic-element e-flexbox-base e-f732cb1 \" data-id=\"8b14252\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"8b14252\" data-e-type=\"e-flexbox\" data-id=\"8b14252\">\n    \t\t<div class=\"elementor-element elementor-element-734f1eb elementor-widget elementor-widget-html\" data-id=\"734f1eb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     KladSoft \u2014 Website Creation \/ Benefits Section\r\n     Left: phone mockup | Right: 2-col feature list\r\n     Paste into Elementor HTML widget\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n\r\n<section class=\"kwb-section\">\r\n  <div class=\"kwb-inner\">\r\n\r\n    <!-- \u2500\u2500 HEADER \u2500\u2500 -->\r\n    <div class=\"kwb-header\">\r\n      <div class=\"kwb-eyebrow\">Why KladSoft<\/div>\r\n      <h2 class=\"kwb-title\">Website Creation<\/h2>\r\n      <p class=\"kwb-sub\">Check the <strong>benefits<\/strong> you get by working with our experts.<\/p>\r\n      <div class=\"kwb-divider\"><\/div>\r\n    <\/div>\r\n\r\n    <!-- \u2500\u2500 BODY: phone left + features right \u2500\u2500 -->\r\n    <div class=\"kwb-body\">\r\n\r\n      <!-- LEFT: Phone mockup -->\r\n      <div class=\"kwb-phone-wrap\">\r\n        <!-- Ambient glow -->\r\n        <div class=\"kwb-glow\"><\/div>\r\n\r\n        <!-- Phone shell -->\r\n        <div class=\"kwb-phone\">\r\n          <!-- Notch -->\r\n          <div class=\"kwb-phone-notch\">\r\n            <div class=\"kwb-phone-notch-inner\"><\/div>\r\n          <\/div>\r\n          <!-- Side buttons -->\r\n          <div class=\"kwb-phone-btn kwb-phone-btn--vol1\"><\/div>\r\n          <div class=\"kwb-phone-btn kwb-phone-btn--vol2\"><\/div>\r\n          <div class=\"kwb-phone-btn kwb-phone-btn--power\"><\/div>\r\n          <!-- Screen -->\r\n          <div class=\"kwb-screen\">\r\n            <!-- Browser bar -->\r\n            <div class=\"kwb-browser-bar\">\r\n              <div class=\"kwb-browser-dots\">\r\n                <span style=\"background:#FF5F57\"><\/span>\r\n                <span style=\"background:#FEBC2E\"><\/span>\r\n                <span style=\"background:#28C840\"><\/span>\r\n              <\/div>\r\n              <div class=\"kwb-browser-url\">kladsoft.com<\/div>\r\n            <\/div>\r\n            <!-- Simulated website content -->\r\n            <div class=\"kwb-site\">\r\n              <!-- Nav -->\r\n              <div class=\"kwb-site-nav\">\r\n                <div class=\"kwb-site-logo\">\r\n                  <div style=\"width:8px;height:8px;border-radius:2px;background:#38BDF8\"><\/div>\r\n                  <div style=\"width:20px;height:4px;border-radius:2px;background:#0B1C40\"><\/div>\r\n                <\/div>\r\n                <div style=\"width:16px;height:10px;display:flex;flex-direction:column;gap:2px;justify-content:center\">\r\n                  <div style=\"height:1.5px;background:#94A3B8;border-radius:1px\"><\/div>\r\n                  <div style=\"height:1.5px;background:#94A3B8;border-radius:1px;width:70%\"><\/div>\r\n                <\/div>\r\n              <\/div>\r\n              <!-- Hero area -->\r\n              <div class=\"kwb-site-hero\">\r\n                <div style=\"width:6px;height:6px;border-radius:50%;background:#22C55E;margin-bottom:6px\"><\/div>\r\n                <div style=\"width:85%;height:7px;border-radius:3px;background:#0B1C40;margin-bottom:5px\"><\/div>\r\n                <div style=\"width:70%;height:7px;border-radius:3px;background:#38BDF8;margin-bottom:10px\"><\/div>\r\n                <div style=\"width:100%;height:4px;border-radius:2px;background:#E2E8F0;margin-bottom:4px\"><\/div>\r\n                <div style=\"width:90%;height:4px;border-radius:2px;background:#E2E8F0;margin-bottom:14px\"><\/div>\r\n                <div style=\"display:flex;gap:6px\">\r\n                  <div style=\"height:20px;width:56px;border-radius:10px;background:#0B1C40\"><\/div>\r\n                  <div style=\"height:20px;width:46px;border-radius:10px;background:transparent;border:1px solid #D1DCF0\"><\/div>\r\n                <\/div>\r\n              <\/div>\r\n              <!-- Stats strip -->\r\n              <div class=\"kwb-site-stats\">\r\n                <div class=\"kwb-site-stat\">\r\n                  <div style=\"font-size:7px;font-weight:800;color:#0B1C40;font-family:'Plus Jakarta Sans',sans-serif;line-height:1\">400+<\/div>\r\n                  <div style=\"font-size:4.5px;color:#94A3B8;font-family:'Inter',sans-serif;margin-top:1px\">Projects<\/div>\r\n                <\/div>\r\n                <div style=\"width:1px;background:#E2E8F0;height:16px\"><\/div>\r\n                <div class=\"kwb-site-stat\">\r\n                  <div style=\"font-size:7px;font-weight:800;color:#0B1C40;font-family:'Plus Jakarta Sans',sans-serif;line-height:1\">200+<\/div>\r\n                  <div style=\"font-size:4.5px;color:#94A3B8;font-family:'Inter',sans-serif;margin-top:1px\">Clients<\/div>\r\n                <\/div>\r\n                <div style=\"width:1px;background:#E2E8F0;height:16px\"><\/div>\r\n                <div class=\"kwb-site-stat\">\r\n                  <div style=\"font-size:7px;font-weight:800;color:#0B1C40;font-family:'Plus Jakarta Sans',sans-serif;line-height:1\">99%<\/div>\r\n                  <div style=\"font-size:4.5px;color:#94A3B8;font-family:'Inter',sans-serif;margin-top:1px\">Happy<\/div>\r\n                <\/div>\r\n              <\/div>\r\n              <!-- Cards row -->\r\n              <div class=\"kwb-site-cards\">\r\n                <div class=\"kwb-site-card\" style=\"background:#E0F2FE\">\r\n                  <div style=\"width:16px;height:16px;border-radius:4px;background:#38BDF8;margin-bottom:5px\"><\/div>\r\n                  <div style=\"width:100%;height:3.5px;border-radius:2px;background:#BAE6FD;margin-bottom:3px\"><\/div>\r\n                  <div style=\"width:80%;height:3px;border-radius:2px;background:#BAE6FD\"><\/div>\r\n                <\/div>\r\n                <div class=\"kwb-site-card\" style=\"background:#F5F3FF\">\r\n                  <div style=\"width:16px;height:16px;border-radius:4px;background:#A78BFA;margin-bottom:5px\"><\/div>\r\n                  <div style=\"width:100%;height:3.5px;border-radius:2px;background:#DDD6FE;margin-bottom:3px\"><\/div>\r\n                  <div style=\"width:75%;height:3px;border-radius:2px;background:#DDD6FE\"><\/div>\r\n                <\/div>\r\n                <div class=\"kwb-site-card\" style=\"background:#F0FDF4\">\r\n                  <div style=\"width:16px;height:16px;border-radius:4px;background:#34D399;margin-bottom:5px\"><\/div>\r\n                  <div style=\"width:100%;height:3.5px;border-radius:2px;background:#A7F3D0;margin-bottom:3px\"><\/div>\r\n                  <div style=\"width:85%;height:3px;border-radius:2px;background:#A7F3D0\"><\/div>\r\n                <\/div>\r\n              <\/div>\r\n              <!-- CTA button -->\r\n              <div style=\"margin:10px 12px 0;background:#38BDF8;border-radius:8px;height:18px;display:flex;align-items:center;justify-content:center\">\r\n                <div style=\"font-size:5px;font-weight:700;color:#fff;font-family:'Inter',sans-serif;letter-spacing:0.05em\">Start a Project \u2192<\/div>\r\n              <\/div>\r\n            <\/div>\r\n            <!-- Home bar -->\r\n            <div class=\"kwb-home-bar\">\r\n              <div class=\"kwb-home-indicator\"><\/div>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- Floating badges -->\r\n        <div class=\"kwb-float kwb-float--tl\">\r\n          <div class=\"kwb-float-icon\" style=\"background:#E0F2FE\">\r\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#0369A1\" stroke-width=\"2\" stroke-linecap=\"round\"><path d=\"M13 2L3 14h9l-1 8 10-12h-9l1-8z\"\/><\/svg>\r\n          <\/div>\r\n          <div>\r\n            <div class=\"kwb-float-label\">Page Speed<\/div>\r\n            <div class=\"kwb-float-val\">97 \/ 100<\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"kwb-float kwb-float--br\">\r\n          <div class=\"kwb-float-icon\" style=\"background:#ECFDF5\">\r\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#065F46\" stroke-width=\"2\" stroke-linecap=\"round\"><polyline points=\"20 6 9 17 4 12\"\/><\/svg>\r\n          <\/div>\r\n          <div>\r\n            <div class=\"kwb-float-label\">Mobile Ready<\/div>\r\n            <div class=\"kwb-float-val\">100%<\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n      <\/div><!-- \/kwb-phone-wrap -->\r\n\r\n      <!-- RIGHT: Features 2-col grid -->\r\n      <div class=\"kwb-features\">\r\n        <div class=\"kwb-features-grid\">\r\n\r\n          <div class=\"kwb-feat\">\r\n            <div class=\"kwb-feat-icon\" style=\"background:#E0F2FE;color:#0369A1\">\r\n              <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M21 15a2 2 0 01-2 2H7l-4 4V5a2 2 0 012-2h14a2 2 0 012 2z\"\/><\/svg>\r\n            <\/div>\r\n            <div>\r\n              <h4 class=\"kwb-feat-title\">24\/7 Fast Support<\/h4>\r\n              <p class=\"kwb-feat-desc\">Real people, real responses. We're always available \u2014 no ticket queues, no silence when you need help most.<\/p>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div class=\"kwb-feat\">\r\n            <div class=\"kwb-feat-icon\" style=\"background:#F5F3FF;color:#5B21B6\">\r\n              <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"2\" y=\"3\" width=\"20\" height=\"14\" rx=\"2\"\/><path d=\"M8 21h8M12 17v4\"\/><\/svg>\r\n            <\/div>\r\n            <div>\r\n              <h4 class=\"kwb-feat-title\">Small &amp; Mighty<\/h4>\r\n              <p class=\"kwb-feat-desc\">A focused agency that goes deep \u2014 not broad. Every project gets our full attention from start to finish.<\/p>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div class=\"kwb-feat\">\r\n            <div class=\"kwb-feat-icon\" style=\"background:#ECFDF5;color:#065F46\">\r\n              <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z\"\/><\/svg>\r\n            <\/div>\r\n            <div>\r\n              <h4 class=\"kwb-feat-title\">Secure by Default<\/h4>\r\n              <p class=\"kwb-feat-desc\">Security isn't an add-on. Every site we build is hardened from day one \u2014 with ongoing monitoring to match.<\/p>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div class=\"kwb-feat\">\r\n            <div class=\"kwb-feat-icon\" style=\"background:#FFF7ED;color:#C2410C\">\r\n              <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"12\" y1=\"1\" x2=\"12\" y2=\"23\"\/><path d=\"M17 5H9.5a3.5 3.5 0 000 7h5a3.5 3.5 0 010 7H6\"\/><\/svg>\r\n            <\/div>\r\n            <div>\r\n              <h4 class=\"kwb-feat-title\">Transparent Pricing<\/h4>\r\n              <p class=\"kwb-feat-desc\">No hidden fees, no scope creep surprises. You'll always know exactly what you're paying for and why.<\/p>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div class=\"kwb-feat\">\r\n            <div class=\"kwb-feat-icon\" style=\"background:#EFF6FF;color:#1D4ED8\">\r\n              <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M13 2L3 14h9l-1 8 10-12h-9l1-8z\"\/><\/svg>\r\n            <\/div>\r\n            <div>\r\n              <h4 class=\"kwb-feat-title\">Built for Performance<\/h4>\r\n              <p class=\"kwb-feat-desc\">Fast-loading, mobile-first, and SEO-friendly as standard. We build to Lighthouse 90+ on every project.<\/p>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div class=\"kwb-feat\">\r\n            <div class=\"kwb-feat-icon\" style=\"background:#F0FDF4;color:#15803D\">\r\n              <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M17 21v-2a4 4 0 00-4-4H5a4 4 0 00-4 4v2\"\/><circle cx=\"9\" cy=\"7\" r=\"4\"\/><path d=\"M23 21v-2a4 4 0 00-3-3.87M16 3.13a4 4 0 010 7.75\"\/><\/svg>\r\n            <\/div>\r\n            <div>\r\n              <h4 class=\"kwb-feat-title\">Long-Term Partnership<\/h4>\r\n              <p class=\"kwb-feat-desc\">We measure success in years. Our goal is to be the last agency you'll ever need to call.<\/p>\r\n            <\/div>\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n        <!-- CTA -->\r\n        <div class=\"kwb-cta-wrap\">\r\n          <a href=\"\/contact\/\" class=\"kwb-cta\">\r\n            Share Your Project Requirement\r\n            <svg viewBox=\"0 0 24 24\"><path d=\"M7 17L17 7M7 7h10v10\"\/><\/svg>\r\n          <\/a>\r\n        <\/div>\r\n\r\n      <\/div><!-- \/kwb-features -->\r\n\r\n    <\/div><!-- \/kwb-body -->\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\/* \u2500\u2500 Reset \u2500\u2500 *\/\r\n.kwb-section, .kwb-section * { box-sizing: border-box; margin: 0; padding: 0; }\r\n.kwb-section a { text-decoration: none !important; }\r\n\r\n\/* \u2500\u2500 SECTION \u2500\u2500 *\/\r\n.kwb-section {\r\n  background: #fff;\r\n  padding: 96px 28px;\r\n}\r\n.kwb-inner { max-width: 1180px; margin: 0 auto; }\r\n\r\n\/* \u2500\u2500 HEADER \u2500\u2500 *\/\r\n.kwb-header { text-align: center; margin-bottom: 64px; }\r\n.kwb-eyebrow {\r\n  display: block; font-family: 'Inter', sans-serif;\r\n  font-size: 0.72rem; font-weight: 700;\r\n  letter-spacing: 0.1em; text-transform: uppercase;\r\n  color: #38BDF8; margin-bottom: 10px;\r\n}\r\n.kwb-title {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: clamp(1.9rem, 3.5vw, 2.75rem);\r\n  font-weight: 800; color: #0B1C40;\r\n  letter-spacing: -0.025em; margin-bottom: 12px;\r\n}\r\n.kwb-sub {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 1.05rem; color: #64748B; line-height: 1.6;\r\n}\r\n.kwb-sub strong { color: #0B1C40; }\r\n.kwb-divider {\r\n  width: 40px; height: 3px; border-radius: 2px;\r\n  background: linear-gradient(90deg, #38BDF8, #818CF8);\r\n  margin: 20px auto 0;\r\n}\r\n\r\n\/* \u2500\u2500 BODY 2-COL \u2500\u2500 *\/\r\n.kwb-body {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1.35fr;\r\n  gap: 72px;\r\n  align-items: center;\r\n}\r\n\r\n\/* \u2500\u2500 PHONE MOCKUP \u2500\u2500 *\/\r\n.kwb-phone-wrap {\r\n  position: relative;\r\n  display: flex; justify-content: center; align-items: center;\r\n  padding: 40px 0;\r\n}\r\n.kwb-glow {\r\n  position: absolute;\r\n  width: 260px; height: 260px; border-radius: 50%;\r\n  background: radial-gradient(circle, rgba(56,189,248,0.15) 0%, transparent 70%);\r\n  pointer-events: none;\r\n}\r\n\r\n\/* Phone shell *\/\r\n.kwb-phone {\r\n  width: 220px;\r\n  background: #0B1C40;\r\n  border-radius: 38px;\r\n  padding: 12px 10px;\r\n  box-shadow:\r\n    0 0 0 1px rgba(255,255,255,0.08),\r\n    inset 0 0 0 1px rgba(255,255,255,0.04),\r\n    0 32px 80px rgba(11,28,64,0.35),\r\n    0 8px 24px rgba(0,0,0,0.2);\r\n  position: relative;\r\n}\r\n\r\n\/* Notch *\/\r\n.kwb-phone-notch {\r\n  position: absolute; top: 12px; left: 50%;\r\n  transform: translateX(-50%);\r\n  width: 72px; height: 22px;\r\n  background: #0B1C40; border-radius: 0 0 14px 14px;\r\n  z-index: 10;\r\n  display: flex; align-items: center; justify-content: center;\r\n}\r\n.kwb-phone-notch-inner {\r\n  width: 50px; height: 14px;\r\n  background: #060D1F; border-radius: 10px;\r\n}\r\n\r\n\/* Side buttons *\/\r\n.kwb-phone-btn {\r\n  position: absolute;\r\n  background: #0A1628; border-radius: 3px;\r\n}\r\n.kwb-phone-btn--vol1  { width: 3px; height: 26px; left: -3px; top: 80px; }\r\n.kwb-phone-btn--vol2  { width: 3px; height: 26px; left: -3px; top: 114px; }\r\n.kwb-phone-btn--power { width: 3px; height: 36px; right: -3px; top: 96px; }\r\n\r\n\/* Screen *\/\r\n.kwb-screen {\r\n  background: #F8FAFC;\r\n  border-radius: 28px;\r\n  overflow: hidden;\r\n  margin-top: 6px;\r\n}\r\n\r\n\/* Browser bar *\/\r\n.kwb-browser-bar {\r\n  display: flex; align-items: center; gap: 6px;\r\n  padding: 7px 10px 6px;\r\n  background: #F1F5F9;\r\n  border-bottom: 1px solid #E2E8F0;\r\n}\r\n.kwb-browser-dots { display: flex; gap: 3px; flex-shrink: 0; }\r\n.kwb-browser-dots span { width: 5px; height: 5px; border-radius: 50%; display: block; }\r\n.kwb-browser-url {\r\n  flex: 1; text-align: center;\r\n  font-family: 'Inter', sans-serif; font-size: 5px;\r\n  color: #94A3B8; background: #fff; border-radius: 3px;\r\n  padding: 2px 6px;\r\n}\r\n\r\n\/* Site content *\/\r\n.kwb-site { padding: 10px 12px 0; }\r\n.kwb-site-nav {\r\n  display: flex; justify-content: space-between; align-items: center;\r\n  margin-bottom: 10px;\r\n}\r\n.kwb-site-logo { display: flex; align-items: center; gap: 4px; }\r\n\r\n.kwb-site-hero { margin-bottom: 10px; }\r\n\r\n.kwb-site-stats {\r\n  display: flex; align-items: center; justify-content: space-between;\r\n  background: #fff; border-radius: 8px;\r\n  padding: 8px 10px; margin-bottom: 10px;\r\n  border: 1px solid #F1F5F9;\r\n}\r\n.kwb-site-stat { text-align: center; }\r\n\r\n.kwb-site-cards { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 5px; }\r\n.kwb-site-card {\r\n  border-radius: 7px; padding: 8px 6px;\r\n}\r\n\r\n\/* Home bar *\/\r\n.kwb-home-bar {\r\n  display: flex; justify-content: center; align-items: center;\r\n  padding: 8px 0 6px;\r\n}\r\n.kwb-home-indicator {\r\n  width: 48px; height: 4px; border-radius: 2px;\r\n  background: #0B1C40; opacity: 0.15;\r\n}\r\n\r\n\/* Floating badges *\/\r\n.kwb-float {\r\n  position: absolute;\r\n  display: flex; align-items: center; gap: 8px;\r\n  background: #fff;\r\n  border: 1px solid #E2E8F0;\r\n  border-radius: 12px;\r\n  padding: 9px 13px;\r\n  box-shadow: 0 8px 24px rgba(15,23,42,0.1);\r\n  white-space: nowrap;\r\n}\r\n.kwb-float--tl { top: 20px; left: -10px; }\r\n.kwb-float--br { bottom: 20px; right: -10px; }\r\n.kwb-float-icon {\r\n  width: 32px; height: 32px; border-radius: 8px;\r\n  display: flex; align-items: center; justify-content: center; flex-shrink: 0;\r\n}\r\n.kwb-float-icon svg { width: 16px; height: 16px; }\r\n.kwb-float-label {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.65rem; color: #94A3B8; font-weight: 500;\r\n}\r\n.kwb-float-val {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: 0.85rem; font-weight: 800; color: #0B1C40;\r\n}\r\n\r\n\/* \u2500\u2500 FEATURES GRID 2\u00d73 \u2500\u2500 *\/\r\n.kwb-features-grid {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 28px 32px;\r\n  margin-bottom: 36px;\r\n}\r\n.kwb-feat { display: flex; gap: 14px; align-items: flex-start; }\r\n.kwb-feat-icon {\r\n  width: 42px; height: 42px; border-radius: 11px;\r\n  flex-shrink: 0; display: flex; align-items: center; justify-content: center;\r\n  transition: transform .2s;\r\n}\r\n.kwb-feat:hover .kwb-feat-icon { transform: scale(1.08); }\r\n.kwb-feat-icon svg { width: 20px; height: 20px; }\r\n.kwb-feat-title {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: 0.95rem; font-weight: 800; color: #0F172A;\r\n  margin-bottom: 5px; line-height: 1.3;\r\n}\r\n.kwb-feat-desc {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.845rem; color: #64748B; line-height: 1.7;\r\n}\r\n\r\n\/* CTA *\/\r\n.kwb-cta-wrap { padding-top: 8px; }\r\n.kwb-cta {\r\n  display: inline-flex; align-items: center; gap: 8px;\r\n  background: #38BDF8; color: #fff !important;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.9rem; font-weight: 700;\r\n  padding: 14px 26px; border-radius: 100px;\r\n  transition: background .2s, transform .15s, box-shadow .2s; line-height: 1;\r\n}\r\n.kwb-cta svg { width: 14px; height: 14px; fill: none; stroke: #fff; stroke-width: 2.5; stroke-linecap: round; flex-shrink: 0; }\r\n.kwb-cta:hover { background: #0EA5E9; transform: translateY(-2px); box-shadow: 0 8px 24px rgba(56,189,248,0.35); }\r\n\r\n\/* \u2500\u2500 RESPONSIVE \u2500\u2500 *\/\r\n@media (max-width: 960px) {\r\n  .kwb-body { grid-template-columns: 1fr; gap: 52px; }\r\n  .kwb-phone-wrap { padding: 24px 0; }\r\n  .kwb-float--tl { left: 0; }\r\n  .kwb-float--br { right: 0; }\r\n}\r\n@media (max-width: 640px) {\r\n  .kwb-section { padding: 72px 16px; }\r\n  .kwb-features-grid { grid-template-columns: 1fr; gap: 20px; }\r\n  .kwb-phone { width: 190px; }\r\n}\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n  .kwb-feat-icon { transition: none; }\r\n}\r\n<\/style>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-6327a77 e-con e-atomic-element e-flexbox-base e-6327a77-42deb6a \" data-id=\"6327a77\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"6327a77\" data-e-type=\"e-flexbox\" data-id=\"6327a77\">\n    \t\t<div class=\"elementor-element elementor-element-edf3aa6 elementor-widget elementor-widget-html\" data-id=\"edf3aa6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     KladSoft \u2014 Portfolio \/ Work Section\r\n     Paste into Elementor HTML widget\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n\r\n<section class=\"ksp-section\" id=\"work\">\r\n  <div class=\"ksp-inner\">\r\n\r\n    <!-- Header -->\r\n    <div class=\"ksp-head\">\r\n      <div class=\"ksp-head-left\">\r\n        <div class=\"ksp-eyebrow\">Selected Work<\/div>\r\n        <h2 class=\"ksp-title\">Recent projects<\/h2>\r\n        <p class=\"ksp-lead\">A cross-section of Shopify stores, WordPress sites, and WooCommerce builds delivered for businesses worldwide.<\/p>\r\n      <\/div>\r\n      <a href=\"\/portfolio\/\" class=\"ksp-all-link\">\r\n        View all work\r\n        <svg viewBox=\"0 0 24 24\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg>\r\n      <\/a>\r\n    <\/div>\r\n\r\n    <!-- Filters -->\r\n    <div class=\"ksp-filters\">\r\n      <button class=\"ksp-filter ksp-active\" data-f=\"all\">All work<\/button>\r\n      <button class=\"ksp-filter\" data-f=\"shopify\">Shopify<\/button>\r\n      <button class=\"ksp-filter\" data-f=\"wordpress\">WordPress<\/button>\r\n      <button class=\"ksp-filter\" data-f=\"woocommerce\">WooCommerce<\/button>\r\n      <button class=\"ksp-filter\" data-f=\"maintenance\">Maintenance<\/button>\r\n    <\/div>\r\n\r\n    <!-- Grid -->\r\n    <div class=\"ksp-grid\" id=\"kspGrid\">\r\n\r\n      <!-- \u2500\u2500 ROW 1 (always visible) \u2500\u2500 -->\r\n      <div class=\"ksp-card\" data-cat=\"shopify\" data-name=\"Shine Armor\" data-url=\"shinearmor.com\" data-img=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/shine_armor-scaled.webp\" data-row=\"1\">\r\n        <div class=\"ksp-thumb\">\r\n          <img decoding=\"async\" src=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/shine_armor-scaled.webp\" alt=\"Shine Armor\" loading=\"lazy\" class=\"ksp-img\">\r\n          <div class=\"ksp-overlay\">\r\n            <button class=\"ksp-preview-btn\" aria-label=\"Preview\">\r\n              <svg viewBox=\"0 0 24 24\"><path d=\"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z\"\/><circle cx=\"12\" cy=\"12\" r=\"3\"\/><\/svg>\r\n              Preview\r\n            <\/button>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"ksp-body\">\r\n          <div class=\"ksp-body-top\">\r\n            <span class=\"ksp-name\">Shine Armor<\/span>\r\n            <span class=\"ksp-badge ksp-badge--shopify\">Shopify<\/span>\r\n          <\/div>\r\n          <p class=\"ksp-desc\">High-performance automotive care store with custom product builder and optimised checkout flow.<\/p>\r\n          <div class=\"ksp-foot\">\r\n            <div class=\"ksp-tags\"><span>Shopify<\/span><span>Liquid<\/span><span>CSS<\/span><\/div>\r\n            <a href=\"#\" class=\"ksp-visit\">Visit site <svg viewBox=\"0 0 12 12\"><path d=\"M2 10L10 2M10 2H4M10 2v6\"\/><\/svg><\/a>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksp-card\" data-cat=\"shopify\" data-name=\"Pleshy\" data-url=\"pleshy.com\" data-img=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Pleshy-scaled.webp\" data-row=\"1\">\r\n        <div class=\"ksp-thumb\">\r\n          <img decoding=\"async\" src=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Pleshy-scaled.webp\" alt=\"Pleshy\" loading=\"lazy\" class=\"ksp-img\">\r\n          <div class=\"ksp-overlay\">\r\n            <button class=\"ksp-preview-btn\" aria-label=\"Preview\">\r\n              <svg viewBox=\"0 0 24 24\"><path d=\"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z\"\/><circle cx=\"12\" cy=\"12\" r=\"3\"\/><\/svg>\r\n              Preview\r\n            <\/button>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"ksp-body\">\r\n          <div class=\"ksp-body-top\">\r\n            <span class=\"ksp-name\">Pleshy<\/span>\r\n            <span class=\"ksp-badge ksp-badge--shopify\">Shopify<\/span>\r\n          <\/div>\r\n          <p class=\"ksp-desc\">Custom Shopify store with interactive product configuration and seamless mobile experience.<\/p>\r\n          <div class=\"ksp-foot\">\r\n            <div class=\"ksp-tags\"><span>Shopify<\/span><span>Liquid<\/span><span>JS<\/span><\/div>\r\n            <a href=\"#\" class=\"ksp-visit\">Visit site <svg viewBox=\"0 0 12 12\"><path d=\"M2 10L10 2M10 2H4M10 2v6\"\/><\/svg><\/a>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksp-card\" data-cat=\"shopify\" data-name=\"Vibe\" data-url=\"vibe.com\" data-img=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Vibe-scaled.webp\" data-row=\"1\">\r\n        <div class=\"ksp-thumb\">\r\n          <img decoding=\"async\" src=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Vibe-scaled.webp\" alt=\"Vibe\" loading=\"lazy\" class=\"ksp-img\">\r\n          <div class=\"ksp-overlay\">\r\n            <button class=\"ksp-preview-btn\" aria-label=\"Preview\">\r\n              <svg viewBox=\"0 0 24 24\"><path d=\"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z\"\/><circle cx=\"12\" cy=\"12\" r=\"3\"\/><\/svg>\r\n              Preview\r\n            <\/button>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"ksp-body\">\r\n          <div class=\"ksp-body-top\">\r\n            <span class=\"ksp-name\">Vibe<\/span>\r\n            <span class=\"ksp-badge ksp-badge--shopify\">Shopify<\/span>\r\n          <\/div>\r\n          <p class=\"ksp-desc\">Lifestyle brand store built on Shopify with custom theme and conversion-focused landing pages.<\/p>\r\n          <div class=\"ksp-foot\">\r\n            <div class=\"ksp-tags\"><span>Shopify<\/span><span>Liquid<\/span><span>CSS<\/span><\/div>\r\n            <a href=\"#\" class=\"ksp-visit\">Visit site <svg viewBox=\"0 0 12 12\"><path d=\"M2 10L10 2M10 2H4M10 2v6\"\/><\/svg><\/a>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- \u2500\u2500 ROW 2 (always visible) \u2500\u2500 -->\r\n      <div class=\"ksp-card\" data-cat=\"shopify\" data-name=\"With Love Cosmetics\" data-url=\"withlovecosmetics.com\" data-img=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/withlovecosmetics-scaled.webp\" data-row=\"2\">\r\n        <div class=\"ksp-thumb\">\r\n          <img decoding=\"async\" src=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/withlovecosmetics-scaled.webp\" alt=\"With Love Cosmetics\" loading=\"lazy\" class=\"ksp-img\">\r\n          <div class=\"ksp-overlay\">\r\n            <button class=\"ksp-preview-btn\" aria-label=\"Preview\">\r\n              <svg viewBox=\"0 0 24 24\"><path d=\"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z\"\/><circle cx=\"12\" cy=\"12\" r=\"3\"\/><\/svg>\r\n              Preview\r\n            <\/button>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"ksp-body\">\r\n          <div class=\"ksp-body-top\">\r\n            <span class=\"ksp-name\">With Love Cosmetics<\/span>\r\n            <span class=\"ksp-badge ksp-badge--shopify\">Shopify<\/span>\r\n          <\/div>\r\n          <p class=\"ksp-desc\">Beauty brand store with custom product swatches, subscription model and loyalty integrations.<\/p>\r\n          <div class=\"ksp-foot\">\r\n            <div class=\"ksp-tags\"><span>Shopify<\/span><span>Liquid<\/span><span>JS<\/span><\/div>\r\n            <a href=\"#\" class=\"ksp-visit\">Visit site <svg viewBox=\"0 0 12 12\"><path d=\"M2 10L10 2M10 2H4M10 2v6\"\/><\/svg><\/a>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksp-card\" data-cat=\"shopify\" data-name=\"Our Place\" data-url=\"fromourplace.com\" data-img=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Our-Place-scaled.webp\" data-row=\"2\">\r\n        <div class=\"ksp-thumb\">\r\n          <img decoding=\"async\" src=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Our-Place-scaled.webp\" alt=\"Our Place\" loading=\"lazy\" class=\"ksp-img\">\r\n          <div class=\"ksp-overlay\">\r\n            <button class=\"ksp-preview-btn\" aria-label=\"Preview\">\r\n              <svg viewBox=\"0 0 24 24\"><path d=\"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z\"\/><circle cx=\"12\" cy=\"12\" r=\"3\"\/><\/svg>\r\n              Preview\r\n            <\/button>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"ksp-body\">\r\n          <div class=\"ksp-body-top\">\r\n            <span class=\"ksp-name\">Our Place<\/span>\r\n            <span class=\"ksp-badge ksp-badge--shopify\">Shopify<\/span>\r\n          <\/div>\r\n          <p class=\"ksp-desc\">Premium cookware brand rebuilt for speed \u2014 60% faster load times and 34% higher conversion rate.<\/p>\r\n          <div class=\"ksp-foot\">\r\n            <div class=\"ksp-tags\"><span>Shopify<\/span><span>Liquid<\/span><span>CSS<\/span><\/div>\r\n            <a href=\"#\" class=\"ksp-visit\">Visit site <svg viewBox=\"0 0 12 12\"><path d=\"M2 10L10 2M10 2H4M10 2v6\"\/><\/svg><\/a>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksp-card\" data-cat=\"shopify\" data-name=\"Nada\" data-url=\"nadaworld.com\" data-img=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Nada-scaled.webp\" data-row=\"2\">\r\n        <div class=\"ksp-thumb\">\r\n          <img decoding=\"async\" src=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Nada-scaled.webp\" alt=\"Nada\" loading=\"lazy\" class=\"ksp-img\">\r\n          <div class=\"ksp-overlay\">\r\n            <button class=\"ksp-preview-btn\" aria-label=\"Preview\">\r\n              <svg viewBox=\"0 0 24 24\"><path d=\"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z\"\/><circle cx=\"12\" cy=\"12\" r=\"3\"\/><\/svg>\r\n              Preview\r\n            <\/button>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"ksp-body\">\r\n          <div class=\"ksp-body-top\">\r\n            <span class=\"ksp-name\">Nada<\/span>\r\n            <span class=\"ksp-badge ksp-badge--shopify\">Shopify<\/span>\r\n          <\/div>\r\n          <p class=\"ksp-desc\">Fashion-forward Shopify store with editorial layout, size guide and custom collection filters.<\/p>\r\n          <div class=\"ksp-foot\">\r\n            <div class=\"ksp-tags\"><span>Shopify<\/span><span>Liquid<\/span><span>JS<\/span><\/div>\r\n            <a href=\"#\" class=\"ksp-visit\">Visit site <svg viewBox=\"0 0 12 12\"><path d=\"M2 10L10 2M10 2H4M10 2v6\"\/><\/svg><\/a>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- \u2500\u2500 ROW 3 (hidden) \u2500\u2500 -->\r\n      <div class=\"ksp-card ksp-extra\" data-cat=\"wordpress\" data-name=\"Finishing Touches\" data-url=\"finishingtouches.com\" data-img=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Finishing-Touches-Group-scaled.webp\" data-row=\"3\">\r\n        <div class=\"ksp-thumb\">\r\n          <img decoding=\"async\" src=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Finishing-Touches-Group-scaled.webp\" alt=\"Finishing Touches\" loading=\"lazy\" class=\"ksp-img\">\r\n          <div class=\"ksp-overlay\"><button class=\"ksp-preview-btn\"><svg viewBox=\"0 0 24 24\"><path d=\"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z\"\/><circle cx=\"12\" cy=\"12\" r=\"3\"\/><\/svg>Preview<\/button><\/div>\r\n        <\/div>\r\n        <div class=\"ksp-body\">\r\n          <div class=\"ksp-body-top\"><span class=\"ksp-name\">Finishing Touches<\/span><span class=\"ksp-badge ksp-badge--wp\">WordPress<\/span><\/div>\r\n          <p class=\"ksp-desc\">Interior design studio site with custom WordPress theme, gallery and enquiry system.<\/p>\r\n          <div class=\"ksp-foot\"><div class=\"ksp-tags\"><span>WordPress<\/span><span>PHP<\/span><span>CSS<\/span><\/div><a href=\"#\" class=\"ksp-visit\">Visit site <svg viewBox=\"0 0 12 12\"><path d=\"M2 10L10 2M10 2H4M10 2v6\"\/><\/svg><\/a><\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksp-card ksp-extra\" data-cat=\"wordpress\" data-name=\"Infiniti Healthcare\" data-url=\"infinitihealthcare.com\" data-img=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Infiniti-Healthcare-scaled.webp\" data-row=\"3\">\r\n        <div class=\"ksp-thumb\">\r\n          <img decoding=\"async\" src=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Infiniti-Healthcare-scaled.webp\" alt=\"Infiniti Healthcare\" loading=\"lazy\" class=\"ksp-img\">\r\n          <div class=\"ksp-overlay\"><button class=\"ksp-preview-btn\"><svg viewBox=\"0 0 24 24\"><path d=\"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z\"\/><circle cx=\"12\" cy=\"12\" r=\"3\"\/><\/svg>Preview<\/button><\/div>\r\n        <\/div>\r\n        <div class=\"ksp-body\">\r\n          <div class=\"ksp-body-top\"><span class=\"ksp-name\">Infiniti Healthcare<\/span><span class=\"ksp-badge ksp-badge--wp\">WordPress<\/span><\/div>\r\n          <p class=\"ksp-desc\">Healthcare provider site with custom plugin for appointment booking and patient portal.<\/p>\r\n          <div class=\"ksp-foot\"><div class=\"ksp-tags\"><span>WordPress<\/span><span>PHP<\/span><span>JS<\/span><\/div><a href=\"#\" class=\"ksp-visit\">Visit site <svg viewBox=\"0 0 12 12\"><path d=\"M2 10L10 2M10 2H4M10 2v6\"\/><\/svg><\/a><\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksp-card ksp-extra\" data-cat=\"shopify\" data-name=\"Mr Draper\" data-url=\"mrdraper.com\" data-img=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Mr-Draper-scaled.webp\" data-row=\"3\">\r\n        <div class=\"ksp-thumb\">\r\n          <img decoding=\"async\" src=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Mr-Draper-scaled.webp\" alt=\"Mr Draper\" loading=\"lazy\" class=\"ksp-img\">\r\n          <div class=\"ksp-overlay\"><button class=\"ksp-preview-btn\"><svg viewBox=\"0 0 24 24\"><path d=\"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z\"\/><circle cx=\"12\" cy=\"12\" r=\"3\"\/><\/svg>Preview<\/button><\/div>\r\n        <\/div>\r\n        <div class=\"ksp-body\">\r\n          <div class=\"ksp-body-top\"><span class=\"ksp-name\">Mr Draper<\/span><span class=\"ksp-badge ksp-badge--shopify\">Shopify<\/span><\/div>\r\n          <p class=\"ksp-desc\">Premium menswear Shopify store with personal stylist quiz and curated collection pages.<\/p>\r\n          <div class=\"ksp-foot\"><div class=\"ksp-tags\"><span>Shopify<\/span><span>Liquid<\/span><span>JS<\/span><\/div><a href=\"#\" class=\"ksp-visit\">Visit site <svg viewBox=\"0 0 12 12\"><path d=\"M2 10L10 2M10 2H4M10 2v6\"\/><\/svg><\/a><\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- \u2500\u2500 ROW 4 (hidden) \u2500\u2500 -->\r\n      <div class=\"ksp-card ksp-extra\" data-cat=\"shopify\" data-name=\"Hanako\" data-url=\"hanako.co\" data-img=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Hanako-scaled.webp\" data-row=\"4\">\r\n        <div class=\"ksp-thumb\">\r\n          <img decoding=\"async\" src=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Hanako-scaled.webp\" alt=\"Hanako\" loading=\"lazy\" class=\"ksp-img\">\r\n          <div class=\"ksp-overlay\"><button class=\"ksp-preview-btn\"><svg viewBox=\"0 0 24 24\"><path d=\"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z\"\/><circle cx=\"12\" cy=\"12\" r=\"3\"\/><\/svg>Preview<\/button><\/div>\r\n        <\/div>\r\n        <div class=\"ksp-body\">\r\n          <div class=\"ksp-body-top\"><span class=\"ksp-name\">Hanako<\/span><span class=\"ksp-badge ksp-badge--shopify\">Shopify<\/span><\/div>\r\n          <p class=\"ksp-desc\">Shopify Plus migration \u2014 zero downtime, page speed jumped from 40 to 92 overnight.<\/p>\r\n          <div class=\"ksp-foot\"><div class=\"ksp-tags\"><span>Shopify Plus<\/span><span>Liquid<\/span><\/div><a href=\"#\" class=\"ksp-visit\">Visit site <svg viewBox=\"0 0 12 12\"><path d=\"M2 10L10 2M10 2H4M10 2v6\"\/><\/svg><\/a><\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksp-card ksp-extra\" data-cat=\"shopify\" data-name=\"Beauty Pillow\" data-url=\"beautypillow.com\" data-img=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Beauty-Pillow-scaled.webp\" data-row=\"4\">\r\n        <div class=\"ksp-thumb\">\r\n          <img decoding=\"async\" src=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Beauty-Pillow-scaled.webp\" alt=\"Beauty Pillow\" loading=\"lazy\" class=\"ksp-img\">\r\n          <div class=\"ksp-overlay\"><button class=\"ksp-preview-btn\"><svg viewBox=\"0 0 24 24\"><path d=\"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z\"\/><circle cx=\"12\" cy=\"12\" r=\"3\"\/><\/svg>Preview<\/button><\/div>\r\n        <\/div>\r\n        <div class=\"ksp-body\">\r\n          <div class=\"ksp-body-top\"><span class=\"ksp-name\">Beauty Pillow<\/span><span class=\"ksp-badge ksp-badge--shopify\">Shopify<\/span><\/div>\r\n          <p class=\"ksp-desc\">Wellness lifestyle brand with custom Shopify theme and email capture flow.<\/p>\r\n          <div class=\"ksp-foot\"><div class=\"ksp-tags\"><span>Shopify<\/span><span>Liquid<\/span><\/div><a href=\"#\" class=\"ksp-visit\">Visit site <svg viewBox=\"0 0 12 12\"><path d=\"M2 10L10 2M10 2H4M10 2v6\"\/><\/svg><\/a><\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ksp-card ksp-extra\" data-cat=\"wordpress\" data-name=\"Powerplant Solar\" data-url=\"powerplantsolar.com\" data-img=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Powerplant-Solar-scaled.webp\" data-row=\"4\">\r\n        <div class=\"ksp-thumb\">\r\n          <img decoding=\"async\" src=\"https:\/\/tanjirul.me\/wp-content\/uploads\/2026\/07\/Powerplant-Solar-scaled.webp\" alt=\"Powerplant Solar\" loading=\"lazy\" class=\"ksp-img\">\r\n          <div class=\"ksp-overlay\"><button class=\"ksp-preview-btn\"><svg viewBox=\"0 0 24 24\"><path d=\"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z\"\/><circle cx=\"12\" cy=\"12\" r=\"3\"\/><\/svg>Preview<\/button><\/div>\r\n        <\/div>\r\n        <div class=\"ksp-body\">\r\n          <div class=\"ksp-body-top\"><span class=\"ksp-name\">Powerplant Solar<\/span><span class=\"ksp-badge ksp-badge--wp\">WordPress<\/span><\/div>\r\n          <p class=\"ksp-desc\">Solar energy provider site with quote calculator, case studies and lead generation forms.<\/p>\r\n          <div class=\"ksp-foot\"><div class=\"ksp-tags\"><span>WordPress<\/span><span>PHP<\/span><span>JS<\/span><\/div><a href=\"#\" class=\"ksp-visit\">Visit site <svg viewBox=\"0 0 12 12\"><path d=\"M2 10L10 2M10 2H4M10 2v6\"\/><\/svg><\/a><\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n    <\/div><!-- \/ksp-grid -->\r\n\r\n    <!-- Load more -->\r\n    <div class=\"ksp-more\">\r\n      <button class=\"ksp-load-btn\" id=\"kspLoadMore\">\r\n        <svg viewBox=\"0 0 24 24\"><path d=\"M12 5v14M5 12l7 7 7-7\"\/><\/svg>\r\n        Show more projects\r\n      <\/button>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<!-- \u2550\u2550 MODAL \u2550\u2550 -->\r\n<div class=\"ksp-modal\" id=\"kspModal\" role=\"dialog\" aria-modal=\"true\">\r\n  <div class=\"ksp-modal-box\">\r\n    <!-- Browser chrome bar -->\r\n    <div class=\"ksp-modal-bar\">\r\n      <div class=\"ksp-modal-dots\">\r\n        <span style=\"background:#FF5F57\"><\/span>\r\n        <span style=\"background:#FEBC2E\"><\/span>\r\n        <span style=\"background:#28C840\"><\/span>\r\n      <\/div>\r\n      <div class=\"ksp-modal-url\" id=\"kspModalUrl\">example.com<\/div>\r\n      <button class=\"ksp-modal-close\" id=\"kspModalClose\" aria-label=\"Close\">\r\n        <svg viewBox=\"0 0 24 24\"><line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"\/><line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"\/><\/svg>\r\n      <\/button>\r\n    <\/div>\r\n    <!-- Screenshot -->\r\n    <div class=\"ksp-modal-body\">\r\n      <img decoding=\"async\" id=\"kspModalImg\" src=\"\" alt=\"\" class=\"ksp-modal-img\">\r\n    <\/div>\r\n    <!-- Footer -->\r\n    <div class=\"ksp-modal-foot\">\r\n      <span class=\"ksp-modal-name\" id=\"kspModalName\"><\/span>\r\n      <a href=\"#\" class=\"ksp-modal-visit\" id=\"kspModalLink\" target=\"_blank\" rel=\"noopener\">\r\n        Visit live site\r\n        <svg viewBox=\"0 0 24 24\"><path d=\"M7 17L17 7M7 7h10v10\"\/><\/svg>\r\n      <\/a>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<style>\r\n\/* \u2500\u2500 Reset \u2500\u2500 *\/\r\n.ksp-section *, .ksp-modal * { box-sizing: border-box; margin: 0; padding: 0; }\r\n.ksp-section a, .ksp-modal a { text-decoration: none !important; }\r\n.ksp-section button, .ksp-modal button { font-family: 'Inter', sans-serif; cursor: pointer; }\r\n\r\n\/* \u2500\u2500 SECTION \u2500\u2500 *\/\r\n.ksp-section {\r\n  background: #fff;\r\n  padding: 96px 0;\r\n}\r\n.ksp-inner {\r\n  max-width: 1180px; margin: 0 auto; padding: 0 28px;\r\n}\r\n\r\n\/* \u2500\u2500 HEAD \u2500\u2500 *\/\r\n.ksp-head {\r\n  display: flex; align-items: flex-end;\r\n  justify-content: space-between; gap: 24px;\r\n  margin-bottom: 36px; flex-wrap: wrap;\r\n}\r\n.ksp-eyebrow {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.72rem; font-weight: 700;\r\n  letter-spacing: 0.1em; text-transform: uppercase;\r\n  color: #38BDF8; margin-bottom: 10px; display: block;\r\n}\r\n.ksp-title {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: clamp(1.9rem, 3.5vw, 2.75rem);\r\n  font-weight: 800; color: #0F172A;\r\n  letter-spacing: -0.025em; line-height: 1.1;\r\n  margin-bottom: 10px;\r\n}\r\n.ksp-lead {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.95rem; color: #64748B; line-height: 1.7;\r\n  max-width: 480px;\r\n}\r\n.ksp-all-link {\r\n  display: inline-flex; align-items: center; gap: 6px;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.875rem; font-weight: 600; color: #0F172A;\r\n  white-space: nowrap; flex-shrink: 0;\r\n  border-bottom: 1.5px solid #E2E8F0;\r\n  padding-bottom: 2px;\r\n  transition: color .2s, border-color .2s;\r\n}\r\n.ksp-all-link svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; transition: transform .2s; }\r\n.ksp-all-link:hover { color: #38BDF8; border-color: #38BDF8; }\r\n.ksp-all-link:hover svg { transform: translateX(3px); }\r\n\r\n\/* \u2500\u2500 FILTERS \u2500\u2500 *\/\r\n.ksp-filters {\r\n  display: flex; gap: 8px; flex-wrap: wrap;\r\n  margin-bottom: 28px;\r\n}\r\n.ksp-filter {\r\n  height: 36px; padding: 0 18px;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.8rem; font-weight: 600;\r\n  color: #64748B;\r\n  border: 1.5px solid #E2E8F0;\r\n  border-radius: 100px;\r\n  background: transparent !important;\r\n  transition: all .18s;\r\n}\r\n.ksp-filter:hover { color: #0F172A; border-color: #94A3B8; }\r\n.ksp-filter.ksp-active {\r\n  background: #0B1C40 !important;\r\n  color: #fff !important;\r\n  border-color: #0B1C40 !important;\r\n}\r\n\r\n\/* \u2500\u2500 GRID \u2500\u2500 *\/\r\n.ksp-grid {\r\n  display: grid;\r\n  grid-template-columns: repeat(3, 1fr);\r\n  gap: 20px;\r\n  margin-bottom: 36px;\r\n}\r\n\r\n\/* \u2500\u2500 CARD \u2500\u2500 *\/\r\n.ksp-card {\r\n  border-radius: 16px; overflow: hidden;\r\n  border: 1px solid #E2E8F0;\r\n  background: #F8FAFC;\r\n  display: flex; flex-direction: column;\r\n  transition: transform .28s ease, box-shadow .28s ease, border-color .2s;\r\n}\r\n.ksp-card:hover {\r\n  transform: translateY(-5px);\r\n  box-shadow: 0 20px 52px rgba(15,23,42,0.1);\r\n  border-color: #BAE6FD;\r\n}\r\n\r\n\/* Thumbnail *\/\r\n.ksp-thumb {\r\n  height: 210px; overflow: hidden;\r\n  position: relative; flex-shrink: 0;\r\n  background: #E2E8F0;\r\n}\r\n.ksp-img {\r\n  width: 100%; height: 100%;\r\n  object-fit: cover; object-position: top;\r\n  display: block;\r\n  transition: transform .5s ease;\r\n}\r\n.ksp-card:hover .ksp-img { transform: scale(1.04); }\r\n\r\n\/* Overlay on thumb *\/\r\n.ksp-overlay {\r\n  position: absolute; inset: 0;\r\n  background: rgba(11,28,64,0);\r\n  display: flex; align-items: center; justify-content: center;\r\n  transition: background .25s;\r\n}\r\n.ksp-card:hover .ksp-overlay { background: rgba(11,28,64,0.42); }\r\n.ksp-preview-btn {\r\n  display: inline-flex; align-items: center; gap: 7px;\r\n  background: rgba(255,255,255,0.95) !important;\r\n  border: none !important;\r\n  color: #0B1C40;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.8rem; font-weight: 700;\r\n  padding: 10px 18px; border-radius: 100px;\r\n  opacity: 0; transform: translateY(6px);\r\n  transition: opacity .2s, transform .2s, background .18s;\r\n}\r\n.ksp-preview-btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }\r\n.ksp-card:hover .ksp-preview-btn { opacity: 1; transform: translateY(0); }\r\n.ksp-preview-btn:hover { background: #38BDF8 !important; color: #fff; }\r\n\r\n\/* Body *\/\r\n.ksp-body {\r\n  padding: 18px 20px 18px;\r\n  display: flex; flex-direction: column; gap: 8px; flex: 1;\r\n}\r\n.ksp-body-top {\r\n  display: flex; align-items: flex-start;\r\n  justify-content: space-between; gap: 8px;\r\n}\r\n.ksp-name {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: 1rem; font-weight: 700;\r\n  color: #0F172A; line-height: 1.2; flex: 1;\r\n}\r\n\/* Badges *\/\r\n.ksp-badge {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.65rem; font-weight: 700;\r\n  letter-spacing: 0.06em; text-transform: uppercase;\r\n  padding: 3px 9px; border-radius: 100px;\r\n  flex-shrink: 0; margin-top: 2px; line-height: 1.5;\r\n}\r\n.ksp-badge--shopify  { background: #ECFDF5; color: #065F46; }\r\n.ksp-badge--wp       { background: #EFF6FF; color: #1D4ED8; }\r\n.ksp-badge--woo      { background: #F5F3FF; color: #5B21B6; }\r\n.ksp-badge--maint    { background: #E0F2FE; color: #0369A1; }\r\n\r\n.ksp-desc {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.855rem; color: #475569;\r\n  line-height: 1.7; flex: 1;\r\n}\r\n\r\n\/* Footer row *\/\r\n.ksp-foot {\r\n  display: flex; align-items: center;\r\n  justify-content: space-between; gap: 8px;\r\n  padding-top: 14px;\r\n  border-top: 1px solid #E2E8F0;\r\n  margin-top: auto;\r\n}\r\n.ksp-tags { display: flex; gap: 5px; flex-wrap: wrap; }\r\n.ksp-tags span {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.7rem; font-weight: 500; color: #94A3B8;\r\n  padding: 2px 8px; border-radius: 5px;\r\n  border: 1px solid #E2E8F0;\r\n}\r\n.ksp-visit {\r\n  display: inline-flex; align-items: center; gap: 4px;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.75rem; font-weight: 600;\r\n  color: #94A3B8; white-space: nowrap; flex-shrink: 0;\r\n  transition: color .18s;\r\n}\r\n.ksp-visit svg {\r\n  width: 11px; height: 11px;\r\n  fill: none; stroke: currentColor;\r\n  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;\r\n}\r\n.ksp-visit:hover { color: #38BDF8; }\r\n\r\n\/* \u2500\u2500 LOAD MORE \u2500\u2500 *\/\r\n.ksp-more { display: flex; justify-content: center; }\r\n.ksp-load-btn {\r\n  display: inline-flex; align-items: center; gap: 8px;\r\n  height: 46px; padding: 0 28px;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.875rem; font-weight: 700;\r\n  background: #0B1C40 !important; color: #fff !important;\r\n  border: none !important; border-radius: 100px;\r\n  transition: background .2s, transform .15s, box-shadow .2s;\r\n}\r\n.ksp-load-btn:hover {\r\n  background: #38BDF8 !important;\r\n  transform: translateY(-2px);\r\n  box-shadow: 0 8px 24px rgba(56,189,248,0.3);\r\n}\r\n.ksp-load-btn svg {\r\n  width: 16px; height: 16px; flex-shrink: 0;\r\n  fill: none; stroke: currentColor;\r\n  stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round;\r\n  transition: transform .3s;\r\n}\r\n.ksp-load-btn.ksp-less svg { transform: rotate(180deg); }\r\n\r\n\/* \u2500\u2500 MODAL \u2500\u2500 *\/\r\n.ksp-modal {\r\n  display: none; position: fixed; inset: 0; z-index: 10000;\r\n  background: rgba(6,13,31,0.8);\r\n  backdrop-filter: blur(12px);\r\n  -webkit-backdrop-filter: blur(12px);\r\n  align-items: center; justify-content: center;\r\n  padding: 24px;\r\n}\r\n.ksp-modal.ksp-open { display: flex; }\r\n\r\n.ksp-modal-box {\r\n  width: 100%; max-width: 960px;\r\n  max-height: 90vh;\r\n  background: #fff;\r\n  border-radius: 18px; overflow: hidden;\r\n  display: flex; flex-direction: column;\r\n  box-shadow: 0 40px 100px rgba(0,0,0,0.4);\r\n  border: 1px solid rgba(255,255,255,0.1);\r\n  animation: ksp-modal-in .3s cubic-bezier(.16,1,.3,1);\r\n}\r\n@keyframes ksp-modal-in {\r\n  from { opacity: 0; transform: scale(.95) translateY(12px); }\r\n  to   { opacity: 1; transform: scale(1) translateY(0); }\r\n}\r\n\r\n\/* Browser bar *\/\r\n.ksp-modal-bar {\r\n  display: flex; align-items: center; gap: 12px;\r\n  padding: 11px 16px;\r\n  background: #F1F5F9;\r\n  border-bottom: 1px solid #E2E8F0;\r\n  flex-shrink: 0;\r\n}\r\n.ksp-modal-dots { display: flex; gap: 6px; flex-shrink: 0; }\r\n.ksp-modal-dots span { width: 11px; height: 11px; border-radius: 50%; display: block; }\r\n.ksp-modal-url {\r\n  flex: 1; text-align: center;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.78rem; color: #64748B;\r\n  background: #fff; border: 1px solid #E2E8F0;\r\n  border-radius: 8px; padding: 4px 14px;\r\n  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;\r\n}\r\n.ksp-modal-close {\r\n  width: 30px; height: 30px; border-radius: 50%;\r\n  background: rgba(15,23,42,0.06) !important;\r\n  border: 1px solid #E2E8F0 !important;\r\n  display: flex; align-items: center; justify-content: center;\r\n  flex-shrink: 0; transition: background .18s, transform .18s;\r\n}\r\n.ksp-modal-close:hover { background: #FEE2E2 !important; transform: rotate(90deg); }\r\n.ksp-modal-close svg {\r\n  width: 13px; height: 13px;\r\n  fill: none; stroke: #64748B;\r\n  stroke-width: 2.5; stroke-linecap: round;\r\n}\r\n\r\n\/* Screenshot area *\/\r\n.ksp-modal-body { overflow-y: auto; flex: 1; }\r\n.ksp-modal-img { width: 100%; display: block; }\r\n\r\n\/* Modal footer *\/\r\n.ksp-modal-foot {\r\n  display: flex; align-items: center; justify-content: space-between;\r\n  padding: 12px 18px;\r\n  background: #F8FAFC;\r\n  border-top: 1px solid #E2E8F0;\r\n  flex-shrink: 0;\r\n}\r\n.ksp-modal-name {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: 0.925rem; font-weight: 700; color: #0F172A;\r\n}\r\n.ksp-modal-visit {\r\n  display: inline-flex; align-items: center; gap: 6px;\r\n  background: #0B1C40; color: #fff !important;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.8rem; font-weight: 700;\r\n  padding: 9px 18px; border-radius: 100px;\r\n  transition: background .18s;\r\n}\r\n.ksp-modal-visit svg { width: 13px; height: 13px; fill: none; stroke: #fff; stroke-width: 2.5; stroke-linecap: round; }\r\n.ksp-modal-visit:hover { background: #38BDF8; }\r\n\r\n\/* \u2500\u2500 RESPONSIVE \u2500\u2500 *\/\r\n@media (max-width: 900px) { .ksp-grid { grid-template-columns: repeat(2, 1fr); } }\r\n@media (max-width: 580px) {\r\n  .ksp-section { padding: 72px 0; }\r\n  .ksp-grid { grid-template-columns: 1fr; gap: 16px; }\r\n  .ksp-inner { padding: 0 16px; }\r\n  .ksp-head { flex-direction: column; align-items: flex-start; gap: 16px; }\r\n  .ksp-modal { padding: 12px; }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n(function () {\r\n  var MAX_ROW = 4;\r\n  var visibleRows = 2;\r\n  var extras = document.querySelectorAll('.ksp-extra');\r\n  var loadBtn = document.getElementById('kspLoadMore');\r\n  var modal   = document.getElementById('kspModal');\r\n  var mImg    = document.getElementById('kspModalImg');\r\n  var mUrl    = document.getElementById('kspModalUrl');\r\n  var mName   = document.getElementById('kspModalName');\r\n  var mLink   = document.getElementById('kspModalLink');\r\n  var mClose  = document.getElementById('kspModalClose');\r\n  var activeFilter = 'all';\r\n\r\n  \/* \u2500\u2500 Visibility \u2500\u2500 *\/\r\n  function applyVisibility() {\r\n    extras.forEach(function (c) {\r\n      var row   = parseInt(c.getAttribute('data-row'));\r\n      var catOk = activeFilter === 'all' || c.dataset.cat === activeFilter;\r\n      c.style.display = (catOk && row <= visibleRows) ? '' : 'none';\r\n    });\r\n    \/* also hide row-1\/2 cards if filter doesn't match *\/\r\n    document.querySelectorAll('.ksp-card:not(.ksp-extra)').forEach(function (c) {\r\n      var catOk = activeFilter === 'all' || c.dataset.cat === activeFilter;\r\n      c.style.display = catOk ? '' : 'none';\r\n    });\r\n    \/* Update button *\/\r\n    if (visibleRows >= MAX_ROW) {\r\n      loadBtn.innerHTML = '<svg viewBox=\"0 0 24 24\"><path d=\"M12 19V5M5 12l7-7 7 7\"\/><\/svg> Show less';\r\n      loadBtn.classList.add('ksp-less');\r\n    } else {\r\n      loadBtn.innerHTML = '<svg viewBox=\"0 0 24 24\"><path d=\"M12 5v14M5 12l7 7 7-7\"\/><\/svg> Show more projects';\r\n      loadBtn.classList.remove('ksp-less');\r\n    }\r\n  }\r\n\r\n  loadBtn.addEventListener('click', function () {\r\n    visibleRows = visibleRows >= MAX_ROW ? 2 : visibleRows + 1;\r\n    applyVisibility();\r\n  });\r\n\r\n  \/* \u2500\u2500 Filters \u2500\u2500 *\/\r\n  document.querySelectorAll('.ksp-filter').forEach(function (btn) {\r\n    btn.addEventListener('click', function () {\r\n      document.querySelectorAll('.ksp-filter').forEach(function (b) { b.classList.remove('ksp-active'); });\r\n      btn.classList.add('ksp-active');\r\n      activeFilter = btn.dataset.f;\r\n      visibleRows = 2;\r\n      applyVisibility();\r\n    });\r\n  });\r\n\r\n  \/* \u2500\u2500 Modal \u2500\u2500 *\/\r\n  function openModal(card) {\r\n    mImg.src           = card.dataset.img  || '';\r\n    mUrl.textContent   = card.dataset.url  || '';\r\n    mName.textContent  = card.dataset.name || '';\r\n    mLink.href         = card.dataset.live || '#';\r\n    modal.classList.add('ksp-open');\r\n    document.body.style.overflow = 'hidden';\r\n  }\r\n  function closeModal() {\r\n    modal.classList.remove('ksp-open');\r\n    document.body.style.overflow = '';\r\n  }\r\n\r\n  document.querySelectorAll('.ksp-card').forEach(function (card) {\r\n    card.querySelector('.ksp-preview-btn').addEventListener('click', function (e) {\r\n      e.stopPropagation();\r\n      openModal(card);\r\n    });\r\n  });\r\n\r\n  mClose.addEventListener('click', closeModal);\r\n  modal.addEventListener('click', function (e) { if (e.target === modal) closeModal(); });\r\n  document.addEventListener('keydown', function (e) { if (e.key === 'Escape') closeModal(); });\r\n\r\n  \/* Init *\/\r\n  applyVisibility();\r\n}());\r\n<\/script>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-bb4f327 e-con e-atomic-element e-flexbox-base e-bb4f327-09914c7 \" data-id=\"bb4f327\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"bb4f327\" data-e-type=\"e-flexbox\" data-id=\"bb4f327\">\n    \t\t<div class=\"elementor-element elementor-element-051105f elementor-widget elementor-widget-html\" data-id=\"051105f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     KladSoft \u2014 Why Work With Us Section\r\n     Paste into Elementor HTML widget\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n\r\n<section class=\"kyw-section\">\r\n  <div class=\"kyw-inner\">\r\n\r\n    <!-- \u2500\u2500 TOP: 2-col layout \u2500\u2500 -->\r\n    <div class=\"kyw-top\">\r\n\r\n      <!-- Left: heading + copy -->\r\n      <div class=\"kyw-left\">\r\n        <div class=\"kyw-eyebrow\">Why KladSoft<\/div>\r\n        <h2 class=\"kyw-title\">\r\n          Why You Should<br>\r\n          <span class=\"kyw-title-outline\">Work With Us<\/span>\r\n        <\/h2>\r\n        <p class=\"kyw-body\">\r\n          <strong>Teamwork is at the core of everything we do at KladSoft.<\/strong> We work closely with you to understand your goals \u2014 and we don't stop until you're genuinely satisfied with the outcome.\r\n        <\/p>\r\n        <p class=\"kyw-body\">\r\n          Our clients range from start-up founders to established national brands. We draw on every experience to deliver web development that's rooted in real, measurable results \u2014 not just aesthetics.\r\n        <\/p>\r\n        <p class=\"kyw-body\">\r\n          If you want your business to grow online, you've come to the right place. We build fast, reliable websites on Shopify, WordPress, and WooCommerce \u2014 and we stick around long after launch to make sure they keep performing.\r\n        <\/p>\r\n        <a href=\"\/contact\/\" class=\"kyw-cta\">\r\n          Start a Project\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M7 17L17 7M7 7h10v10\"\/><\/svg>\r\n        <\/a>\r\n      <\/div>\r\n\r\n      <!-- Right: 2\u00d72 values grid -->\r\n      <div class=\"kyw-right\">\r\n        <div class=\"kyw-values\">\r\n\r\n          <div class=\"kyw-value\">\r\n            <div class=\"kyw-value-icon\" style=\"background:#E0F2FE;color:#0369A1\">\r\n              <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2\"\/><circle cx=\"9\" cy=\"7\" r=\"4\"\/><path d=\"M23 21v-2a4 4 0 0 0-3-3.87\"\/><path d=\"M16 3.13a4 4 0 0 1 0 7.75\"\/><\/svg>\r\n            <\/div>\r\n            <div>\r\n              <h4 class=\"kyw-value-title\">Teamwork<\/h4>\r\n              <p class=\"kyw-value-desc\">We collaborate closely with you at every step \u2014 your goals become our goals from day one.<\/p>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div class=\"kyw-value\">\r\n            <div class=\"kyw-value-icon\" style=\"background:#F5F3FF;color:#5B21B6\">\r\n              <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z\"\/><\/svg>\r\n            <\/div>\r\n            <div>\r\n              <h4 class=\"kyw-value-title\">Accountability<\/h4>\r\n              <p class=\"kyw-value-desc\">We own the outcomes. If something isn't right, we fix it \u2014 no excuses, no extra charges.<\/p>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div class=\"kyw-value\">\r\n            <div class=\"kyw-value-icon\" style=\"background:#ECFDF5;color:#065F46\">\r\n              <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M13 2L3 14h9l-1 8 10-12h-9l1-8z\"\/><\/svg>\r\n            <\/div>\r\n            <div>\r\n              <h4 class=\"kyw-value-title\">Agility<\/h4>\r\n              <p class=\"kyw-value-desc\">We adapt fast. Changing requirements don't derail us \u2014 they're just part of building something great.<\/p>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div class=\"kyw-value\">\r\n            <div class=\"kyw-value-icon\" style=\"background:#FFF7ED;color:#C2410C\">\r\n              <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polygon points=\"12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2\"\/><\/svg>\r\n            <\/div>\r\n            <div>\r\n              <h4 class=\"kyw-value-title\">Quality<\/h4>\r\n              <p class=\"kyw-value-desc\">Clean code, fast sites, mobile-first. We hold every project to a standard we're proud to put our name on.<\/p>\r\n            <\/div>\r\n          <\/div>\r\n\r\n        <\/div><!-- \/kyw-values -->\r\n      <\/div>\r\n\r\n    <\/div><!-- \/kyw-top -->\r\n\r\n    <!-- \u2500\u2500 STATS BAR \u2500\u2500 -->\r\n    <div class=\"kyw-stats\">\r\n\r\n      <div class=\"kyw-stat\">\r\n        <div class=\"kyw-stat-num\" data-target=\"99\" data-suffix=\"%\">0<\/div>\r\n        <div class=\"kyw-stat-label\">Success Rate<\/div>\r\n      <\/div>\r\n\r\n      <div class=\"kyw-stat-divider\"><\/div>\r\n\r\n      <div class=\"kyw-stat\">\r\n        <div class=\"kyw-stat-num\" data-target=\"200\" data-suffix=\"+\">0<\/div>\r\n        <div class=\"kyw-stat-label\">Happy Clients<\/div>\r\n      <\/div>\r\n\r\n      <div class=\"kyw-stat-divider\"><\/div>\r\n\r\n      <div class=\"kyw-stat\">\r\n        <div class=\"kyw-stat-num\" data-target=\"400\" data-suffix=\"+\">0<\/div>\r\n        <div class=\"kyw-stat-label\">Projects Delivered<\/div>\r\n      <\/div>\r\n\r\n      <div class=\"kyw-stat-divider\"><\/div>\r\n\r\n      <div class=\"kyw-stat\">\r\n        <div class=\"kyw-stat-num\" data-target=\"8\" data-suffix=\"+\">0<\/div>\r\n        <div class=\"kyw-stat-label\">Years of Experience<\/div>\r\n      <\/div>\r\n\r\n    <\/div><!-- \/kyw-stats -->\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\/* \u2500\u2500 Reset \u2500\u2500 *\/\r\n.kyw-section, .kyw-section * { box-sizing: border-box; margin: 0; padding: 0; }\r\n.kyw-section a { text-decoration: none !important; }\r\n\r\n\/* \u2500\u2500 SECTION \u2500\u2500 *\/\r\n.kyw-section {\r\n  background: #fff;\r\n  padding: 96px 0 0;\r\n}\r\n.kyw-inner {\r\n  max-width: 1180px; margin: 0 auto; padding: 0 28px;\r\n}\r\n\r\n\/* \u2500\u2500 TOP 2-COL \u2500\u2500 *\/\r\n.kyw-top {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 72px;\r\n  align-items: center;\r\n  padding-bottom: 72px;\r\n}\r\n\r\n\/* \u2500\u2500 LEFT \u2500\u2500 *\/\r\n.kyw-eyebrow {\r\n  display: block; font-family: 'Inter', sans-serif;\r\n  font-size: 0.72rem; font-weight: 700;\r\n  letter-spacing: 0.1em; text-transform: uppercase;\r\n  color: #38BDF8; margin-bottom: 14px;\r\n}\r\n.kyw-title {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: clamp(2rem, 3.8vw, 3rem);\r\n  font-weight: 800; line-height: 1.12;\r\n  letter-spacing: -0.03em;\r\n  color: #0B1C40;\r\n  margin-bottom: 28px;\r\n}\r\n\/* Outline\/ghost text \u2014 second line *\/\r\n.kyw-title-outline {\r\n  -webkit-text-stroke: 2px #0B1C40;\r\n  color: transparent;\r\n  display: block;\r\n}\r\n.kyw-body {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.925rem; color: #475569;\r\n  line-height: 1.8; margin-bottom: 16px;\r\n}\r\n.kyw-body:last-of-type { margin-bottom: 32px; }\r\n.kyw-body strong { color: #0F172A; font-weight: 700; }\r\n\r\n.kyw-cta {\r\n  display: inline-flex; align-items: center; gap: 7px;\r\n  background: #0B1C40; color: #fff !important;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.9rem; font-weight: 700;\r\n  padding: 13px 26px; border-radius: 100px;\r\n  transition: background .2s, transform .15s, box-shadow .2s;\r\n  line-height: 1;\r\n}\r\n.kyw-cta svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; flex-shrink: 0; }\r\n.kyw-cta:hover { background: #38BDF8; transform: translateY(-2px); box-shadow: 0 8px 24px rgba(56,189,248,0.3); }\r\n\r\n\/* \u2500\u2500 RIGHT: 2\u00d72 VALUES \u2500\u2500 *\/\r\n.kyw-values {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 1px;\r\n  background: #E2E8F0;\r\n  border-radius: 20px;\r\n  overflow: hidden;\r\n  border: 1px solid #E2E8F0;\r\n}\r\n.kyw-value {\r\n  background: #F8FAFC;\r\n  padding: 28px 26px;\r\n  display: flex; flex-direction: column; gap: 12px;\r\n  transition: background .2s;\r\n}\r\n.kyw-value:hover { background: #fff; }\r\n\r\n.kyw-value-icon {\r\n  width: 46px; height: 46px; border-radius: 12px;\r\n  flex-shrink: 0; display: flex; align-items: center; justify-content: center;\r\n  transition: transform .2s;\r\n}\r\n.kyw-value:hover .kyw-value-icon { transform: scale(1.08); }\r\n.kyw-value-icon svg { width: 22px; height: 22px; }\r\n\r\n.kyw-value-title {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: 1rem; font-weight: 800;\r\n  color: #0F172A; line-height: 1.2;\r\n}\r\n.kyw-value-desc {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.845rem; color: #64748B;\r\n  line-height: 1.65;\r\n}\r\n\r\n\/* \u2500\u2500 STATS BAR \u2500\u2500 *\/\r\n.kyw-stats {\r\n  display: flex; align-items: center;\r\n  border-top: 1px solid #E2E8F0;\r\n  padding: 0;\r\n  flex-wrap: wrap;\r\n}\r\n.kyw-stat {\r\n  flex: 1; min-width: 160px;\r\n  text-align: center;\r\n  padding: 40px 20px;\r\n}\r\n.kyw-stat-num {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: clamp(2.2rem, 4vw, 3.2rem);\r\n  font-weight: 800; color: #0B1C40;\r\n  letter-spacing: -0.04em; line-height: 1;\r\n  margin-bottom: 8px;\r\n}\r\n.kyw-stat-label {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.825rem; font-weight: 500;\r\n  color: #94A3B8; text-transform: uppercase;\r\n  letter-spacing: 0.07em;\r\n}\r\n.kyw-stat-divider {\r\n  width: 1px; height: 60px; background: #E2E8F0; flex-shrink: 0;\r\n}\r\n\r\n\/* \u2500\u2500 RESPONSIVE \u2500\u2500 *\/\r\n@media (max-width: 960px) {\r\n  .kyw-top { grid-template-columns: 1fr; gap: 48px; padding-bottom: 56px; }\r\n  .kyw-title-outline { -webkit-text-stroke-width: 1.5px; }\r\n}\r\n@media (max-width: 640px) {\r\n  .kyw-section { padding: 72px 0 0; }\r\n  .kyw-inner { padding: 0 16px; }\r\n  .kyw-values { grid-template-columns: 1fr; }\r\n  .kyw-stats { flex-wrap: wrap; }\r\n  .kyw-stat { min-width: 48%; padding: 32px 16px; }\r\n  .kyw-stat-divider { display: none; }\r\n  .kyw-stat:nth-child(odd) { border-right: 1px solid #E2E8F0; }\r\n  .kyw-stat:nth-child(1), .kyw-stat:nth-child(3) { border-bottom: 1px solid #E2E8F0; }\r\n  .kyw-title { font-size: 2rem; }\r\n}\r\n\r\n\/* \u2500\u2500 REDUCED MOTION \u2500\u2500 *\/\r\n@media (prefers-reduced-motion: reduce) {\r\n  .kyw-value-icon { transition: none; }\r\n  .kyw-cta { transition: none; }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n(function () {\r\n  var counters = document.querySelectorAll('.kyw-stat-num[data-target]');\r\n  if (!counters.length) return;\r\n\r\n  function animateCount(el) {\r\n    var target  = parseInt(el.getAttribute('data-target'), 10);\r\n    var suffix  = el.getAttribute('data-suffix') || '';\r\n    var duration = 1800;\r\n    var startTime = null;\r\n    function step(ts) {\r\n      if (!startTime) startTime = ts;\r\n      var progress = Math.min((ts - startTime) \/ duration, 1);\r\n      var eased = 1 - Math.pow(1 - progress, 3);\r\n      el.textContent = Math.round(eased * target) + suffix;\r\n      if (progress < 1) requestAnimationFrame(step);\r\n      else el.textContent = target + suffix;\r\n    }\r\n    requestAnimationFrame(step);\r\n  }\r\n\r\n  if ('IntersectionObserver' in window) {\r\n    var io = new IntersectionObserver(function (entries) {\r\n      entries.forEach(function (e) {\r\n        if (e.isIntersecting) { animateCount(e.target); io.unobserve(e.target); }\r\n      });\r\n    }, { threshold: 0.5 });\r\n    counters.forEach(function (el) { io.observe(el); });\r\n  } else {\r\n    counters.forEach(animateCount);\r\n  }\r\n}());\r\n<\/script>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-2cb30b7 e-con e-atomic-element e-flexbox-base e-2cb30b7-7c8c98b \" data-id=\"2cb30b7\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"2cb30b7\" data-e-type=\"e-flexbox\" data-id=\"2cb30b7\">\n    \t\t<div class=\"elementor-element elementor-element-cc42aad elementor-widget elementor-widget-html\" data-id=\"cc42aad\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     KladSoft \u2014 FAQ Section (2-column, smooth accordion)\r\n     Paste into Elementor HTML widget\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n\r\n<section class=\"kfq-section\">\r\n  <div class=\"kfq-inner\">\r\n\r\n    <!-- Header -->\r\n    <div class=\"kfq-header\">\r\n      <div class=\"kfq-eyebrow\">Got questions?<\/div>\r\n      <h2 class=\"kfq-title\">Frequently Asked Questions<\/h2>\r\n      <p class=\"kfq-sub\">Everything you need to know before starting a project with us.<\/p>\r\n    <\/div>\r\n\r\n    <!-- 2-column accordion grid -->\r\n    <div class=\"kfq-grid\">\r\n\r\n      <!-- Col 1 -->\r\n      <div class=\"kfq-col\">\r\n\r\n        <div class=\"kfq-item\">\r\n          <button class=\"kfq-q\" aria-expanded=\"false\">\r\n            <span>How long does it take to build a website?<\/span>\r\n            <div class=\"kfq-icon-wrap\">\r\n              <svg class=\"kfq-plus\" viewBox=\"0 0 24 24\"><line x1=\"12\" y1=\"5\" x2=\"12\" y2=\"19\"\/><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><\/svg>\r\n              <svg class=\"kfq-minus\" viewBox=\"0 0 24 24\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><\/svg>\r\n            <\/div>\r\n          <\/button>\r\n          <div class=\"kfq-body\">\r\n            <p>Most projects are delivered in <strong>4\u20138 weeks<\/strong> depending on scope. A straightforward WordPress or Shopify build typically takes 3\u20134 weeks. Larger custom builds may take 6\u201310 weeks. We'll give you a clear timeline before we start \u2014 and we stick to it.<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"kfq-item\">\r\n          <button class=\"kfq-q\" aria-expanded=\"false\">\r\n            <span>Do you handle design as well as development?<\/span>\r\n            <div class=\"kfq-icon-wrap\">\r\n              <svg class=\"kfq-plus\" viewBox=\"0 0 24 24\"><line x1=\"12\" y1=\"5\" x2=\"12\" y2=\"19\"\/><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><\/svg>\r\n              <svg class=\"kfq-minus\" viewBox=\"0 0 24 24\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><\/svg>\r\n            <\/div>\r\n          <\/button>\r\n          <div class=\"kfq-body\">\r\n            <p>Yes \u2014 every project includes UX\/UI design. You'll get wireframes and full visual designs to approve before we write a single line of code. No surprises at launch.<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"kfq-item\">\r\n          <button class=\"kfq-q\" aria-expanded=\"false\">\r\n            <span>Can you work on my existing site?<\/span>\r\n            <div class=\"kfq-icon-wrap\">\r\n              <svg class=\"kfq-plus\" viewBox=\"0 0 24 24\"><line x1=\"12\" y1=\"5\" x2=\"12\" y2=\"19\"\/><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><\/svg>\r\n              <svg class=\"kfq-minus\" viewBox=\"0 0 24 24\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><\/svg>\r\n            <\/div>\r\n          <\/button>\r\n          <div class=\"kfq-body\">\r\n            <p>Absolutely. We work on existing Shopify and WordPress sites regularly \u2014 redesigns, new features, speed improvements, and bug fixes. We audit your setup first and give you honest recommendations.<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"kfq-item\">\r\n          <button class=\"kfq-q\" aria-expanded=\"false\">\r\n            <span>Will my site be mobile-friendly and fast?<\/span>\r\n            <div class=\"kfq-icon-wrap\">\r\n              <svg class=\"kfq-plus\" viewBox=\"0 0 24 24\"><line x1=\"12\" y1=\"5\" x2=\"12\" y2=\"19\"\/><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><\/svg>\r\n              <svg class=\"kfq-minus\" viewBox=\"0 0 24 24\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><\/svg>\r\n            <\/div>\r\n          <\/button>\r\n          <div class=\"kfq-body\">\r\n            <p>Always. We build mobile-first by default and target a <strong>Lighthouse score of 90+<\/strong> for performance, SEO, and accessibility. Speed is part of every deliverable \u2014 not an optional extra.<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n      <\/div><!-- \/col 1 -->\r\n\r\n      <!-- Col 2 -->\r\n      <div class=\"kfq-col\">\r\n\r\n        <div class=\"kfq-item\">\r\n          <button class=\"kfq-q\" aria-expanded=\"false\">\r\n            <span>How do I get started?<\/span>\r\n            <div class=\"kfq-icon-wrap\">\r\n              <svg class=\"kfq-plus\" viewBox=\"0 0 24 24\"><line x1=\"12\" y1=\"5\" x2=\"12\" y2=\"19\"\/><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><\/svg>\r\n              <svg class=\"kfq-minus\" viewBox=\"0 0 24 24\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><\/svg>\r\n            <\/div>\r\n          <\/button>\r\n          <div class=\"kfq-body\">\r\n            <p>Send us a message or book a free discovery call. We'll ask about your project, goals, and budget, then send a proposal within 48 hours. No commitment required at that stage.<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"kfq-item\">\r\n          <button class=\"kfq-q\" aria-expanded=\"false\">\r\n            <span>What does a maintenance plan include?<\/span>\r\n            <div class=\"kfq-icon-wrap\">\r\n              <svg class=\"kfq-plus\" viewBox=\"0 0 24 24\"><line x1=\"12\" y1=\"5\" x2=\"12\" y2=\"19\"\/><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><\/svg>\r\n              <svg class=\"kfq-minus\" viewBox=\"0 0 24 24\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><\/svg>\r\n            <\/div>\r\n          <\/button>\r\n          <div class=\"kfq-body\">\r\n            <p>Security monitoring, daily backups, plugin updates, uptime monitoring, performance reports, content updates, and dev hours \u2014 depending on your plan. Starting from <strong>$99\/month<\/strong>, cancel anytime.<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"kfq-item\">\r\n          <button class=\"kfq-q\" aria-expanded=\"false\">\r\n            <span>What's your payment structure?<\/span>\r\n            <div class=\"kfq-icon-wrap\">\r\n              <svg class=\"kfq-plus\" viewBox=\"0 0 24 24\"><line x1=\"12\" y1=\"5\" x2=\"12\" y2=\"19\"\/><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><\/svg>\r\n              <svg class=\"kfq-minus\" viewBox=\"0 0 24 24\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><\/svg>\r\n            <\/div>\r\n          <\/button>\r\n          <div class=\"kfq-body\">\r\n            <p><strong>50% upfront<\/strong> to reserve your spot, and <strong>50% on delivery<\/strong> before launch. Maintenance plans are billed monthly. We accept bank transfers and all major credit cards.<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"kfq-item\">\r\n          <button class=\"kfq-q\" aria-expanded=\"false\">\r\n            <span>Do you offer post-launch support?<\/span>\r\n            <div class=\"kfq-icon-wrap\">\r\n              <svg class=\"kfq-plus\" viewBox=\"0 0 24 24\"><line x1=\"12\" y1=\"5\" x2=\"12\" y2=\"19\"\/><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><\/svg>\r\n              <svg class=\"kfq-minus\" viewBox=\"0 0 24 24\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><\/svg>\r\n            <\/div>\r\n          <\/button>\r\n          <div class=\"kfq-body\">\r\n            <p>Yes \u2014 every project includes a <strong>30-day post-launch window<\/strong> at no extra charge. If anything breaks due to our work, we fix it immediately. After that, ongoing support is available through our maintenance plans.<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n      <\/div><!-- \/col 2 -->\r\n\r\n    <\/div><!-- \/kfq-grid -->\r\n\r\n    <!-- Bottom CTA -->\r\n    <div class=\"kfq-bottom\">\r\n      <p>Still have questions?<\/p>\r\n      <a href=\"\/contact\/\" class=\"kfq-btn\">Get in touch<\/a>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\/* \u2500\u2500 Reset \u2500\u2500 *\/\r\n.kfq-section, .kfq-section * { box-sizing: border-box; margin: 0; padding: 0; }\r\n.kfq-section a { text-decoration: none !important; }\r\n.kfq-section button { font-family: 'Inter', sans-serif; cursor: pointer; background: none; border: none; }\r\n\r\n\/* \u2500\u2500 SECTION \u2500\u2500 *\/\r\n.kfq-section {\r\n  background: #fff;\r\n  padding: 96px 28px;\r\n}\r\n.kfq-inner { max-width: 1100px; margin: 0 auto; }\r\n\r\n\/* \u2500\u2500 HEADER \u2500\u2500 *\/\r\n.kfq-header {\r\n  text-align: center; margin-bottom: 60px;\r\n}\r\n.kfq-eyebrow {\r\n  display: block; font-family: 'Inter', sans-serif;\r\n  font-size: 0.72rem; font-weight: 700;\r\n  letter-spacing: 0.1em; text-transform: uppercase;\r\n  color: #38BDF8; margin-bottom: 12px;\r\n}\r\n.kfq-title {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: clamp(1.9rem, 3.5vw, 2.6rem);\r\n  font-weight: 800; color: #0F172A;\r\n  letter-spacing: -0.025em; line-height: 1.12; margin-bottom: 12px;\r\n}\r\n.kfq-sub {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 1rem; color: #94A3B8; line-height: 1;\r\n}\r\n\r\n\/* \u2500\u2500 2-COL GRID \u2500\u2500 *\/\r\n.kfq-grid {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 0 40px;\r\n}\r\n.kfq-col { display: flex; flex-direction: column; }\r\n\r\n\/* \u2500\u2500 ITEM \u2500\u2500 *\/\r\n.kfq-item {\r\n  border-bottom: 1px solid #F1F5F9;\r\n  overflow: hidden;\r\n}\r\n.kfq-item:first-child { border-top: 1px solid #F1F5F9; }\r\n\r\n\/* \u2500\u2500 QUESTION BUTTON \u2500\u2500 *\/\r\n.kfq-q {\r\n  width: 100%; padding: 22px 0;\r\n  display: flex; align-items: center;\r\n  justify-content: space-between; gap: 16px;\r\n  text-align: left;\r\n  transition: opacity .15s;\r\n}\r\n.kfq-q:hover { opacity: 0.8; }\r\n\r\n.kfq-q span {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: 0.95rem; font-weight: 700;\r\n  color: #0F172A; line-height: 1.4; flex: 1;\r\n}\r\n.kfq-item.kfq-open .kfq-q span { color: #38BDF8; }\r\n\r\n\/* \u2500\u2500 +\/\u2212 ICON \u2500\u2500 *\/\r\n.kfq-icon-wrap {\r\n  width: 30px; height: 30px; border-radius: 50%; flex-shrink: 0;\r\n  border: 1.5px solid #E2E8F0;\r\n  display: flex; align-items: center; justify-content: center;\r\n  position: relative;\r\n  transition: background .25s, border-color .25s;\r\n}\r\n.kfq-item.kfq-open .kfq-icon-wrap {\r\n  background: #38BDF8; border-color: #38BDF8;\r\n}\r\n.kfq-plus, .kfq-minus {\r\n  position: absolute; width: 13px; height: 13px;\r\n  fill: none; stroke: #94A3B8;\r\n  stroke-width: 2.5; stroke-linecap: round;\r\n  transition: opacity .25s, stroke .25s;\r\n}\r\n.kfq-minus { opacity: 0; }\r\n.kfq-item.kfq-open .kfq-plus { opacity: 0; }\r\n.kfq-item.kfq-open .kfq-minus { opacity: 1; stroke: #fff; }\r\n\r\n\/* \u2500\u2500 ANIMATED ANSWER \u2500\u2500 *\/\r\n.kfq-body {\r\n  display: grid;\r\n  grid-template-rows: 0fr;\r\n  transition: grid-template-rows .38s cubic-bezier(.4,0,.2,1);\r\n}\r\n.kfq-item.kfq-open .kfq-body {\r\n  grid-template-rows: 1fr;\r\n}\r\n\/* Inner div needed for grid row animation *\/\r\n.kfq-body > p {\r\n  overflow: hidden;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.885rem; color: #64748B;\r\n  line-height: 1.8; padding-bottom: 20px;\r\n  \/* smooth fade *\/\r\n  opacity: 0;\r\n  transform: translateY(-4px);\r\n  transition: opacity .3s .05s ease, transform .3s .05s ease;\r\n}\r\n.kfq-item.kfq-open .kfq-body > p {\r\n  opacity: 1; transform: translateY(0);\r\n}\r\n.kfq-body p strong { color: #0F172A; font-weight: 700; }\r\n\r\n\/* \u2500\u2500 BOTTOM CTA \u2500\u2500 *\/\r\n.kfq-bottom {\r\n  display: flex; align-items: center; justify-content: center;\r\n  gap: 20px; margin-top: 56px; flex-wrap: wrap;\r\n}\r\n.kfq-bottom p {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 1rem; color: #94A3B8; line-height: 1;\r\n}\r\n.kfq-btn {\r\n  display: inline-flex; align-items: center;\r\n  background: #0F172A; color: #fff !important;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.875rem; font-weight: 700;\r\n  padding: 12px 24px; border-radius: 100px;\r\n  transition: background .2s, transform .15s, box-shadow .2s;\r\n  line-height: 1;\r\n}\r\n.kfq-btn:hover {\r\n  background: #38BDF8; transform: translateY(-2px);\r\n  box-shadow: 0 8px 24px rgba(56,189,248,0.28);\r\n}\r\n\r\n\/* \u2500\u2500 RESPONSIVE \u2500\u2500 *\/\r\n@media (max-width: 768px) {\r\n  .kfq-section { padding: 72px 20px; }\r\n  .kfq-grid { grid-template-columns: 1fr; gap: 0; }\r\n  \/* On mobile col 2 items need a top border to connect with col 1 *\/\r\n  .kfq-col:nth-child(2) .kfq-item:first-child { border-top: none; }\r\n}\r\n\r\n\/* \u2500\u2500 REDUCED MOTION \u2500\u2500 *\/\r\n@media (prefers-reduced-motion: reduce) {\r\n  .kfq-body, .kfq-body > p, .kfq-icon-wrap, .kfq-plus, .kfq-minus { transition: none !important; }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n(function () {\r\n  document.querySelectorAll('.kfq-item').forEach(function (item) {\r\n    item.querySelector('.kfq-q').addEventListener('click', function () {\r\n      var isOpen = item.classList.contains('kfq-open');\r\n      \/* Close all items in BOTH columns independently *\/\r\n      document.querySelectorAll('.kfq-item.kfq-open').forEach(function (el) {\r\n        el.classList.remove('kfq-open');\r\n        el.querySelector('.kfq-q').setAttribute('aria-expanded', 'false');\r\n      });\r\n      if (!isOpen) {\r\n        item.classList.add('kfq-open');\r\n        item.querySelector('.kfq-q').setAttribute('aria-expanded', 'true');\r\n      }\r\n    });\r\n  });\r\n}());\r\n<\/script>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-4ee0a80 e-con e-atomic-element e-flexbox-base e-5609e7a \" data-id=\"4ee0a80\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"4ee0a80\" data-e-type=\"e-flexbox\" data-id=\"4ee0a80\">\n    \t\t<div class=\"elementor-element elementor-element-ae23ff4 elementor-widget elementor-widget-html\" data-id=\"ae23ff4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     KladSoft \u2014 Scrolling Testimonials Marquee\r\n     Paste into Elementor HTML widget\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n\r\n<section class=\"kst-section\">\r\n\r\n  <!-- Header -->\r\n  <div class=\"kst-header\">\r\n    <div class=\"kst-eyebrow\">Client Testimonials<\/div>\r\n    <h2 class=\"kst-title\">Businesses trust KladSoft<\/h2>\r\n    <p class=\"kst-sub\">Don't take our word for it \u2014 hear from the clients we've built for.<\/p>\r\n  <\/div>\r\n\r\n  <!-- Row 1 \u2014 scrolls left -->\r\n  <div class=\"kst-track-wrap kst-fade\">\r\n    <div class=\"kst-track kst-track--left\" id=\"kstRow1\">\r\n\r\n      <div class=\"kst-card\">\r\n        <div class=\"kst-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\r\n        <p class=\"kst-quote\">\"KladSoft rebuilt our Shopify store from the ground up. The new site loads in under 2 seconds and our revenue <strong>increased by 35% in the first quarter<\/strong> after launch. Incredible work.\"<\/p>\r\n        <div class=\"kst-author\">\r\n          <div class=\"kst-avatar\" style=\"background:linear-gradient(135deg,#38BDF8,#0369A1)\">SE<\/div>\r\n          <div>\r\n            <div class=\"kst-name\">Sarah E.<\/div>\r\n            <div class=\"kst-role\">Founder \u00b7 Bloom &amp; Thread<\/div>\r\n          <\/div>\r\n          <div class=\"kst-badge kst-badge--shopify\">Shopify<\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"kst-card\">\r\n        <div class=\"kst-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\r\n        <p class=\"kst-quote\">\"We've worked with several agencies over the years. KladSoft is the first team that <strong>actually explains what they're doing<\/strong> and delivers exactly what they promise \u2014 every time.\"<\/p>\r\n        <div class=\"kst-author\">\r\n          <div class=\"kst-avatar\" style=\"background:linear-gradient(135deg,#1E293B,#475569)\">MK<\/div>\r\n          <div>\r\n            <div class=\"kst-name\">Marcus K.<\/div>\r\n            <div class=\"kst-role\">Partner \u00b7 Meridian Legal<\/div>\r\n          <\/div>\r\n          <div class=\"kst-badge kst-badge--wp\">WordPress<\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"kst-card\">\r\n        <div class=\"kst-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\r\n        <p class=\"kst-quote\">\"The maintenance plan is a game-changer. I never have to think about backups, updates, or security anymore. <strong>It just works<\/strong> \u2014 and when I need a change, it gets done fast.\"<\/p>\r\n        <div class=\"kst-author\">\r\n          <div class=\"kst-avatar\" style=\"background:linear-gradient(135deg,#7C3AED,#38BDF8)\">LW<\/div>\r\n          <div>\r\n            <div class=\"kst-name\">Laura W.<\/div>\r\n            <div class=\"kst-role\">CEO \u00b7 CraftRoots<\/div>\r\n          <\/div>\r\n          <div class=\"kst-badge kst-badge--maint\">Maintenance<\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"kst-card\">\r\n        <div class=\"kst-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\r\n        <p class=\"kst-quote\">\"Our WooCommerce store had been slow for years. KladSoft audited it and <strong>cut our page load time by 60%<\/strong>. The difference in bounce rate and conversions was immediate.\"<\/p>\r\n        <div class=\"kst-author\">\r\n          <div class=\"kst-avatar\" style=\"background:linear-gradient(135deg,#059669,#34D399)\">JP<\/div>\r\n          <div>\r\n            <div class=\"kst-name\">James P.<\/div>\r\n            <div class=\"kst-role\">Director \u00b7 Oakfield Supplies<\/div>\r\n          <\/div>\r\n          <div class=\"kst-badge kst-badge--woo\">WooCommerce<\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"kst-card\">\r\n        <div class=\"kst-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\r\n        <p class=\"kst-quote\">\"Professional, communicative, and delivered ahead of schedule. Our new Shopify theme looks stunning and <strong>our average order value went up 22%<\/strong> within weeks of launch.\"<\/p>\r\n        <div class=\"kst-author\">\r\n          <div class=\"kst-avatar\" style=\"background:linear-gradient(135deg,#F59E0B,#EF4444)\">AR<\/div>\r\n          <div>\r\n            <div class=\"kst-name\">Amara R.<\/div>\r\n            <div class=\"kst-role\">Owner \u00b7 Soleil Skincare<\/div>\r\n          <\/div>\r\n          <div class=\"kst-badge kst-badge--shopify\">Shopify<\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"kst-card\">\r\n        <div class=\"kst-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\r\n        <p class=\"kst-quote\">\"I handed over a rough brief and they came back with a WordPress site that <strong>exceeded every expectation<\/strong>. Clean code, fast, mobile-perfect. Exactly what a modern business needs.\"<\/p>\r\n        <div class=\"kst-author\">\r\n          <div class=\"kst-avatar\" style=\"background:linear-gradient(135deg,#2563EB,#7C3AED)\">TH<\/div>\r\n          <div>\r\n            <div class=\"kst-name\">Tom H.<\/div>\r\n            <div class=\"kst-role\">MD \u00b7 Hargrove Consulting<\/div>\r\n          <\/div>\r\n          <div class=\"kst-badge kst-badge--wp\">WordPress<\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- Duplicate set for seamless loop -->\r\n      <div class=\"kst-card\">\r\n        <div class=\"kst-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\r\n        <p class=\"kst-quote\">\"KladSoft rebuilt our Shopify store from the ground up. The new site loads in under 2 seconds and our revenue <strong>increased by 35% in the first quarter<\/strong> after launch. Incredible work.\"<\/p>\r\n        <div class=\"kst-author\">\r\n          <div class=\"kst-avatar\" style=\"background:linear-gradient(135deg,#38BDF8,#0369A1)\">SE<\/div>\r\n          <div>\r\n            <div class=\"kst-name\">Sarah E.<\/div>\r\n            <div class=\"kst-role\">Founder \u00b7 Bloom &amp; Thread<\/div>\r\n          <\/div>\r\n          <div class=\"kst-badge kst-badge--shopify\">Shopify<\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"kst-card\">\r\n        <div class=\"kst-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\r\n        <p class=\"kst-quote\">\"We've worked with several agencies over the years. KladSoft is the first team that <strong>actually explains what they're doing<\/strong> and delivers exactly what they promise \u2014 every time.\"<\/p>\r\n        <div class=\"kst-author\">\r\n          <div class=\"kst-avatar\" style=\"background:linear-gradient(135deg,#1E293B,#475569)\">MK<\/div>\r\n          <div>\r\n            <div class=\"kst-name\">Marcus K.<\/div>\r\n            <div class=\"kst-role\">Partner \u00b7 Meridian Legal<\/div>\r\n          <\/div>\r\n          <div class=\"kst-badge kst-badge--wp\">WordPress<\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"kst-card\">\r\n        <div class=\"kst-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\r\n        <p class=\"kst-quote\">\"The maintenance plan is a game-changer. I never have to think about backups, updates, or security anymore. <strong>It just works<\/strong> \u2014 and when I need a change, it gets done fast.\"<\/p>\r\n        <div class=\"kst-author\">\r\n          <div class=\"kst-avatar\" style=\"background:linear-gradient(135deg,#7C3AED,#38BDF8)\">LW<\/div>\r\n          <div>\r\n            <div class=\"kst-name\">Laura W.<\/div>\r\n            <div class=\"kst-role\">CEO \u00b7 CraftRoots<\/div>\r\n          <\/div>\r\n          <div class=\"kst-badge kst-badge--maint\">Maintenance<\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"kst-card\">\r\n        <div class=\"kst-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\r\n        <p class=\"kst-quote\">\"Our WooCommerce store had been slow for years. KladSoft audited it and <strong>cut our page load time by 60%<\/strong>. The difference in bounce rate and conversions was immediate.\"<\/p>\r\n        <div class=\"kst-author\">\r\n          <div class=\"kst-avatar\" style=\"background:linear-gradient(135deg,#059669,#34D399)\">JP<\/div>\r\n          <div>\r\n            <div class=\"kst-name\">James P.<\/div>\r\n            <div class=\"kst-role\">Director \u00b7 Oakfield Supplies<\/div>\r\n          <\/div>\r\n          <div class=\"kst-badge kst-badge--woo\">WooCommerce<\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"kst-card\">\r\n        <div class=\"kst-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\r\n        <p class=\"kst-quote\">\"Professional, communicative, and delivered ahead of schedule. Our new Shopify theme looks stunning and <strong>our average order value went up 22%<\/strong> within weeks of launch.\"<\/p>\r\n        <div class=\"kst-author\">\r\n          <div class=\"kst-avatar\" style=\"background:linear-gradient(135deg,#F59E0B,#EF4444)\">AR<\/div>\r\n          <div>\r\n            <div class=\"kst-name\">Amara R.<\/div>\r\n            <div class=\"kst-role\">Owner \u00b7 Soleil Skincare<\/div>\r\n          <\/div>\r\n          <div class=\"kst-badge kst-badge--shopify\">Shopify<\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"kst-card\">\r\n        <div class=\"kst-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\r\n        <p class=\"kst-quote\">\"I handed over a rough brief and they came back with a WordPress site that <strong>exceeded every expectation<\/strong>. Clean code, fast, mobile-perfect. Exactly what a modern business needs.\"<\/p>\r\n        <div class=\"kst-author\">\r\n          <div class=\"kst-avatar\" style=\"background:linear-gradient(135deg,#2563EB,#7C3AED)\">TH<\/div>\r\n          <div>\r\n            <div class=\"kst-name\">Tom H.<\/div>\r\n            <div class=\"kst-role\">MD \u00b7 Hargrove Consulting<\/div>\r\n          <\/div>\r\n          <div class=\"kst-badge kst-badge--wp\">WordPress<\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n<style>\r\n\/* \u2500\u2500 Reset \u2500\u2500 *\/\r\n.kst-section, .kst-section * { box-sizing: border-box; margin: 0; padding: 0; }\r\n\r\n\/* \u2500\u2500 SECTION \u2500\u2500 *\/\r\n.kst-section {\r\n  background: #fff;\r\n  padding: 88px 0;\r\n  overflow: hidden;\r\n}\r\n\r\n\/* \u2500\u2500 HEADER \u2500\u2500 *\/\r\n.kst-header {\r\n  text-align: center;\r\n  padding: 0 24px;\r\n  margin-bottom: 52px;\r\n}\r\n.kst-eyebrow {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.72rem; font-weight: 700;\r\n  letter-spacing: 0.1em; text-transform: uppercase;\r\n  color: #38BDF8; margin-bottom: 12px;\r\n  display: block;\r\n}\r\n.kst-title {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: clamp(1.9rem, 3.5vw, 2.8rem);\r\n  font-weight: 800; color: #0F172A;\r\n  letter-spacing: -0.025em; line-height: 1.15;\r\n  margin-bottom: 12px;\r\n}\r\n.kst-sub {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 1rem; color: #64748B; line-height: 1.7;\r\n}\r\n\r\n\/* \u2500\u2500 TRACK WRAPPER \u2014 fade edges \u2500\u2500 *\/\r\n.kst-track-wrap {\r\n  position: relative;\r\n  overflow: hidden;\r\n}\r\n\/* Left + right edge fade *\/\r\n.kst-fade::before,\r\n.kst-fade::after {\r\n  content: '';\r\n  position: absolute; top: 0; bottom: 0; z-index: 2;\r\n  width: 120px; pointer-events: none;\r\n}\r\n.kst-fade::before {\r\n  left: 0;\r\n  background: linear-gradient(to right, #fff 0%, transparent 100%);\r\n}\r\n.kst-fade::after {\r\n  right: 0;\r\n  background: linear-gradient(to left, #fff 0%, transparent 100%);\r\n}\r\n\r\n\/* \u2500\u2500 TRACK \u2500\u2500 *\/\r\n.kst-track {\r\n  display: flex;\r\n  gap: 20px;\r\n  width: max-content;\r\n  padding: 12px 0;\r\n  will-change: transform;\r\n}\r\n.kst-track--left  { animation: kst-scroll-left  38s linear infinite; }\r\n\r\n@keyframes kst-scroll-left {\r\n  from { transform: translateX(0); }\r\n  to   { transform: translateX(-50%); }\r\n}\r\n\r\n\/* Pause on hover (desktop) *\/\r\n@media (min-width: 768px) {\r\n  .kst-track--left:hover  { animation-play-state: paused; }\r\n}\r\n\r\n\/* \u2500\u2500 CARD \u2500\u2500 *\/\r\n.kst-card {\r\n  background: #F8FAFC;\r\n  border: 1px solid #E2E8F0;\r\n  border-radius: 18px;\r\n  padding: 26px 26px 22px;\r\n  width: 340px;\r\n  flex-shrink: 0;\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 14px;\r\n  transition: box-shadow .2s, transform .2s, border-color .2s;\r\n  cursor: default;\r\n}\r\n.kst-card:hover {\r\n  box-shadow: 0 12px 36px rgba(15,23,42,0.09);\r\n  transform: translateY(-3px);\r\n  border-color: #BAE6FD;\r\n}\r\n\r\n\/* Stars *\/\r\n.kst-stars {\r\n  color: #F59E0B;\r\n  font-size: 0.9rem;\r\n  letter-spacing: 2px;\r\n  line-height: 1;\r\n}\r\n\r\n\/* Quote *\/\r\n.kst-quote {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.9rem;\r\n  color: #475569;\r\n  line-height: 1.75;\r\n  flex: 1;\r\n}\r\n.kst-quote strong { color: #0F172A; font-weight: 700; }\r\n\r\n\/* Author row *\/\r\n.kst-author {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n  padding-top: 14px;\r\n  border-top: 1px solid #E2E8F0;\r\n}\r\n.kst-avatar {\r\n  width: 38px; height: 38px; border-radius: 50%;\r\n  flex-shrink: 0;\r\n  display: flex; align-items: center; justify-content: center;\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: 0.72rem; font-weight: 800;\r\n  color: #fff; letter-spacing: 0.02em;\r\n}\r\n.kst-name {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  font-size: 0.855rem; font-weight: 700; color: #0F172A;\r\n  line-height: 1.2;\r\n}\r\n.kst-role {\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.75rem; color: #94A3B8;\r\n  margin-top: 2px; line-height: 1;\r\n}\r\n\r\n\/* Badge \u2014 pushed to right *\/\r\n.kst-badge {\r\n  margin-left: auto;\r\n  flex-shrink: 0;\r\n  font-family: 'Inter', sans-serif;\r\n  font-size: 0.65rem; font-weight: 700;\r\n  padding: 4px 9px; border-radius: 100px;\r\n  text-transform: uppercase; letter-spacing: 0.06em;\r\n}\r\n.kst-badge--shopify { background: #E6F3EC; color: #166534; }\r\n.kst-badge--wp      { background: #EFF6FF; color: #1D4ED8; }\r\n.kst-badge--woo     { background: #F5F3FF; color: #5B21B6; }\r\n.kst-badge--maint   { background: #E0F2FE; color: #0369A1; }\r\n\r\n\/* \u2500\u2500 REDUCED MOTION \u2500\u2500 *\/\r\n@media (prefers-reduced-motion: reduce) {\r\n  .kst-track--left,\r\n  .kst-track--right { animation: none; }\r\n}\r\n<\/style>\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Available for new projects Top Tier Web Design and Development Welcome to KladSoft \u2014 a specialist web design and development [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-14","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/kladsoft.com\/index.php?rest_route=\/wp\/v2\/pages\/14","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kladsoft.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/kladsoft.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/kladsoft.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/kladsoft.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=14"}],"version-history":[{"count":37,"href":"https:\/\/kladsoft.com\/index.php?rest_route=\/wp\/v2\/pages\/14\/revisions"}],"predecessor-version":[{"id":135,"href":"https:\/\/kladsoft.com\/index.php?rest_route=\/wp\/v2\/pages\/14\/revisions\/135"}],"wp:attachment":[{"href":"https:\/\/kladsoft.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=14"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}