{"product_id":"dualora™-total-body-contouring-lymphatic-drainage","title":"Dualora™ Total-Body Contouring","description":"\u003cbody\u003e\n\n\n  \u003cmeta charset=\"UTF-8\"\u003e\n  \u003cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"\u003e\n  \u003ctitle\u003eDualora™ Total-Body Contouring\u003c\/title\u003e\n  \u003c!-- Tailwind CSS CDN --\u003e\n  \u003cscript src=\"https:\/\/cdn.tailwindcss.com\"\u003e\u003c\/script\u003e\n  \u003c!-- Google Fonts: Inter \u0026 Playfair Display for luxury aesthetic --\u003e\n  \u003clink rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\"\u003e\n  \u003clink rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin\u003e\n  \u003clink href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600;700\u0026amp;family=Playfair+Display:ital,wght@0,500;0,600;1,400\u0026amp;display=swap\" rel=\"stylesheet\"\u003e\n\n  \u003cscript\u003e\n    tailwind.config = {\n      theme: {\n        extend: {\n          fontFamily: {\n            sans: ['Inter', 'sans-serif'],\n            serif: ['Playfair Display', 'serif'],\n          },\n          colors: {\n            emerald: {\n              50: '#ecfdf5',\n              100: '#d1fae5',\n              200: '#a7f3d0',\n              300: '#6ee7b7',\n              400: '#34d399',\n              500: '#10b981',\n              600: '#059669',\n              700: '#047857',\n              800: '#065f46',\n              900: '#064e3b',\n            }\n          },\n          animation: {\n            'pulse-slow': 'pulse 2.5s cubic-bezier(0.4, 0, 0.6, 1) infinite',\n            'float': 'float 4s ease-in-out infinite',\n            'fade-in': 'fadeIn 0.4s ease-out forwards',\n          },\n          keyframes: {\n            float: {\n              '0%, 100%': { transform: 'translateY(0px)' },\n              '50%': { transform: 'translateY(-6px)' },\n            },\n            fadeIn: {\n              '0%': { opacity: '0', transform: 'translateY(8px)' },\n              '100%': { opacity: '1', transform: 'translateY(0)' },\n            }\n          }\n        }\n      }\n    }\n  \u003c\/script\u003e\n\n  \u003cstyle\u003e\n    \/* Custom Scoped CSS Styles *\/\n    .dualora-wrapper {\n      background-color: #ffffff;\n      color: #111111;\n    }\n\n    .dualora-wrapper .custom-shadow {\n      box-shadow: 0 10px 30px -10px rgba(5, 150, 105, 0.08), 0 4px 12px -2px rgba(0, 0, 0, 0.04);\n    }\n\n    .dualora-wrapper .hotspot-pulse::before {\n      content: '';\n      position: absolute;\n      width: 100%;\n      height: 100%;\n      border-radius: 50%;\n      background: rgba(5, 150, 105, 0.4);\n      animation: emerald-ripple 2s infinite ease-out;\n      z-index: 0;\n    }\n\n    @keyframes emerald-ripple {\n      0% {\n        transform: scale(1);\n        opacity: 0.8;\n      }\n      100% {\n        transform: scale(2.3);\n        opacity: 0;\n      }\n    }\n\n    .dualora-wrapper .active-hotspot {\n      background-color: #059669 !important;\n      color: #ffffff !important;\n      transform: translate(-50%, -50%) scale(1.15) !important;\n      box-shadow: 0 0 18px rgba(5, 150, 105, 0.6) !important;\n      border-color: #047857 !important;\n    }\n\n    .dualora-wrapper .active-zone-card {\n      border-color: #059669 !important;\n      background-color: #ecfdf5 !important;\n      transform: translateY(-2px);\n    }\n\n    \/* Fixed Aspect Ratio Silhouette Container for Mobile \u0026 Desktop Accuracy *\/\n    .silhouette-stage {\n      position: relative;\n      width: 100%;\n      max-width: 240px;\n      aspect-ratio: 1 \/ 1.35;\n      margin: 0 auto;\n    }\n  \u003c\/style\u003e\n\n\n\n  \u003c!-- DUALORA SHOPIFY CONTAINER --\u003e\n  \u003cdiv id=\"dualora-product-section\" class=\"dualora-wrapper max-w-5xl mx-auto px-4 py-6 md:py-12 space-y-12 md:space-y-16\"\u003e\n\n    \u003c!-- 1. HERO \/ INTRODUCTION SECTION --\u003e\n    \u003csection class=\"text-center max-w-3xl mx-auto space-y-3 md:space-y-4\"\u003e\n      \u003cdiv class=\"inline-flex items-center gap-2 px-3.5 py-1 rounded-full bg-emerald-50 border border-emerald-200 text-emerald-800 text-xs font-semibold tracking-wide uppercase\"\u003e\n        \u003cspan class=\"w-2 h-2 rounded-full bg-emerald-600 animate-pulse\"\u003e\u003c\/span\u003e\n        Self-Care Ritual\n      \u003c\/div\u003e\n      \n      \u003ch2 class=\"text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-serif font-semibold tracking-tight text-gray-900 leading-tight\"\u003e\n        Dualora™ Total-Body Contouring\n      \u003c\/h2\u003e\n\n      \u003cp class=\"text-sm sm:text-base md:text-lg text-gray-600 font-normal leading-relaxed pt-1\"\u003e\n        Meet your new self-care ritual. The \u003cspan class=\"font-semibold text-gray-900\"\u003eDualora™ Total-Body Contouring Roller\u003c\/span\u003e is designed to stimulate lymphatic drainage, reduce puffiness, and help you feel lighter, smoother, and more confident — all from the comfort of home.\n      \u003c\/p\u003e\n      \n      \u003cdiv class=\"pt-2 flex justify-center\"\u003e\n        \u003cdiv class=\"w-16 h-0.5 bg-gradient-to-r from-transparent via-emerald-500 to-transparent rounded-full\"\u003e\u003c\/div\u003e\n      \u003c\/div\u003e\n    \u003c\/section\u003e\n\n    \u003c!-- 2. WHAT YOU'LL FEEL SECTION --\u003e\n    \u003csection class=\"space-y-6 md:space-y-8\"\u003e\n      \u003cdiv class=\"text-center space-y-1.5\"\u003e\n        \u003cspan class=\"text-xs font-bold tracking-widest text-emerald-700 uppercase\"\u003eThe Dualora Experience\u003c\/span\u003e\n        \u003ch3 class=\"text-xl sm:text-2xl md:text-3xl font-serif font-medium text-gray-900\"\u003eWhat You'll Feel 💚\u003c\/h3\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 sm:gap-5\"\u003e\n        \n        \u003c!-- Card 1 --\u003e\n        \u003cdiv class=\"group p-5 sm:p-6 rounded-2xl bg-white border border-gray-100 custom-shadow hover:border-emerald-400 transition-all duration-300 hover:-translate-y-1\"\u003e\n          \u003cdiv class=\"w-11 h-11 rounded-xl bg-emerald-50 flex items-center justify-center text-emerald-600 mb-3.5 group-hover:bg-emerald-600 group-hover:text-white transition-colors duration-300\"\u003e\n            \u003c!-- Icon: Water Droplet --\u003e\n            \u003csvg class=\"w-5 h-5 sm:w-6 sm:h-6\" fill=\"none\" stroke=\"currentColor\" viewbox=\"0 0 24 24\"\u003e\n              \u003cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.8\" d=\"M12 2.69l5.66 5.66a8 8 0 11-11.31 0z\"\u003e\u003c\/path\u003e\n            \u003c\/svg\u003e\n          \u003c\/div\u003e\n          \u003ch4 class=\"font-semibold text-gray-900 mb-1 text-base\"\u003eDe-Bloat \u0026amp; Refine\u003c\/h4\u003e\n          \u003cp class=\"text-xs sm:text-sm text-gray-600 leading-relaxed\"\u003eReduced bloating \u0026amp; fluid retention for a lighter feel.\u003c\/p\u003e\n        \u003c\/div\u003e\n\n        \u003c!-- Card 2 --\u003e\n        \u003cdiv class=\"group p-5 sm:p-6 rounded-2xl bg-white border border-gray-100 custom-shadow hover:border-emerald-400 transition-all duration-300 hover:-translate-y-1\"\u003e\n          \u003cdiv class=\"w-11 h-11 rounded-xl bg-emerald-50 flex items-center justify-center text-emerald-600 mb-3.5 group-hover:bg-emerald-600 group-hover:text-white transition-colors duration-300\"\u003e\n            \u003c!-- Icon: Sparkles --\u003e\n            \u003csvg class=\"w-5 h-5 sm:w-6 sm:h-6\" fill=\"none\" stroke=\"currentColor\" viewbox=\"0 0 24 24\"\u003e\n              \u003cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.8\" d=\"M5 3v4M3 5h4M6 17v4m-2-2h4m5-16l2.286 6.857L21 12l-5.714 2.143L13 21l-2.286-6.857L5 12l5.714-2.143L13 3z\"\u003e\u003c\/path\u003e\n            \u003c\/svg\u003e\n          \u003c\/div\u003e\n          \u003ch4 class=\"font-semibold text-gray-900 mb-1 text-base\"\u003eSmooth \u0026amp; Firm\u003c\/h4\u003e\n          \u003cp class=\"text-xs sm:text-sm text-gray-600 leading-relaxed\"\u003eSmoother, firmer-looking skin texture and tone.\u003c\/p\u003e\n        \u003c\/div\u003e\n\n        \u003c!-- Card 3 --\u003e\n        \u003cdiv class=\"group p-5 sm:p-6 rounded-2xl bg-white border border-gray-100 custom-shadow hover:border-emerald-400 transition-all duration-300 hover:-translate-y-1\"\u003e\n          \u003cdiv class=\"w-11 h-11 rounded-xl bg-emerald-50 flex items-center justify-center text-emerald-600 mb-3.5 group-hover:bg-emerald-600 group-hover:text-white transition-colors duration-300\"\u003e\n            \u003c!-- Icon: Circulation --\u003e\n            \u003csvg class=\"w-5 h-5 sm:w-6 sm:h-6\" fill=\"none\" stroke=\"currentColor\" viewbox=\"0 0 24 24\"\u003e\n              \u003cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.8\" d=\"M13 10V3L4 14h7v7l9-11h-7z\"\u003e\u003c\/path\u003e\n            \u003c\/svg\u003e\n          \u003c\/div\u003e\n          \u003ch4 class=\"font-semibold text-gray-900 mb-1 text-base\"\u003eRevitalize Flow\u003c\/h4\u003e\n          \u003cp class=\"text-xs sm:text-sm text-gray-600 leading-relaxed\"\u003eImproved circulation \u0026amp; soothing muscle tension relief.\u003c\/p\u003e\n        \u003c\/div\u003e\n\n        \u003c!-- Card 4 --\u003e\n        \u003cdiv class=\"group p-5 sm:p-6 rounded-2xl bg-white border border-gray-100 custom-shadow hover:border-emerald-400 transition-all duration-300 hover:-translate-y-1\"\u003e\n          \u003cdiv class=\"w-11 h-11 rounded-xl bg-emerald-50 flex items-center justify-center text-emerald-600 mb-3.5 group-hover:bg-emerald-600 group-hover:text-white transition-colors duration-300\"\u003e\n            \u003c!-- Icon: Massage --\u003e\n            \u003csvg class=\"w-5 h-5 sm:w-6 sm:h-6\" fill=\"none\" stroke=\"currentColor\" viewbox=\"0 0 24 24\"\u003e\n              \u003cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.8\" d=\"M14.828 14.828a4 4 0 01-5.656 0M9 10h.01M15 10h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z\"\u003e\u003c\/path\u003e\n            \u003c\/svg\u003e\n          \u003c\/div\u003e\n          \u003ch4 class=\"font-semibold text-gray-900 mb-1 text-base\"\u003eDeep Release 🙌\u003c\/h4\u003e\n          \u003cp class=\"text-xs sm:text-sm text-gray-600 leading-relaxed\"\u003eThat deep, satisfying post-massage sense of tension release.\u003c\/p\u003e\n        \u003c\/div\u003e\n\n      \u003c\/div\u003e\n    \u003c\/section\u003e\n\n    \u003c!-- 3. INTERACTIVE BODY MAPPING SECTION (WORKS ON) --\u003e\n    \u003csection class=\"bg-gradient-to-b from-gray-50\/80 to-white rounded-3xl p-5 sm:p-8 md:p-10 border border-gray-100 custom-shadow space-y-6 md:space-y-8\"\u003e\n      \n      \u003cdiv class=\"text-center space-y-1.5\"\u003e\n        \u003cspan class=\"text-xs font-bold tracking-widest text-emerald-700 uppercase\"\u003eTargeted Drainage\u003c\/span\u003e\n        \u003ch3 class=\"text-xl sm:text-2xl md:text-3xl font-serif font-medium text-gray-900\"\u003e🎯 Works On\u003c\/h3\u003e\n        \u003cp class=\"text-xs sm:text-sm text-gray-600 max-w-md mx-auto\"\u003eHover over or tap a numbered zone on the body silhouette or select from the list below.\u003c\/p\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"grid grid-cols-1 md:grid-cols-12 gap-6 md:gap-8 items-center\"\u003e\n        \n        \u003c!-- Silhouette \u0026 Interactive Hotspots Container --\u003e\n        \u003cdiv class=\"md:col-span-6 flex justify-center items-center py-2\"\u003e\n          \u003cdiv class=\"silhouette-stage bg-white rounded-2xl p-4 border border-gray-200\/80 shadow-inner flex items-center justify-center select-none\"\u003e\n            \n            \u003c!-- Person Silhouette SVG --\u003e\n            \u003csvg class=\"w-full h-full text-black transition-all duration-300 filter drop-shadow-sm\" viewbox=\"0 0 350 350\" fill=\"currentColor\"\u003e\n              \u003cpath d=\"M 175,28 C 190.46,28 203,40.54 203,56 C 203,71.46 190.46,84 175,84 C 159.54,84 147,71.46 147,56 C 147,40.54 159.54,28 175,28 Z M 132,100 C 112,100 95,117 95,137 L 95,185 C 95,195 103,203 113,203 C 123,203 131,195 131,185 L 131,155 L 139,155 L 139,275 C 139,288 149,298 162,298 C 175,298 185,288 185,275 L 185,210 L 189,210 L 189,275 C 189,288 199,298 212,298 C 225,298 235,288 235,275 L 235,155 L 243,155 L 243,185 C 243,195 251,203 261,203 C 271,203 279,195 279,185 L 279,137 C 279,117 262,100 242,100 Z\"\u003e\u003c\/path\u003e\n            \u003c\/svg\u003e\n\n            \u003c!-- HOTSPOT 1: Neck --\u003e\n            \u003cbutton data-zone=\"1\" id=\"hotspot-1\" class=\"hotspot-btn hotspot-pulse absolute top-[25%] left-[50%] -translate-x-1\/2 -translate-y-1\/2 w-8 h-8 sm:w-9 sm:h-9 rounded-full bg-white text-emerald-800 font-bold text-xs sm:text-sm flex items-center justify-center border-2 border-emerald-600 shadow-md transition-all duration-300 z-10 hover:scale-110 focus:outline-none cursor-pointer\" aria-label=\"Target Zone 1: Neck \u0026amp; Cervical Spine\"\u003e\n              \u003cspan class=\"relative z-10\"\u003e1\u003c\/span\u003e\n            \u003c\/button\u003e\n\n            \u003c!-- HOTSPOT 2: Waist \u0026 Stomach --\u003e\n            \u003cbutton data-zone=\"2\" id=\"hotspot-2\" class=\"hotspot-btn hotspot-pulse absolute top-[43%] left-[50%] -translate-x-1\/2 -translate-y-1\/2 w-8 h-8 sm:w-9 sm:h-9 rounded-full bg-white text-emerald-800 font-bold text-xs sm:text-sm flex items-center justify-center border-2 border-emerald-600 shadow-md transition-all duration-300 z-10 hover:scale-110 focus:outline-none cursor-pointer\" aria-label=\"Target Zone 2: Waist \u0026amp; Stomach\"\u003e\n              \u003cspan class=\"relative z-10\"\u003e2\u003c\/span\u003e\n            \u003c\/button\u003e\n\n            \u003c!-- HOTSPOT 3: Thighs \u0026 Legs --\u003e\n            \u003cbutton data-zone=\"3\" id=\"hotspot-3\" class=\"hotspot-btn hotspot-pulse absolute top-[70%] left-[50%] -translate-x-1\/2 -translate-y-1\/2 w-8 h-8 sm:w-9 sm:h-9 rounded-full bg-white text-emerald-800 font-bold text-xs sm:text-sm flex items-center justify-center border-2 border-emerald-600 shadow-md transition-all duration-300 z-10 hover:scale-110 focus:outline-none cursor-pointer\" aria-label=\"Target Zone 3: Thighs \u0026amp; Legs\"\u003e\n              \u003cspan class=\"relative z-10\"\u003e3\u003c\/span\u003e\n            \u003c\/button\u003e\n\n            \u003c!-- HOTSPOT 4: Upper Arms --\u003e\n            \u003cbutton data-zone=\"4\" id=\"hotspot-4\" class=\"hotspot-btn hotspot-pulse absolute top-[42%] left-[28%] -translate-x-1\/2 -translate-y-1\/2 w-8 h-8 sm:w-9 sm:h-9 rounded-full bg-white text-emerald-800 font-bold text-xs sm:text-sm flex items-center justify-center border-2 border-emerald-600 shadow-md transition-all duration-300 z-10 hover:scale-110 focus:outline-none cursor-pointer\" aria-label=\"Target Zone 4: Upper Arms\"\u003e\n              \u003cspan class=\"relative z-10\"\u003e4\u003c\/span\u003e\n            \u003c\/button\u003e\n\n          \u003c\/div\u003e\n        \u003c\/div\u003e\n\n        \u003c!-- Zone List \u0026 Dynamic Info Panel --\u003e\n        \u003cdiv class=\"md:col-span-6 space-y-3.5 sm:space-y-4\"\u003e\n          \u003cdiv class=\"space-y-2.5 sm:space-y-3\"\u003e\n            \n            \u003c!-- Zone Item 1 --\u003e\n            \u003cdiv data-zone=\"1\" id=\"zone-card-1\" class=\"zone-card cursor-pointer p-3 sm:p-3.5 rounded-xl border border-gray-200 bg-white hover:border-emerald-400 transition-all duration-200 flex items-center gap-3\"\u003e\n              \u003cspan class=\"w-7 h-7 sm:w-8 sm:h-8 rounded-lg bg-emerald-100 text-emerald-800 font-bold text-xs sm:text-sm flex items-center justify-center shrink-0\"\u003e1\u003c\/span\u003e\n              \u003cdiv\u003e\n                \u003ch5 class=\"text-xs sm:text-sm font-semibold text-gray-900\"\u003eNeck \u0026amp; Cervical Spine\u003c\/h5\u003e\n                \u003cp class=\"text-[11px] sm:text-xs text-gray-500 leading-snug\"\u003eRelieves upper neck stiffness and prompts submandibular fluid release.\u003c\/p\u003e\n              \u003c\/div\u003e\n            \u003c\/div\u003e\n\n            \u003c!-- Zone Item 2 --\u003e\n            \u003cdiv data-zone=\"2\" id=\"zone-card-2\" class=\"zone-card cursor-pointer p-3 sm:p-3.5 rounded-xl border border-gray-200 bg-white hover:border-emerald-400 transition-all duration-200 flex items-center gap-3\"\u003e\n              \u003cspan class=\"w-7 h-7 sm:w-8 sm:h-8 rounded-lg bg-emerald-100 text-emerald-800 font-bold text-xs sm:text-sm flex items-center justify-center shrink-0\"\u003e2\u003c\/span\u003e\n              \u003cdiv\u003e\n                \u003ch5 class=\"text-xs sm:text-sm font-semibold text-gray-900\"\u003eWaist \u0026amp; Stomach\u003c\/h5\u003e\n                \u003cp class=\"text-[11px] sm:text-xs text-gray-500 leading-snug\"\u003eTargets midsection water retention and encourages smooth digestion.\u003c\/p\u003e\n              \u003c\/div\u003e\n            \u003c\/div\u003e\n\n            \u003c!-- Zone Item 3 --\u003e\n            \u003cdiv data-zone=\"3\" id=\"zone-card-3\" class=\"zone-card cursor-pointer p-3 sm:p-3.5 rounded-xl border border-gray-200 bg-white hover:border-emerald-400 transition-all duration-200 flex items-center gap-3\"\u003e\n              \u003cspan class=\"w-7 h-7 sm:w-8 sm:h-8 rounded-lg bg-emerald-100 text-emerald-800 font-bold text-xs sm:text-sm flex items-center justify-center shrink-0\"\u003e3\u003c\/span\u003e\n              \u003cdiv\u003e\n                \u003ch5 class=\"text-xs sm:text-sm font-semibold text-gray-900\"\u003eThighs \u0026amp; Legs\u003c\/h5\u003e\n                \u003cp class=\"text-[11px] sm:text-xs text-gray-500 leading-snug\"\u003eReduces heavy leg feeling, smooths skin appearance, and boosts circulation.\u003c\/p\u003e\n              \u003c\/div\u003e\n            \u003c\/div\u003e\n\n            \u003c!-- Zone Item 4 --\u003e\n            \u003cdiv data-zone=\"4\" id=\"zone-card-4\" class=\"zone-card cursor-pointer p-3 sm:p-3.5 rounded-xl border border-gray-200 bg-white hover:border-emerald-400 transition-all duration-200 flex items-center gap-3\"\u003e\n              \u003cspan class=\"w-7 h-7 sm:w-8 sm:h-8 rounded-lg bg-emerald-100 text-emerald-800 font-bold text-xs sm:text-sm flex items-center justify-center shrink-0\"\u003e4\u003c\/span\u003e\n              \u003cdiv\u003e\n                \u003ch5 class=\"text-xs sm:text-sm font-semibold text-gray-900\"\u003eUpper Arms\u003c\/h5\u003e\n                \u003cp class=\"text-[11px] sm:text-xs text-gray-500 leading-snug\"\u003eFirms underarm tissue and stimulates axillary lymph node flush.\u003c\/p\u003e\n              \u003c\/div\u003e\n            \u003c\/div\u003e\n\n          \u003c\/div\u003e\n\n          \u003c!-- Dynamic Active Output Display Box --\u003e\n          \u003cdiv class=\"p-3.5 sm:p-4 rounded-xl bg-emerald-700 text-white shadow-md transition-all duration-300\"\u003e\n            \u003cdiv class=\"flex items-center gap-2 mb-1\"\u003e\n              \u003cspan class=\"text-[10px] sm:text-xs font-semibold uppercase tracking-wider text-emerald-200\"\u003eSelected Target Zone\u003c\/span\u003e\n              \u003cspan class=\"w-1.5 h-1.5 rounded-full bg-white animate-pulse\"\u003e\u003c\/span\u003e\n            \u003c\/div\u003e\n            \u003ch4 id=\"target-title\" class=\"text-sm sm:text-base font-bold\"\u003eTarget Zone 1: Neck \u0026amp; Cervical Spine\u003c\/h4\u003e\n            \u003cp id=\"target-desc\" class=\"text-xs text-emerald-100 mt-1 leading-relaxed\"\u003e\n              Focus on gentle upward strokes to release muscle tension along the neck and promote submandibular lymphatic drainage.\n            \u003c\/p\u003e\n          \u003c\/div\u003e\n\n        \u003c\/div\u003e\n\n      \u003c\/div\u003e\n    \u003c\/section\u003e\n\n    \u003c!-- 4. PRODUCT DETAILS SECTION --\u003e\n    \u003csection class=\"space-y-6 md:space-y-8\"\u003e\n      \u003cdiv class=\"text-center space-y-1.5\"\u003e\n        \u003cspan class=\"text-xs font-bold tracking-widest text-emerald-700 uppercase\"\u003eThoughtful Engineering\u003c\/span\u003e\n        \u003ch3 class=\"text-xl sm:text-2xl md:text-3xl font-serif font-medium text-gray-900\"\u003e🛠️ Product Details\u003c\/h3\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"grid grid-cols-1 md:grid-cols-2 gap-3.5 sm:gap-4\"\u003e\n        \n        \u003c!-- Detail 1 --\u003e\n        \u003cdiv class=\"p-4 sm:p-5 rounded-2xl bg-white border border-gray-200\/80 custom-shadow flex items-start gap-3.5 hover:border-emerald-400 transition-all\"\u003e\n          \u003cdiv class=\"w-9 h-9 sm:w-10 sm:h-10 rounded-xl bg-emerald-50 flex items-center justify-center text-emerald-700 shrink-0 font-bold text-base sm:text-lg\"\u003e\n            💧\n          \u003c\/div\u003e\n          \u003cdiv class=\"space-y-0.5\"\u003e\n            \u003ch4 class=\"font-semibold text-gray-900 text-xs sm:text-sm md:text-base\"\u003e3D Floating Point Roller Heads\u003c\/h4\u003e\n            \u003cp class=\"text-xs text-gray-600 leading-relaxed\"\u003e\n              3D water droplet floating point roller heads — deep massage, no irritation.\n            \u003c\/p\u003e\n          \u003c\/div\u003e\n        \u003c\/div\u003e\n\n        \u003c!-- Detail 2 --\u003e\n        \u003cdiv class=\"p-4 sm:p-5 rounded-2xl bg-white border border-gray-200\/80 custom-shadow flex items-start gap-3.5 hover:border-emerald-400 transition-all\"\u003e\n          \u003cdiv class=\"w-9 h-9 sm:w-10 sm:h-10 rounded-xl bg-emerald-50 flex items-center justify-center text-emerald-700 shrink-0 font-bold text-base sm:text-lg\"\u003e\n            ✨\n          \u003c\/div\u003e\n          \u003cdiv class=\"space-y-0.5\"\u003e\n            \u003ch4 class=\"font-semibold text-gray-900 text-xs sm:text-sm md:text-base\"\u003eHypoallergenic Silicone Covers\u003c\/h4\u003e\n            \u003cp class=\"text-xs text-gray-600 leading-relaxed\"\u003e\n              Hypoallergenic silicone roller covers — gentle on all skin types.\n            \u003c\/p\u003e\n          \u003c\/div\u003e\n        \u003c\/div\u003e\n\n        \u003c!-- Detail 3 --\u003e\n        \u003cdiv class=\"p-4 sm:p-5 rounded-2xl bg-white border border-gray-200\/80 custom-shadow flex items-start gap-3.5 hover:border-emerald-400 transition-all\"\u003e\n          \u003cdiv class=\"w-9 h-9 sm:w-10 sm:h-10 rounded-xl bg-emerald-50 flex items-center justify-center text-emerald-700 shrink-0 font-bold text-base sm:text-lg\"\u003e\n            〰️\n          \u003c\/div\u003e\n          \u003cdiv class=\"space-y-0.5\"\u003e\n            \u003ch4 class=\"font-semibold text-gray-900 text-xs sm:text-sm md:text-base\"\u003eDurable, Flexible Frame\u003c\/h4\u003e\n            \u003cp class=\"text-xs text-gray-600 leading-relaxed\"\u003e\n              Durable, flexible frame — bends to fit every body curve effortlessly.\n            \u003c\/p\u003e\n          \u003c\/div\u003e\n        \u003c\/div\u003e\n\n        \u003c!-- Detail 4 --\u003e\n        \u003cdiv class=\"p-4 sm:p-5 rounded-2xl bg-white border border-gray-200\/80 custom-shadow flex items-start gap-4 hover:border-emerald-400 transition-all\"\u003e\n          \u003cdiv class=\"w-9 h-9 sm:w-10 sm:h-10 rounded-xl bg-emerald-50 flex items-center justify-center text-emerald-700 shrink-0 font-bold text-base sm:text-lg\"\u003e\n            🖐️\n          \u003c\/div\u003e\n          \u003cdiv class=\"space-y-0.5\"\u003e\n            \u003ch4 class=\"font-semibold text-gray-900 text-xs sm:text-sm md:text-base\"\u003eErgonomic Grip Design\u003c\/h4\u003e\n            \u003cp class=\"text-xs text-gray-600 leading-relaxed\"\u003e\n              Ergonomic grip design — easy to use on all body areas without fatigue.\n            \u003c\/p\u003e\n          \u003c\/div\u003e\n        \u003c\/div\u003e\n\n      \u003c\/div\u003e\n\n      \u003c!-- Battery-free banner --\u003e\n      \u003cdiv class=\"p-3.5 sm:p-4 rounded-2xl bg-emerald-50 border border-emerald-200 flex items-center justify-center gap-2.5 text-center\"\u003e\n        \u003cspan class=\"text-base sm:text-lg\"\u003e🔋\u003c\/span\u003e\n        \u003cp class=\"text-xs sm:text-sm font-medium text-emerald-950\"\u003e\n          \u003cspan class=\"font-bold\"\u003eNo Batteries Needed:\u003c\/span\u003e No batteries or charging needed — use it anywhere, anytime.\n        \u003c\/p\u003e\n      \u003c\/div\u003e\n    \u003c\/section\u003e\n\n  \u003c\/div\u003e\n\n  \u003c!-- RELIABLE SHOPIFY-SAFE JAVASCRIPT --\u003e\n  \u003cscript\u003e\n    (function initDualoraInteractive() {\n      const targetData = {\n        1: {\n          title: \"Target Zone 1: Neck \u0026 Cervical Spine\",\n          description: \"Focus on gentle upward strokes to release muscle tension along the neck and promote submandibular lymphatic drainage.\"\n        },\n        2: {\n          title: \"Target Zone 2: Waist \u0026 Stomach\",\n          description: \"Roll smoothly in light clockwise movements across the abdomen to diminish fluid buildup and promote abdominal contouring.\"\n        },\n        3: {\n          title: \"Target Zone 3: Thighs \u0026 Legs\",\n          description: \"Apply firm upward strokes from knees toward hips to reduce heavy leg feel and enhance circulation.\"\n        },\n        4: {\n          title: \"Target Zone 4: Upper Arms\",\n          description: \"Roll along the inner and outer arm towards the underarm area to firm loose tissue and stimulate axillary drainage.\"\n        }\n      };\n\n      let activeZone = 1;\n\n      function highlightZone(zoneId) {\n        const root = document.getElementById('dualora-product-section');\n        if (!root) return;\n\n        for (let i = 1; i \u003c= 4; i++) {\n          const hs = root.querySelector(`#hotspot-${i}`);\n          const card = root.querySelector(`#zone-card-${i}`);\n          if (hs) hs.classList.remove('active-hotspot');\n          if (card) card.classList.remove('active-zone-card');\n        }\n\n        const currentHs = root.querySelector(`#hotspot-${zoneId}`);\n        const currentCard = root.querySelector(`#zone-card-${zoneId}`);\n        if (currentHs) currentHs.classList.add('active-hotspot');\n        if (currentCard) currentCard.classList.add('active-zone-card');\n\n        const titleElem = root.querySelector('#target-title');\n        const descElem = root.querySelector('#target-desc');\n        if (titleElem \u0026\u0026 descElem \u0026\u0026 targetData[zoneId]) {\n          titleElem.innerText = targetData[zoneId].title;\n          descElem.innerText = targetData[zoneId].description;\n        }\n      }\n\n      function setupEventListeners() {\n        const root = document.getElementById('dualora-product-section');\n        if (!root) return;\n\n        const interactiveElements = root.querySelectorAll('[data-zone]');\n        interactiveElements.forEach(elem =\u003e {\n          const zoneId = parseInt(elem.getAttribute('data-zone'), 10);\n\n          elem.addEventListener('mouseenter', () =\u003e highlightZone(zoneId));\n          elem.addEventListener('mouseleave', () =\u003e highlightZone(activeZone));\n          \n          elem.addEventListener('click', (e) =\u003e {\n            activeZone = zoneId;\n            highlightZone(activeZone);\n          });\n\n          elem.addEventListener('touchstart', (e) =\u003e {\n            activeZone = zoneId;\n            highlightZone(activeZone);\n          }, { passive: true });\n        });\n\n        highlightZone(1);\n      }\n\n      if (document.readyState === 'loading') {\n        document.addEventListener('DOMContentLoaded', setupEventListeners);\n      } else {\n        setupEventListeners();\n      }\n    })();\n  \u003c\/script\u003e\n\n\u003c\/body\u003e","brand":"Dualora","offers":[{"title":"Default Title","offer_id":67957640495425,"sku":null,"price":499.0,"currency_code":"ZAR","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/1011\/4862\/3169\/files\/Gemini_Generated_Image_j467ydj467ydj467_01f29cc5-0899-462d-b239-36313613e6d2.jpg?v=1792520734","url":"https:\/\/www.dualora.co.za\/products\/dualora%e2%84%a2-total-body-contouring-lymphatic-drainage","provider":"Dualora","version":"1.0","type":"link"}