African Spice Journey<\/title>\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<style>\r\n.spice-journey-container {\r\n width: 100%;\r\n max-width: 800px;\r\n height: 500px;\r\n margin: 0 auto;\r\n position: relative;\r\n overflow: hidden;\r\n background: #1a0a00;\r\n border-radius: 10px;\r\n box-shadow: 0 10px 30px rgba(0,0,0,0.3);\r\n font-family: Arial, sans-serif;\r\n cursor: pointer;\r\n}\r\n.spice-journey-container * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n}\r\n#map {\r\n position: absolute;\r\n top: 0; left: 0;\r\n width: 100%; height: 100%;\r\n object-fit: cover;\r\n z-index: 1;\r\n opacity: 0.85;\r\n}\r\n#plane {\r\n position: absolute;\r\n width: 50px; height: 50px;\r\n z-index: 10;\r\n pointer-events: none;\r\n filter: drop-shadow(0 3px 8px rgba(0,0,0,0.9));\r\n transition: left 2s cubic-bezier(0.4,0,0.2,1),\r\n top 2s cubic-bezier(0.4,0,0.2,1),\r\n transform 0.6s;\r\n left: 27%; top: 32%;\r\n transform: translate(-50%,-50%) rotate(90deg);\r\n opacity: 0;\r\n}\r\n.plane-icon { width: 100%; height: 100%; color: #fff; }\r\n.marker {\r\n position: absolute;\r\n width: 26px; height: 26px;\r\n background: #ff9800;\r\n border: 2px solid #fff;\r\n border-radius: 50%;\r\n box-shadow: 0 0 12px #ff9800;\r\n transform: translate(-50%,-50%);\r\n z-index: 9;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-weight: bold;\r\n font-size: 8px;\r\n color: white;\r\n}\r\n.marker.picked {\r\n background: #4caf50;\r\n box-shadow: 0 0 18px #4caf50;\r\n animation: pulse 2s infinite;\r\n}\r\n.spice-bag {\r\n position: absolute;\r\n width: 14px; height: 14px;\r\n background: #ff5722;\r\n border-radius: 3px;\r\n transform: translate(-50%,-50%);\r\n opacity: 0;\r\n z-index: 8;\r\n border: 1px solid #fff;\r\n}\r\n.spice-bag.collected {\r\n opacity: 1;\r\n animation: float 2s ease-in-out infinite;\r\n}\r\n#path {\r\n position: absolute;\r\n top: 0; left: 0;\r\n width: 100%; height: 100%;\r\n pointer-events: none;\r\n z-index: 5;\r\n}\r\n#dropzone {\r\n position: absolute;\r\n width: 55px; height: 55px;\r\n border: 3px dashed #4caf50;\r\n border-radius: 50%;\r\n left: 54%; top: 89%;\r\n transform: translate(-50%,-50%);\r\n z-index: 7;\r\n opacity: 0;\r\n box-shadow: 0 0 20px rgba(76,175,80,0.5);\r\n}\r\n#dropzone.active {\r\n opacity: 1;\r\n animation: pulse 3s infinite;\r\n}\r\n#spice-collection {\r\n position: absolute;\r\n left: 54%; top: 96%;\r\n transform: translateX(-50%);\r\n display: flex;\r\n gap: 5px;\r\n z-index: 15;\r\n opacity: 0;\r\n}\r\n.collected-spice {\r\n width: 18px; height: 18px;\r\n background: #ff5722;\r\n border-radius: 4px;\r\n border: 1px solid #fff;\r\n opacity: 0;\r\n transform: scale(0);\r\n}\r\n.collected-spice.show {\r\n opacity: 1;\r\n transform: scale(1);\r\n transition: all 0.3s ease;\r\n}\r\n#title {\r\n position: absolute;\r\n top: 10px; left: 0;\r\n width: 100%;\r\n text-align: center;\r\n color: white;\r\n font-size: 17px;\r\n font-weight: bold;\r\n text-shadow: 2px 2px 6px rgba(0,0,0,0.9);\r\n z-index: 11;\r\n letter-spacing: 1px;\r\n}\r\n#progress {\r\n position: absolute;\r\n bottom: 12px; left: 12px;\r\n background: rgba(0,0,0,0.75);\r\n color: #4dabf7;\r\n padding: 5px 10px;\r\n border-radius: 5px;\r\n font-size: 11px;\r\n z-index: 11;\r\n border: 1px solid #4dabf7;\r\n max-width: 72%;\r\n}\r\n#restart-hint {\r\n position: absolute;\r\n bottom: 12px; right: 12px;\r\n background: rgba(0,0,0,0.6);\r\n color: #aaa;\r\n padding: 4px 8px;\r\n border-radius: 5px;\r\n font-size: 10px;\r\n z-index: 11;\r\n border: 1px solid #555;\r\n}\r\n@keyframes pulse {\r\n 0%,100% { transform: translate(-50%,-50%) scale(1); }\r\n 50% { transform: translate(-50%,-50%) scale(1.3); }\r\n}\r\n@keyframes float {\r\n 0%,100% { transform: translate(-50%,-50%) translateY(0px); }\r\n 50% { transform: translate(-50%,-50%) translateY(-5px); }\r\n}\r\n@keyframes bounce {\r\n 0%,100% { transform: translate(-50%,-50%) translateY(0) rotate(var(--plane-angle,90deg)); }\r\n 50% { transform: translate(-50%,-50%) translateY(-5px) rotate(var(--plane-angle,90deg)); }\r\n}\r\n.parachute-container {\r\n position: absolute;\r\n top: 0; left: 0;\r\n width: 100%; height: 100%;\r\n pointer-events: none;\r\n z-index: 12;\r\n}\r\n.parachute {\r\n position: absolute;\r\n width: 12px; height: 12px;\r\n background: #ff5722;\r\n border-radius: 2px;\r\n border: 1px solid #fff;\r\n transform: translate(-50%,-50%);\r\n opacity: 0;\r\n z-index: 13;\r\n}\r\n.parachute-canopy {\r\n position: absolute;\r\n width: 28px; height: 16px;\r\n background: #4dabf7;\r\n border-radius: 50% 50% 0 0;\r\n top: -18px; left: 50%;\r\n transform: translateX(-50%);\r\n}\r\n.parachute-line-left,\r\n.parachute-line-right {\r\n position: absolute;\r\n width: 1px; height: 18px;\r\n background: #fff;\r\n top: -18px; opacity: 0.8;\r\n}\r\n.parachute-line-left { left: calc(50% - 5px); transform-origin: bottom; transform: rotate(-10deg); }\r\n.parachute-line-right { left: calc(50% + 4px); transform-origin: bottom; transform: rotate(10deg); }\r\n.parachute.active {\r\n opacity: 1;\r\n animation: parachuteDrop 3s ease-out forwards;\r\n}\r\n@keyframes parachuteDrop {\r\n 0% { top: var(--drop-start-top); left: var(--drop-start-left); opacity: 1; }\r\n 100% { top: 89%; left: 54%; opacity: 0.9; }\r\n}\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n<div class=\"spice-journey-container\" id=\"spiceContainer\">\r\n\r\n <div id=\"title\">\ud83c\udf36 African Spice Journey<\/div>\r\n <div id=\"progress\">Preparing for departure...<\/div>\r\n <div id=\"restart-hint\">Click to restart<\/div>\r\n\r\n <img decoding=\"async\"\r\n id=\"map\"\r\n src=\"https:\/\/upload.wikimedia.org\/wikipedia\/commons\/thumb\/8\/86\/Africa_%28orthographic_projection%29.svg\/2048px-Africa_%28orthographic_projection%29.svg.png\"\r\n alt=\"Africa orthographic projection\"\r\n crossorigin=\"anonymous\"\r\n >\r\n\r\n <div id=\"plane\">\r\n <svg class=\"plane-icon\" viewBox=\"0 0 24 24\" fill=\"white\">\r\n <path d=\"M21 16v-2l-8-5V3.5c0-.83-.67-1.5-1.5-1.5S10 2.67 10 3.5V9l-8 5v2l8-2.5V19l-2 1.5V22l3.5-1 3.5 1v-1.5L13 19v-5.5l8 2.5z\"\/>\r\n <\/svg>\r\n <\/div>\r\n\r\n <div class=\"parachute-container\" id=\"parachuteContainer\"><\/div>\r\n\r\n <svg id=\"path\" viewBox=\"0 0 100 100\" preserveAspectRatio=\"none\"><\/svg>\r\n\r\n \r\n <div class=\"marker\" style=\"left:27%;top:32%;\">MA<\/div>\r\n <div class=\"spice-bag\" style=\"left:27%;top:32%;\"><\/div>\r\n\r\n <div class=\"marker\" style=\"left:37%;top:29%;\">TN<\/div>\r\n <div class=\"spice-bag\" style=\"left:37%;top:29%;\"><\/div>\r\n\r\n <div class=\"marker\" style=\"left:53%;top:27%;\">EG<\/div>\r\n <div class=\"spice-bag\" style=\"left:53%;top:27%;\"><\/div>\r\n\r\n <div class=\"marker\" style=\"left:40%;top:46%;\">NG<\/div>\r\n <div class=\"spice-bag\" style=\"left:40%;top:46%;\"><\/div>\r\n\r\n <div class=\"marker\" style=\"left:57%;top:43%;\">ET<\/div>\r\n <div class=\"spice-bag\" style=\"left:57%;top:43%;\"><\/div>\r\n\r\n <div class=\"marker\" style=\"left:58%;top:50%;\">KE<\/div>\r\n <div class=\"spice-bag\" style=\"left:58%;top:50%;\"><\/div>\r\n\r\n \r\n <div class=\"marker\" style=\"left:54%;top:89%;\">ZA<\/div>\r\n <div id=\"dropzone\"><\/div>\r\n\r\n <div id=\"spice-collection\">\r\n <div class=\"collected-spice\" id=\"spice1\"><\/div>\r\n <div class=\"collected-spice\" id=\"spice2\"><\/div>\r\n <div class=\"collected-spice\" id=\"spice3\"><\/div>\r\n <div class=\"collected-spice\" id=\"spice4\"><\/div>\r\n <div class=\"collected-spice\" id=\"spice5\"><\/div>\r\n <div class=\"collected-spice\" id=\"spice6\"><\/div>\r\n <\/div>\r\n\r\n<\/div>\r\n\r\n<script>\r\nconst route = [\r\n {x:27, y:32, country:\"Morocco\", spice:\"Ras el Hanout\", action:\"pickup\"},\r\n {x:37, y:29, country:\"Tunisia\", spice:\"Harissa\", action:\"pickup\"},\r\n {x:53, y:27, country:\"Egypt\", spice:\"Dukkah\", action:\"pickup\"},\r\n {x:40, y:46, country:\"Nigeria\", spice:\"Suya Spice\", action:\"pickup\"},\r\n {x:57, y:43, country:\"Ethiopia\", spice:\"Berbere\", action:\"pickup\"},\r\n {x:58, y:50, country:\"Kenya\", spice:\"Pilau Masala\", action:\"pickup\"},\r\n {x:54, y:89, country:\"South Africa\", spice:\"All Spices\", action:\"dropoff\"}\r\n];\r\n\r\nlet currentStop = 0;\r\nlet collectedSpices = 0;\r\n\r\nconst plane = document.getElementById('plane');\r\nconst pathSvg = document.getElementById('path');\r\nconst markers = document.querySelectorAll('.marker');\r\nconst spiceBags = document.querySelectorAll('.spice-bag');\r\nconst dropzone = document.getElementById('dropzone');\r\nconst spiceCollection = document.getElementById('spice-collection');\r\nconst progress = document.getElementById('progress');\r\nconst parachuteContainer = document.getElementById('parachuteContainer');\r\n\r\nfunction calcAngle(x1,y1,x2,y2) {\r\n return Math.atan2(y2-y1, x2-x1) * 180 \/ Math.PI;\r\n}\r\n\r\nfunction drawPath() {\r\n let d = \"\";\r\n for (let i = 0; i <= currentStop && i < route.length; i++) {\r\n d += (i===0 ? \"M\" : \"L\") + route[i].x + \" \" + route[i].y + \" \";\r\n }\r\n pathSvg.innerHTML = `\r\n <path d=\"${d}\"\r\n stroke=\"#4dabf7\"\r\n stroke-width=\"0.6\"\r\n fill=\"none\"\r\n opacity=\"0.85\"\r\n stroke-dasharray=\"2.5 1.5\">\r\n <animate attributeName=\"stroke-dashoffset\"\r\n from=\"60\" to=\"0\" dur=\"1.2s\" repeatCount=\"indefinite\"\/>\r\n <\/path>`;\r\n}\r\n\r\nfunction createParachute() {\r\n const pr = plane.getBoundingClientRect();\r\n const cr = parachuteContainer.getBoundingClientRect();\r\n const sl = ((pr.left + pr.width\/2) - cr.left) \/ cr.width * 100;\r\n const st = ((pr.top + pr.height\/2) - cr.top) \/ cr.height * 100;\r\n\r\n const p = document.createElement('div');\r\n p.className = 'parachute';\r\n p.style.setProperty('--drop-start-left', sl+'%');\r\n p.style.setProperty('--drop-start-top', st+'%');\r\n p.innerHTML = `\r\n <div class=\"parachute-canopy\"><\/div>\r\n <div class=\"parachute-line-left\"><\/div>\r\n <div class=\"parachute-line-right\"><\/div>`;\r\n parachuteContainer.appendChild(p);\r\n setTimeout(() => p.classList.add('active'), 80);\r\n setTimeout(() => { p.remove(); revealSpice(); }, 3200);\r\n}\r\n\r\nfunction revealSpice() {\r\n const el = document.getElementById('spice' + collectedSpices);\r\n if (el) el.classList.add('show');\r\n}\r\n\r\nfunction addSpiceToPlane() {\r\n plane.innerHTML = `\r\n <svg class=\"plane-icon\" viewBox=\"0 0 24 24\" fill=\"white\">\r\n <path d=\"M21 16v-2l-8-5V3.5c0-.83-.67-1.5-1.5-1.5S10 2.67 10 3.5V9l-8 5v2l8-2.5V19l-2 1.5V22l3.5-1 3.5 1v-1.5L13 19v-5.5l8 2.5z\"\/>\r\n <\/svg>\r\n <div style=\"position:absolute;top:-9px;left:50%;transform:translateX(-50%);\r\n width:16px;height:16px;background:#ff5722;border-radius:3px;\r\n border:1px solid white;\"><\/div>`;\r\n}\r\n\r\nfunction resetPlaneIcon() {\r\n plane.innerHTML = `\r\n <svg class=\"plane-icon\" viewBox=\"0 0 24 24\" fill=\"white\">\r\n <path d=\"M21 16v-2l-8-5V3.5c0-.83-.67-1.5-1.5-1.5S10 2.67 10 3.5V9l-8 5v2l8-2.5V19l-2 1.5V22l3.5-1 3.5 1v-1.5L13 19v-5.5l8 2.5z\"\/>\r\n <\/svg>`;\r\n}\r\n\r\nfunction dropAllSpices() {\r\n dropzone.classList.add('active');\r\n spiceCollection.style.opacity = '1';\r\n let delay = 0;\r\n for (let i = 0; i < collectedSpices; i++) {\r\n setTimeout(createParachute, delay);\r\n delay += 550;\r\n }\r\n setTimeout(() => {\r\n resetPlaneIcon();\r\n const a = plane.style.transform.match(\/rotate\$([^)]+)\$\/);\r\n plane.style.setProperty('--plane-angle', a ? a[1] : '90deg');\r\n plane.style.animation = 'bounce 0.8s 4';\r\n progress.textContent = '\ud83c\udf89 All spices delivered to South Africa!';\r\n progress.style.color = '#4caf50';\r\n progress.style.borderColor = '#4caf50';\r\n }, delay + 800);\r\n}\r\n\r\nfunction flyToNext() {\r\n if (currentStop >= route.length) return;\r\n const dest = route[currentStop];\r\n const prev = currentStop > 0 ? route[currentStop-1] : {x:20,y:30};\r\n const angle = calcAngle(prev.x, prev.y, dest.x, dest.y);\r\n\r\n plane.style.transform = `translate(-50%,-50%) rotate(${angle+90}deg)`;\r\n plane.style.left = dest.x + '%';\r\n plane.style.top = dest.y + '%';\r\n plane.style.setProperty('--plane-angle', (angle+90)+'deg');\r\n\r\n progress.textContent = dest.action === 'pickup'\r\n ? `\u2708 Flying to ${dest.country}...`\r\n : `\ud83d\udce6 Delivering to ${dest.country}...`;\r\n\r\n drawPath();\r\n\r\n setTimeout(() => {\r\n if (dest.action === 'pickup') {\r\n markers[currentStop].classList.add('picked');\r\n spiceBags[currentStop].classList.add('collected');\r\n collectedSpices++;\r\n addSpiceToPlane();\r\n progress.textContent = `\u2705 Collected ${dest.spice} from ${dest.country}`;\r\n } else {\r\n markers[currentStop].classList.add('picked');\r\n dropAllSpices();\r\n }\r\n }, 1800);\r\n\r\n currentStop++;\r\n if (currentStop < route.length) setTimeout(flyToNext, 3000);\r\n}\r\n\r\nfunction startJourney() {\r\n setTimeout(() => {\r\n plane.style.opacity = '1';\r\n progress.textContent = '\u2708 Departing from Morocco...';\r\n setTimeout(flyToNext, 600);\r\n }, 400);\r\n}\r\n\r\nfunction resetAll() {\r\n currentStop = 0;\r\n collectedSpices = 0;\r\n parachuteContainer.innerHTML = '';\r\n pathSvg.innerHTML = '';\r\n markers.forEach(m => m.classList.remove('picked'));\r\n spiceBags.forEach(b => b.classList.remove('collected'));\r\n document.querySelectorAll('.collected-spice').forEach(s => s.classList.remove('show'));\r\n dropzone.classList.remove('active');\r\n spiceCollection.style.opacity = '0';\r\n plane.style.left = '27%';\r\n plane.style.top = '32%';\r\n plane.style.transform = 'translate(-50%,-50%) rotate(90deg)';\r\n plane.style.animation = '';\r\n plane.style.opacity = '0';\r\n progress.textContent = '\u2708 Departing from Morocco...';\r\n progress.style.color = '#4dabf7';\r\n progress.style.borderColor = '#4dabf7';\r\n resetPlaneIcon();\r\n startJourney();\r\n}\r\n\r\ndocument.getElementById('spiceContainer').addEventListener('click', resetAll);\r\nwindow.addEventListener('load', startJourney);\r\n<\/script>\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-92a9c10 e-flex e-con-boxed e-con e-parent\" data-id=\"92a9c10\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-39c54a75 e-con-full e-flex e-con e-parent\" data-id=\"39c54a75\" data-element_type=\"container\" data-settings=\"{"background_background":"classic"}\">\n\t\t<div class=\"elementor-element elementor-element-3c58b10c e-con-full e-flex e-con e-child\" data-id=\"3c58b10c\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8657e03 elementor-cta--skin-classic elementor-animated-content elementor-bg-transform elementor-bg-transform-zoom-in elementor-widget elementor-widget-call-to-action\" data-id=\"8657e03\" data-element_type=\"widget\" data-widget_type=\"call-to-action.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-cta\">\n\t\t\t\t\t<div class=\"elementor-cta__bg-wrapper\">\n\t\t\t\t<div class=\"elementor-cta__bg elementor-bg\" style=\"background-image: url(https:\/\/mumbaispices.co.za\/wp-content\/uploads\/2025\/11\/Image_fx-65-1024x559.jpg);\" role=\"img\" aria-label=\"Image_fx (65)\"><\/div>\n\t\t\t\t<div class=\"elementor-cta__bg-overlay\"><\/div>\n\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-cta__content\">\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<h2 class=\"elementor-cta__title elementor-cta__content-item elementor-content-item\">\n\t\t\t\t\t\tCompany Establishment\t\t\t\t\t<\/h2>\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-cta__description elementor-cta__content-item elementor-content-item\">\n\t\t\t\t\t\tMumbai Spices was\nestablished in 2020\t\t\t\t\t<\/div>\n\t\t\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-966a79f elementor-cta--skin-classic elementor-animated-content elementor-bg-transform elementor-bg-transform-zoom-in elementor-widget elementor-widget-call-to-action\" data-id=\"966a79f\" data-element_type=\"widget\" data-widget_type=\"call-to-action.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-cta\">\n\t\t\t\t\t<div class=\"elementor-cta__bg-wrapper\">\n\t\t\t\t<div class=\"elementor-cta__bg elementor-bg\" style=\"background-image: url(https:\/\/mumbaispices.co.za\/wp-content\/uploads\/2025\/11\/Image_fx-73-1024x559.jpg);\" role=\"img\" aria-label=\"Image_fx (73)\"><\/div>\n\t\t\t\t<div class=\"elementor-cta__bg-overlay\"><\/div>\n\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-cta__content\">\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<h2 class=\"elementor-cta__title elementor-cta__content-item elementor-content-item\">\n\t\t\t\t\t\tClient Base\t\t\t\t\t<\/h2>\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-cta__description elementor-cta__content-item elementor-content-item\">\n\t\t\t\t\t\tRead More\nMumbai Spices serves\nwholesale and retail\nclientel throughout South\nAfrica \t\t\t\t\t<\/div>\n\t\t\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-041b13e elementor-bg-transform elementor-bg-transform-zoom-out elementor-cta--skin-classic elementor-animated-content elementor-widget elementor-widget-call-to-action\" data-id=\"041b13e\" data-element_type=\"widget\" data-widget_type=\"call-to-action.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-cta\">\n\t\t\t\t\t<div class=\"elementor-cta__bg-wrapper\">\n\t\t\t\t<div class=\"elementor-cta__bg elementor-bg\" style=\"background-image: url(https:\/\/mumbaispices.co.za\/wp-content\/uploads\/2025\/11\/Image_fx-75-1024x559.jpg);\" role=\"img\" aria-label=\"Image_fx (75)\"><\/div>\n\t\t\t\t<div class=\"elementor-cta__bg-overlay\"><\/div>\n\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-cta__content\">\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<h2 class=\"elementor-cta__title elementor-cta__content-item elementor-content-item\">\n\t\t\t\t\t\tKey Services \t\t\t\t\t<\/h2>\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-cta__description elementor-cta__content-item elementor-content-item\">\n\t\t\t\t\t\tThe company provides\nmanufacturing, milling,\nblending, exporting, and\npackaging services.\t\t\t\t\t<\/div>\n\t\t\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3b9b4e4 elementor-cta--skin-classic elementor-animated-content elementor-bg-transform elementor-bg-transform-zoom-in elementor-widget elementor-widget-call-to-action\" data-id=\"3b9b4e4\" data-element_type=\"widget\" data-widget_type=\"call-to-action.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-cta\">\n\t\t\t\t\t<div class=\"elementor-cta__bg-wrapper\">\n\t\t\t\t<div class=\"elementor-cta__bg elementor-bg\" style=\"background-image: url(https:\/\/mumbaispices.co.za\/wp-content\/uploads\/2025\/12\/EBP_0154-684x1024.jpg);\" role=\"img\" aria-label=\"Mumbai Spices\"><\/div>\n\t\t\t\t<div class=\"elementor-cta__bg-overlay\"><\/div>\n\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-cta__content\">\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<h2 class=\"elementor-cta__title elementor-cta__content-item elementor-content-item\">\n\t\t\t\t\t\tQuality Commitment \t\t\t\t\t<\/h2>\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-cta__description elementor-cta__content-item elementor-content-item\">\n\t\t\t\t\t\tMumbai Spices ensures\nhigh-quality standards\nthrough technology and\ncompliance. \t\t\t\t\t<\/div>\n\t\t\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-315b5ab e-flex e-con-boxed e-con e-parent\" data-id=\"315b5ab\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-4b65b87 e-con-full e-flex e-con e-child\" data-id=\"4b65b87\" data-element_type=\"container\">\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-af2b1da e-con-full e-flex e-con e-child\" data-id=\"af2b1da\" data-element_type=\"container\">\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-dd25ca7 e-con-full e-flex e-con e-child\" data-id=\"dd25ca7\" data-element_type=\"container\">\n\t\t\t\t<\/div>\n\t\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>African Spice Journey 🌶 African Spice Journey Preparing for departure… Click to restart MA TN EG NG ET KE ZA Company Establishment Mumbai Spices was established in 2020 Client Base Read More Mumbai Spices serves wholesale and retail clientel throughout South Africa Key Services The company provides manufacturing, milling, blending, exporting, and packaging services. Quality<\/p>\n<div class=\"more-link\">\n <a href=\"https:\/\/mumbaispices.co.za\/?page_id=96\" class=\"theme-btn\"><span>Continue Reading <\/span><i class=\"bi bi-arrow-right\"><\/i><\/a>\n <\/div>\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-96","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/mumbaispices.co.za\/index.php?rest_route=\/wp\/v2\/pages\/96","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mumbaispices.co.za\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/mumbaispices.co.za\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/mumbaispices.co.za\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mumbaispices.co.za\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=96"}],"version-history":[{"count":64,"href":"https:\/\/mumbaispices.co.za\/index.php?rest_route=\/wp\/v2\/pages\/96\/revisions"}],"predecessor-version":[{"id":422,"href":"https:\/\/mumbaispices.co.za\/index.php?rest_route=\/wp\/v2\/pages\/96\/revisions\/422"}],"wp:attachment":[{"href":"https:\/\/mumbaispices.co.za\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=96"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\t\t\r\n\r\n\r\n\r\nAfrican Spice Journey<\/title>\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<style>\r\n.spice-journey-container {\r\n width: 100%;\r\n max-width: 800px;\r\n height: 500px;\r\n margin: 0 auto;\r\n position: relative;\r\n overflow: hidden;\r\n background: #1a0a00;\r\n border-radius: 10px;\r\n box-shadow: 0 10px 30px rgba(0,0,0,0.3);\r\n font-family: Arial, sans-serif;\r\n cursor: pointer;\r\n}\r\n.spice-journey-container * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n}\r\n#map {\r\n position: absolute;\r\n top: 0; left: 0;\r\n width: 100%; height: 100%;\r\n object-fit: cover;\r\n z-index: 1;\r\n opacity: 0.85;\r\n}\r\n#plane {\r\n position: absolute;\r\n width: 50px; height: 50px;\r\n z-index: 10;\r\n pointer-events: none;\r\n filter: drop-shadow(0 3px 8px rgba(0,0,0,0.9));\r\n transition: left 2s cubic-bezier(0.4,0,0.2,1),\r\n top 2s cubic-bezier(0.4,0,0.2,1),\r\n transform 0.6s;\r\n left: 27%; top: 32%;\r\n transform: translate(-50%,-50%) rotate(90deg);\r\n opacity: 0;\r\n}\r\n.plane-icon { width: 100%; height: 100%; color: #fff; }\r\n.marker {\r\n position: absolute;\r\n width: 26px; height: 26px;\r\n background: #ff9800;\r\n border: 2px solid #fff;\r\n border-radius: 50%;\r\n box-shadow: 0 0 12px #ff9800;\r\n transform: translate(-50%,-50%);\r\n z-index: 9;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-weight: bold;\r\n font-size: 8px;\r\n color: white;\r\n}\r\n.marker.picked {\r\n background: #4caf50;\r\n box-shadow: 0 0 18px #4caf50;\r\n animation: pulse 2s infinite;\r\n}\r\n.spice-bag {\r\n position: absolute;\r\n width: 14px; height: 14px;\r\n background: #ff5722;\r\n border-radius: 3px;\r\n transform: translate(-50%,-50%);\r\n opacity: 0;\r\n z-index: 8;\r\n border: 1px solid #fff;\r\n}\r\n.spice-bag.collected {\r\n opacity: 1;\r\n animation: float 2s ease-in-out infinite;\r\n}\r\n#path {\r\n position: absolute;\r\n top: 0; left: 0;\r\n width: 100%; height: 100%;\r\n pointer-events: none;\r\n z-index: 5;\r\n}\r\n#dropzone {\r\n position: absolute;\r\n width: 55px; height: 55px;\r\n border: 3px dashed #4caf50;\r\n border-radius: 50%;\r\n left: 54%; top: 89%;\r\n transform: translate(-50%,-50%);\r\n z-index: 7;\r\n opacity: 0;\r\n box-shadow: 0 0 20px rgba(76,175,80,0.5);\r\n}\r\n#dropzone.active {\r\n opacity: 1;\r\n animation: pulse 3s infinite;\r\n}\r\n#spice-collection {\r\n position: absolute;\r\n left: 54%; top: 96%;\r\n transform: translateX(-50%);\r\n display: flex;\r\n gap: 5px;\r\n z-index: 15;\r\n opacity: 0;\r\n}\r\n.collected-spice {\r\n width: 18px; height: 18px;\r\n background: #ff5722;\r\n border-radius: 4px;\r\n border: 1px solid #fff;\r\n opacity: 0;\r\n transform: scale(0);\r\n}\r\n.collected-spice.show {\r\n opacity: 1;\r\n transform: scale(1);\r\n transition: all 0.3s ease;\r\n}\r\n#title {\r\n position: absolute;\r\n top: 10px; left: 0;\r\n width: 100%;\r\n text-align: center;\r\n color: white;\r\n font-size: 17px;\r\n font-weight: bold;\r\n text-shadow: 2px 2px 6px rgba(0,0,0,0.9);\r\n z-index: 11;\r\n letter-spacing: 1px;\r\n}\r\n#progress {\r\n position: absolute;\r\n bottom: 12px; left: 12px;\r\n background: rgba(0,0,0,0.75);\r\n color: #4dabf7;\r\n padding: 5px 10px;\r\n border-radius: 5px;\r\n font-size: 11px;\r\n z-index: 11;\r\n border: 1px solid #4dabf7;\r\n max-width: 72%;\r\n}\r\n#restart-hint {\r\n position: absolute;\r\n bottom: 12px; right: 12px;\r\n background: rgba(0,0,0,0.6);\r\n color: #aaa;\r\n padding: 4px 8px;\r\n border-radius: 5px;\r\n font-size: 10px;\r\n z-index: 11;\r\n border: 1px solid #555;\r\n}\r\n@keyframes pulse {\r\n 0%,100% { transform: translate(-50%,-50%) scale(1); }\r\n 50% { transform: translate(-50%,-50%) scale(1.3); }\r\n}\r\n@keyframes float {\r\n 0%,100% { transform: translate(-50%,-50%) translateY(0px); }\r\n 50% { transform: translate(-50%,-50%) translateY(-5px); }\r\n}\r\n@keyframes bounce {\r\n 0%,100% { transform: translate(-50%,-50%) translateY(0) rotate(var(--plane-angle,90deg)); }\r\n 50% { transform: translate(-50%,-50%) translateY(-5px) rotate(var(--plane-angle,90deg)); }\r\n}\r\n.parachute-container {\r\n position: absolute;\r\n top: 0; left: 0;\r\n width: 100%; height: 100%;\r\n pointer-events: none;\r\n z-index: 12;\r\n}\r\n.parachute {\r\n position: absolute;\r\n width: 12px; height: 12px;\r\n background: #ff5722;\r\n border-radius: 2px;\r\n border: 1px solid #fff;\r\n transform: translate(-50%,-50%);\r\n opacity: 0;\r\n z-index: 13;\r\n}\r\n.parachute-canopy {\r\n position: absolute;\r\n width: 28px; height: 16px;\r\n background: #4dabf7;\r\n border-radius: 50% 50% 0 0;\r\n top: -18px; left: 50%;\r\n transform: translateX(-50%);\r\n}\r\n.parachute-line-left,\r\n.parachute-line-right {\r\n position: absolute;\r\n width: 1px; height: 18px;\r\n background: #fff;\r\n top: -18px; opacity: 0.8;\r\n}\r\n.parachute-line-left { left: calc(50% - 5px); transform-origin: bottom; transform: rotate(-10deg); }\r\n.parachute-line-right { left: calc(50% + 4px); transform-origin: bottom; transform: rotate(10deg); }\r\n.parachute.active {\r\n opacity: 1;\r\n animation: parachuteDrop 3s ease-out forwards;\r\n}\r\n@keyframes parachuteDrop {\r\n 0% { top: var(--drop-start-top); left: var(--drop-start-left); opacity: 1; }\r\n 100% { top: 89%; left: 54%; opacity: 0.9; }\r\n}\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n<div class=\"spice-journey-container\" id=\"spiceContainer\">\r\n\r\n <div id=\"title\">\ud83c\udf36 African Spice Journey<\/div>\r\n <div id=\"progress\">Preparing for departure...<\/div>\r\n <div id=\"restart-hint\">Click to restart<\/div>\r\n\r\n <img decoding=\"async\"\r\n id=\"map\"\r\n src=\"https:\/\/upload.wikimedia.org\/wikipedia\/commons\/thumb\/8\/86\/Africa_%28orthographic_projection%29.svg\/2048px-Africa_%28orthographic_projection%29.svg.png\"\r\n alt=\"Africa orthographic projection\"\r\n crossorigin=\"anonymous\"\r\n >\r\n\r\n <div id=\"plane\">\r\n <svg class=\"plane-icon\" viewBox=\"0 0 24 24\" fill=\"white\">\r\n <path d=\"M21 16v-2l-8-5V3.5c0-.83-.67-1.5-1.5-1.5S10 2.67 10 3.5V9l-8 5v2l8-2.5V19l-2 1.5V22l3.5-1 3.5 1v-1.5L13 19v-5.5l8 2.5z\"\/>\r\n <\/svg>\r\n <\/div>\r\n\r\n <div class=\"parachute-container\" id=\"parachuteContainer\"><\/div>\r\n\r\n <svg id=\"path\" viewBox=\"0 0 100 100\" preserveAspectRatio=\"none\"><\/svg>\r\n\r\n \r\n <div class=\"marker\" style=\"left:27%;top:32%;\">MA<\/div>\r\n <div class=\"spice-bag\" style=\"left:27%;top:32%;\"><\/div>\r\n\r\n <div class=\"marker\" style=\"left:37%;top:29%;\">TN<\/div>\r\n <div class=\"spice-bag\" style=\"left:37%;top:29%;\"><\/div>\r\n\r\n <div class=\"marker\" style=\"left:53%;top:27%;\">EG<\/div>\r\n <div class=\"spice-bag\" style=\"left:53%;top:27%;\"><\/div>\r\n\r\n <div class=\"marker\" style=\"left:40%;top:46%;\">NG<\/div>\r\n <div class=\"spice-bag\" style=\"left:40%;top:46%;\"><\/div>\r\n\r\n <div class=\"marker\" style=\"left:57%;top:43%;\">ET<\/div>\r\n <div class=\"spice-bag\" style=\"left:57%;top:43%;\"><\/div>\r\n\r\n <div class=\"marker\" style=\"left:58%;top:50%;\">KE<\/div>\r\n <div class=\"spice-bag\" style=\"left:58%;top:50%;\"><\/div>\r\n\r\n \r\n <div class=\"marker\" style=\"left:54%;top:89%;\">ZA<\/div>\r\n <div id=\"dropzone\"><\/div>\r\n\r\n <div id=\"spice-collection\">\r\n <div class=\"collected-spice\" id=\"spice1\"><\/div>\r\n <div class=\"collected-spice\" id=\"spice2\"><\/div>\r\n <div class=\"collected-spice\" id=\"spice3\"><\/div>\r\n <div class=\"collected-spice\" id=\"spice4\"><\/div>\r\n <div class=\"collected-spice\" id=\"spice5\"><\/div>\r\n <div class=\"collected-spice\" id=\"spice6\"><\/div>\r\n <\/div>\r\n\r\n<\/div>\r\n\r\n<script>\r\nconst route = [\r\n {x:27, y:32, country:\"Morocco\", spice:\"Ras el Hanout\", action:\"pickup\"},\r\n {x:37, y:29, country:\"Tunisia\", spice:\"Harissa\", action:\"pickup\"},\r\n {x:53, y:27, country:\"Egypt\", spice:\"Dukkah\", action:\"pickup\"},\r\n {x:40, y:46, country:\"Nigeria\", spice:\"Suya Spice\", action:\"pickup\"},\r\n {x:57, y:43, country:\"Ethiopia\", spice:\"Berbere\", action:\"pickup\"},\r\n {x:58, y:50, country:\"Kenya\", spice:\"Pilau Masala\", action:\"pickup\"},\r\n {x:54, y:89, country:\"South Africa\", spice:\"All Spices\", action:\"dropoff\"}\r\n];\r\n\r\nlet currentStop = 0;\r\nlet collectedSpices = 0;\r\n\r\nconst plane = document.getElementById('plane');\r\nconst pathSvg = document.getElementById('path');\r\nconst markers = document.querySelectorAll('.marker');\r\nconst spiceBags = document.querySelectorAll('.spice-bag');\r\nconst dropzone = document.getElementById('dropzone');\r\nconst spiceCollection = document.getElementById('spice-collection');\r\nconst progress = document.getElementById('progress');\r\nconst parachuteContainer = document.getElementById('parachuteContainer');\r\n\r\nfunction calcAngle(x1,y1,x2,y2) {\r\n return Math.atan2(y2-y1, x2-x1) * 180 \/ Math.PI;\r\n}\r\n\r\nfunction drawPath() {\r\n let d = \"\";\r\n for (let i = 0; i <= currentStop && i < route.length; i++) {\r\n d += (i===0 ? \"M\" : \"L\") + route[i].x + \" \" + route[i].y + \" \";\r\n }\r\n pathSvg.innerHTML = `\r\n <path d=\"${d}\"\r\n stroke=\"#4dabf7\"\r\n stroke-width=\"0.6\"\r\n fill=\"none\"\r\n opacity=\"0.85\"\r\n stroke-dasharray=\"2.5 1.5\">\r\n <animate attributeName=\"stroke-dashoffset\"\r\n from=\"60\" to=\"0\" dur=\"1.2s\" repeatCount=\"indefinite\"\/>\r\n <\/path>`;\r\n}\r\n\r\nfunction createParachute() {\r\n const pr = plane.getBoundingClientRect();\r\n const cr = parachuteContainer.getBoundingClientRect();\r\n const sl = ((pr.left + pr.width\/2) - cr.left) \/ cr.width * 100;\r\n const st = ((pr.top + pr.height\/2) - cr.top) \/ cr.height * 100;\r\n\r\n const p = document.createElement('div');\r\n p.className = 'parachute';\r\n p.style.setProperty('--drop-start-left', sl+'%');\r\n p.style.setProperty('--drop-start-top', st+'%');\r\n p.innerHTML = `\r\n <div class=\"parachute-canopy\"><\/div>\r\n <div class=\"parachute-line-left\"><\/div>\r\n <div class=\"parachute-line-right\"><\/div>`;\r\n parachuteContainer.appendChild(p);\r\n setTimeout(() => p.classList.add('active'), 80);\r\n setTimeout(() => { p.remove(); revealSpice(); }, 3200);\r\n}\r\n\r\nfunction revealSpice() {\r\n const el = document.getElementById('spice' + collectedSpices);\r\n if (el) el.classList.add('show');\r\n}\r\n\r\nfunction addSpiceToPlane() {\r\n plane.innerHTML = `\r\n <svg class=\"plane-icon\" viewBox=\"0 0 24 24\" fill=\"white\">\r\n <path d=\"M21 16v-2l-8-5V3.5c0-.83-.67-1.5-1.5-1.5S10 2.67 10 3.5V9l-8 5v2l8-2.5V19l-2 1.5V22l3.5-1 3.5 1v-1.5L13 19v-5.5l8 2.5z\"\/>\r\n <\/svg>\r\n <div style=\"position:absolute;top:-9px;left:50%;transform:translateX(-50%);\r\n width:16px;height:16px;background:#ff5722;border-radius:3px;\r\n border:1px solid white;\"><\/div>`;\r\n}\r\n\r\nfunction resetPlaneIcon() {\r\n plane.innerHTML = `\r\n <svg class=\"plane-icon\" viewBox=\"0 0 24 24\" fill=\"white\">\r\n <path d=\"M21 16v-2l-8-5V3.5c0-.83-.67-1.5-1.5-1.5S10 2.67 10 3.5V9l-8 5v2l8-2.5V19l-2 1.5V22l3.5-1 3.5 1v-1.5L13 19v-5.5l8 2.5z\"\/>\r\n <\/svg>`;\r\n}\r\n\r\nfunction dropAllSpices() {\r\n dropzone.classList.add('active');\r\n spiceCollection.style.opacity = '1';\r\n let delay = 0;\r\n for (let i = 0; i < collectedSpices; i++) {\r\n setTimeout(createParachute, delay);\r\n delay += 550;\r\n }\r\n setTimeout(() => {\r\n resetPlaneIcon();\r\n const a = plane.style.transform.match(\/rotate\$([^)]+)\$\/);\r\n plane.style.setProperty('--plane-angle', a ? a[1] : '90deg');\r\n plane.style.animation = 'bounce 0.8s 4';\r\n progress.textContent = '\ud83c\udf89 All spices delivered to South Africa!';\r\n progress.style.color = '#4caf50';\r\n progress.style.borderColor = '#4caf50';\r\n }, delay + 800);\r\n}\r\n\r\nfunction flyToNext() {\r\n if (currentStop >= route.length) return;\r\n const dest = route[currentStop];\r\n const prev = currentStop > 0 ? route[currentStop-1] : {x:20,y:30};\r\n const angle = calcAngle(prev.x, prev.y, dest.x, dest.y);\r\n\r\n plane.style.transform = `translate(-50%,-50%) rotate(${angle+90}deg)`;\r\n plane.style.left = dest.x + '%';\r\n plane.style.top = dest.y + '%';\r\n plane.style.setProperty('--plane-angle', (angle+90)+'deg');\r\n\r\n progress.textContent = dest.action === 'pickup'\r\n ? `\u2708 Flying to ${dest.country}...`\r\n : `\ud83d\udce6 Delivering to ${dest.country}...`;\r\n\r\n drawPath();\r\n\r\n setTimeout(() => {\r\n if (dest.action === 'pickup') {\r\n markers[currentStop].classList.add('picked');\r\n spiceBags[currentStop].classList.add('collected');\r\n collectedSpices++;\r\n addSpiceToPlane();\r\n progress.textContent = `\u2705 Collected ${dest.spice} from ${dest.country}`;\r\n } else {\r\n markers[currentStop].classList.add('picked');\r\n dropAllSpices();\r\n }\r\n }, 1800);\r\n\r\n currentStop++;\r\n if (currentStop < route.length) setTimeout(flyToNext, 3000);\r\n}\r\n\r\nfunction startJourney() {\r\n setTimeout(() => {\r\n plane.style.opacity = '1';\r\n progress.textContent = '\u2708 Departing from Morocco...';\r\n setTimeout(flyToNext, 600);\r\n }, 400);\r\n}\r\n\r\nfunction resetAll() {\r\n currentStop = 0;\r\n collectedSpices = 0;\r\n parachuteContainer.innerHTML = '';\r\n pathSvg.innerHTML = '';\r\n markers.forEach(m => m.classList.remove('picked'));\r\n spiceBags.forEach(b => b.classList.remove('collected'));\r\n document.querySelectorAll('.collected-spice').forEach(s => s.classList.remove('show'));\r\n dropzone.classList.remove('active');\r\n spiceCollection.style.opacity = '0';\r\n plane.style.left = '27%';\r\n plane.style.top = '32%';\r\n plane.style.transform = 'translate(-50%,-50%) rotate(90deg)';\r\n plane.style.animation = '';\r\n plane.style.opacity = '0';\r\n progress.textContent = '\u2708 Departing from Morocco...';\r\n progress.style.color = '#4dabf7';\r\n progress.style.borderColor = '#4dabf7';\r\n resetPlaneIcon();\r\n startJourney();\r\n}\r\n\r\ndocument.getElementById('spiceContainer').addEventListener('click', resetAll);\r\nwindow.addEventListener('load', startJourney);\r\n<\/script>\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-92a9c10 e-flex e-con-boxed e-con e-parent\" data-id=\"92a9c10\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-39c54a75 e-con-full e-flex e-con e-parent\" data-id=\"39c54a75\" data-element_type=\"container\" data-settings=\"{"background_background":"classic"}\">\n\t\t<div class=\"elementor-element elementor-element-3c58b10c e-con-full e-flex e-con e-child\" data-id=\"3c58b10c\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8657e03 elementor-cta--skin-classic elementor-animated-content elementor-bg-transform elementor-bg-transform-zoom-in elementor-widget elementor-widget-call-to-action\" data-id=\"8657e03\" data-element_type=\"widget\" data-widget_type=\"call-to-action.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-cta\">\n\t\t\t\t\t<div class=\"elementor-cta__bg-wrapper\">\n\t\t\t\t<div class=\"elementor-cta__bg elementor-bg\" style=\"background-image: url(https:\/\/mumbaispices.co.za\/wp-content\/uploads\/2025\/11\/Image_fx-65-1024x559.jpg);\" role=\"img\" aria-label=\"Image_fx (65)\"><\/div>\n\t\t\t\t<div class=\"elementor-cta__bg-overlay\"><\/div>\n\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-cta__content\">\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<h2 class=\"elementor-cta__title elementor-cta__content-item elementor-content-item\">\n\t\t\t\t\t\tCompany Establishment\t\t\t\t\t<\/h2>\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-cta__description elementor-cta__content-item elementor-content-item\">\n\t\t\t\t\t\tMumbai Spices was\nestablished in 2020\t\t\t\t\t<\/div>\n\t\t\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-966a79f elementor-cta--skin-classic elementor-animated-content elementor-bg-transform elementor-bg-transform-zoom-in elementor-widget elementor-widget-call-to-action\" data-id=\"966a79f\" data-element_type=\"widget\" data-widget_type=\"call-to-action.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-cta\">\n\t\t\t\t\t<div class=\"elementor-cta__bg-wrapper\">\n\t\t\t\t<div class=\"elementor-cta__bg elementor-bg\" style=\"background-image: url(https:\/\/mumbaispices.co.za\/wp-content\/uploads\/2025\/11\/Image_fx-73-1024x559.jpg);\" role=\"img\" aria-label=\"Image_fx (73)\"><\/div>\n\t\t\t\t<div class=\"elementor-cta__bg-overlay\"><\/div>\n\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-cta__content\">\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<h2 class=\"elementor-cta__title elementor-cta__content-item elementor-content-item\">\n\t\t\t\t\t\tClient Base\t\t\t\t\t<\/h2>\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-cta__description elementor-cta__content-item elementor-content-item\">\n\t\t\t\t\t\tRead More\nMumbai Spices serves\nwholesale and retail\nclientel throughout South\nAfrica \t\t\t\t\t<\/div>\n\t\t\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-041b13e elementor-bg-transform elementor-bg-transform-zoom-out elementor-cta--skin-classic elementor-animated-content elementor-widget elementor-widget-call-to-action\" data-id=\"041b13e\" data-element_type=\"widget\" data-widget_type=\"call-to-action.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-cta\">\n\t\t\t\t\t<div class=\"elementor-cta__bg-wrapper\">\n\t\t\t\t<div class=\"elementor-cta__bg elementor-bg\" style=\"background-image: url(https:\/\/mumbaispices.co.za\/wp-content\/uploads\/2025\/11\/Image_fx-75-1024x559.jpg);\" role=\"img\" aria-label=\"Image_fx (75)\"><\/div>\n\t\t\t\t<div class=\"elementor-cta__bg-overlay\"><\/div>\n\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-cta__content\">\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<h2 class=\"elementor-cta__title elementor-cta__content-item elementor-content-item\">\n\t\t\t\t\t\tKey Services \t\t\t\t\t<\/h2>\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-cta__description elementor-cta__content-item elementor-content-item\">\n\t\t\t\t\t\tThe company provides\nmanufacturing, milling,\nblending, exporting, and\npackaging services.\t\t\t\t\t<\/div>\n\t\t\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3b9b4e4 elementor-cta--skin-classic elementor-animated-content elementor-bg-transform elementor-bg-transform-zoom-in elementor-widget elementor-widget-call-to-action\" data-id=\"3b9b4e4\" data-element_type=\"widget\" data-widget_type=\"call-to-action.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-cta\">\n\t\t\t\t\t<div class=\"elementor-cta__bg-wrapper\">\n\t\t\t\t<div class=\"elementor-cta__bg elementor-bg\" style=\"background-image: url(https:\/\/mumbaispices.co.za\/wp-content\/uploads\/2025\/12\/EBP_0154-684x1024.jpg);\" role=\"img\" aria-label=\"Mumbai Spices\"><\/div>\n\t\t\t\t<div class=\"elementor-cta__bg-overlay\"><\/div>\n\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-cta__content\">\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<h2 class=\"elementor-cta__title elementor-cta__content-item elementor-content-item\">\n\t\t\t\t\t\tQuality Commitment \t\t\t\t\t<\/h2>\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-cta__description elementor-cta__content-item elementor-content-item\">\n\t\t\t\t\t\tMumbai Spices ensures\nhigh-quality standards\nthrough technology and\ncompliance. \t\t\t\t\t<\/div>\n\t\t\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-315b5ab e-flex e-con-boxed e-con e-parent\" data-id=\"315b5ab\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-4b65b87 e-con-full e-flex e-con e-child\" data-id=\"4b65b87\" data-element_type=\"container\">\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-af2b1da e-con-full e-flex e-con e-child\" data-id=\"af2b1da\" data-element_type=\"container\">\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-dd25ca7 e-con-full e-flex e-con e-child\" data-id=\"dd25ca7\" data-element_type=\"container\">\n\t\t\t\t<\/div>\n\t\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>African Spice Journey 🌶 African Spice Journey Preparing for departure… Click to restart MA TN EG NG ET KE ZA Company Establishment Mumbai Spices was established in 2020 Client Base Read More Mumbai Spices serves wholesale and retail clientel throughout South Africa Key Services The company provides manufacturing, milling, blending, exporting, and packaging services. Quality<\/p>\n<div class=\"more-link\">\n <a href=\"https:\/\/mumbaispices.co.za\/?page_id=96\" class=\"theme-btn\"><span>Continue Reading <\/span><i class=\"bi bi-arrow-right\"><\/i><\/a>\n <\/div>\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-96","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/mumbaispices.co.za\/index.php?rest_route=\/wp\/v2\/pages\/96","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mumbaispices.co.za\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/mumbaispices.co.za\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/mumbaispices.co.za\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mumbaispices.co.za\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=96"}],"version-history":[{"count":64,"href":"https:\/\/mumbaispices.co.za\/index.php?rest_route=\/wp\/v2\/pages\/96\/revisions"}],"predecessor-version":[{"id":422,"href":"https:\/\/mumbaispices.co.za\/index.php?rest_route=\/wp\/v2\/pages\/96\/revisions\/422"}],"wp:attachment":[{"href":"https:\/\/mumbaispices.co.za\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=96"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}