{"id":1015,"date":"2026-02-12T12:32:47","date_gmt":"2026-02-12T12:32:47","guid":{"rendered":"http:\/\/localhost\/amka\/?page_id=1015"},"modified":"2026-03-09T13:24:40","modified_gmt":"2026-03-09T13:24:40","slug":"our-portfolio","status":"publish","type":"page","link":"https:\/\/www.amkadigital.co.ke\/?page_id=1015","title":{"rendered":"Our Portfolio"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1015\" class=\"elementor elementor-1015\" data-elementor-settings=\"{&quot;ha_cmc_init_switcher&quot;:&quot;no&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d8c174b e-con-full service-card e-flex e-con e-child\" data-id=\"d8c174b\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5371b6e eael-infobox-icon-bg-shape-none eael-infobox-icon-hover-bg-shape-none elementor-widget elementor-widget-eael-info-box\" data-id=\"5371b6e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"eael-info-box.default\">\n\t\t\t\t\t        <div class=\"eael-infobox icon-on-left\">\n\t            <div class=\"infobox-icon eael-icon-only\">\n\n            \n                            <div class=\"infobox-icon-wrap\">\n                    <i aria-hidden=\"true\" class=\"hm hm-team-carousel\"><\/i>                <\/div>\n            \n            \n        <\/div>\n            <div class=\"infobox-content eael-icon-only\">\n                    <div class=\"infobox-title-section\">\n                <h2 class=\"title\">Portfolio<\/h2>            <\/div>\n                    <\/div>\n            <\/div>\n\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-62f4108 e-con-full e-flex e-con e-parent\" data-id=\"62f4108\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0dac976 elementor-widget elementor-widget-html\" data-id=\"0dac976\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n.amka-scene {\n  width: 320px;\n  height: 320px;\n  margin: 100px auto;\n  perspective: 1000px;\n}\n\n.amka-cube {\n  width: 100%;\n  height: 100%;\n  position: relative;\n  transform-style: preserve-3d;\n  animation: spin 20s infinite linear;\n  transition: transform 1s ease;\n}\n\n.amka-cube.fast-spin {\n  animation: spin 1s linear 1;\n}\n\n\/* Pause on hover *\/\n.amka-scene:hover .amka-cube {\n  animation-play-state: paused;\n}\n\n\/* Faces *\/\n.amka-face {\n  position: absolute;\n  width: 320px;\n  height: 320px;\n  transform-style: preserve-3d;\n  cursor: pointer;\n}\n\n\/* Inner wrapper prevents flipping *\/\n.amka-inner {\n  width: 100%;\n  height: 100%;\n  background-size: cover;\n  background-position: center;\n  display: flex;\n  align-items: flex-end;\n  justify-content: center;\n  transition: transform 0.4s ease, filter 0.4s ease;\n  position: relative;\n}\n\n\/* Overlay text *\/\n.amka-inner::after {\n  content: attr(data-title);\n  width: 100%;\n  padding: 20px;\n  background: rgba(0,0,0,0.7);\n  color: white;\n  font-family: 'Figtree', sans-serif;\n  font-size: 18px;\n  text-align: center;\n  opacity: 0;\n  transition: opacity 0.3s ease;\n}\n\n\/* Hover effect only affects inner layer *\/\n.amka-face:hover .amka-inner {\n  transform: scale(1.05);\n  filter: brightness(1.15);\n}\n\n.amka-face:hover .amka-inner::after {\n  opacity: 1;\n}\n\n\/* Blur effect *\/\n.amka-face {\n  transition: transform 0.6s ease, filter 0.6s ease, opacity 0.6s ease;\n}\n\n.amka-face.blur {\n  filter: blur(6px) brightness(0.6);\n  opacity: 0.6;\n}\n\n.amka-face.active .amka-inner {\n  transform: scale(1.25);\n  z-index: 5;\n}\n\n\/* Smooth cube rotation override *\/\n.amka-cube.manual-rotate {\n  animation: none !important;\n  transition: transform 1s ease-in-out;\n}\n\n\/* Smooth manual control *\/\n.amka-cube.manual {\n  animation: none !important;\n  transition: transform 1s cubic-bezier(0.65, 0, 0.35, 1);\n}\n\n\/* Fast acceleration spin *\/\n.amka-cube.accelerate {\n  animation: spin 0.4s linear infinite !important;\n}\n\n\/* Blur others *\/\n.amka-face.blur {\n  filter: blur(8px) brightness(0.5);\n  opacity: 0.5;\n  transition: all 0.6s ease;\n}\n\n\/* Selected zoom *\/\n.amka-face.active .amka-inner {\n  transform: scale(2.2);\n  transition: transform 1s ease-in-out;\n  z-index: 10;\n}\n\n\n\/* Position faces *\/\n.front  { transform: rotateY(0deg) translateZ(160px); }\n.back   { transform: rotateY(180deg) translateZ(160px); }\n.right  { transform: rotateY(90deg) translateZ(160px); }\n.left   { transform: rotateY(-90deg) translateZ(160px); }\n.top    { transform: rotateX(90deg) translateZ(160px); }\n.bottom { transform: rotateX(-90deg) translateZ(160px); }\n\n\/* Enhanced 3D spin *\/\n@keyframes spin {\n  \/* Opening angle - sculptural *\/\n  0%   { transform: rotateX(-35deg) rotateY(45deg); }\n\n  \/* Face 1 centered *\/\n  12%  { transform: rotateX(0deg) rotateY(0deg); }\n\n  \/* Transition *\/\n  20%  { transform: rotateX(-35deg) rotateY(-45deg); }\n\n  \/* Face 2 centered *\/\n  32%  { transform: rotateX(-10deg) rotateY(-90deg); }\n\n  \/* Transition *\/\n  40%  { transform: rotateX(-35deg) rotateY(-135deg); }\n\n  \/* Face 3 centered *\/\n  52%  { transform: rotateX(-10deg) rotateY(-180deg); }\n\n  \/* Transition *\/\n  60%  { transform: rotateX(-35deg) rotateY(-225deg); }\n\n  \/* Face 4 centered *\/\n  72%  { transform: rotateX(-10deg) rotateY(-270deg); }\n\n  \/* Transition *\/\n  80%  { transform: rotateX(-35deg) rotateY(-315deg); }\n\n  \/* Reset to sculptural *\/\n  100% { transform: rotateX(-35deg) rotateY(-360deg); }\n}\n\n}\n<\/style>\n\n<div class=\"amka-scene\">\n  <div class=\"amka-cube\">\n\n    <div class=\"amka-face front\" data-link=\"https:\/\/www.amkadigital.co.ke\/?page_id=1942\">\n      <div class=\"amka-inner\" \n           data-title=\"CEC Australia Africa\"\n           style=\"background-image:url('https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/CEC-LOGO.png');\">\n      <\/div>\n    <\/div>\n\n    <div class=\"amka-face back\" data-link=\"https:\/\/www.amkadigital.co.ke\/?page_id=1864\">\n      <div class=\"amka-inner\"\n           data-title=\"Kamuiru Muibu & CO\"\n           style=\"background-image:url('https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/kamuirulogo.png');\">\n      <\/div>\n    <\/div>\n\n    <div class=\"amka-face right\" data-link=\"http:https:\/\/www.amkadigital.co.ke\/?page_id=1851\">\n      <div class=\"amka-inner\"\n           data-title=\"Wanjiru Kairu & CO\"\n           style=\"background-image:url('https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/Wanjiru-Logo.png');\">\n      <\/div>\n    <\/div>\n\n    <div class=\"amka-face left\" data-link=\"https:\/\/www.amkadigital.co.ke\/?page_id=1824\">\n      <div class=\"amka-inner\"\n           data-title=\"Mtech\"\n           style=\"background-image:url('https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/Mtech1.png');\">\n      <\/div>\n    <\/div>\n\n    <div class=\"amka-face top\" data-link=\"https:\/\/www.amkadigital.co.ke\/?page_id=1888\">\n      <div class=\"amka-inner\"\n           data-title=\"Gadget World\"\n           style=\"background-image:url('https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/GWLOGO.png');\">\n      <\/div>\n    <\/div>\n\n    <div class=\"amka-face bottom\" data-link=\"https:\/\/www.amkadigital.co.ke\/?page_id=1015\">\n      <div class=\"amka-inner\"\n           data-title=\"Project Six\"\n           style=\"background-image:url('https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/pexels-shvets-production-7562001-scaled.jpg');\">\n      <\/div>\n    <\/div>\n\n  <\/div>\n<\/div>\n\n<script>\n\ndocument.querySelectorAll(\".amka-scene\").forEach(scene => {\n\n  const cube = scene.querySelector(\".amka-cube\");\n  const faces = scene.querySelectorAll(\".amka-face\");\n\n  const rotations = {\n    front:  { x: -30, y: 0 },\n    back:   { x: -30, y: 180 },\n    right:  { x: -30, y: -90 },\n    left:   { x: -30, y: 90 },\n    top:    { x: -90, y: 0 },\n    bottom: { x: 90,  y: 0 }\n  };\n\n  faces.forEach(face => {\n\n    face.addEventListener(\"click\", () => {\n\n      cube.classList.add(\"accelerate\");\n\n      setTimeout(() => {\n\n        cube.classList.remove(\"accelerate\");\n        cube.classList.add(\"manual\");\n\n        let faceName = [...face.classList].find(c =>\n          [\"front\",\"back\",\"left\",\"right\",\"top\",\"bottom\"].includes(c)\n        );\n\n        let rotation = rotations[faceName];\n\n        cube.style.transform =\n          `rotateX(${rotation.x}deg) rotateY(${rotation.y}deg)`;\n\n        faces.forEach(f => {\n          if (f !== face) {\n            f.classList.add(\"blur\");\n          } else {\n            f.classList.add(\"active\");\n          }\n        });\n\n        setTimeout(() => {\n          face.querySelector(\".amka-inner\").style.transform = \"scale(3)\";\n        }, 800);\n\n        setTimeout(() => {\n          window.location.href = face.dataset.link;\n        }, 1700);\n\n      }, 500);\n\n    });\n\n  });\n\n});\n<\/script>\n\n\n\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4bda5b9 elementor-widget elementor-widget-html\" data-id=\"4bda5b9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n.amka-scene {\n  width: 320px;\n  height: 320px;\n  margin: 100px auto;\n  perspective: 1000px;\n}\n\n.amka-cube {\n  width: 100%;\n  height: 100%;\n  position: relative;\n  transform-style: preserve-3d;\n  animation: spin 20s infinite linear;\n  transition: transform 1s ease;\n}\n\n.amka-cube.fast-spin {\n  animation: spin 1s linear 1;\n}\n\n\/* Pause on hover *\/\n.amka-scene:hover .amka-cube {\n  animation-play-state: paused;\n}\n\n\/* Faces *\/\n.amka-face {\n  position: absolute;\n  width: 320px;\n  height: 320px;\n  transform-style: preserve-3d;\n  cursor: pointer;\n}\n\n\/* Inner wrapper prevents flipping *\/\n.amka-inner {\n  width: 100%;\n  height: 100%;\n  background-size: cover;\n  background-position: center;\n  display: flex;\n  align-items: flex-end;\n  justify-content: center;\n  transition: transform 0.4s ease, filter 0.4s ease;\n  position: relative;\n}\n\n\/* Overlay text *\/\n.amka-inner::after {\n  content: attr(data-title);\n  width: 100%;\n  padding: 20px;\n  background: rgba(0,0,0,0.7);\n  color: white;\n  font-family: 'Figtree', sans-serif;\n  font-size: 18px;\n  text-align: center;\n  opacity: 0;\n  transition: opacity 0.3s ease;\n}\n\n\/* Hover effect only affects inner layer *\/\n.amka-face:hover .amka-inner {\n  transform: scale(1.05);\n  filter: brightness(1.15);\n}\n\n.amka-face:hover .amka-inner::after {\n  opacity: 1;\n}\n\n\/* Blur effect *\/\n.amka-face {\n  transition: transform 0.6s ease, filter 0.6s ease, opacity 0.6s ease;\n}\n\n.amka-face.blur {\n  filter: blur(6px) brightness(0.6);\n  opacity: 0.6;\n}\n\n.amka-face.active .amka-inner {\n  transform: scale(1.25);\n  z-index: 5;\n}\n\n\/* Smooth cube rotation override *\/\n.amka-cube.manual-rotate {\n  animation: none !important;\n  transition: transform 1s ease-in-out;\n}\n\n\/* Smooth manual control *\/\n.amka-cube.manual {\n  animation: none !important;\n  transition: transform 1s cubic-bezier(0.65, 0, 0.35, 1);\n}\n\n\/* Fast acceleration spin *\/\n.amka-cube.accelerate {\n  animation: spin 0.4s linear infinite !important;\n}\n\n\/* Blur others *\/\n.amka-face.blur {\n  filter: blur(8px) brightness(0.5);\n  opacity: 0.5;\n  transition: all 0.6s ease;\n}\n\n\/* Selected zoom *\/\n.amka-face.active .amka-inner {\n  transform: scale(2.2);\n  transition: transform 1s ease-in-out;\n  z-index: 10;\n}\n\n\n\/* Position faces *\/\n.front  { transform: rotateY(0deg) translateZ(160px); }\n.back   { transform: rotateY(180deg) translateZ(160px); }\n.right  { transform: rotateY(90deg) translateZ(160px); }\n.left   { transform: rotateY(-90deg) translateZ(160px); }\n.top    { transform: rotateX(90deg) translateZ(160px); }\n.bottom { transform: rotateX(-90deg) translateZ(160px); }\n\n\/* Enhanced 3D spin *\/\n@keyframes spin {\n  \/* Opening angle - sculptural *\/\n  0%   { transform: rotateX(-35deg) rotateY(45deg); }\n\n  \/* Face 1 centered *\/\n  12%  { transform: rotateX(0deg) rotateY(0deg); }\n\n  \/* Transition *\/\n  20%  { transform: rotateX(-35deg) rotateY(-45deg); }\n\n  \/* Face 2 centered *\/\n  32%  { transform: rotateX(-10deg) rotateY(-90deg); }\n\n  \/* Transition *\/\n  40%  { transform: rotateX(-35deg) rotateY(-135deg); }\n\n  \/* Face 3 centered *\/\n  52%  { transform: rotateX(-10deg) rotateY(-180deg); }\n\n  \/* Transition *\/\n  60%  { transform: rotateX(-35deg) rotateY(-225deg); }\n\n  \/* Face 4 centered *\/\n  72%  { transform: rotateX(-10deg) rotateY(-270deg); }\n\n  \/* Transition *\/\n  80%  { transform: rotateX(-35deg) rotateY(-315deg); }\n\n  \/* Reset to sculptural *\/\n  100% { transform: rotateX(-35deg) rotateY(-360deg); }\n}\n\n}\n<\/style>\n\n<div class=\"amka-scene\">\n  <div class=\"amka-cube\">\n\n    <div class=\"amka-face front\" data-link=\"https:\/\/www.amkadigital.co.ke\/?page_id=1904\">\n      <div class=\"amka-inner\" \n           data-title=\"Kings Paper Works\"\n           style=\"background-image:url('https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/KINGS-PAPER-WORK-LTD-LOGO.jpg');\">\n      <\/div>\n    <\/div>\n\n    <div class=\"amka-face back\" data-link=\"https:\/\/www.amkadigital.co.ke\/?page_id=1926\">\n      <div class=\"amka-inner\"\n           data-title=\"Novatech\"\n           style=\"background-image:url('https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/Novatech-computers-logo-2.png');\">\n      <\/div>\n    <\/div>\n\n    <div class=\"amka-face right\" data-link=\"https:\/\/www.amkadigital.co.ke\/?page_id=1966\">\n      <div class=\"amka-inner\"\n           data-title=\"Kratos De Energia\"\n           style=\"background-image:url('https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/kratos3.png');\">\n      <\/div>\n    <\/div>\n\n    <div class=\"amka-face left\" data-link=\"https:\/\/www.amkadigital.co.ke\/?page_id=1739\">\n      <div class=\"amka-inner\"\n           data-title=\"Techovant\"\n           style=\"background-image:url('https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/Techovant-Solutions-Final-Logo.png.webp');\">\n      <\/div>\n    <\/div>\n\n    <div class=\"amka-face top\" data-link=\"https:\/\/www.amkadigital.co.ke\/?page_id=1473\">\n      <div class=\"amka-inner\"\n           data-title=\"Basify\"\n           style=\"background-image:url('https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/BasifyLogo.webp');\">\n      <\/div>\n    <\/div>\n\n    <div class=\"amka-face bottom\" data-link=\"https:\/\/www.amkadigital.co.ke\/?page_id=1015\">\n      <div class=\"amka-inner\"\n           data-title=\"Project Six\"\n           style=\"background-image:url('https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/pexels-shvets-production-7562001-scaled.jpg');\">\n      <\/div>\n    <\/div>\n\n  <\/div>\n<\/div>\n\n<script>\n\ndocument.querySelectorAll(\".amka-scene\").forEach(scene => {\n\n  const cube = scene.querySelector(\".amka-cube\");\n  const faces = scene.querySelectorAll(\".amka-face\");\n\n  const rotations = {\n    front:  { x: -30, y: 0 },\n    back:   { x: -30, y: 180 },\n    right:  { x: -30, y: -90 },\n    left:   { x: -30, y: 90 },\n    top:    { x: -90, y: 0 },\n    bottom: { x: 90,  y: 0 }\n  };\n\n  faces.forEach(face => {\n\n    face.addEventListener(\"click\", () => {\n\n      cube.classList.add(\"accelerate\");\n\n      setTimeout(() => {\n\n        cube.classList.remove(\"accelerate\");\n        cube.classList.add(\"manual\");\n\n        let faceName = [...face.classList].find(c =>\n          [\"front\",\"back\",\"left\",\"right\",\"top\",\"bottom\"].includes(c)\n        );\n\n        let rotation = rotations[faceName];\n\n        cube.style.transform =\n          `rotateX(${rotation.x}deg) rotateY(${rotation.y}deg)`;\n\n        faces.forEach(f => {\n          if (f !== face) {\n            f.classList.add(\"blur\");\n          } else {\n            f.classList.add(\"active\");\n          }\n        });\n\n        setTimeout(() => {\n          face.querySelector(\".amka-inner\").style.transform = \"scale(3)\";\n        }, 800);\n\n        setTimeout(() => {\n          window.location.href = face.dataset.link;\n        }, 1700);\n\n      }, 500);\n\n    });\n\n  });\n\n});\n<\/script>\n\n\n\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9de62ee elementor-widget elementor-widget-html\" data-id=\"9de62ee\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n.amka-scene {\n  width: 320px;\n  height: 320px;\n  margin: 100px auto;\n  perspective: 1000px;\n}\n\n.amka-cube {\n  width: 100%;\n  height: 100%;\n  position: relative;\n  transform-style: preserve-3d;\n  animation: spin 20s infinite linear;\n  transition: transform 1s ease;\n}\n\n.amka-cube.fast-spin {\n  animation: spin 1s linear 1;\n}\n\n\/* Pause on hover *\/\n.amka-scene:hover .amka-cube {\n  animation-play-state: paused;\n}\n\n\/* Faces *\/\n.amka-face {\n  position: absolute;\n  width: 320px;\n  height: 320px;\n  transform-style: preserve-3d;\n  cursor: pointer;\n}\n\n\/* Inner wrapper prevents flipping *\/\n.amka-inner {\n  width: 100%;\n  height: 100%;\n  background-size: cover;\n  background-position: center;\n  display: flex;\n  align-items: flex-end;\n  justify-content: center;\n  transition: transform 0.4s ease, filter 0.4s ease;\n  position: relative;\n}\n\n\/* Overlay text *\/\n.amka-inner::after {\n  content: attr(data-title);\n  width: 100%;\n  padding: 20px;\n  background: rgba(0,0,0,0.7);\n  color: white;\n  font-family: 'Figtree', sans-serif;\n  font-size: 18px;\n  text-align: center;\n  opacity: 0;\n  transition: opacity 0.3s ease;\n}\n\n\/* Hover effect only affects inner layer *\/\n.amka-face:hover .amka-inner {\n  transform: scale(1.05);\n  filter: brightness(1.15);\n}\n\n.amka-face:hover .amka-inner::after {\n  opacity: 1;\n}\n\n\/* Blur effect *\/\n.amka-face {\n  transition: transform 0.6s ease, filter 0.6s ease, opacity 0.6s ease;\n}\n\n.amka-face.blur {\n  filter: blur(6px) brightness(0.6);\n  opacity: 0.6;\n}\n\n.amka-face.active .amka-inner {\n  transform: scale(1.25);\n  z-index: 5;\n}\n\n\/* Smooth cube rotation override *\/\n.amka-cube.manual-rotate {\n  animation: none !important;\n  transition: transform 1s ease-in-out;\n}\n\n\/* Smooth manual control *\/\n.amka-cube.manual {\n  animation: none !important;\n  transition: transform 1s cubic-bezier(0.65, 0, 0.35, 1);\n}\n\n\/* Fast acceleration spin *\/\n.amka-cube.accelerate {\n  animation: spin 0.4s linear infinite !important;\n}\n\n\/* Blur others *\/\n.amka-face.blur {\n  filter: blur(8px) brightness(0.5);\n  opacity: 0.5;\n  transition: all 0.6s ease;\n}\n\n\/* Selected zoom *\/\n.amka-face.active .amka-inner {\n  transform: scale(2.2);\n  transition: transform 1s ease-in-out;\n  z-index: 10;\n}\n\n\n\/* Position faces *\/\n.front  { transform: rotateY(0deg) translateZ(160px); }\n.back   { transform: rotateY(180deg) translateZ(160px); }\n.right  { transform: rotateY(90deg) translateZ(160px); }\n.left   { transform: rotateY(-90deg) translateZ(160px); }\n.top    { transform: rotateX(90deg) translateZ(160px); }\n.bottom { transform: rotateX(-90deg) translateZ(160px); }\n\n\/* Enhanced 3D spin *\/\n@keyframes spin {\n  \/* Opening angle - sculptural *\/\n  0%   { transform: rotateX(-35deg) rotateY(45deg); }\n\n  \/* Face 1 centered *\/\n  12%  { transform: rotateX(0deg) rotateY(0deg); }\n\n  \/* Transition *\/\n  20%  { transform: rotateX(-35deg) rotateY(-45deg); }\n\n  \/* Face 2 centered *\/\n  32%  { transform: rotateX(-10deg) rotateY(-90deg); }\n\n  \/* Transition *\/\n  40%  { transform: rotateX(-35deg) rotateY(-135deg); }\n\n  \/* Face 3 centered *\/\n  52%  { transform: rotateX(-10deg) rotateY(-180deg); }\n\n  \/* Transition *\/\n  60%  { transform: rotateX(-35deg) rotateY(-225deg); }\n\n  \/* Face 4 centered *\/\n  72%  { transform: rotateX(-10deg) rotateY(-270deg); }\n\n  \/* Transition *\/\n  80%  { transform: rotateX(-35deg) rotateY(-315deg); }\n\n  \/* Reset to sculptural *\/\n  100% { transform: rotateX(-35deg) rotateY(-360deg); }\n}\n\n}\n<\/style>\n\n<div class=\"amka-scene\">\n  <div class=\"amka-cube\">\n\n    <div class=\"amka-face front\" data-link=\"https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/smartbuy.png\">\n      <div class=\"amka-inner\" \n           data-title=\"Smartbuy\"\n           style=\"background-image:url('https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/smartbuy.-Logo.webp');\">\n      <\/div>\n    <\/div>\n\n    <div class=\"amka-face back\" data-link=\"https:\/\/www.amkadigital.co.ke\/?page_id=1015\">\n      <div class=\"amka-inner\"\n           data-title=\"Shewin Group\"\n           style=\"background-image:url('https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/pexels-hellochemo-1799435-scaled.jpg');\">\n      <\/div>\n    <\/div>\n\n    <div class=\"amka-face right\" data-link=\"https:\/\/www.amkadigital.co.ke\/?page_id=1015\">\n      <div class=\"amka-inner\"\n           data-title=\"   \"\n           style=\"background-image:url('https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/pexels-linda-christiansen-3817393-5691773.jpg');\">\n      <\/div>\n    <\/div>\n\n    <div class=\"amka-face left\" data-link=\"https:\/\/www.amkadigital.co.ke\/?page_id=1015\">\n      <div class=\"amka-inner\"\n           data-title=\"       \"\n           style=\"background-image:url('https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/pexels-shvets-production-7562001-scaled.jpg');\">\n      <\/div>\n    <\/div>\n\n    <div class=\"amka-face top\" data-link=\"https:\/\/www.amkadigital.co.ke\/?page_id=1015\">\n      <div class=\"amka-inner\"\n           data-title=\"      \"\n           style=\"background-image:url('https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/pexels-shvets-production-7562001-scaled.jpg');\">\n      <\/div>\n    <\/div>\n\n    <div class=\"amka-face bottom\" data-link=\"https:\/\/www.amkadigital.co.ke\/?page_id=1015\">\n      <div class=\"amka-inner\"\n           data-title=\"       \"\n           style=\"background-image:url('https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/pexels-shvets-production-7562001-scaled.jpg');\">\n      <\/div>\n    <\/div>\n\n  <\/div>\n<\/div>\n\n<script>\n\ndocument.querySelectorAll(\".amka-scene\").forEach(scene => {\n\n  const cube = scene.querySelector(\".amka-cube\");\n  const faces = scene.querySelectorAll(\".amka-face\");\n\n  const rotations = {\n    front:  { x: -30, y: 0 },\n    back:   { x: -30, y: 180 },\n    right:  { x: -30, y: -90 },\n    left:   { x: -30, y: 90 },\n    top:    { x: -90, y: 0 },\n    bottom: { x: 90,  y: 0 }\n  };\n\n  faces.forEach(face => {\n\n    face.addEventListener(\"click\", () => {\n\n      cube.classList.add(\"accelerate\");\n\n      setTimeout(() => {\n\n        cube.classList.remove(\"accelerate\");\n        cube.classList.add(\"manual\");\n\n        let faceName = [...face.classList].find(c =>\n          [\"front\",\"back\",\"left\",\"right\",\"top\",\"bottom\"].includes(c)\n        );\n\n        let rotation = rotations[faceName];\n\n        cube.style.transform =\n          `rotateX(${rotation.x}deg) rotateY(${rotation.y}deg)`;\n\n        faces.forEach(f => {\n          if (f !== face) {\n            f.classList.add(\"blur\");\n          } else {\n            f.classList.add(\"active\");\n          }\n        });\n\n        setTimeout(() => {\n          face.querySelector(\".amka-inner\").style.transform = \"scale(3)\";\n        }, 800);\n\n        setTimeout(() => {\n          window.location.href = face.dataset.link;\n        }, 1700);\n\n      }, 500);\n\n    });\n\n  });\n\n});\n<\/script>\n\n\n\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-a6e3e87 e-con-full animated-slow e-flex e-con e-parent\" data-id=\"a6e3e87\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;animation&quot;:&quot;none&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a01b9ff elementor-widget elementor-widget-html\" data-id=\"a01b9ff\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"custom-marquee\">\r\n  <div class=\"marquee-track\">\r\n    <span>Build the Future \/<\/span>\r\n    <span>Launch Your Vision \/<\/span>\r\n    <span>Transform Your Ideas \/<\/span>\r\n    <span>Build the Future \/<\/span>\r\n    <span>Launch Your Vision \/<\/span>\r\n     <span>Transform Your Ideas \/<\/span>\r\n  \r\n  <\/div>\r\n<\/div>\r\n<style>\r\n    @import url('https:\/\/fonts.googleapis.com\/css2?family=Figtree:wght@600;700;800&display=swap');\r\n\r\n.custom-marquee {\r\n  width: 100%;\r\n  overflow: hidden;\r\n  background: ; \/* match your section background *\/\r\n  padding: 2.5rem 0;\r\n}\r\n\r\n.marquee-track {\r\n  display: flex;\r\n  width: max-content;\r\n  white-space: nowrap;\r\n  gap: 4rem;\r\n  animation: marqueeScroll 18s linear infinite;\r\n}\r\n\r\n.marquee-track span {\r\n  font-family: 'Figtree', sans-serif;\r\n  font-size: clamp(5.5rem, 12vw, 12rem); \/* BIG like Zein *\/\r\n  font-weight:600;\r\n  letter-spacing: -0.02em;\r\n  color: #ffffff;\r\n  text-transform: ;\r\n}\r\n\r\n@keyframes marqueeScroll {\r\n  from { transform: translateX(0); }\r\n  to { transform: translateX(-50%); }\r\n}\r\n\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3182fc0 elementor-widget elementor-widget-ha-creative-button happy-addon ha-creative-button\" data-id=\"3182fc0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"ha-creative-button.default\">\n\t\t\t\t\t\t\t<div data-magnetic=\"no\" class=\"ha-creative-btn-wrap\">\n\t\t\t<a class=\"ha-creative-btn ha-stl--montino ha-eft--nina\" href=\"https:\/\/www.amkadigital.co.ke\/?page_id=1124\" rel=\"nofollow\" data-text=\"Contact Us\"><span style=\"--delay:0.045s\">C<\/span><span style=\"--delay:0.09s\">o<\/span><span style=\"--delay:0.135s\">n<\/span><span style=\"--delay:0.18s\">t<\/span><span style=\"--delay:0.225s\">a<\/span><span style=\"--delay:0.27s\">c<\/span><span style=\"--delay:0.315s\">t<\/span><span>&nbsp;<\/span><span style=\"--delay:0.405s\">U<\/span><span style=\"--delay:0.45s\">s<\/span><\/a>\n\t\t<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-a8fe315 e-con-full e-flex e-con e-parent\" data-id=\"a8fe315\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f3ef8de elementor-widget elementor-widget-html\" data-id=\"f3ef8de\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"nav-toggle-wrapper\">\r\n  <button class=\"nav-toggle\" aria-expanded=\"false\" aria-label=\"Toggle menu\">\r\n    <span><\/span>\r\n    <span><\/span>\r\n    <span><\/span>\r\n  <\/button>\r\n\r\n  <nav class=\"main-nav\">\r\n    <div class=\"nav-bg\"><\/div>\r\n    <ul>\r\n      <li><a href=\"https:\/\/www.amkadigital.co.ke\/\">Home<\/a><\/li>\r\n      <li><a href=\"https:\/\/www.amkadigital.co.ke\/?page_id=753\">About Us<\/a><\/li>\r\n      <li><a href=\"https:\/\/www.amkadigital.co.ke\/?page_id=997\">Services<\/a><\/li>\r\n      <li><a href=\"https:\/\/www.amkadigital.co.ke\/?page_id=1015\">Portfolio<\/a><\/li>\r\n      <li><a href=\"https:\/\/www.amkadigital.co.ke\/?page_id=1124\">Contact Us<\/a><\/li>\r\n    <\/ul>\r\n  <\/nav>\r\n  \r\n  <script>\r\n  document.addEventListener('DOMContentLoaded', () => {\r\n    const toggle = document.querySelector('.nav-toggle');\r\n    const nav = document.querySelector('.main-nav');\r\n\r\n    toggle.addEventListener('click', () => {\r\n      toggle.classList.toggle('active');\r\n      nav.classList.toggle('active');\r\n      toggle.setAttribute(\r\n        'aria-expanded',\r\n        toggle.classList.contains('active')\r\n      );\r\n    });\r\n\r\n    \/\/ Close when clicking a link\r\n    document.querySelectorAll('.main-nav a').forEach(link => {\r\n      link.addEventListener('click', () => {\r\n        toggle.classList.remove('active');\r\n        nav.classList.remove('active');\r\n        toggle.setAttribute('aria-expanded', 'false');\r\n      });\r\n    });\r\n\r\n    \/\/ Close on Escape key\r\n    document.addEventListener('keydown', (e) => {\r\n      if (e.key === 'Escape') {\r\n        toggle.classList.remove('active');\r\n        nav.classList.remove('active');\r\n        toggle.setAttribute('aria-expanded', 'false');\r\n      }\r\n    });\r\n  });\r\n<\/script>\r\n\r\n<\/div>\r\n\r\n<style>\r\n   @import url('https:\/\/fonts.googleapis.com\/css2?family=Figtree:wght@400;600;800;900&display=swap');\r\n\r\n\/* Wrapper *\/\r\n.nav-toggle-wrapper {\r\n  position: fixed;\r\n  top: 30px;\r\n  right: 30px;\r\n  z-index: 9999;\r\n}\r\n\r\n\/* Toggle Button (SCALED UP) *\/\r\n.nav-toggle {\r\n  width: 104px;\r\n  height: 104px;\r\n  background: rgba(255, 255, 255, 0.15);\r\n  border: 1px solid rgba(255,255,255,0.35);\r\n  border-radius: 50%;\r\n  backdrop-filter: blur(12px);\r\n  -webkit-backdrop-filter: blur(12px);\r\n  cursor: pointer;\r\n  position: relative;\r\n  z-index: 10000;\r\n  box-shadow: \r\n    0 0 18px rgba(255,255,255,0.45),\r\n    0 0 40px rgba(255,255,255,0.3);\r\n  transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1);\r\n}\r\n\r\n\/* Glow on hover *\/\r\n.nav-toggle:hover {\r\n  box-shadow: \r\n    0 0 28px rgba(255,255,255,0.7),\r\n    0 0 60px rgba(255,255,255,0.4);\r\n  transform: scale(1.08);\r\n}\r\n\r\n\/* Hamburger lines (SCALED UP) *\/\r\n.nav-toggle span {\r\n  position: absolute;\r\n  left: 50%;\r\n  width: 38px;\r\n  height: 3px;\r\n  background: #fff;\r\n  border-radius: 3px;\r\n  transform: translateX(-50%);\r\n  transition: all 0.6s cubic-bezier(0.22, 1, 0.36, 1);\r\n}\r\n\r\n.nav-toggle span:nth-child(1) { top: 34px; }\r\n.nav-toggle span:nth-child(2) { top: 50px; }\r\n.nav-toggle span:nth-child(3) { top: 66px; }\r\n\r\n\/* Active state (hamburger \u2192 X) *\/\r\n.nav-toggle.active span:nth-child(1) {\r\n  top: 50px;\r\n  transform: translateX(-50%) rotate(45deg);\r\n}\r\n.nav-toggle.active span:nth-child(2) {\r\n  opacity: 0;\r\n}\r\n.nav-toggle.active span:nth-child(3) {\r\n  top: 50px;\r\n  transform: translateX(-50%) rotate(-45deg);\r\n}\r\n\r\n\/* Navigation panel *\/\r\n.main-nav {\r\n  position: fixed;\r\n  inset: 0;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  transform: translateY(-100%);\r\n  transition: transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);\r\n  z-index: 9990;\r\n  overflow: hidden;\r\n}\r\n\r\n\/* Background layer (glass + optional image) *\/\r\n.main-nav .nav-bg {\r\n  position: absolute;\r\n  inset: 0;\r\n  background: \r\n    linear-gradient(135deg, rgba(10,10,20,0.6), rgba(5,5,10,0.7)),\r\n    url('https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/2026\/02\/pexels-alessialorenzi-18409678-scaled.jpg');\r\n  background-size: cover;\r\n  background-position: center;\r\n  filter: saturate(120%) contrast(110%);\r\n}\r\n\r\n\/* Glass overlay *\/\r\n.main-nav::before {\r\n  content: \"\";\r\n  position: absolute;\r\n  inset: 0;\r\n  backdrop-filter: blur(24px);\r\n  -webkit-backdrop-filter: blur(24px);\r\n  background: rgba(10,10,20,0.55);\r\n  z-index: 1;\r\n}\r\n\r\n\/* Reveal menu *\/\r\n.main-nav.active {\r\n  transform: translateY(0);\r\n}\r\n\r\n\/* Menu list *\/\r\n.main-nav ul {\r\n  list-style: none;\r\n  padding: 0;\r\n  margin: 0;\r\n  text-align: center;\r\n  position: relative;\r\n  z-index: 2;\r\n}\r\n\r\n\/* Menu items *\/\r\n.main-nav ul li {\r\n  margin: 28px 0;\r\n  opacity: 0;\r\n  transform: translateY(30px);\r\n  transition: all 0.8s cubic-bezier(0.22, 1, 0.36, 1);\r\n}\r\n\r\n.main-nav.active ul li {\r\n  opacity: 1;\r\n  transform: translateY(0);\r\n}\r\n\r\n\/* Stagger *\/\r\n.main-nav.active ul li:nth-child(1) { transition-delay: 0.15s; }\r\n.main-nav.active ul li:nth-child(2) { transition-delay: 0.25s; }\r\n.main-nav.active ul li:nth-child(3) { transition-delay: 0.35s; }\r\n.main-nav.active ul li:nth-child(4) { transition-delay: 0.45s; }\r\n.main-nav.active ul li:nth-child(5) { transition-delay: 0.55s; }\r\n\r\n\/* Menu links *\/\r\n.main-nav ul li a {\r\n  font-family: 'Figtree', sans-serif;\r\n  font-size: clamp(3.2rem, 7vw, 6.2rem);\r\n  font-weight: 800;\r\n  text-decoration: none;\r\n  letter-spacing: -0.02em;\r\n  color: #f5f7ff;\r\n  text-shadow: 0 0 20px rgba(255,255,255,0.15);\r\n  transition: all 0.35s cubic-bezier(0.22, 1, 0.36, 1);\r\n}\r\n\r\n\/* Hover effect *\/\r\n.main-nav ul li a:hover {\r\n  color: #7dd3fc;\r\n  text-shadow: 0 0 30px rgba(125,211,252,0.75);\r\n  transform: scale(1.06);\r\n}\r\n\r\n\/* =========================\r\n   TABLET (\u22641024px)\r\n========================= *\/\r\n@media (max-width: 1024px) {\r\n\r\n  .nav-toggle-wrapper {\r\n    top: 24px;\r\n    right: 24px;\r\n  }\r\n\r\n  .nav-toggle {\r\n    width: 82px;\r\n    height: 82px;\r\n  }\r\n\r\n  .nav-toggle span {\r\n    width: 30px;\r\n    height: 3px;\r\n  }\r\n\r\n  .nav-toggle span:nth-child(1) { top: 26px; }\r\n  .nav-toggle span:nth-child(2) { top: 39px; }\r\n  .nav-toggle span:nth-child(3) { top: 52px; }\r\n\r\n}\r\n\r\n\r\n\/* =========================\r\n   MOBILE (\u2264767px)\r\n========================= *\/\r\n@media (max-width: 767px) {\r\n\r\n  .nav-toggle-wrapper {\r\n    top: 18px;\r\n    right: 18px;\r\n  }\r\n\r\n  .nav-toggle {\r\n    width: 64px;\r\n    height: 64px;\r\n  }\r\n\r\n  .nav-toggle span {\r\n    width: 24px;\r\n    height: 2.5px;\r\n  }\r\n\r\n  .nav-toggle span:nth-child(1) { top: 20px; }\r\n  .nav-toggle span:nth-child(2) { top: 31px; }\r\n  .nav-toggle span:nth-child(3) { top: 42px; }\r\n\r\n}\r\n\r\n<\/style>\t\t\t\t<\/div>\n\t\t<a class=\"eael-wrapper-link-daed6c1 --eael-wrapper-link-tag\" href=\"https:\/\/www.amkadigital.co.ke\/\"><\/a>\t\t<div data-ha-element-link=\"{&quot;url&quot;:&quot;https:\\\/\\\/www.amkadigital.co.ke\\\/&quot;,&quot;is_external&quot;:&quot;&quot;,&quot;nofollow&quot;:&quot;&quot;}\" style=\"cursor: pointer\" data-eael-wrapper-link=\"eael-wrapper-link-daed6c1\" class=\"elementor-element elementor-element-daed6c1 sticky-logo elementor-widget elementor-widget-image\" data-id=\"daed6c1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t<figure class=\"wp-caption\">\n\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/www.amkadigital.co.ke\/wp-content\/uploads\/elementor\/thumbs\/WhatsApp_Image_2026-02-04_at_18.57.27-removebg-preview-rio7at6j87z0if8gx3mfh3bsictefokhynjai2vb8g.png\" title=\"WhatsApp_Image_2026-02-04_at_18.57.27-removebg-preview\" alt=\"WhatsApp_Image_2026-02-04_at_18.57.27-removebg-preview\" class=\"elementor-animation-grow\" loading=\"lazy\" \/>\t\t\t\t\t\t\t\t\t\t\t<figcaption class=\"widget-image-caption wp-caption-text\"><\/figcaption>\n\t\t\t\t\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<div data-eael_duration=\"{&quot;transitionDuration&quot;:1000}\" data-eael_easing=\"{&quot;transitionEasing&quot;:&quot;ease&quot;}\" data-eael_hover_duration=\"{&quot;transitionDuration&quot;:1000}\" data-eael_hover_easing=\"{&quot;transitionEasing&quot;:&quot;ease&quot;}\" class=\"eael_hover_effect elementor-element elementor-element-936e988 elementor-widget elementor-widget-html\" data-id=\"936e988\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;eael_hover_effect_transform_popover&quot;:&quot;yes&quot;,&quot;eael_hover_effect_general_settings_easing&quot;:&quot;ease&quot;,&quot;eael_hover_effect_general_settings_hover_easing&quot;:&quot;ease&quot;}\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n    .sticky-logo {\n    position: fixed;           \/* Stays on screen while scrolling *\/\n    top: 0;                    \/* Flush with top *\/\n    left: 0;                   \/* Flush with left *\/\n    width: 200px;              \/* Logo width *\/\n    height: 200px;             \/* Logo height *\/\n    z-index: 9999;             \/* On top of everything *\/\n    border: none;\n    background: transparent;\n    filter: drop-shadow(0 0 30px rgba(255, 255, 255, 0.9)); \/* Soft glow *\/\n    \n}\n\n \/* Tablet Layout *\/\n    @media (max-width: 1024px) {\n        .sticky-logo {\n            width: 140px;\n            height: 140px;\n            filter: drop-shadow(0 0 20px rgba(255, 255, 255, 0.8));\n        }\n    }\n\n    \/* Mobile Layout *\/\n    @media (max-width: 767px) {\n        .sticky-logo {\n            width: 100px;\n            height: 100px;\n            filter: drop-shadow(0 0 15px rgba(255, 255, 255, 0.7));\n        }\n    }\n\n\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Portfolio Build the Future \/ Launch Your Vision \/ Transform Your Ideas \/ Build the Future \/ Launch Your Vision \/ Transform Your Ideas \/ Contact&nbsp;Us Home About Us Services Portfolio Contact Us<\/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":{"footnotes":""},"class_list":["post-1015","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.amkadigital.co.ke\/index.php?rest_route=\/wp\/v2\/pages\/1015","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.amkadigital.co.ke\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.amkadigital.co.ke\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.amkadigital.co.ke\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.amkadigital.co.ke\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1015"}],"version-history":[{"count":145,"href":"https:\/\/www.amkadigital.co.ke\/index.php?rest_route=\/wp\/v2\/pages\/1015\/revisions"}],"predecessor-version":[{"id":2654,"href":"https:\/\/www.amkadigital.co.ke\/index.php?rest_route=\/wp\/v2\/pages\/1015\/revisions\/2654"}],"wp:attachment":[{"href":"https:\/\/www.amkadigital.co.ke\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1015"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}