Adea Spa | Luxury Sanctuary, South of Johannesburg<\/title>\r\n \r\n \r\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\r\n <script>\r\n tailwind.config = {\r\n theme: {\r\n extend: {\r\n colors: {\r\n adeaTeal: '#164F4A',\r\n adeaGold: '#D4A72C',\r\n adeaAqua: '#82D3D0',\r\n adeaSage: '#B8BE91',\r\n adeaCream: '#E8E5D2',\r\n adeaDark: '#111111',\r\n whatsappGreen: '#25D366',\r\n whatsappDark: '#128C7E',\r\n },\r\n fontFamily: {\r\n serif: ['Playfair Display', 'Georgia', 'serif'],\r\n sans: ['Plus Jakarta Sans', 'Inter', 'sans-serif'],\r\n }\r\n }\r\n }\r\n }\r\n <\/script>\r\n\r\n \r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Plus+Jakarta+Sans:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\">\r\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n\r\n <style>\r\n body {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n background-color: #E8E5D2;\r\n color: #111111;\r\n }\r\n h1, h2, h3, h4, .font-serif {\r\n font-family: 'Playfair Display', Georgia, serif;\r\n }\r\n .hero-bg {\r\n background: linear-gradient(rgba(22, 79, 74, 0.70), rgba(22, 79, 74, 0.80)), url('https:\/\/images.unsplash.com\/photo-1540555700478-4be289fbecef?auto=format&fit=crop&q=80&w=1920') no-repeat center center\/cover;\r\n }\r\n .spa-btn {\r\n background-color: #164F4A;\r\n color: #ffffff;\r\n transition: all 0.3s ease;\r\n cursor: pointer;\r\n }\r\n .spa-btn:hover {\r\n background-color: #D4A72C;\r\n color: #164F4A;\r\n }\r\n .spa-form input[type=\"text\"],\r\n .spa-form input[type=\"email\"],\r\n .spa-form input[type=\"tel\"],\r\n .spa-form input[type=\"date\"],\r\n .spa-form select,\r\n .spa-form textarea {\r\n width: 100%;\r\n background-color: rgba(232, 229, 210, 0.45);\r\n border: 1px solid #B8BE91;\r\n border-radius: 0.75rem;\r\n padding: 0.75rem 1rem;\r\n color: #111111;\r\n font-size: 0.875rem;\r\n margin-top: 0.25rem;\r\n margin-bottom: 1rem;\r\n outline: none;\r\n }\r\n .spa-form input:focus, .spa-form select:focus, .spa-form textarea:focus {\r\n border-color: #D4A72C;\r\n }\r\n .spa-form label {\r\n display: block;\r\n font-size: 0.75rem;\r\n text-transform: uppercase;\r\n letter-spacing: 0.05em;\r\n color: rgba(17, 17, 17, 0.7);\r\n font-weight: 600;\r\n }\r\n .spa-form button[type=\"submit\"] {\r\n width: 100%;\r\n background-color: #164F4A;\r\n color: #ffffff;\r\n font-weight: 700;\r\n font-size: 0.75rem;\r\n text-transform: uppercase;\r\n letter-spacing: 0.2em;\r\n padding: 1rem;\r\n border-radius: 9999px;\r\n box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);\r\n cursor: pointer;\r\n transition: all 0.3s ease;\r\n margin-top: 1rem;\r\n border: none;\r\n }\r\n .spa-form button[type=\"submit\"]:hover {\r\n background-color: #D4A72C;\r\n color: #164F4A;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body class=\"bg-[#E8E5D2] text-[#111111] antialiased selection:bg-[#D4A72C] selection:text-white\">\r\n\r\n <header id=\"navbar\" class=\"fixed top-0 left-0 right-0 z-50 transition-all duration-300 bg-[#E8E5D2]\/95 backdrop-blur-md border-b border-[#D4A72C]\/40 shadow-md\">\r\n <div class=\"max-w-7xl mx-auto px-6 h-32 flex items-center justify-between\">\r\n <a href=\"#\" class=\"flex items-center group py-1\">\r\n <img decoding=\"async\" src=\"https:\/\/adeaspa.co.za\/uplift\/wp-content\/uploads\/2026\/09\/ADEA-SPA-LOGO-500px-x-500px-1.png\" alt=\"Adea Spa Logo\" style=\"height: 100px !important; max-height: 100px !important; width: auto !important;\" class=\"object-contain transition-transform duration-300 group-hover:scale-105\">\r\n <\/a>\r\n\r\n <nav class=\"hidden lg:flex items-center gap-8 text-xs uppercase tracking-[0.25em] font-semibold\">\r\n <a href=\"#about\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A] transition-colors\">About<\/a>\r\n <a href=\"#treatments\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A] transition-colors\">Treatments<\/a>\r\n <a href=\"#packages\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A] transition-colors\">Packages<\/a>\r\n <a href=\"#experience\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A] transition-colors\">Gallery<\/a>\r\n <a href=\"#location\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A] transition-colors\">Location<\/a>\r\n <a href=\"#contact\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A] transition-colors\">Contact<\/a>\r\n <\/nav>\r\n\r\n <div class=\"hidden sm:flex items-center\">\r\n <button type=\"button\" onclick=\"openBookingModal()\" class=\"px-6 py-3 spa-btn font-bold text-xs uppercase tracking-[0.2em] rounded-full shadow-md hover:scale-105\">\r\n Book Now\r\n <\/button>\r\n <\/div>\r\n\r\n <button type=\"button\" onclick=\"toggleMobileMenu()\" class=\"lg:hidden text-[#164F4A] focus:outline-none p-2 text-2xl\">\r\n <i id=\"menu-icon\" class=\"fa-solid fa-bars\"><\/i>\r\n <\/button>\r\n <\/div>\r\n\r\n <div id=\"mobile-menu\" class=\"hidden lg:hidden bg-[#E8E5D2] border-b border-[#D4A72C]\/40 px-6 py-8 flex flex-col gap-6 text-xs uppercase tracking-[0.2em] text-center shadow-2xl\">\r\n <a href=\"#about\" onclick=\"toggleMobileMenu()\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A]\">About<\/a>\r\n <a href=\"#treatments\" onclick=\"toggleMobileMenu()\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A]\">Treatments<\/a>\r\n <a href=\"#packages\" onclick=\"toggleMobileMenu()\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A]\">Packages<\/a>\r\n <a href=\"#experience\" onclick=\"toggleMobileMenu()\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A]\">Gallery<\/a>\r\n <a href=\"#location\" onclick=\"toggleMobileMenu()\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A]\">Location<\/a>\r\n <a href=\"#contact\" onclick=\"toggleMobileMenu()\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A]\">Contact<\/a>\r\n <button type=\"button\" onclick=\"openBookingModal(); toggleMobileMenu();\" class=\"w-full py-3.5 spa-btn font-bold rounded-full shadow-md tracking-[0.2em]\">\r\n Book Now\r\n <\/button>\r\n <\/div>\r\n <\/header>\r\n\r\n <section class=\"relative min-h-screen flex items-center justify-center hero-bg pt-40 pb-20 text-center text-white px-6\">\r\n <div class=\"max-w-4xl mx-auto space-y-8 z-10\">\r\n <div class=\"inline-flex items-center gap-2 px-5 py-2 rounded-full bg-[#164F4A]\/90 backdrop-blur-md border border-[#D4A72C]\/50 text-white text-xs uppercase tracking-[0.3em] font-bold shadow-md\">\r\n <i class=\"fa-solid fa-crown text-[10px] text-[#D4A72C]\"><\/i> \u201cAdea\u201d \u2013 A Kind Gift from God\r\n <\/div>\r\n <h1 class=\"font-serif text-4xl sm:text-6xl md:text-7xl lg:text-8xl tracking-tight leading-none font-normal text-white drop-shadow-lg\">\r\n You Are Not Just a Client \u2013 <br><span class=\"italic font-light text-[#D4A72C]\">You Are Royalty<\/span>\r\n <\/h1>\r\n <p class=\"text-base sm:text-xl text-[#E8E5D2] max-w-2xl mx-auto font-light leading-relaxed drop-shadow\">\r\n Tucked away at 23 Cunningham Rd, Glenvista in the South of Johannesburg. Experience divine healing, luxury beauty, and soul-restoring serenity.\r\n <\/p>\r\n <div class=\"flex flex-col sm:flex-row items-center justify-center gap-4 pt-4\">\r\n <button type=\"button\" onclick=\"openBookingModal()\" class=\"w-full sm:w-auto px-8 py-4 spa-btn font-bold text-xs uppercase tracking-[0.2em] rounded-full shadow-xl shadow-[#D4A72C]\/20 hover:scale-105 border border-[#D4A72C]\/60\">\r\n Explore Menu & Book\r\n <\/button>\r\n <a href=\"#treatments\" class=\"w-full sm:w-auto px-8 py-4 spa-btn border border-[#D4A72C]\/50 font-semibold text-xs uppercase tracking-[0.2em] rounded-full shadow-md inline-flex items-center justify-center\">\r\n Our Services\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"about\" class=\"py-24 px-6 bg-white\">\r\n <div class=\"max-w-7xl mx-auto grid grid-cols-1 lg:grid-cols-2 gap-16 items-center\">\r\n <div class=\"space-y-6\">\r\n <span class=\"text-[#164F4A] uppercase tracking-[0.3em] text-xs font-semibold\">Welcome to Adea Spa<\/span>\r\n <h2 class=\"font-serif text-3xl sm:text-5xl text-[#164F4A] leading-tight\">\r\n A Sacred Experience of <br><span class=\"italic text-[#D4A72C]\">Wellness & Soul<\/span>\r\n <\/h2>\r\n <p class=\"text-[#111111]\/80 leading-relaxed font-light text-base sm:text-lg\">\r\n Inspired by the Swahili meaning of our name, \u201cAdea\u201d \u2013 a kind gift from God, we are devoted to offering each guest a divine experience of healing, beauty, and serenity. Situated at our new exclusive sanctuary at 23 Cunningham Rd, Glenvista in the South of Johannesburg, wellness is more than a service \u2013 it's a sacred ritual of restoration.\r\n <\/p>\r\n <div class=\"grid grid-cols-2 gap-6 pt-4\">\r\n <div class=\"border-l-2 border-[#D4A72C] pl-4\">\r\n <span class=\"block font-serif text-3xl text-[#164F4A] font-semibold\">Glenvista<\/span>\r\n <span class=\"text-xs uppercase tracking-wider text-[#111111]\/70\">Exclusive Sanctuary<\/span>\r\n <\/div>\r\n <div class=\"border-l-2 border-[#D4A72C] pl-4\">\r\n <span class=\"block font-serif text-3xl text-[#164F4A] font-semibold\">Royal<\/span>\r\n <span class=\"text-xs uppercase tracking-wider text-[#111111]\/70\">Personalized Care<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1519823551278-64ac92734fb1?auto=format&fit=crop&q=80&w=800\" alt=\"Spa interior botanical\" class=\"rounded-2xl shadow-xl w-full h-80 object-cover transform translate-y-6 border border-[#B8BE91]\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1507652313519-d4e9174996dd?auto=format&fit=crop&q=80&w=800\" alt=\"Massage therapy\" class=\"rounded-2xl shadow-xl w-full h-80 object-cover border border-[#B8BE91]\">\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"treatments\" class=\"py-24 px-6 bg-[#B8BE91]\/15 text-[#111111]\">\r\n <div class=\"max-w-7xl mx-auto\">\r\n <div class=\"text-center max-w-2xl mx-auto space-y-4 mb-16\">\r\n <span class=\"text-[#164F4A] uppercase tracking-[0.3em] text-xs font-semibold\">Curated Menu<\/span>\r\n <h2 class=\"font-serif text-3xl sm:text-5xl text-[#164F4A]\">Restore Balance & Vitality<\/h2>\r\n <p class=\"text-[#111111]\/70 font-light text-sm sm:text-base\">\r\n From deeply relaxing massages and rejuvenating body scrubs to sculpting wood therapy and radiant facials.\r\n <\/p>\r\n <\/div>\r\n\r\n <div class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8\">\r\n \r\n <div class=\"bg-white border border-[#B8BE91]\/50 rounded-2xl p-8 flex flex-col justify-between hover:border-[#D4A72C] transition-all duration-300 group shadow-md\">\r\n <div class=\"space-y-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <span class=\"text-xs uppercase tracking-widest text-[#164F4A] bg-white border border-[#164F4A]\/30 px-3 py-1 rounded-full font-bold\">Signature<\/span>\r\n <span class=\"font-serif text-2xl text-[#164F4A] font-bold\">R429<\/span>\r\n <\/div>\r\n <h3 class=\"font-serif text-2xl text-[#164F4A] group-hover:text-[#D4A72C] transition-colors\">Express & Facial Scrub<\/h3>\r\n <p class=\"text-[#111111]\/70 text-sm font-light leading-relaxed\">\r\n A rejuvenating combination designed to exfoliate dead cells, invigorate circulation, and restore natural radiance.\r\n <\/p>\r\n <\/div>\r\n <button type=\"button\" onclick=\"openBookingModalWithTreatment('Express & Facial Scrub - R429')\" class=\"mt-8 w-full py-3 spa-btn font-bold text-xs uppercase tracking-widest rounded-full shadow-sm\">\r\n Book Treatment\r\n <\/button>\r\n <\/div>\r\n\r\n \r\n <div class=\"bg-white border border-[#B8BE91]\/50 rounded-2xl p-8 flex flex-col justify-between hover:border-[#D4A72C] transition-all duration-300 group shadow-md\">\r\n <div class=\"space-y-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <span class=\"text-xs uppercase tracking-widest text-[#164F4A] bg-white border border-[#164F4A]\/30 px-3 py-1 rounded-full font-bold\">Revitalizing<\/span>\r\n <span class=\"font-serif text-2xl text-[#164F4A] font-bold\">R349<\/span>\r\n <\/div>\r\n <h3 class=\"font-serif text-2xl text-[#164F4A] group-hover:text-[#D4A72C] transition-colors\">Express Facial<\/h3>\r\n <p class=\"text-[#111111]\/70 text-sm font-light leading-relaxed\">\r\n Includes head and neck massage, designed to deeply cleanse, unclog pores, and bring out your natural glow.\r\n <\/p>\r\n <\/div>\r\n <button type=\"button\" onclick=\"openBookingModalWithTreatment('Express Facial - R349')\" class=\"mt-8 w-full py-3 spa-btn font-bold text-xs uppercase tracking-widest rounded-full shadow-sm\">\r\n Book Treatment\r\n <\/button>\r\n <\/div>\r\n\r\n \r\n <div class=\"bg-white border border-[#B8BE91]\/50 rounded-2xl p-8 flex flex-col justify-between hover:border-[#D4A72C] transition-all duration-300 group shadow-md\">\r\n <div class=\"space-y-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <span class=\"text-xs uppercase tracking-widest text-[#164F4A] bg-white border border-[#164F4A]\/30 px-3 py-1 rounded-full font-bold\">Popular<\/span>\r\n <span class=\"font-serif text-2xl text-[#164F4A] font-bold\">R299<\/span>\r\n <\/div>\r\n <h3 class=\"font-serif text-2xl text-[#164F4A] group-hover:text-[#D4A72C] transition-colors\">Hot Stone Massage<\/h3>\r\n <p class=\"text-[#111111]\/70 text-sm font-light leading-relaxed\">\r\n Warm basalt stones melt away tension, soothing muscles and promoting deep, restorative relaxation.\r\n <\/p>\r\n <\/div>\r\n <button type=\"button\" onclick=\"openBookingModalWithTreatment('Hot Stone Massage - R299')\" class=\"mt-8 w-full py-3 spa-btn font-bold text-xs uppercase tracking-widest rounded-full shadow-sm\">\r\n Book Treatment\r\n <\/button>\r\n <\/div>\r\n\r\n \r\n <div class=\"bg-white border border-[#B8BE91]\/50 rounded-2xl p-8 flex flex-col justify-between hover:border-[#D4A72C] transition-all duration-300 group shadow-md\">\r\n <div class=\"space-y-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <span class=\"text-xs uppercase tracking-widest text-[#164F4A] bg-white border border-[#164F4A]\/30 px-3 py-1 rounded-full font-bold\">Essential<\/span>\r\n <span class=\"font-serif text-2xl text-[#164F4A] font-bold\">R299<\/span>\r\n <\/div>\r\n <h3 class=\"font-serif text-2xl text-[#164F4A] group-hover:text-[#D4A72C] transition-colors\">Back, Neck & Shoulder<\/h3>\r\n <p class=\"text-[#111111]\/70 text-sm font-light leading-relaxed\">\r\n Targeted therapeutic relief focusing on high-stress zones to release knots and improve posture.\r\n <\/p>\r\n <\/div>\r\n <button type=\"button\" onclick=\"openBookingModalWithTreatment('Back, Neck & Shoulder - R299')\" class=\"mt-8 w-full py-3 spa-btn font-bold text-xs uppercase tracking-widest rounded-full shadow-sm\">\r\n Book Treatment\r\n <\/button>\r\n <\/div>\r\n\r\n \r\n <div class=\"bg-white border border-[#B8BE91]\/50 rounded-2xl p-8 flex flex-col justify-between hover:border-[#D4A72C] transition-all duration-300 group shadow-md\">\r\n <div class=\"space-y-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <span class=\"text-xs uppercase tracking-widest text-[#164F4A] bg-white border border-[#164F4A]\/30 px-3 py-1 rounded-full font-bold\">Ultimate Luxury<\/span>\r\n <span class=\"font-serif text-2xl text-[#164F4A] font-bold\">R599<\/span>\r\n <\/div>\r\n <h3 class=\"font-serif text-2xl text-[#164F4A] group-hover:text-[#D4A72C] transition-colors\">Couple's Massage<\/h3>\r\n <p class=\"text-[#111111]\/70 text-sm font-light leading-relaxed\">\r\n Share a restorative side-by-side relaxation journey designed to unwind the body and harmonize shared energy.\r\n <\/p>\r\n <\/div>\r\n <button type=\"button\" onclick=\"openBookingModalWithTreatment('Couple\\'s Massage - R599')\" class=\"mt-8 w-full py-3 spa-btn font-bold text-xs uppercase tracking-widest rounded-full shadow-sm\">\r\n Book Treatment\r\n <\/button>\r\n <\/div>\r\n\r\n \r\n <div class=\"bg-white border border-[#B8BE91]\/50 rounded-2xl p-8 flex flex-col justify-between hover:border-[#D4A72C] transition-all duration-300 group shadow-md\">\r\n <div class=\"space-y-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <span class=\"text-xs uppercase tracking-widest text-[#164F4A] bg-white border border-[#164F4A]\/30 px-3 py-1 rounded-full font-bold\">Classic<\/span>\r\n <span class=\"font-serif text-2xl text-[#164F4A] font-bold\">R299<\/span>\r\n <\/div>\r\n <h3 class=\"font-serif text-2xl text-[#164F4A] group-hover:text-[#D4A72C] transition-colors\">Swedish Massage<\/h3>\r\n <p class=\"text-[#111111]\/70 text-sm font-light leading-relaxed\">\r\n A classic full-body massage using long, soothing strokes to improve circulation and dissolve everyday fatigue.\r\n <\/p>\r\n <\/div>\r\n <button type=\"button\" onclick=\"openBookingModalWithTreatment('Swedish Massage - R299')\" class=\"mt-8 w-full py-3 spa-btn font-bold text-xs uppercase tracking-widest rounded-full shadow-sm\">\r\n Book Treatment\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"packages\" class=\"py-24 px-6 bg-[#164F4A] text-white\">\r\n <div class=\"max-w-7xl mx-auto\">\r\n <div class=\"text-center max-w-2xl mx-auto space-y-4 mb-16\">\r\n <span class=\"text-[#D4A72C] uppercase tracking-[0.3em] text-xs font-semibold\">Special Offers<\/span>\r\n <h2 class=\"font-serif text-3xl sm:text-5xl text-white\">Royalty Spa Packages<\/h2>\r\n <p class=\"text-[#E8E5D2]\/80 font-light text-sm sm:text-base\">\r\n Immerse yourself in our all-inclusive spa journeys crafted for ultimate pampering and rejuvenation.\r\n <\/p>\r\n <\/div>\r\n\r\n <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-8\">\r\n \r\n <div class=\"bg-white\/10 backdrop-blur-md border border-[#D4A72C]\/30 rounded-3xl p-8 sm:p-12 flex flex-col justify-between space-y-6 shadow-xl\">\r\n <div class=\"space-y-4\">\r\n <span class=\"px-4 py-1.5 rounded-full bg-[#D4A72C] text-[#164F4A] text-xs uppercase font-bold tracking-widest\">Most Popular<\/span>\r\n <h3 class=\"font-serif text-3xl text-white\">The South JHB Escape<\/h3>\r\n <p class=\"text-[#E8E5D2]\/90 text-sm font-light leading-relaxed\">\r\n Includes a full body Swedish massage, express facial, foot scrub, and complimentary herbal refreshment in our tranquil garden lounge.\r\n <\/p>\r\n <ul class=\"space-y-2 text-xs uppercase tracking-wider text-[#D4A72C] pt-2\">\r\n <li><i class=\"fa-solid fa-check mr-2\"><\/i> 90 Minutes of Pure Bliss<\/li>\r\n <li><i class=\"fa-solid fa-check mr-2\"><\/i> Aromatherapy Oils Included<\/li>\r\n <li><i class=\"fa-solid fa-check mr-2\"><\/i> Private Sanctuary Lounge Access<\/li>\r\n <\/ul>\r\n <\/div>\r\n <div class=\"flex items-center justify-between pt-6 border-t border-white\/10\">\r\n <span class=\"font-serif text-3xl text-[#D4A72C]\">R850<\/span>\r\n <button type=\"button\" onclick=\"openBookingModalWithTreatment('The South JHB Escape - R850')\" class=\"px-6 py-3 bg-[#D4A72C] hover:bg-white text-[#164F4A] font-bold text-xs uppercase tracking-widest rounded-full transition-all cursor-pointer\">\r\n Book Package\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"bg-white\/10 backdrop-blur-md border border-[#D4A72C]\/30 rounded-3xl p-8 sm:p-12 flex flex-col justify-between space-y-6 shadow-xl\">\r\n <div class=\"space-y-4\">\r\n <span class=\"px-4 py-1.5 rounded-full bg-white text-[#164F4A] text-xs uppercase font-bold tracking-widest\">Couples Retreat<\/span>\r\n <h3 class=\"font-serif text-3xl text-white\">Royal Duo Serenity<\/h3>\r\n <p class=\"text-[#E8E5D2]\/90 text-sm font-light leading-relaxed\">\r\n Side-by-side hot stone massages, revitalizing express facials, and sparkling refreshments to celebrate connection and peace.\r\n <\/p>\r\n <ul class=\"space-y-2 text-xs uppercase tracking-wider text-[#D4A72C] pt-2\">\r\n <li><i class=\"fa-solid fa-check mr-2\"><\/i> 120 Minutes Combined Journey<\/li>\r\n <li><i class=\"fa-solid fa-check mr-2\"><\/i> Private Couples Suite<\/li>\r\n <li><i class=\"fa-solid fa-check mr-2\"><\/i> Complimentary Treats<\/li>\r\n <\/ul>\r\n <\/div>\r\n <div class=\"flex items-center justify-between pt-6 border-t border-white\/10\">\r\n <span class=\"font-serif text-3xl text-[#D4A72C]\">R1,199<\/span>\r\n <button type=\"button\" onclick=\"openBookingModalWithTreatment('Royal Duo Serenity - R1,199')\" class=\"px-6 py-3 bg-[#D4A72C] hover:bg-white text-[#164F4A] font-bold text-xs uppercase tracking-widest rounded-full transition-all cursor-pointer\">\r\n Book Package\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"experience\" class=\"py-24 px-6 bg-white\">\r\n <div class=\"max-w-7xl mx-auto\">\r\n <div class=\"text-center max-w-2xl mx-auto space-y-4 mb-16\">\r\n <span class=\"text-[#164F4A] uppercase tracking-[0.3em] text-xs font-semibold\">Visual Sanctuary<\/span>\r\n <h2 class=\"font-serif text-3xl sm:text-5xl text-[#164F4A]\">Glimpse Into Adea Spa<\/h2>\r\n <p class=\"text-[#111111]\/70 font-light text-sm sm:text-base\">\r\n Designed for tranquility, elegance, and deep soul restoration.\r\n <\/p>\r\n <\/div>\r\n\r\n <div class=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6\">\r\n <div class=\"overflow-hidden rounded-2xl shadow-md group\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1540555700478-4be289fbecef?auto=format&fit=crop&q=80&w=800\" alt=\"Spa ambiance\" class=\"w-full h-72 object-cover group-hover:scale-110 transition-transform duration-500\">\r\n <\/div>\r\n <div class=\"overflow-hidden rounded-2xl shadow-md group\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1519823551278-64ac92734fb1?auto=format&fit=crop&q=80&w=800\" alt=\"Botanical spa room\" class=\"w-full h-72 object-cover group-hover:scale-110 transition-transform duration-500\">\r\n <\/div>\r\n <div class=\"overflow-hidden rounded-2xl shadow-md group\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1507652313519-d4e9174996dd?auto=format&fit=crop&q=80&w=800\" alt=\"Massage therapy oils\" class=\"w-full h-72 object-cover group-hover:scale-110 transition-transform duration-500\">\r\n <\/div>\r\n <div class=\"overflow-hidden rounded-2xl shadow-md group\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1570172619644-dfd03ed5d881?auto=format&fit=crop&q=80&w=800\" alt=\"Relaxation lounge\" class=\"w-full h-72 object-cover group-hover:scale-110 transition-transform duration-500\">\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"location\" class=\"py-24 px-6 bg-[#E8E5D2] border-t border-[#B8BE91]\/40\">\r\n <div class=\"max-w-7xl mx-auto grid grid-cols-1 lg:grid-cols-2 gap-16 items-start\">\r\n <div class=\"space-y-6\">\r\n <span class=\"text-[#164F4A] uppercase tracking-[0.3em] text-xs font-semibold\">Find Us & Connect<\/span>\r\n <h2 class=\"font-serif text-3xl sm:text-5xl text-[#164F4A]\">Exclusive Sanctuary<\/h2>\r\n <p class=\"text-[#111111]\/80 leading-relaxed font-light text-base\">\r\n Conveniently located at our new premises at 23 Cunningham Rd, Glenvista in the tranquil South of Johannesburg, Gauteng. Visit us for a peaceful retreat away from the city hustle.\r\n <\/p>\r\n <div class=\"space-y-4 text-sm text-[#111111]\">\r\n <p class=\"flex items-center gap-3\"><i class=\"fa-solid fa-location-dot text-[#164F4A] text-lg\"><\/i> 23 Cunningham Rd, Glenvista, Johannesburg South, 2190<\/p>\r\n <p class=\"flex items-center gap-3\"><i class=\"fa-solid fa-phone text-[#164F4A] text-lg\"><\/i> +27 65 877 3285<\/p>\r\n <p class=\"flex items-center gap-3\"><i class=\"fa-solid fa-envelope text-[#164F4A] text-lg\"><\/i> bookings@adeaspa.co.za<\/p>\r\n <\/div>\r\n <div class=\"bg-white\/80 border border-[#B8BE91] rounded-3xl p-8 shadow-sm space-y-4 mt-8\">\r\n <h3 class=\"font-serif text-xl text-[#164F4A]\">Operating Hours<\/h3>\r\n <div class=\"space-y-2 text-sm text-[#111111]\/80\">\r\n <div class=\"flex justify-between border-b border-[#111111]\/10 py-2\">\r\n <span class=\"font-medium\">Monday \u2013 Sunday<\/span> \r\n <span class=\"font-semibold text-[#111111]\">09:00 \u2013 17:00<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"bg-white border border-[#B8BE91] rounded-3xl p-8 sm:p-12 shadow-lg space-y-6\">\r\n <div class=\"space-y-2\">\r\n <span class=\"text-[#164F4A] uppercase tracking-[0.2em] text-xs font-bold\">Direct Inquiry<\/span>\r\n <h3 class=\"font-serif text-3xl text-[#164F4A]\">Send Us a Message<\/h3>\r\n <p class=\"text-xs text-[#111111]\/70\">Submissions route directly to bookings@adeaspa.co.za<\/p>\r\n <\/div>\r\n \r\n <form action=\"\" method=\"POST\" class=\"spa-form\">\r\n <input type=\"hidden\" name=\"adea_form_submit\" value=\"1\">\r\n <div>\r\n <label>Your Name<\/label>\r\n <input type=\"text\" name=\"name\" required placeholder=\"Full Name\">\r\n <\/div>\r\n <div>\r\n <label>Your Email<\/label>\r\n <input type=\"email\" name=\"email\" required placeholder=\"email@domain.com\">\r\n <\/div>\r\n <div>\r\n <label>Phone Number<\/label>\r\n <input type=\"tel\" name=\"phone\" required placeholder=\"+27 ...\">\r\n <\/div>\r\n <div>\r\n <label>Select Treatment \/ Package<\/label>\r\n <select name=\"treatment\">\r\n <option value=\"General Inquiry\">General Inquiry<\/option>\r\n <option value=\"Express & Facial Scrub - R429\">Express & Facial Scrub - R429<\/option>\r\n <option value=\"Express Facial - R349\">Express Facial - R349<\/option>\r\n <option value=\"Hot Stone Massage - R299\">Hot Stone Massage - R299<\/option>\r\n <option value=\"Back, Neck & Shoulder - R299\">Back, Neck & Shoulder - R299<\/option>\r\n <option value=\"Couple's Massage - R599\">Couple's Massage - R599<\/option>\r\n <option value=\"Swedish Massage - R299\">Swedish Massage - R299<\/option>\r\n <option value=\"The South JHB Escape - R850\">The South JHB Escape - R850<\/option>\r\n <option value=\"Royal Duo Serenity - R1,199\">Royal Duo Serenity - R1,199<\/option>\r\n <\/select>\r\n <\/div>\r\n <div>\r\n <label>Your Message \/ Preferred Date<\/label>\r\n <textarea name=\"message\" rows=\"4\" placeholder=\"Let us know your preferred date and time...\"><\/textarea>\r\n <\/div>\r\n <button type=\"submit\">Send Message<\/button>\r\n <\/form>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <footer id=\"contact\" class=\"bg-[#164F4A] text-[#E8E5D2] py-16 px-6 border-t border-[#D4A72C]\/40 text-xs tracking-wider\">\r\n <div class=\"max-w-7xl mx-auto grid grid-cols-1 md:grid-cols-3 gap-12 mb-12\">\r\n <div class=\"space-y-4\">\r\n <img decoding=\"async\" src=\"https:\/\/adeaspa.co.za\/uplift\/wp-content\/uploads\/2026\/09\/ADEA-SPA-LOGO-500px-x-500px-1.png\" alt=\"Adea Spa Logo\" style=\"height: 70px !important; width: auto !important;\" class=\"object-contain filter brightness-200\">\r\n <p class=\"text-[#E8E5D2]\/80 font-light\">A sacred sanctuary of wellness, healing, and luxury situated at 23 Cunningham Rd, Glenvista.<\/p>\r\n <\/div>\r\n <div class=\"space-y-3\">\r\n <h4 class=\"font-serif text-[#D4A72C] text-sm uppercase tracking-widest font-semibold\">Quick Links<\/h4>\r\n <ul class=\"space-y-2 uppercase text-[#E8E5D2]\">\r\n <li><a href=\"#about\" class=\"hover:text-[#D4A72C] transition-colors\">About Us<\/a><\/li>\r\n <li><a href=\"#treatments\" class=\"hover:text-[#D4A72C] transition-colors\">Curated Treatments<\/a><\/li>\r\n <li><a href=\"#packages\" class=\"hover:text-[#D4A72C] transition-colors\">Spa Packages<\/a><\/li>\r\n <li><a href=\"#location\" class=\"hover:text-[#D4A72C] transition-colors\">Location & Hours<\/a><\/li>\r\n <\/ul>\r\n <\/div>\r\n <div class=\"space-y-3\">\r\n <h4 class=\"font-serif text-[#D4A72C] text-sm uppercase tracking-widest font-semibold\">Official Channels<\/h4>\r\n <ul class=\"space-y-2 uppercase text-[#E8E5D2]\">\r\n <li><a href=\"https:\/\/adeaspa.co.za\/\" target=\"_blank\" class=\"hover:text-[#D4A72C] transition-colors\">Official Website<\/a><\/li>\r\n <li><a href=\"#\" onclick=\"openBookingModal(); return false;\" class=\"hover:text-[#D4A72C] transition-colors\">Online Booking<\/a><\/li>\r\n <\/ul>\r\n <\/div>\r\n <\/div>\r\n <div class=\"max-w-7xl mx-auto pt-8 border-t border-[#D4A72C]\/20 text-center text-[#E8E5D2]\/60\">\r\n © 2026 Adea Spa, South of Johannesburg. All rights reserved.\r\n <\/div>\r\n <\/footer>\r\n\r\n \r\n <div id=\"booking-modal\" class=\"fixed inset-0 z-50 bg-black\/60 backdrop-blur-sm hidden items-center justify-center p-6\">\r\n <div class=\"bg-white border border-[#D4A72C]\/30 w-full max-w-lg rounded-3xl p-8 relative shadow-2xl text-[#111111] max-h-[90vh] overflow-y-auto\">\r\n <button type=\"button\" onclick=\"closeBookingModal()\" class=\"absolute top-6 right-6 text-[#111111] hover:text-[#164F4A] text-lg cursor-pointer\">\r\n <i class=\"fa-solid fa-xmark\"><\/i>\r\n <\/button>\r\n <h3 class=\"font-serif text-3xl mb-1 text-[#164F4A]\">Book Your Treatment<\/h3>\r\n <p class=\"text-xs text-[#111111]\/70 mb-6 uppercase tracking-wider\">Submissions route directly to bookings@adeaspa.co.za<\/p>\r\n \r\n <form action=\"\" method=\"POST\" class=\"spa-form modal-form\">\r\n <input type=\"hidden\" name=\"adea_form_submit\" value=\"1\">\r\n <div>\r\n <label>Your Name<\/label>\r\n <input type=\"text\" name=\"name\" required placeholder=\"Full Name\">\r\n <\/div>\r\n <div>\r\n <label>Your Email<\/label>\r\n <input type=\"email\" name=\"email\" required placeholder=\"email@domain.com\">\r\n <\/div>\r\n <div>\r\n <label>Phone Number<\/label>\r\n <input type=\"tel\" name=\"phone\" required placeholder=\"+27 ...\">\r\n <\/div>\r\n <div>\r\n <label>Select Treatment \/ Package<\/label>\r\n <select name=\"treatment\" class=\"modal-treatment-select\">\r\n <option value=\"General Inquiry\">General Inquiry<\/option>\r\n <option value=\"Express & Facial Scrub - R429\">Express & Facial Scrub - R429<\/option>\r\n <option value=\"Express Facial - R349\">Express Facial - R349<\/option>\r\n <option value=\"Hot Stone Massage - R299\">Hot Stone Massage - R299<\/option>\r\n <option value=\"Back, Neck & Shoulder - R299\">Back, Neck & Shoulder - R299<\/option>\r\n <option value=\"Couple's Massage - R599\">Couple's Massage - R599<\/option>\r\n <option value=\"Swedish Massage - R299\">Swedish Massage - R299<\/option>\r\n <option value=\"The South JHB Escape - R850\">The South JHB Escape - R850<\/option>\r\n <option value=\"Royal Duo Serenity - R1,199\">Royal Duo Serenity - R1,199<\/option>\r\n <\/select>\r\n <\/div>\r\n <div>\r\n <label>Your Message \/ Preferred Date<\/label>\r\n <textarea name=\"message\" rows=\"4\" placeholder=\"Let us know your preferred date and time...\"><\/textarea>\r\n <\/div>\r\n <button type=\"submit\">Submit Booking Request<\/button>\r\n <\/form>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div id=\"whatsapp-bot-container\" class=\"fixed bottom-6 right-6 z-50 font-sans\">\r\n \r\n <button id=\"whatsapp-bot-toggle\" onclick=\"toggleWhatsappBot()\" class=\"w-16 h-16 bg-gradient-to-tr from-[#128C7E] to-[#25D366] hover:scale-105 text-white rounded-full shadow-[0_10px_25px_rgba(37,211,102,0.4)] flex items-center justify-center text-3xl transition-all duration-300 border-2 border-white group relative\">\r\n <i id=\"whatsapp-bot-icon\" class=\"fa-brands fa-whatsapp transition-transform group-hover:rotate-12\"><\/i>\r\n <span class=\"absolute -top-1 -right-1 w-4 h-4 bg-[#D4A72C] border-2 border-white rounded-full animate-pulse\"><\/span>\r\n <\/button>\r\n\r\n \r\n <div id=\"whatsapp-bot-window\" class=\"hidden absolute bottom-20 right-0 w-80 sm:w-96 bg-white border border-[#D4A72C]\/30 rounded-3xl shadow-[0_20px_50px_rgba(0,0,0,0.2)] overflow-hidden flex flex-col transition-all duration-300 origin-bottom-right\">\r\n \r\n \r\n <div class=\"bg-[#164F4A] text-white p-4 flex items-center justify-between border-b border-[#D4A72C]\/30 shadow-md\">\r\n <div class=\"flex items-center space-x-3\">\r\n <div class=\"relative\">\r\n <div class=\"w-10 h-10 rounded-full bg-[#D4A72C] text-[#164F4A] flex items-center justify-center font-bold text-xl shadow-md border border-white\/20\">\r\n <i class=\"fa-brands fa-whatsapp\"><\/i>\r\n <\/div>\r\n <span class=\"absolute bottom-0 right-0 w-3 h-3 bg-[#25D366] border-2 border-[#164F4A] rounded-full\"><\/span>\r\n <\/div>\r\n <div>\r\n <div class=\"flex items-center gap-1.5\">\r\n <h4 class=\"font-serif font-bold text-sm tracking-wide text-white\">Adea Spa Concierge<\/h4>\r\n <i class=\"fa-solid fa-crown text-[10px] text-[#D4A72C]\"><\/i>\r\n <\/div>\r\n <span class=\"text-[10px] text-[#E8E5D2]\/80\">Online \u2022 Ready to assist you<\/span>\r\n <\/div>\r\n <\/div>\r\n <button onclick=\"toggleWhatsappBot()\" class=\"text-[#E8E5D2] hover:text-[#D4A72C] text-lg p-1 transition-colors\"><i class=\"fa-solid fa-xmark\"><\/i><\/button>\r\n <\/div>\r\n\r\n \r\n <div id=\"whatsapp-chat-messages\" class=\"p-4 h-80 overflow-y-auto space-y-3 bg-[#FAF8F5] text-xs\">\r\n \r\n <div class=\"flex items-start space-x-2\">\r\n <div class=\"bg-white text-[#111111] p-3.5 rounded-2xl rounded-tl-none max-w-[88%] leading-relaxed shadow-sm border border-[#B8BE91]\/30 relative\">\r\n <p class=\"font-serif font-semibold text-[#164F4A] mb-1 flex items-center gap-1\">\r\n <i class=\"fa-solid fa-crown text-[10px] text-[#D4A72C]\"><\/i> Adea Royalty Desk\r\n <\/p>\r\n Welcome to Adea Spa at 23 Cunningham Rd, Glenvista! \ud83d\udc51 How may we curate your relaxation journey today?\r\n <span class=\"block text-[9px] text-gray-400 text-right mt-1.5\">Just now<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"px-3 py-2.5 bg-[#E8E5D2]\/50 border-t border-[#B8BE91]\/30 flex gap-1.5 overflow-x-auto text-[10px] scrollbar-none\">\r\n <button onclick=\"sendWhatsappPrompt('Prices')\" class=\"bg-white hover:bg-[#164F4A] hover:text-white px-3 py-1 rounded-full whitespace-nowrap transition-all font-medium border border-[#B8BE91]\/50 shadow-xs\">\ud83d\udcb0 Prices<\/button>\r\n <button onclick=\"sendWhatsappPrompt('Location')\" class=\"bg-white hover:bg-[#164F4A] hover:text-white px-3 py-1 rounded-full whitespace-nowrap transition-all font-medium border border-[#B8BE91]\/50 shadow-xs\">\ud83d\udccd Location<\/button>\r\n <button onclick=\"sendWhatsappPrompt('Book')\" class=\"bg-white hover:bg-[#164F4A] hover:text-white px-3 py-1 rounded-full whitespace-nowrap transition-all font-medium border border-[#B8BE91]\/50 shadow-xs\">\ud83d\udcc5 How to Book<\/button>\r\n <\/div>\r\n\r\n \r\n <div class=\"p-3 bg-white border-t border-gray-100 flex items-center gap-2\">\r\n <input type=\"text\" id=\"whatsapp-chat-input\" onkeypress=\"handleWhatsappKeypress(event)\" placeholder=\"Type your message...\" class=\"flex-1 bg-[#FAF8F5] border border-[#B8BE91]\/40 rounded-full px-4 py-2 text-xs outline-none focus:border-[#164F4A] text-[#111111]\">\r\n <button onclick=\"sendWhatsappUserMessage()\" class=\"bg-[#164F4A] hover:bg-[#D4A72C] text-white w-9 h-9 rounded-full flex items-center justify-center transition-colors shadow-sm\">\r\n <i class=\"fa-solid fa-paper-plane text-xs\"><\/i>\r\n <\/button>\r\n <\/div>\r\n\r\n \r\n <div class=\"bg-[#164F4A]\/5 px-4 py-2.5 border-t border-[#B8BE91]\/20 text-center\">\r\n <a href=\"https:\/\/wa.me\/27658773285?text=Hello%20Adea%20Spa,%20I%20would%20like%20to%20inquire%20about...\" target=\"_blank\" class=\"text-[11px] text-[#164F4A] font-bold hover:underline flex items-center justify-center gap-1.5\">\r\n <i class=\"fa-brands fa-whatsapp text-sm text-[#25D366]\"><\/i> Open direct chat in WhatsApp App\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <script>\r\n \/\/ Toggle mobile navigation menu visibility\r\n function toggleMobileMenu() {\r\n const menu = document.getElementById('mobile-menu');\r\n const icon = document.getElementById('menu-icon');\r\n menu.classList.toggle('hidden');\r\n if (menu.classList.contains('hidden')) {\r\n icon.classList.remove('fa-xmark');\r\n icon.classList.add('fa-bars');\r\n } else {\r\n icon.classList.remove('fa-bars');\r\n icon.classList.add('fa-xmark');\r\n }\r\n }\r\n\r\n \/\/ Open booking modal\r\n function openBookingModal() {\r\n const modal = document.getElementById('booking-modal');\r\n modal.classList.remove('hidden');\r\n modal.classList.add('flex');\r\n }\r\n\r\n \/\/ Open booking modal and pre-select treatment dropdown\r\n function openBookingModalWithTreatment(treatmentName) {\r\n openBookingModal();\r\n setTimeout(() => {\r\n const selectElement = document.querySelector('.modal-treatment-select');\r\n if (selectElement) {\r\n for (let i = 0; i < selectElement.options.length; i++) {\r\n if (selectElement.options[i].value.includes(treatmentName) || selectElement.options[i].text.includes(treatmentName)) {\r\n selectElement.selectedIndex = i;\r\n break;\r\n }\r\n }\r\n }\r\n }, 100);\r\n }\r\n\r\n \/\/ Close booking modal\r\n function closeBookingModal() {\r\n const modal = document.getElementById('booking-modal');\r\n modal.classList.remove('flex');\r\n modal.classList.add('hidden');\r\n }\r\n\r\n \/\/ Close modal when clicking outside content backdrop\r\n window.onclick = function(event) {\r\n const modal = document.getElementById('booking-modal');\r\n if (event.target === modal) {\r\n closeBookingModal();\r\n }\r\n }\r\n\r\n \/\/ WhatsApp Bot Script Logic\r\n function toggleWhatsappBot() {\r\n const win = document.getElementById('whatsapp-bot-window');\r\n const icon = document.getElementById('whatsapp-bot-icon');\r\n win.classList.toggle('hidden');\r\n if(win.classList.contains('hidden')) {\r\n icon.classList.remove('fa-xmark');\r\n icon.classList.add('fa-brands', 'fa-whatsapp');\r\n } else {\r\n icon.classList.remove('fa-brands', 'fa-whatsapp');\r\n icon.classList.add('fa-solid', 'fa-xmark');\r\n }\r\n }\r\n\r\n function sendWhatsappPrompt(text) {\r\n document.getElementById('whatsapp-chat-input').value = text;\r\n sendWhatsappUserMessage();\r\n }\r\n\r\n function handleWhatsappKeypress(e) {\r\n if (e.key === 'Enter') {\r\n sendWhatsappUserMessage();\r\n }\r\n }\r\n\r\n function sendWhatsappUserMessage() {\r\n const input = document.getElementById('whatsapp-chat-input');\r\n const message = input.value.trim();\r\n if(!message) return;\r\n\r\n appendWhatsappMessage(message, 'user');\r\n input.value = '';\r\n\r\n \/\/ Simulate bot thinking delay\r\n setTimeout(() => {\r\n generateWhatsappBotResponse(message);\r\n }, 600);\r\n }\r\n\r\n function appendWhatsappMessage(text, sender) {\r\n const container = document.getElementById('whatsapp-chat-messages');\r\n const div = document.createElement('div');\r\n div.className = sender === 'user' ? 'flex justify-end' : 'flex justify-start';\r\n \r\n const timeString = new Date().toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });\r\n\r\n if(sender === 'user') {\r\n div.innerHTML = `<div class=\"bg-[#164F4A] text-white p-3.5 rounded-2xl rounded-tr-none max-w-[88%] leading-relaxed shadow-sm relative\">\r\n ${escapeHtml(text)}\r\n <span class=\"block text-[9px] text-[#E8E5D2]\/70 text-right mt-1.5\">${timeString} <i class=\"fa-solid fa-check-double text-[#D4A72C]\"><\/i><\/span>\r\n <\/div>`;\r\n } else {\r\n div.innerHTML = `<div class=\"bg-white text-[#111111] p-3.5 rounded-2xl rounded-tl-none max-w-[88%] leading-relaxed shadow-sm border border-[#B8BE91]\/30 relative\">\r\n ${text}\r\n <span class=\"block text-[9px] text-gray-400 text-right mt-1.5\">${timeString}<\/span>\r\n <\/div>`;\r\n }\r\n container.appendChild(div);\r\n container.scrollTop = container.scrollHeight;\r\n }\r\n\r\n function generateWhatsappBotResponse(query) {\r\n const q = query.toLowerCase();\r\n let response = \"\";\r\n\r\n if (q.includes('human') || q.includes('person') || q.includes('agent') || q.includes('talk') || q.includes('speak') || q.includes('someone')) {\r\n response = `You can easily connect directly with our human team via WhatsApp or phone:<br><br>\r\n \ud83d\udcf1 <strong>WhatsApp\/Call:<\/strong> <a href=\"https:\/\/wa.me\/27658773285\" target=\"_blank\" class=\"text-[#164F4A] underline font-semibold\">+27 65 877 3285<\/a><br>\r\n \ud83d\udce7 <strong>Email:<\/strong> bookings@adeaspa.co.za`;\r\n } else if (q.includes('price') || q.includes('cost') || q.includes('menu') || q.includes('rate') || q.includes('r')) {\r\n response = `Our standalone treatments range from R299 to R599, and packages range from R850 to R1,199:<br><br>\r\n \u2022 Swedish \/ Hot Stone \/ Back & Neck: R299<br>\r\n \u2022 Express Facial: R349<br>\r\n \u2022 Couple's Massage: R599<br>\r\n \u2022 The South JHB Escape: R850<br><br>Check out our <strong>Treatments<\/strong> section above for full details!`;\r\n } else if (q.includes('location') || q.includes('where') || q.includes('address') || q.includes('find') || q.includes('directions')) {\r\n response = `Our new exclusive sanctuary is located at:<br>\ud83d\udccd <strong>23 Cunningham Rd, Glenvista, Johannesburg South, 2190<\/strong>. We look forward to welcoming you!`;\r\n } else if (q.includes('book') || q.includes('appointment') || q.includes('reserve')) {\r\n response = `You can book instantly by clicking the <strong>\"Book Now\"<\/strong> button at the top of the page, or by clicking \"Book Treatment\" under any service on our menu!`;\r\n } else if (q.includes('hours') || q.includes('time') || q.includes('open') || q.includes('schedule')) {\r\n response = `Adea Spa is open <strong>Monday through Sunday from 09:00 to 17:00<\/strong>.`;\r\n } else {\r\n response = `Thank you for your message! For personalized assistance or custom bookings, feel free to chat with us directly on WhatsApp: <br><br><a href=\"https:\/\/wa.me\/27658773285?text=Hello%20Adea%20Spa,%20I%20have%20an%20inquiry%20about...\" target=\"_blank\" class=\"inline-block bg-[#25D366] text-white font-bold px-4 py-2 rounded-full mt-1 text-center shadow\"><i class=\"fa-brands fa-whatsapp\"><\/i> Chat on WhatsApp<\/a>`;\r\n }\r\n\r\n appendWhatsappMessage(response, 'bot');\r\n }\r\n\r\n function escapeHtml(text) {\r\n const map = { '&': '&', '<': '<', '>': '>', '\"': '"', \"'\": ''' };\r\n return text.replace(\/[&<>\"']\/g, function(m) { return map[m]; });\r\n }\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Adea Spa | Luxury Sanctuary, South of Johannesburg About Treatments Packages Gallery Location Contact Book Now About Treatments Packages Gallery Location Contact Book Now \u201cAdea\u201d \u2013 A Kind Gift from God You Are Not Just a Client \u2013 You Are Royalty Tucked away at 23 Cunningham Rd, Glenvista in the South of Johannesburg. Experience divine […]<\/p>\n","protected":false},"author":1,"featured_media":89,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-84","page","type-page","status-publish","has-post-thumbnail","hentry"],"_links":{"self":[{"href":"https:\/\/adeaspa.co.za\/index.php?rest_route=\/wp\/v2\/pages\/84","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/adeaspa.co.za\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/adeaspa.co.za\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/adeaspa.co.za\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/adeaspa.co.za\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=84"}],"version-history":[{"count":356,"href":"https:\/\/adeaspa.co.za\/index.php?rest_route=\/wp\/v2\/pages\/84\/revisions"}],"predecessor-version":[{"id":543,"href":"https:\/\/adeaspa.co.za\/index.php?rest_route=\/wp\/v2\/pages\/84\/revisions\/543"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/adeaspa.co.za\/index.php?rest_route=\/wp\/v2\/media\/89"}],"wp:attachment":[{"href":"https:\/\/adeaspa.co.za\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=84"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n \t\t

\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n Adea Spa | Luxury Sanctuary, South of Johannesburg<\/title>\r\n \r\n \r\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\r\n <script>\r\n tailwind.config = {\r\n theme: {\r\n extend: {\r\n colors: {\r\n adeaTeal: '#164F4A',\r\n adeaGold: '#D4A72C',\r\n adeaAqua: '#82D3D0',\r\n adeaSage: '#B8BE91',\r\n adeaCream: '#E8E5D2',\r\n adeaDark: '#111111',\r\n whatsappGreen: '#25D366',\r\n whatsappDark: '#128C7E',\r\n },\r\n fontFamily: {\r\n serif: ['Playfair Display', 'Georgia', 'serif'],\r\n sans: ['Plus Jakarta Sans', 'Inter', 'sans-serif'],\r\n }\r\n }\r\n }\r\n }\r\n <\/script>\r\n\r\n \r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Plus+Jakarta+Sans:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\">\r\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n\r\n <style>\r\n body {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n background-color: #E8E5D2;\r\n color: #111111;\r\n }\r\n h1, h2, h3, h4, .font-serif {\r\n font-family: 'Playfair Display', Georgia, serif;\r\n }\r\n .hero-bg {\r\n background: linear-gradient(rgba(22, 79, 74, 0.70), rgba(22, 79, 74, 0.80)), url('https:\/\/images.unsplash.com\/photo-1540555700478-4be289fbecef?auto=format&fit=crop&q=80&w=1920') no-repeat center center\/cover;\r\n }\r\n .spa-btn {\r\n background-color: #164F4A;\r\n color: #ffffff;\r\n transition: all 0.3s ease;\r\n cursor: pointer;\r\n }\r\n .spa-btn:hover {\r\n background-color: #D4A72C;\r\n color: #164F4A;\r\n }\r\n .spa-form input[type=\"text\"],\r\n .spa-form input[type=\"email\"],\r\n .spa-form input[type=\"tel\"],\r\n .spa-form input[type=\"date\"],\r\n .spa-form select,\r\n .spa-form textarea {\r\n width: 100%;\r\n background-color: rgba(232, 229, 210, 0.45);\r\n border: 1px solid #B8BE91;\r\n border-radius: 0.75rem;\r\n padding: 0.75rem 1rem;\r\n color: #111111;\r\n font-size: 0.875rem;\r\n margin-top: 0.25rem;\r\n margin-bottom: 1rem;\r\n outline: none;\r\n }\r\n .spa-form input:focus, .spa-form select:focus, .spa-form textarea:focus {\r\n border-color: #D4A72C;\r\n }\r\n .spa-form label {\r\n display: block;\r\n font-size: 0.75rem;\r\n text-transform: uppercase;\r\n letter-spacing: 0.05em;\r\n color: rgba(17, 17, 17, 0.7);\r\n font-weight: 600;\r\n }\r\n .spa-form button[type=\"submit\"] {\r\n width: 100%;\r\n background-color: #164F4A;\r\n color: #ffffff;\r\n font-weight: 700;\r\n font-size: 0.75rem;\r\n text-transform: uppercase;\r\n letter-spacing: 0.2em;\r\n padding: 1rem;\r\n border-radius: 9999px;\r\n box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);\r\n cursor: pointer;\r\n transition: all 0.3s ease;\r\n margin-top: 1rem;\r\n border: none;\r\n }\r\n .spa-form button[type=\"submit\"]:hover {\r\n background-color: #D4A72C;\r\n color: #164F4A;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body class=\"bg-[#E8E5D2] text-[#111111] antialiased selection:bg-[#D4A72C] selection:text-white\">\r\n\r\n <header id=\"navbar\" class=\"fixed top-0 left-0 right-0 z-50 transition-all duration-300 bg-[#E8E5D2]\/95 backdrop-blur-md border-b border-[#D4A72C]\/40 shadow-md\">\r\n <div class=\"max-w-7xl mx-auto px-6 h-32 flex items-center justify-between\">\r\n <a href=\"#\" class=\"flex items-center group py-1\">\r\n <img decoding=\"async\" src=\"https:\/\/adeaspa.co.za\/uplift\/wp-content\/uploads\/2026\/09\/ADEA-SPA-LOGO-500px-x-500px-1.png\" alt=\"Adea Spa Logo\" style=\"height: 100px !important; max-height: 100px !important; width: auto !important;\" class=\"object-contain transition-transform duration-300 group-hover:scale-105\">\r\n <\/a>\r\n\r\n <nav class=\"hidden lg:flex items-center gap-8 text-xs uppercase tracking-[0.25em] font-semibold\">\r\n <a href=\"#about\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A] transition-colors\">About<\/a>\r\n <a href=\"#treatments\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A] transition-colors\">Treatments<\/a>\r\n <a href=\"#packages\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A] transition-colors\">Packages<\/a>\r\n <a href=\"#experience\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A] transition-colors\">Gallery<\/a>\r\n <a href=\"#location\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A] transition-colors\">Location<\/a>\r\n <a href=\"#contact\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A] transition-colors\">Contact<\/a>\r\n <\/nav>\r\n\r\n <div class=\"hidden sm:flex items-center\">\r\n <button type=\"button\" onclick=\"openBookingModal()\" class=\"px-6 py-3 spa-btn font-bold text-xs uppercase tracking-[0.2em] rounded-full shadow-md hover:scale-105\">\r\n Book Now\r\n <\/button>\r\n <\/div>\r\n\r\n <button type=\"button\" onclick=\"toggleMobileMenu()\" class=\"lg:hidden text-[#164F4A] focus:outline-none p-2 text-2xl\">\r\n <i id=\"menu-icon\" class=\"fa-solid fa-bars\"><\/i>\r\n <\/button>\r\n <\/div>\r\n\r\n <div id=\"mobile-menu\" class=\"hidden lg:hidden bg-[#E8E5D2] border-b border-[#D4A72C]\/40 px-6 py-8 flex flex-col gap-6 text-xs uppercase tracking-[0.2em] text-center shadow-2xl\">\r\n <a href=\"#about\" onclick=\"toggleMobileMenu()\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A]\">About<\/a>\r\n <a href=\"#treatments\" onclick=\"toggleMobileMenu()\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A]\">Treatments<\/a>\r\n <a href=\"#packages\" onclick=\"toggleMobileMenu()\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A]\">Packages<\/a>\r\n <a href=\"#experience\" onclick=\"toggleMobileMenu()\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A]\">Gallery<\/a>\r\n <a href=\"#location\" onclick=\"toggleMobileMenu()\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A]\">Location<\/a>\r\n <a href=\"#contact\" onclick=\"toggleMobileMenu()\" style=\"color: #000000 !important;\" class=\"hover:text-[#164F4A]\">Contact<\/a>\r\n <button type=\"button\" onclick=\"openBookingModal(); toggleMobileMenu();\" class=\"w-full py-3.5 spa-btn font-bold rounded-full shadow-md tracking-[0.2em]\">\r\n Book Now\r\n <\/button>\r\n <\/div>\r\n <\/header>\r\n\r\n <section class=\"relative min-h-screen flex items-center justify-center hero-bg pt-40 pb-20 text-center text-white px-6\">\r\n <div class=\"max-w-4xl mx-auto space-y-8 z-10\">\r\n <div class=\"inline-flex items-center gap-2 px-5 py-2 rounded-full bg-[#164F4A]\/90 backdrop-blur-md border border-[#D4A72C]\/50 text-white text-xs uppercase tracking-[0.3em] font-bold shadow-md\">\r\n <i class=\"fa-solid fa-crown text-[10px] text-[#D4A72C]\"><\/i> \u201cAdea\u201d \u2013 A Kind Gift from God\r\n <\/div>\r\n <h1 class=\"font-serif text-4xl sm:text-6xl md:text-7xl lg:text-8xl tracking-tight leading-none font-normal text-white drop-shadow-lg\">\r\n You Are Not Just a Client \u2013 <br><span class=\"italic font-light text-[#D4A72C]\">You Are Royalty<\/span>\r\n <\/h1>\r\n <p class=\"text-base sm:text-xl text-[#E8E5D2] max-w-2xl mx-auto font-light leading-relaxed drop-shadow\">\r\n Tucked away at 23 Cunningham Rd, Glenvista in the South of Johannesburg. Experience divine healing, luxury beauty, and soul-restoring serenity.\r\n <\/p>\r\n <div class=\"flex flex-col sm:flex-row items-center justify-center gap-4 pt-4\">\r\n <button type=\"button\" onclick=\"openBookingModal()\" class=\"w-full sm:w-auto px-8 py-4 spa-btn font-bold text-xs uppercase tracking-[0.2em] rounded-full shadow-xl shadow-[#D4A72C]\/20 hover:scale-105 border border-[#D4A72C]\/60\">\r\n Explore Menu & Book\r\n <\/button>\r\n <a href=\"#treatments\" class=\"w-full sm:w-auto px-8 py-4 spa-btn border border-[#D4A72C]\/50 font-semibold text-xs uppercase tracking-[0.2em] rounded-full shadow-md inline-flex items-center justify-center\">\r\n Our Services\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"about\" class=\"py-24 px-6 bg-white\">\r\n <div class=\"max-w-7xl mx-auto grid grid-cols-1 lg:grid-cols-2 gap-16 items-center\">\r\n <div class=\"space-y-6\">\r\n <span class=\"text-[#164F4A] uppercase tracking-[0.3em] text-xs font-semibold\">Welcome to Adea Spa<\/span>\r\n <h2 class=\"font-serif text-3xl sm:text-5xl text-[#164F4A] leading-tight\">\r\n A Sacred Experience of <br><span class=\"italic text-[#D4A72C]\">Wellness & Soul<\/span>\r\n <\/h2>\r\n <p class=\"text-[#111111]\/80 leading-relaxed font-light text-base sm:text-lg\">\r\n Inspired by the Swahili meaning of our name, \u201cAdea\u201d \u2013 a kind gift from God, we are devoted to offering each guest a divine experience of healing, beauty, and serenity. Situated at our new exclusive sanctuary at 23 Cunningham Rd, Glenvista in the South of Johannesburg, wellness is more than a service \u2013 it's a sacred ritual of restoration.\r\n <\/p>\r\n <div class=\"grid grid-cols-2 gap-6 pt-4\">\r\n <div class=\"border-l-2 border-[#D4A72C] pl-4\">\r\n <span class=\"block font-serif text-3xl text-[#164F4A] font-semibold\">Glenvista<\/span>\r\n <span class=\"text-xs uppercase tracking-wider text-[#111111]\/70\">Exclusive Sanctuary<\/span>\r\n <\/div>\r\n <div class=\"border-l-2 border-[#D4A72C] pl-4\">\r\n <span class=\"block font-serif text-3xl text-[#164F4A] font-semibold\">Royal<\/span>\r\n <span class=\"text-xs uppercase tracking-wider text-[#111111]\/70\">Personalized Care<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1519823551278-64ac92734fb1?auto=format&fit=crop&q=80&w=800\" alt=\"Spa interior botanical\" class=\"rounded-2xl shadow-xl w-full h-80 object-cover transform translate-y-6 border border-[#B8BE91]\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1507652313519-d4e9174996dd?auto=format&fit=crop&q=80&w=800\" alt=\"Massage therapy\" class=\"rounded-2xl shadow-xl w-full h-80 object-cover border border-[#B8BE91]\">\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"treatments\" class=\"py-24 px-6 bg-[#B8BE91]\/15 text-[#111111]\">\r\n <div class=\"max-w-7xl mx-auto\">\r\n <div class=\"text-center max-w-2xl mx-auto space-y-4 mb-16\">\r\n <span class=\"text-[#164F4A] uppercase tracking-[0.3em] text-xs font-semibold\">Curated Menu<\/span>\r\n <h2 class=\"font-serif text-3xl sm:text-5xl text-[#164F4A]\">Restore Balance & Vitality<\/h2>\r\n <p class=\"text-[#111111]\/70 font-light text-sm sm:text-base\">\r\n From deeply relaxing massages and rejuvenating body scrubs to sculpting wood therapy and radiant facials.\r\n <\/p>\r\n <\/div>\r\n\r\n <div class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8\">\r\n \r\n <div class=\"bg-white border border-[#B8BE91]\/50 rounded-2xl p-8 flex flex-col justify-between hover:border-[#D4A72C] transition-all duration-300 group shadow-md\">\r\n <div class=\"space-y-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <span class=\"text-xs uppercase tracking-widest text-[#164F4A] bg-white border border-[#164F4A]\/30 px-3 py-1 rounded-full font-bold\">Signature<\/span>\r\n <span class=\"font-serif text-2xl text-[#164F4A] font-bold\">R429<\/span>\r\n <\/div>\r\n <h3 class=\"font-serif text-2xl text-[#164F4A] group-hover:text-[#D4A72C] transition-colors\">Express & Facial Scrub<\/h3>\r\n <p class=\"text-[#111111]\/70 text-sm font-light leading-relaxed\">\r\n A rejuvenating combination designed to exfoliate dead cells, invigorate circulation, and restore natural radiance.\r\n <\/p>\r\n <\/div>\r\n <button type=\"button\" onclick=\"openBookingModalWithTreatment('Express & Facial Scrub - R429')\" class=\"mt-8 w-full py-3 spa-btn font-bold text-xs uppercase tracking-widest rounded-full shadow-sm\">\r\n Book Treatment\r\n <\/button>\r\n <\/div>\r\n\r\n \r\n <div class=\"bg-white border border-[#B8BE91]\/50 rounded-2xl p-8 flex flex-col justify-between hover:border-[#D4A72C] transition-all duration-300 group shadow-md\">\r\n <div class=\"space-y-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <span class=\"text-xs uppercase tracking-widest text-[#164F4A] bg-white border border-[#164F4A]\/30 px-3 py-1 rounded-full font-bold\">Revitalizing<\/span>\r\n <span class=\"font-serif text-2xl text-[#164F4A] font-bold\">R349<\/span>\r\n <\/div>\r\n <h3 class=\"font-serif text-2xl text-[#164F4A] group-hover:text-[#D4A72C] transition-colors\">Express Facial<\/h3>\r\n <p class=\"text-[#111111]\/70 text-sm font-light leading-relaxed\">\r\n Includes head and neck massage, designed to deeply cleanse, unclog pores, and bring out your natural glow.\r\n <\/p>\r\n <\/div>\r\n <button type=\"button\" onclick=\"openBookingModalWithTreatment('Express Facial - R349')\" class=\"mt-8 w-full py-3 spa-btn font-bold text-xs uppercase tracking-widest rounded-full shadow-sm\">\r\n Book Treatment\r\n <\/button>\r\n <\/div>\r\n\r\n \r\n <div class=\"bg-white border border-[#B8BE91]\/50 rounded-2xl p-8 flex flex-col justify-between hover:border-[#D4A72C] transition-all duration-300 group shadow-md\">\r\n <div class=\"space-y-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <span class=\"text-xs uppercase tracking-widest text-[#164F4A] bg-white border border-[#164F4A]\/30 px-3 py-1 rounded-full font-bold\">Popular<\/span>\r\n <span class=\"font-serif text-2xl text-[#164F4A] font-bold\">R299<\/span>\r\n <\/div>\r\n <h3 class=\"font-serif text-2xl text-[#164F4A] group-hover:text-[#D4A72C] transition-colors\">Hot Stone Massage<\/h3>\r\n <p class=\"text-[#111111]\/70 text-sm font-light leading-relaxed\">\r\n Warm basalt stones melt away tension, soothing muscles and promoting deep, restorative relaxation.\r\n <\/p>\r\n <\/div>\r\n <button type=\"button\" onclick=\"openBookingModalWithTreatment('Hot Stone Massage - R299')\" class=\"mt-8 w-full py-3 spa-btn font-bold text-xs uppercase tracking-widest rounded-full shadow-sm\">\r\n Book Treatment\r\n <\/button>\r\n <\/div>\r\n\r\n \r\n <div class=\"bg-white border border-[#B8BE91]\/50 rounded-2xl p-8 flex flex-col justify-between hover:border-[#D4A72C] transition-all duration-300 group shadow-md\">\r\n <div class=\"space-y-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <span class=\"text-xs uppercase tracking-widest text-[#164F4A] bg-white border border-[#164F4A]\/30 px-3 py-1 rounded-full font-bold\">Essential<\/span>\r\n <span class=\"font-serif text-2xl text-[#164F4A] font-bold\">R299<\/span>\r\n <\/div>\r\n <h3 class=\"font-serif text-2xl text-[#164F4A] group-hover:text-[#D4A72C] transition-colors\">Back, Neck & Shoulder<\/h3>\r\n <p class=\"text-[#111111]\/70 text-sm font-light leading-relaxed\">\r\n Targeted therapeutic relief focusing on high-stress zones to release knots and improve posture.\r\n <\/p>\r\n <\/div>\r\n <button type=\"button\" onclick=\"openBookingModalWithTreatment('Back, Neck & Shoulder - R299')\" class=\"mt-8 w-full py-3 spa-btn font-bold text-xs uppercase tracking-widest rounded-full shadow-sm\">\r\n Book Treatment\r\n <\/button>\r\n <\/div>\r\n\r\n \r\n <div class=\"bg-white border border-[#B8BE91]\/50 rounded-2xl p-8 flex flex-col justify-between hover:border-[#D4A72C] transition-all duration-300 group shadow-md\">\r\n <div class=\"space-y-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <span class=\"text-xs uppercase tracking-widest text-[#164F4A] bg-white border border-[#164F4A]\/30 px-3 py-1 rounded-full font-bold\">Ultimate Luxury<\/span>\r\n <span class=\"font-serif text-2xl text-[#164F4A] font-bold\">R599<\/span>\r\n <\/div>\r\n <h3 class=\"font-serif text-2xl text-[#164F4A] group-hover:text-[#D4A72C] transition-colors\">Couple's Massage<\/h3>\r\n <p class=\"text-[#111111]\/70 text-sm font-light leading-relaxed\">\r\n Share a restorative side-by-side relaxation journey designed to unwind the body and harmonize shared energy.\r\n <\/p>\r\n <\/div>\r\n <button type=\"button\" onclick=\"openBookingModalWithTreatment('Couple\\'s Massage - R599')\" class=\"mt-8 w-full py-3 spa-btn font-bold text-xs uppercase tracking-widest rounded-full shadow-sm\">\r\n Book Treatment\r\n <\/button>\r\n <\/div>\r\n\r\n \r\n <div class=\"bg-white border border-[#B8BE91]\/50 rounded-2xl p-8 flex flex-col justify-between hover:border-[#D4A72C] transition-all duration-300 group shadow-md\">\r\n <div class=\"space-y-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <span class=\"text-xs uppercase tracking-widest text-[#164F4A] bg-white border border-[#164F4A]\/30 px-3 py-1 rounded-full font-bold\">Classic<\/span>\r\n <span class=\"font-serif text-2xl text-[#164F4A] font-bold\">R299<\/span>\r\n <\/div>\r\n <h3 class=\"font-serif text-2xl text-[#164F4A] group-hover:text-[#D4A72C] transition-colors\">Swedish Massage<\/h3>\r\n <p class=\"text-[#111111]\/70 text-sm font-light leading-relaxed\">\r\n A classic full-body massage using long, soothing strokes to improve circulation and dissolve everyday fatigue.\r\n <\/p>\r\n <\/div>\r\n <button type=\"button\" onclick=\"openBookingModalWithTreatment('Swedish Massage - R299')\" class=\"mt-8 w-full py-3 spa-btn font-bold text-xs uppercase tracking-widest rounded-full shadow-sm\">\r\n Book Treatment\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"packages\" class=\"py-24 px-6 bg-[#164F4A] text-white\">\r\n <div class=\"max-w-7xl mx-auto\">\r\n <div class=\"text-center max-w-2xl mx-auto space-y-4 mb-16\">\r\n <span class=\"text-[#D4A72C] uppercase tracking-[0.3em] text-xs font-semibold\">Special Offers<\/span>\r\n <h2 class=\"font-serif text-3xl sm:text-5xl text-white\">Royalty Spa Packages<\/h2>\r\n <p class=\"text-[#E8E5D2]\/80 font-light text-sm sm:text-base\">\r\n Immerse yourself in our all-inclusive spa journeys crafted for ultimate pampering and rejuvenation.\r\n <\/p>\r\n <\/div>\r\n\r\n <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-8\">\r\n \r\n <div class=\"bg-white\/10 backdrop-blur-md border border-[#D4A72C]\/30 rounded-3xl p-8 sm:p-12 flex flex-col justify-between space-y-6 shadow-xl\">\r\n <div class=\"space-y-4\">\r\n <span class=\"px-4 py-1.5 rounded-full bg-[#D4A72C] text-[#164F4A] text-xs uppercase font-bold tracking-widest\">Most Popular<\/span>\r\n <h3 class=\"font-serif text-3xl text-white\">The South JHB Escape<\/h3>\r\n <p class=\"text-[#E8E5D2]\/90 text-sm font-light leading-relaxed\">\r\n Includes a full body Swedish massage, express facial, foot scrub, and complimentary herbal refreshment in our tranquil garden lounge.\r\n <\/p>\r\n <ul class=\"space-y-2 text-xs uppercase tracking-wider text-[#D4A72C] pt-2\">\r\n <li><i class=\"fa-solid fa-check mr-2\"><\/i> 90 Minutes of Pure Bliss<\/li>\r\n <li><i class=\"fa-solid fa-check mr-2\"><\/i> Aromatherapy Oils Included<\/li>\r\n <li><i class=\"fa-solid fa-check mr-2\"><\/i> Private Sanctuary Lounge Access<\/li>\r\n <\/ul>\r\n <\/div>\r\n <div class=\"flex items-center justify-between pt-6 border-t border-white\/10\">\r\n <span class=\"font-serif text-3xl text-[#D4A72C]\">R850<\/span>\r\n <button type=\"button\" onclick=\"openBookingModalWithTreatment('The South JHB Escape - R850')\" class=\"px-6 py-3 bg-[#D4A72C] hover:bg-white text-[#164F4A] font-bold text-xs uppercase tracking-widest rounded-full transition-all cursor-pointer\">\r\n Book Package\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"bg-white\/10 backdrop-blur-md border border-[#D4A72C]\/30 rounded-3xl p-8 sm:p-12 flex flex-col justify-between space-y-6 shadow-xl\">\r\n <div class=\"space-y-4\">\r\n <span class=\"px-4 py-1.5 rounded-full bg-white text-[#164F4A] text-xs uppercase font-bold tracking-widest\">Couples Retreat<\/span>\r\n <h3 class=\"font-serif text-3xl text-white\">Royal Duo Serenity<\/h3>\r\n <p class=\"text-[#E8E5D2]\/90 text-sm font-light leading-relaxed\">\r\n Side-by-side hot stone massages, revitalizing express facials, and sparkling refreshments to celebrate connection and peace.\r\n <\/p>\r\n <ul class=\"space-y-2 text-xs uppercase tracking-wider text-[#D4A72C] pt-2\">\r\n <li><i class=\"fa-solid fa-check mr-2\"><\/i> 120 Minutes Combined Journey<\/li>\r\n <li><i class=\"fa-solid fa-check mr-2\"><\/i> Private Couples Suite<\/li>\r\n <li><i class=\"fa-solid fa-check mr-2\"><\/i> Complimentary Treats<\/li>\r\n <\/ul>\r\n <\/div>\r\n <div class=\"flex items-center justify-between pt-6 border-t border-white\/10\">\r\n <span class=\"font-serif text-3xl text-[#D4A72C]\">R1,199<\/span>\r\n <button type=\"button\" onclick=\"openBookingModalWithTreatment('Royal Duo Serenity - R1,199')\" class=\"px-6 py-3 bg-[#D4A72C] hover:bg-white text-[#164F4A] font-bold text-xs uppercase tracking-widest rounded-full transition-all cursor-pointer\">\r\n Book Package\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"experience\" class=\"py-24 px-6 bg-white\">\r\n <div class=\"max-w-7xl mx-auto\">\r\n <div class=\"text-center max-w-2xl mx-auto space-y-4 mb-16\">\r\n <span class=\"text-[#164F4A] uppercase tracking-[0.3em] text-xs font-semibold\">Visual Sanctuary<\/span>\r\n <h2 class=\"font-serif text-3xl sm:text-5xl text-[#164F4A]\">Glimpse Into Adea Spa<\/h2>\r\n <p class=\"text-[#111111]\/70 font-light text-sm sm:text-base\">\r\n Designed for tranquility, elegance, and deep soul restoration.\r\n <\/p>\r\n <\/div>\r\n\r\n <div class=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6\">\r\n <div class=\"overflow-hidden rounded-2xl shadow-md group\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1540555700478-4be289fbecef?auto=format&fit=crop&q=80&w=800\" alt=\"Spa ambiance\" class=\"w-full h-72 object-cover group-hover:scale-110 transition-transform duration-500\">\r\n <\/div>\r\n <div class=\"overflow-hidden rounded-2xl shadow-md group\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1519823551278-64ac92734fb1?auto=format&fit=crop&q=80&w=800\" alt=\"Botanical spa room\" class=\"w-full h-72 object-cover group-hover:scale-110 transition-transform duration-500\">\r\n <\/div>\r\n <div class=\"overflow-hidden rounded-2xl shadow-md group\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1507652313519-d4e9174996dd?auto=format&fit=crop&q=80&w=800\" alt=\"Massage therapy oils\" class=\"w-full h-72 object-cover group-hover:scale-110 transition-transform duration-500\">\r\n <\/div>\r\n <div class=\"overflow-hidden rounded-2xl shadow-md group\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1570172619644-dfd03ed5d881?auto=format&fit=crop&q=80&w=800\" alt=\"Relaxation lounge\" class=\"w-full h-72 object-cover group-hover:scale-110 transition-transform duration-500\">\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"location\" class=\"py-24 px-6 bg-[#E8E5D2] border-t border-[#B8BE91]\/40\">\r\n <div class=\"max-w-7xl mx-auto grid grid-cols-1 lg:grid-cols-2 gap-16 items-start\">\r\n <div class=\"space-y-6\">\r\n <span class=\"text-[#164F4A] uppercase tracking-[0.3em] text-xs font-semibold\">Find Us & Connect<\/span>\r\n <h2 class=\"font-serif text-3xl sm:text-5xl text-[#164F4A]\">Exclusive Sanctuary<\/h2>\r\n <p class=\"text-[#111111]\/80 leading-relaxed font-light text-base\">\r\n Conveniently located at our new premises at 23 Cunningham Rd, Glenvista in the tranquil South of Johannesburg, Gauteng. Visit us for a peaceful retreat away from the city hustle.\r\n <\/p>\r\n <div class=\"space-y-4 text-sm text-[#111111]\">\r\n <p class=\"flex items-center gap-3\"><i class=\"fa-solid fa-location-dot text-[#164F4A] text-lg\"><\/i> 23 Cunningham Rd, Glenvista, Johannesburg South, 2190<\/p>\r\n <p class=\"flex items-center gap-3\"><i class=\"fa-solid fa-phone text-[#164F4A] text-lg\"><\/i> +27 65 877 3285<\/p>\r\n <p class=\"flex items-center gap-3\"><i class=\"fa-solid fa-envelope text-[#164F4A] text-lg\"><\/i> bookings@adeaspa.co.za<\/p>\r\n <\/div>\r\n <div class=\"bg-white\/80 border border-[#B8BE91] rounded-3xl p-8 shadow-sm space-y-4 mt-8\">\r\n <h3 class=\"font-serif text-xl text-[#164F4A]\">Operating Hours<\/h3>\r\n <div class=\"space-y-2 text-sm text-[#111111]\/80\">\r\n <div class=\"flex justify-between border-b border-[#111111]\/10 py-2\">\r\n <span class=\"font-medium\">Monday \u2013 Sunday<\/span> \r\n <span class=\"font-semibold text-[#111111]\">09:00 \u2013 17:00<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"bg-white border border-[#B8BE91] rounded-3xl p-8 sm:p-12 shadow-lg space-y-6\">\r\n <div class=\"space-y-2\">\r\n <span class=\"text-[#164F4A] uppercase tracking-[0.2em] text-xs font-bold\">Direct Inquiry<\/span>\r\n <h3 class=\"font-serif text-3xl text-[#164F4A]\">Send Us a Message<\/h3>\r\n <p class=\"text-xs text-[#111111]\/70\">Submissions route directly to bookings@adeaspa.co.za<\/p>\r\n <\/div>\r\n \r\n <form action=\"\" method=\"POST\" class=\"spa-form\">\r\n <input type=\"hidden\" name=\"adea_form_submit\" value=\"1\">\r\n <div>\r\n <label>Your Name<\/label>\r\n <input type=\"text\" name=\"name\" required placeholder=\"Full Name\">\r\n <\/div>\r\n <div>\r\n <label>Your Email<\/label>\r\n <input type=\"email\" name=\"email\" required placeholder=\"email@domain.com\">\r\n <\/div>\r\n <div>\r\n <label>Phone Number<\/label>\r\n <input type=\"tel\" name=\"phone\" required placeholder=\"+27 ...\">\r\n <\/div>\r\n <div>\r\n <label>Select Treatment \/ Package<\/label>\r\n <select name=\"treatment\">\r\n <option value=\"General Inquiry\">General Inquiry<\/option>\r\n <option value=\"Express & Facial Scrub - R429\">Express & Facial Scrub - R429<\/option>\r\n <option value=\"Express Facial - R349\">Express Facial - R349<\/option>\r\n <option value=\"Hot Stone Massage - R299\">Hot Stone Massage - R299<\/option>\r\n <option value=\"Back, Neck & Shoulder - R299\">Back, Neck & Shoulder - R299<\/option>\r\n <option value=\"Couple's Massage - R599\">Couple's Massage - R599<\/option>\r\n <option value=\"Swedish Massage - R299\">Swedish Massage - R299<\/option>\r\n <option value=\"The South JHB Escape - R850\">The South JHB Escape - R850<\/option>\r\n <option value=\"Royal Duo Serenity - R1,199\">Royal Duo Serenity - R1,199<\/option>\r\n <\/select>\r\n <\/div>\r\n <div>\r\n <label>Your Message \/ Preferred Date<\/label>\r\n <textarea name=\"message\" rows=\"4\" placeholder=\"Let us know your preferred date and time...\"><\/textarea>\r\n <\/div>\r\n <button type=\"submit\">Send Message<\/button>\r\n <\/form>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <footer id=\"contact\" class=\"bg-[#164F4A] text-[#E8E5D2] py-16 px-6 border-t border-[#D4A72C]\/40 text-xs tracking-wider\">\r\n <div class=\"max-w-7xl mx-auto grid grid-cols-1 md:grid-cols-3 gap-12 mb-12\">\r\n <div class=\"space-y-4\">\r\n <img decoding=\"async\" src=\"https:\/\/adeaspa.co.za\/uplift\/wp-content\/uploads\/2026\/09\/ADEA-SPA-LOGO-500px-x-500px-1.png\" alt=\"Adea Spa Logo\" style=\"height: 70px !important; width: auto !important;\" class=\"object-contain filter brightness-200\">\r\n <p class=\"text-[#E8E5D2]\/80 font-light\">A sacred sanctuary of wellness, healing, and luxury situated at 23 Cunningham Rd, Glenvista.<\/p>\r\n <\/div>\r\n <div class=\"space-y-3\">\r\n <h4 class=\"font-serif text-[#D4A72C] text-sm uppercase tracking-widest font-semibold\">Quick Links<\/h4>\r\n <ul class=\"space-y-2 uppercase text-[#E8E5D2]\">\r\n <li><a href=\"#about\" class=\"hover:text-[#D4A72C] transition-colors\">About Us<\/a><\/li>\r\n <li><a href=\"#treatments\" class=\"hover:text-[#D4A72C] transition-colors\">Curated Treatments<\/a><\/li>\r\n <li><a href=\"#packages\" class=\"hover:text-[#D4A72C] transition-colors\">Spa Packages<\/a><\/li>\r\n <li><a href=\"#location\" class=\"hover:text-[#D4A72C] transition-colors\">Location & Hours<\/a><\/li>\r\n <\/ul>\r\n <\/div>\r\n <div class=\"space-y-3\">\r\n <h4 class=\"font-serif text-[#D4A72C] text-sm uppercase tracking-widest font-semibold\">Official Channels<\/h4>\r\n <ul class=\"space-y-2 uppercase text-[#E8E5D2]\">\r\n <li><a href=\"https:\/\/adeaspa.co.za\/\" target=\"_blank\" class=\"hover:text-[#D4A72C] transition-colors\">Official Website<\/a><\/li>\r\n <li><a href=\"#\" onclick=\"openBookingModal(); return false;\" class=\"hover:text-[#D4A72C] transition-colors\">Online Booking<\/a><\/li>\r\n <\/ul>\r\n <\/div>\r\n <\/div>\r\n <div class=\"max-w-7xl mx-auto pt-8 border-t border-[#D4A72C]\/20 text-center text-[#E8E5D2]\/60\">\r\n © 2026 Adea Spa, South of Johannesburg. All rights reserved.\r\n <\/div>\r\n <\/footer>\r\n\r\n \r\n <div id=\"booking-modal\" class=\"fixed inset-0 z-50 bg-black\/60 backdrop-blur-sm hidden items-center justify-center p-6\">\r\n <div class=\"bg-white border border-[#D4A72C]\/30 w-full max-w-lg rounded-3xl p-8 relative shadow-2xl text-[#111111] max-h-[90vh] overflow-y-auto\">\r\n <button type=\"button\" onclick=\"closeBookingModal()\" class=\"absolute top-6 right-6 text-[#111111] hover:text-[#164F4A] text-lg cursor-pointer\">\r\n <i class=\"fa-solid fa-xmark\"><\/i>\r\n <\/button>\r\n <h3 class=\"font-serif text-3xl mb-1 text-[#164F4A]\">Book Your Treatment<\/h3>\r\n <p class=\"text-xs text-[#111111]\/70 mb-6 uppercase tracking-wider\">Submissions route directly to bookings@adeaspa.co.za<\/p>\r\n \r\n <form action=\"\" method=\"POST\" class=\"spa-form modal-form\">\r\n <input type=\"hidden\" name=\"adea_form_submit\" value=\"1\">\r\n <div>\r\n <label>Your Name<\/label>\r\n <input type=\"text\" name=\"name\" required placeholder=\"Full Name\">\r\n <\/div>\r\n <div>\r\n <label>Your Email<\/label>\r\n <input type=\"email\" name=\"email\" required placeholder=\"email@domain.com\">\r\n <\/div>\r\n <div>\r\n <label>Phone Number<\/label>\r\n <input type=\"tel\" name=\"phone\" required placeholder=\"+27 ...\">\r\n <\/div>\r\n <div>\r\n <label>Select Treatment \/ Package<\/label>\r\n <select name=\"treatment\" class=\"modal-treatment-select\">\r\n <option value=\"General Inquiry\">General Inquiry<\/option>\r\n <option value=\"Express & Facial Scrub - R429\">Express & Facial Scrub - R429<\/option>\r\n <option value=\"Express Facial - R349\">Express Facial - R349<\/option>\r\n <option value=\"Hot Stone Massage - R299\">Hot Stone Massage - R299<\/option>\r\n <option value=\"Back, Neck & Shoulder - R299\">Back, Neck & Shoulder - R299<\/option>\r\n <option value=\"Couple's Massage - R599\">Couple's Massage - R599<\/option>\r\n <option value=\"Swedish Massage - R299\">Swedish Massage - R299<\/option>\r\n <option value=\"The South JHB Escape - R850\">The South JHB Escape - R850<\/option>\r\n <option value=\"Royal Duo Serenity - R1,199\">Royal Duo Serenity - R1,199<\/option>\r\n <\/select>\r\n <\/div>\r\n <div>\r\n <label>Your Message \/ Preferred Date<\/label>\r\n <textarea name=\"message\" rows=\"4\" placeholder=\"Let us know your preferred date and time...\"><\/textarea>\r\n <\/div>\r\n <button type=\"submit\">Submit Booking Request<\/button>\r\n <\/form>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div id=\"whatsapp-bot-container\" class=\"fixed bottom-6 right-6 z-50 font-sans\">\r\n \r\n <button id=\"whatsapp-bot-toggle\" onclick=\"toggleWhatsappBot()\" class=\"w-16 h-16 bg-gradient-to-tr from-[#128C7E] to-[#25D366] hover:scale-105 text-white rounded-full shadow-[0_10px_25px_rgba(37,211,102,0.4)] flex items-center justify-center text-3xl transition-all duration-300 border-2 border-white group relative\">\r\n <i id=\"whatsapp-bot-icon\" class=\"fa-brands fa-whatsapp transition-transform group-hover:rotate-12\"><\/i>\r\n <span class=\"absolute -top-1 -right-1 w-4 h-4 bg-[#D4A72C] border-2 border-white rounded-full animate-pulse\"><\/span>\r\n <\/button>\r\n\r\n \r\n <div id=\"whatsapp-bot-window\" class=\"hidden absolute bottom-20 right-0 w-80 sm:w-96 bg-white border border-[#D4A72C]\/30 rounded-3xl shadow-[0_20px_50px_rgba(0,0,0,0.2)] overflow-hidden flex flex-col transition-all duration-300 origin-bottom-right\">\r\n \r\n \r\n <div class=\"bg-[#164F4A] text-white p-4 flex items-center justify-between border-b border-[#D4A72C]\/30 shadow-md\">\r\n <div class=\"flex items-center space-x-3\">\r\n <div class=\"relative\">\r\n <div class=\"w-10 h-10 rounded-full bg-[#D4A72C] text-[#164F4A] flex items-center justify-center font-bold text-xl shadow-md border border-white\/20\">\r\n <i class=\"fa-brands fa-whatsapp\"><\/i>\r\n <\/div>\r\n <span class=\"absolute bottom-0 right-0 w-3 h-3 bg-[#25D366] border-2 border-[#164F4A] rounded-full\"><\/span>\r\n <\/div>\r\n <div>\r\n <div class=\"flex items-center gap-1.5\">\r\n <h4 class=\"font-serif font-bold text-sm tracking-wide text-white\">Adea Spa Concierge<\/h4>\r\n <i class=\"fa-solid fa-crown text-[10px] text-[#D4A72C]\"><\/i>\r\n <\/div>\r\n <span class=\"text-[10px] text-[#E8E5D2]\/80\">Online \u2022 Ready to assist you<\/span>\r\n <\/div>\r\n <\/div>\r\n <button onclick=\"toggleWhatsappBot()\" class=\"text-[#E8E5D2] hover:text-[#D4A72C] text-lg p-1 transition-colors\"><i class=\"fa-solid fa-xmark\"><\/i><\/button>\r\n <\/div>\r\n\r\n \r\n <div id=\"whatsapp-chat-messages\" class=\"p-4 h-80 overflow-y-auto space-y-3 bg-[#FAF8F5] text-xs\">\r\n \r\n <div class=\"flex items-start space-x-2\">\r\n <div class=\"bg-white text-[#111111] p-3.5 rounded-2xl rounded-tl-none max-w-[88%] leading-relaxed shadow-sm border border-[#B8BE91]\/30 relative\">\r\n <p class=\"font-serif font-semibold text-[#164F4A] mb-1 flex items-center gap-1\">\r\n <i class=\"fa-solid fa-crown text-[10px] text-[#D4A72C]\"><\/i> Adea Royalty Desk\r\n <\/p>\r\n Welcome to Adea Spa at 23 Cunningham Rd, Glenvista! \ud83d\udc51 How may we curate your relaxation journey today?\r\n <span class=\"block text-[9px] text-gray-400 text-right mt-1.5\">Just now<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"px-3 py-2.5 bg-[#E8E5D2]\/50 border-t border-[#B8BE91]\/30 flex gap-1.5 overflow-x-auto text-[10px] scrollbar-none\">\r\n <button onclick=\"sendWhatsappPrompt('Prices')\" class=\"bg-white hover:bg-[#164F4A] hover:text-white px-3 py-1 rounded-full whitespace-nowrap transition-all font-medium border border-[#B8BE91]\/50 shadow-xs\">\ud83d\udcb0 Prices<\/button>\r\n <button onclick=\"sendWhatsappPrompt('Location')\" class=\"bg-white hover:bg-[#164F4A] hover:text-white px-3 py-1 rounded-full whitespace-nowrap transition-all font-medium border border-[#B8BE91]\/50 shadow-xs\">\ud83d\udccd Location<\/button>\r\n <button onclick=\"sendWhatsappPrompt('Book')\" class=\"bg-white hover:bg-[#164F4A] hover:text-white px-3 py-1 rounded-full whitespace-nowrap transition-all font-medium border border-[#B8BE91]\/50 shadow-xs\">\ud83d\udcc5 How to Book<\/button>\r\n <\/div>\r\n\r\n \r\n <div class=\"p-3 bg-white border-t border-gray-100 flex items-center gap-2\">\r\n <input type=\"text\" id=\"whatsapp-chat-input\" onkeypress=\"handleWhatsappKeypress(event)\" placeholder=\"Type your message...\" class=\"flex-1 bg-[#FAF8F5] border border-[#B8BE91]\/40 rounded-full px-4 py-2 text-xs outline-none focus:border-[#164F4A] text-[#111111]\">\r\n <button onclick=\"sendWhatsappUserMessage()\" class=\"bg-[#164F4A] hover:bg-[#D4A72C] text-white w-9 h-9 rounded-full flex items-center justify-center transition-colors shadow-sm\">\r\n <i class=\"fa-solid fa-paper-plane text-xs\"><\/i>\r\n <\/button>\r\n <\/div>\r\n\r\n \r\n <div class=\"bg-[#164F4A]\/5 px-4 py-2.5 border-t border-[#B8BE91]\/20 text-center\">\r\n <a href=\"https:\/\/wa.me\/27658773285?text=Hello%20Adea%20Spa,%20I%20would%20like%20to%20inquire%20about...\" target=\"_blank\" class=\"text-[11px] text-[#164F4A] font-bold hover:underline flex items-center justify-center gap-1.5\">\r\n <i class=\"fa-brands fa-whatsapp text-sm text-[#25D366]\"><\/i> Open direct chat in WhatsApp App\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <script>\r\n \/\/ Toggle mobile navigation menu visibility\r\n function toggleMobileMenu() {\r\n const menu = document.getElementById('mobile-menu');\r\n const icon = document.getElementById('menu-icon');\r\n menu.classList.toggle('hidden');\r\n if (menu.classList.contains('hidden')) {\r\n icon.classList.remove('fa-xmark');\r\n icon.classList.add('fa-bars');\r\n } else {\r\n icon.classList.remove('fa-bars');\r\n icon.classList.add('fa-xmark');\r\n }\r\n }\r\n\r\n \/\/ Open booking modal\r\n function openBookingModal() {\r\n const modal = document.getElementById('booking-modal');\r\n modal.classList.remove('hidden');\r\n modal.classList.add('flex');\r\n }\r\n\r\n \/\/ Open booking modal and pre-select treatment dropdown\r\n function openBookingModalWithTreatment(treatmentName) {\r\n openBookingModal();\r\n setTimeout(() => {\r\n const selectElement = document.querySelector('.modal-treatment-select');\r\n if (selectElement) {\r\n for (let i = 0; i < selectElement.options.length; i++) {\r\n if (selectElement.options[i].value.includes(treatmentName) || selectElement.options[i].text.includes(treatmentName)) {\r\n selectElement.selectedIndex = i;\r\n break;\r\n }\r\n }\r\n }\r\n }, 100);\r\n }\r\n\r\n \/\/ Close booking modal\r\n function closeBookingModal() {\r\n const modal = document.getElementById('booking-modal');\r\n modal.classList.remove('flex');\r\n modal.classList.add('hidden');\r\n }\r\n\r\n \/\/ Close modal when clicking outside content backdrop\r\n window.onclick = function(event) {\r\n const modal = document.getElementById('booking-modal');\r\n if (event.target === modal) {\r\n closeBookingModal();\r\n }\r\n }\r\n\r\n \/\/ WhatsApp Bot Script Logic\r\n function toggleWhatsappBot() {\r\n const win = document.getElementById('whatsapp-bot-window');\r\n const icon = document.getElementById('whatsapp-bot-icon');\r\n win.classList.toggle('hidden');\r\n if(win.classList.contains('hidden')) {\r\n icon.classList.remove('fa-xmark');\r\n icon.classList.add('fa-brands', 'fa-whatsapp');\r\n } else {\r\n icon.classList.remove('fa-brands', 'fa-whatsapp');\r\n icon.classList.add('fa-solid', 'fa-xmark');\r\n }\r\n }\r\n\r\n function sendWhatsappPrompt(text) {\r\n document.getElementById('whatsapp-chat-input').value = text;\r\n sendWhatsappUserMessage();\r\n }\r\n\r\n function handleWhatsappKeypress(e) {\r\n if (e.key === 'Enter') {\r\n sendWhatsappUserMessage();\r\n }\r\n }\r\n\r\n function sendWhatsappUserMessage() {\r\n const input = document.getElementById('whatsapp-chat-input');\r\n const message = input.value.trim();\r\n if(!message) return;\r\n\r\n appendWhatsappMessage(message, 'user');\r\n input.value = '';\r\n\r\n \/\/ Simulate bot thinking delay\r\n setTimeout(() => {\r\n generateWhatsappBotResponse(message);\r\n }, 600);\r\n }\r\n\r\n function appendWhatsappMessage(text, sender) {\r\n const container = document.getElementById('whatsapp-chat-messages');\r\n const div = document.createElement('div');\r\n div.className = sender === 'user' ? 'flex justify-end' : 'flex justify-start';\r\n \r\n const timeString = new Date().toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });\r\n\r\n if(sender === 'user') {\r\n div.innerHTML = `<div class=\"bg-[#164F4A] text-white p-3.5 rounded-2xl rounded-tr-none max-w-[88%] leading-relaxed shadow-sm relative\">\r\n ${escapeHtml(text)}\r\n <span class=\"block text-[9px] text-[#E8E5D2]\/70 text-right mt-1.5\">${timeString} <i class=\"fa-solid fa-check-double text-[#D4A72C]\"><\/i><\/span>\r\n <\/div>`;\r\n } else {\r\n div.innerHTML = `<div class=\"bg-white text-[#111111] p-3.5 rounded-2xl rounded-tl-none max-w-[88%] leading-relaxed shadow-sm border border-[#B8BE91]\/30 relative\">\r\n ${text}\r\n <span class=\"block text-[9px] text-gray-400 text-right mt-1.5\">${timeString}<\/span>\r\n <\/div>`;\r\n }\r\n container.appendChild(div);\r\n container.scrollTop = container.scrollHeight;\r\n }\r\n\r\n function generateWhatsappBotResponse(query) {\r\n const q = query.toLowerCase();\r\n let response = \"\";\r\n\r\n if (q.includes('human') || q.includes('person') || q.includes('agent') || q.includes('talk') || q.includes('speak') || q.includes('someone')) {\r\n response = `You can easily connect directly with our human team via WhatsApp or phone:<br><br>\r\n \ud83d\udcf1 <strong>WhatsApp\/Call:<\/strong> <a href=\"https:\/\/wa.me\/27658773285\" target=\"_blank\" class=\"text-[#164F4A] underline font-semibold\">+27 65 877 3285<\/a><br>\r\n \ud83d\udce7 <strong>Email:<\/strong> bookings@adeaspa.co.za`;\r\n } else if (q.includes('price') || q.includes('cost') || q.includes('menu') || q.includes('rate') || q.includes('r')) {\r\n response = `Our standalone treatments range from R299 to R599, and packages range from R850 to R1,199:<br><br>\r\n \u2022 Swedish \/ Hot Stone \/ Back & Neck: R299<br>\r\n \u2022 Express Facial: R349<br>\r\n \u2022 Couple's Massage: R599<br>\r\n \u2022 The South JHB Escape: R850<br><br>Check out our <strong>Treatments<\/strong> section above for full details!`;\r\n } else if (q.includes('location') || q.includes('where') || q.includes('address') || q.includes('find') || q.includes('directions')) {\r\n response = `Our new exclusive sanctuary is located at:<br>\ud83d\udccd <strong>23 Cunningham Rd, Glenvista, Johannesburg South, 2190<\/strong>. We look forward to welcoming you!`;\r\n } else if (q.includes('book') || q.includes('appointment') || q.includes('reserve')) {\r\n response = `You can book instantly by clicking the <strong>\"Book Now\"<\/strong> button at the top of the page, or by clicking \"Book Treatment\" under any service on our menu!`;\r\n } else if (q.includes('hours') || q.includes('time') || q.includes('open') || q.includes('schedule')) {\r\n response = `Adea Spa is open <strong>Monday through Sunday from 09:00 to 17:00<\/strong>.`;\r\n } else {\r\n response = `Thank you for your message! For personalized assistance or custom bookings, feel free to chat with us directly on WhatsApp: <br><br><a href=\"https:\/\/wa.me\/27658773285?text=Hello%20Adea%20Spa,%20I%20have%20an%20inquiry%20about...\" target=\"_blank\" class=\"inline-block bg-[#25D366] text-white font-bold px-4 py-2 rounded-full mt-1 text-center shadow\"><i class=\"fa-brands fa-whatsapp\"><\/i> Chat on WhatsApp<\/a>`;\r\n }\r\n\r\n appendWhatsappMessage(response, 'bot');\r\n }\r\n\r\n function escapeHtml(text) {\r\n const map = { '&': '&', '<': '<', '>': '>', '\"': '"', \"'\": ''' };\r\n return text.replace(\/[&<>\"']\/g, function(m) { return map[m]; });\r\n }\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Adea Spa | Luxury Sanctuary, South of Johannesburg About Treatments Packages Gallery Location Contact Book Now About Treatments Packages Gallery Location Contact Book Now \u201cAdea\u201d \u2013 A Kind Gift from God You Are Not Just a Client \u2013 You Are Royalty Tucked away at 23 Cunningham Rd, Glenvista in the South of Johannesburg. Experience divine […]<\/p>\n","protected":false},"author":1,"featured_media":89,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-84","page","type-page","status-publish","has-post-thumbnail","hentry"],"_links":{"self":[{"href":"https:\/\/adeaspa.co.za\/index.php?rest_route=\/wp\/v2\/pages\/84","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/adeaspa.co.za\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/adeaspa.co.za\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/adeaspa.co.za\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/adeaspa.co.za\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=84"}],"version-history":[{"count":356,"href":"https:\/\/adeaspa.co.za\/index.php?rest_route=\/wp\/v2\/pages\/84\/revisions"}],"predecessor-version":[{"id":543,"href":"https:\/\/adeaspa.co.za\/index.php?rest_route=\/wp\/v2\/pages\/84\/revisions\/543"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/adeaspa.co.za\/index.php?rest_route=\/wp\/v2\/media\/89"}],"wp:attachment":[{"href":"https:\/\/adeaspa.co.za\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=84"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}