{"id":2526,"date":"2025-10-31T16:09:35","date_gmt":"2025-10-31T16:09:35","guid":{"rendered":"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/?page_id=2526"},"modified":"2025-12-13T01:32:57","modified_gmt":"2025-12-13T01:32:57","slug":"accommodations","status":"publish","type":"page","link":"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/accommodations\/","title":{"rendered":"Accommodations"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t
\n\t\t
\n\t\t
\n\t\t\t\t
\n\t\t\t\t\t

Accommodations<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Sanctuary@Puerto Viejo offers an all-inclusive retreat to renew body, mind, and spirit amid vibrant tropical gardens \u2014 the perfect haven to rest and recharge.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t

\n\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Our 10 private rooms combine tropical charm with intimate, nest-like comfort. Nidos 1\u20138 are cozy, air-conditioned spaces with cotton bedding and natural finishes, sharing two conveniently located bathrooms. Nidos 9 & 10 offer couples or privacy seekers a more secluded experience, with private entrances, covered patios, and a shared bathroom with just one other room.<\/p>

Whether you choose a Nido or a private room, your stay includes daily yoga, dance, breath work, creative workshops, excursions, nourishing meals, ample free time and access to our spa, pool, and gardens\u2014everything you need for a truly restorative escape.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t

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

Gallery<\/h2>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t
\n\t\t\t\t
\n\t\t\t\t\t\n\n\n \n \n Slider con Zoom y Botones SVG<\/title>\n <style>\n .carousel-container {\n width: 100%;\n max-width: 1920px;\n overflow: hidden;\n position: relative;\n }\n\n .carousel-track {\n display: flex;\n transition: transform 0.6s ease-in-out;\n padding: 20px 0;\n margin: 0 -25%;\n width: 150%;\n will-change: transform;\n backface-visibility: hidden;\n }\n\n .carousel-slide {\n flex: 0 0 33.333%;\n padding: 0 10px;\n transition: transform 0.6s ease, opacity 0.6s ease;\n box-sizing: border-box;\n opacity: 0.7;\n transform: scale(0.9);\n }\n\n .carousel-slide img {\n width: 100%;\n height: 500px;\n object-fit: cover;\n border-radius: 3rem;\n transition: all 0.6s ease;\n }\n\n \/* Efecto de zoom y enfoque en el slide activo *\/\n .carousel-slide.active {\n opacity: 1;\n transform: scale(1.1);\n z-index: 2;\n }\n\n \/* Botones de navegaci\u00f3n con SVG *\/\n .carousel-btn {\n padding: 0px;\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n background-color: rgba(255, 255, 255, 0.9);\n border: none;\n width: 5em;\n height: 5em;\n border-radius: 50%;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n box-shadow: 0 4px 10px rgba(0,0,0,0.15);\n transition: all 0.3s ease;\n z-index: 10;\n }\n\n .carousel-btn svg {\n width: 5em;\n height: 5em;\n fill: #333;\n transition: transform 0.3s ease, fill 0.3s ease;\n }\n\n .carousel-btn:hover {\n background-color: #fff;\n transform: translateY(-50%) scale(1.1);\n }\n\n .carousel-btn:hover svg {\n fill: #000;\n transform: scale(1.2);\n }\n\n .prev { left: 16%; }\n .next { right: 16%; }\n\n \/* Dots *\/\n .carousel-dots {\n text-align: center;\n margin-top: 30px;\n }\n\n .dot {\n height: 8px;\n width: 8px;\n margin: 0 8px;\n background-color: #bbb;\n border-radius: 50%;\n display: inline-block;\n cursor: pointer;\n transition: all 0.3s ease;\n }\n\n .dot.active {\n background-color: #333;\n transform: scale(1.3);\n }\n\n .dot:hover {\n background-color: #666;\n }\n\n \/* Responsive *\/\n @media (max-width: 768px) {\n .carousel-slide img {\n height: 400px;\n }\n\n .carousel-btn {\n width: 45px;\n height: 45px;\n }\n\n .carousel-btn svg {\n width: 22px;\n height: 22px;\n }\n }\n\n @media (max-width: 480px) {\n .carousel-slide {\n flex: 0 0 100%;\n }\n\n .carousel-slide:not(.active) {\n display: none;\n }\n\n .carousel-slide img {\n height: 400px;\n }\n\n .dot {\n height: 10px;\n width: 10px;\n margin: 0 5px;\n }\n\n .carousel-btn {\n display: none;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"carousel-container\">\n <!-- Bot\u00f3n anterior con SVG -->\n <button class=\"carousel-btn prev\" aria-label=\"Anterior\">\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 132.45 132.45\"><defs><style>.cls-1{fill:#f3efe8;}.cls-2{fill:#653412;}<\/style><\/defs><g id=\"Capa_2\" data-name=\"Capa 2\"><g id=\"Capa_1-2\" data-name=\"Capa 1\"><circle class=\"cls-1\" cx=\"66.22\" cy=\"66.22\" r=\"66.22\"><\/circle><path class=\"cls-2\" d=\"M45.88,63.45H93.66a8.77,8.77,0,0,1,1,.36,2.8,2.8,0,0,1,0,4.88,8.77,8.77,0,0,1-1,.36H45.88L60.13,83.37a2.8,2.8,0,0,1-4.2,3.69L37.29,68.41c-.86-1-1.31-2-.68-3.35C42.84,58.18,49.7,51.84,56.2,45.2a2.79,2.79,0,0,1,4,3.87Z\"><\/path><\/g><\/g><\/svg>\n <\/button>\n\n <div class=\"carousel-track\" id=\"carouselTrack\">\n <!-- Slide clonado del final (para efecto infinito) -->\n <div class=\"carousel-slide\">\n <img decoding=\"async\" src=\"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-content\/uploads\/2025\/11\/chill-puerto-viejo-1.png\" alt=\"Slide 3\">\n <\/div>\n\n <!-- Slides originales -->\n <div class=\"carousel-slide active\">\n <img decoding=\"async\" src=\"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-content\/uploads\/2025\/11\/chill-puerto-viejo-2.png\" alt=\"Slide 1\">\n <\/div>\n <div class=\"carousel-slide\">\n <img decoding=\"async\" src=\"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-content\/uploads\/2025\/11\/chill-puerto-viejo-3.png\" alt=\"Slide 2\">\n <\/div>\n <div class=\"carousel-slide\">\n <img decoding=\"async\" src=\"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-content\/uploads\/2025\/11\/chill-puerto-viejo-4.png\" alt=\"Slide 3\">\n <\/div>\n\n <!-- Slide clonado del inicio (para efecto infinito) -->\n <div class=\"carousel-slide\">\n <img decoding=\"async\" src=\"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-content\/uploads\/2025\/11\/chill-puerto-viejo-1.png\" alt=\"Slide 1\">\n <\/div>\n <\/div>\n\n <!-- Bot\u00f3n siguiente con SVG -->\n <button class=\"carousel-btn next\" aria-label=\"Siguiente\">\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 132.45 132.45\"><defs><style>.cls-1{fill:#f3efe8;}.cls-2{fill:#653412;}<\/style><\/defs><g id=\"Capa_2\" data-name=\"Capa 2\"><g id=\"Capa_1-2\" data-name=\"Capa 1\"><circle class=\"cls-1\" cx=\"66.22\" cy=\"66.22\" r=\"66.22\"><\/circle><path class=\"cls-2\" d=\"M86.57,69H38.79a8.77,8.77,0,0,1-1-.36,2.8,2.8,0,0,1,0-4.88,8.77,8.77,0,0,1,1-.36H86.57L72.32,49.08a2.8,2.8,0,0,1,4.2-3.69L95.16,64c.86,1,1.31,2,.68,3.35-6.23,6.88-13.09,13.22-19.59,19.86a2.79,2.79,0,0,1-4-3.88Z\"><\/path><\/g><\/g>\n <\/svg>\n <\/button>\n\n <\/div>\n\n <script>\n const track = document.getElementById('carouselTrack');\n const slides = Array.from(track.children);\n const dots = Array.from(document.querySelectorAll('.dot'));\n const prevBtn = document.querySelector('.prev');\n const nextBtn = document.querySelector('.next');\n\n let currentIndex = 1;\n const totalRealSlides = 3;\n const totalSlides = slides.length;\n\n function updateCarousel() {\n const slideWidth = slides[0].offsetWidth + 20;\n const offset = slideWidth;\n\n track.style.transform = `translateX(-${currentIndex * slideWidth - offset}px)`;\n\n slides.forEach((slide, index) => {\n slide.classList.toggle('active', index === currentIndex);\n });\n\n const realIndex = (currentIndex - 1 + totalRealSlides) % totalRealSlides;\n dots.forEach((dot, index) => {\n dot.classList.toggle('active', index === realIndex);\n });\n }\n\n function goToSlide(index) {\n currentIndex = index + 1;\n updateCarousel();\n }\n\n function nextSlide() {\n currentIndex++;\n updateCarousel();\n\n if (currentIndex >= totalSlides - 1) {\n track.addEventListener('transitionend', handleNextReset, { once: true });\n }\n }\n\n function handleNextReset() {\n track.style.transition = 'none';\n track.style.opacity = '0';\n currentIndex = 1;\n updateCarousel();\n track.offsetHeight;\n track.style.transition = 'transform 0.6s ease-in-out, opacity 0.3s';\n track.style.opacity = '1';\n }\n\n function prevSlide() {\n currentIndex--;\n updateCarousel();\n\n if (currentIndex <= 0) {\n track.addEventListener('transitionend', handlePrevReset, { once: true });\n }\n }\n\n function handlePrevReset() {\n track.style.transition = 'none';\n currentIndex = totalSlides - 2;\n updateCarousel();\n track.offsetHeight;\n track.style.transition = 'transform 0.6s ease-in-out';\n }\n\n \/\/ Navegaci\u00f3n con botones\n nextBtn.addEventListener('click', nextSlide);\n prevBtn.addEventListener('click', prevSlide);\n\n \/\/ Navegaci\u00f3n con dots\n dots.forEach((dot, index) => {\n dot.addEventListener('click', () => goToSlide(index));\n });\n\n \/\/ Autoplay\n setInterval(nextSlide, 6000);\n\n \/\/ Swipe\n let startX = 0;\n track.addEventListener('touchstart', e => startX = e.changedTouches[0].clientX);\n track.addEventListener('touchend', e => {\n const endX = e.changedTouches[0].clientX;\n if (endX < startX - 50) nextSlide();\n if (endX > startX + 50) prevSlide();\n });\n\n \/\/ Resize\n window.addEventListener('resize', updateCarousel);\n\n \/\/ Inicial\n updateCarousel();\n <\/script>\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-445a251 e-con-full e-flex e-con e-parent\" data-id=\"445a251\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-87e044c elementor-widget elementor-widget-heading\" data-id=\"87e044c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Costa Rican CARIBBEAN ADVENTURES!<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6864629 elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"6864629\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"_animation":"fadeInUp"}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>There will be 3 carefully curated excursions per 6 day Signature Retreat<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-75a6784 e-flex e-con-boxed e-con e-parent\" data-id=\"75a6784\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2683888 elementor-widget elementor-widget-html\" data-id=\"2683888\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"es\">\n<head>\n <meta charset=\"UTF-8\" \/>\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/>\n <title>Tabs - Nature & Adventure<\/title>\n <style>\n \n\n .tabs-container {\n text-align: center;\n background-color: #F3EFE8;\n padding: 40px 20px;\n border-radius: 20px;\n max-width: 900px;\n width: 100%;\n margin: auto;\n }\n\n \/* --- TABS --- *\/\n .tabs {\n display: flex;\n justify-content: center;\n border-radius: 50px;\n overflow: hidden;\n margin-bottom: 40px;\n background-color: #e6e1db;\n }\n\n .tab {\n flex: 1;\n border: none;\n background: transparent;\n color: #3a2d25;\n padding: 20px 10px;\n cursor: pointer;\n font-weight: 600;\n transition: all 0.3s ease;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 10px;\n }\n\n .tab svg {\n width: 35px;\n height: 35px;\n opacity: 0.8;\n transition: all 0.3s ease;\n }\n\n .tab.active {\n background-color: #5b3a22;\n color: #fff;\n }\n\n .tab.active svg {\n fill: #fff;\n opacity: 1;\n }\n\n .tab:hover {\n background-color: #d6ccc2;\n }\n\n \/* --- CONTENT --- *\/\n .tab-content h2 {\n font-family: \"GOTHICB\", Sans-serif;\n font-size: 1.8rem;\n color: #3a2d25;\n margin-bottom: 20px;\n }\n\n .activities {\n display: flex;\n justify-content: center;\n gap: 60px;\n text-align: left;\n margin-bottom: 30px;\n flex-wrap: wrap;\n }\n\n .activities ul {\n list-style-type: disc;\n padding-left: 20px;\n margin: 0;\n }\n\n .activities li {\n margin-bottom: 8px;\n color: #3a2d25;\n font-size: 0.95rem;\n }\n\n .retreat-btn {\n background-color: #5b3a22;\n color: #fff;\n border: none;\n padding: 12px 30px;\n border-radius: 25px;\n font-size: 1rem;\n cursor: pointer;\n transition: all 0.3s ease;\n }\n\n .retreat-btn:hover {\n background-color: #7b5232;\n }\n\n @media (max-width: 768px) {\n .tabs {\n flex-direction: column;\n border-radius: 20px;\n }\n .tab {\n border-bottom: 1px solid #ddd;\n }\n .activities {\n flex-direction: column;\n align-items: center;\n }\n }\n <\/style>\n<\/head>\n<body>\n\n <div class=\"tabs-container\">\n <div class=\"tabs\">\n <button class=\"tab active\" data-tab=\"adventure\">\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 81.78 81.73\"><defs><style>.cls-1{fill:#fff;}<\/style><\/defs><g id=\"Capa_2\" data-name=\"Capa 2\"><g id=\"Capa_1-2\" data-name=\"Capa 1\">\n <path class=\"cls-1\" d=\"M0,37.49C.85,26.78,8.62,16.93,18.51,13.12,34.43,7,52.66,16,57,32.51c.31,1.18,1.29,4.07-.56,4.31-1.4.19-1.34-1.78-2-2.73-2-3-7.22-1.78-7.76,1.61-.14.91.36,2.52-.66,2.84-2,.6-1.72-1.36-2.44-2.53-1.85-3-7.3-2.17-7.77,1.26-.14,1,.41,2.38-.66,3-1.7,1-1.79-1.07-2.24-2a4.16,4.16,0,0,0-3.33-2.33l2.39,15H80.53a1.31,1.31,0,0,1,1.11,1.92,2.59,2.59,0,0,1-.79.64H32.43L34,62.66c5.09,4.18,10.63,8.17,17.63,7.17,2.08-.29,4.08-1.35,5.86-1.64a1.27,1.27,0,0,1,.8,2.41,29.44,29.44,0,0,1-6.94,1.83c-14.39,1.64-21.28-15.1-35.42-14.2A20,20,0,0,0,5.07,62.54c-.73.62-2.84,3.18-3.32,3.39C1,66.27.61,65.86,0,65.41V64.29A21.38,21.38,0,0,1,21,56.05a26.81,26.81,0,0,1,9.94,4.57c.13,0,.08-.12.09-.24a51.22,51.22,0,0,0-1-6.5c0-.13,0-.4-.22-.44H1.39c-.66,0-1-.33-1.35-.8v-1c.17-.19.65-.8.88-.8H29.4L27.16,36.38c-.19-.23-1.48,1.25-1.62,1.48a5.89,5.89,0,0,0-.73,2c-.1.71.31,2.09-.77,2.27-1.58.27-1.74-1.78-2.39-2.7-2-2.84-7.13-1.79-7.69,1.54-.16.94.38,2.77-.79,3-1.78.4-1.54-1.06-2.09-2.15-1.8-3.57-7.35-2.87-8,.86-.18,1.07.38,3.35-1.52,3.2C0,45.79.44,43.86,0,42.76.14,41-.09,39.19,0,37.49Zm32.23-3.35A80.54,80.54,0,0,0,28.76,21c-.67-1.8-1.93-5-3.19-6.38-.51-.55-.76-.76-1.15,0-1.67,3.07-1.1,13.22-.77,16.94.12,1.3.35,2.61.48,3.91A6.94,6.94,0,0,1,32.27,34.14ZM42.8,32.07c-2.26-7.29-6.6-15.46-14.36-17.87.51,1.14,1.17,2.21,1.67,3.35,2.25,5.11,3.55,10.83,4.71,16.27A7.31,7.31,0,0,1,42.8,32.07Zm10.68-1.76a25.72,25.72,0,0,0-19-15.95c5.63,4.51,9.13,11.14,11,18l.88-1A6.93,6.93,0,0,1,53.48,30.31Zm-31.9,5.75c-.55-6.93-1.54-14,0-20.9-2.82,1.76-4.47,4.35-5.88,7.28-.5,1-.83,3.28-2.53,2.16-1.18-.77.25-3.36.77-4.4a29.13,29.13,0,0,1,1.74-2.81c-.28-.26-4,2.73-4.47,3.11A27.65,27.65,0,0,0,3.37,33.4a16.92,16.92,0,0,0-.7,5.37,6.86,6.86,0,0,1,8.22-.8,22.1,22.1,0,0,1-.17-4.23A26.86,26.86,0,0,1,11.26,29a1.31,1.31,0,0,1,2.5.29,43.29,43.29,0,0,0-.48,7.88A6.87,6.87,0,0,1,21.58,36.06Z\"><\/path><path class=\"cls-1\" d=\"M69,0c1.18.43,1,4.38.41,5a1.3,1.3,0,0,1-2.15-.73C67,3.12,67,.8,67.84,0Z\"><\/path><path class=\"cls-1\" d=\"M67.81,6.59c8.59-.9,10.09,12.33,1.53,13.34C60.4,21,59,7.5,67.81,6.59Zm0,2.55c-4.62.66-4.58,7.69,0,8.23C74.28,18.14,74,8.24,67.81,9.14Z\"><\/path><path class=\"cls-1\" d=\"M74.82,57a1.31,1.31,0,0,1-1,2.19H53.24a1.28,1.28,0,0,1,.16-2.56c6.53.46,13.84-.59,20.28,0A2.12,2.12,0,0,1,74.82,57Z\"><\/path><path class=\"cls-1\" d=\"M68.13,65.14A17.35,17.35,0,0,1,78.8,67.3c1.06.61,3.3,1.83,2.85,3.22C81,72.58,78.4,70,77.47,69.43a15.37,15.37,0,0,0-9.06-1.78c-.9.06-3,.72-3.68.49A1.34,1.34,0,0,1,64.34,66,14.44,14.44,0,0,1,68.13,65.14Z\"><\/path><path class=\"cls-1\" d=\"M46.1,61.62l9.86,0a1.29,1.29,0,0,1-.33,2.53,59.7,59.7,0,0,1-9.07,0C45.06,63.91,44.61,62.2,46.1,61.62Z\"><\/path><path class=\"cls-1\" d=\"M76.58,3.55a1.26,1.26,0,0,1,1.51,1.83A20,20,0,0,1,75.72,7.8a1.29,1.29,0,0,1-1.89-1.57A10.77,10.77,0,0,1,76.58,3.55Z\"><\/path><path class=\"cls-1\" d=\"M60.14,12.33a1.3,1.3,0,0,1-.55,2.15,19.68,19.68,0,0,1-3.6,0A1.31,1.31,0,0,1,56.15,12C56.83,11.85,59.67,11.86,60.14,12.33Z\"><\/path><path class=\"cls-1\" d=\"M69.4,21.58c.47.47.48,3.32.33,4a1.27,1.27,0,0,1-2.49,0,16.48,16.48,0,0,1,0-3.44A1.34,1.34,0,0,1,69.4,21.58Z\"><\/path>\n <path class=\"cls-1\" d=\"M62.85,18.87c.65.65.28,1.43-.19,2a16.72,16.72,0,0,1-2,2c-1.57.65-2.48-.78-1.48-2.11C59.8,19.86,61.76,17.78,62.85,18.87Z\"><\/path>\n <path class=\"cls-1\" d=\"M77.53,12a10.53,10.53,0,0,1,3.6.16,1.27,1.27,0,0,1-.45,2.35,17,17,0,0,1-3.43-.06A1.28,1.28,0,0,1,77.53,12Z\"><\/path>\n <path class=\"cls-1\" d=\"M74.83,18.54a1,1,0,0,1,.83.21c.22.15,2.4,2.31,2.47,2.47.58,1.27-.67,2.2-1.89,1.57a22.9,22.9,0,0,1-2.31-2.31A1.25,1.25,0,0,1,74.83,18.54Z\"><\/path>\n <path class=\"cls-1\" d=\"M59.5,3.54a1.56,1.56,0,0,1,1,0A32.14,32.14,0,0,1,63,6.07c.76,1.19-.41,2.29-1.63,1.79A22.76,22.76,0,0,1,59,5.58C58.57,4.89,58.67,3.79,59.5,3.54Z\"><\/path>\n <path class=\"cls-1\" d=\"M26,65.44c1.7-.27,2,2.78,0,2.52C24.52,67.77,24.79,65.63,26,65.44Z\"><\/path>\n <path class=\"cls-1\" d=\"M5.26,67.83a1.28,1.28,0,0,1,.43,2.53C4,70.53,3.92,68.07,5.26,67.83Z\"><\/path>\n <path class=\"cls-1\" d=\"M71.63,72.62a1.28,1.28,0,1,1,.69,2.46C70.7,75.39,70.42,73,71.63,72.62Z\"><\/path>\n <path class=\"cls-1\" d=\"M23,74.86c.94,1-.58,3-1.78,1.87S21.82,73.64,23,74.86Z\"><\/path><path class=\"cls-1\" d=\"M57.43,79.32c2.22-.66,2.22,3,0,2.33A1.3,1.3,0,0,1,57.43,79.32Z\"><\/path><\/g><\/g><\/svg>\n <span>Nature & Adventure<\/span>\n <\/button>\n <button class=\"tab\" data-tab=\"culture\">\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 84.02 84.05\"><g id=\"Capa_2\" data-name=\"Capa 2\"><g id=\"Capa_1-2\" data-name=\"Capa 1\"><path d=\"M9.19,84.05c-1.22-.38-.94-2.79.08-2.79h6.15l-2.49-4.81C4.9,52.63,6.34,23.32,22.57,3.2,24,1.46,25.63-1.11,28.17.51c1.47.94,4.81,5.76,5.89,7.41a62.57,62.57,0,0,1,9.58,24.46c1.16-1.67,2.14-3.46,3.31-5.14a60.08,60.08,0,0,1,17.2-16.42c2.77-1.73,5.92-4.35,7.7,0,5.89,14.34,4.09,31-1.35,45.08C67,65,62.6,74.4,55.45,81.26H74.72c1,0,1.29,2.41.08,2.79ZM40.35,30.24a62.11,62.11,0,0,0-12.63-26C27.51,4,26.64,2.86,26.41,3a28.75,28.75,0,0,1-2.2,2.8A59.67,59.67,0,0,0,13,30.25l12.22-8.54a3,3,0,0,1,3,.1Zm.5,51L66.93,12.53a58.34,58.34,0,0,0-20.53,21c-.63,1.1-2,3.28-2,4.46.39,12,.87,24.5-3.22,36a42.06,42.06,0,0,1-3.49,7.25Zm3.11,0h5.33c1.69,0,3.17-1.31,4.35-2.37,9.73-8.76,18.29-31.7,18.87-44.62a65.14,65.14,0,0,0-2.63-20.59ZM41.67,39.6A30,30,0,0,0,41,34.42L26.66,24.34c-4.94,3.16-9.6,6.78-14.47,10.06a22.12,22.12,0,0,0-.63,5.36c4.68-3.37,9.34-6.83,14.18-9.94a3.08,3.08,0,0,1,2.23.26Zm0,15.42c.16-3.87.28-7.77.09-11.65l-15-10.6c-.33-.09-.88.41-1.2.62-4.84,3.18-9.42,6.81-14.19,10.09-.14,3.86.06,7.69.13,11.54l13.7-9.52a3.37,3.37,0,0,1,2.38-.25Zm-.82,7.87.51-4-.16-.49L26.66,48.13,11.83,58.57l.55,4.32,12.5-8.83c1.91-1.08,2.67-.46,4.27.59C33.13,57.26,36.86,60.29,40.84,62.89ZM26.52,56.53,13,66a29.5,29.5,0,0,0,2.3,8.52c.89,2.15,2.37,5.93,4.8,6.53,2.08.51,8.9.37,11.28.21,3.33-.23,4.11-1.78,5.47-4.54a34.93,34.93,0,0,0,3.27-10.61Z\"><\/path><path d=\"M4.76,84.05H0v-2c.33-.39.52-.72,1.08-.81a23.14,23.14,0,0,1,3.73,0C5.94,81.63,5.89,83.61,4.76,84.05Z\"><\/path><path d=\"M83.17,84.05H79.23A1.53,1.53,0,0,1,79,81.42a15,15,0,0,1,3.78-.16A1.47,1.47,0,0,1,83.17,84.05Z\"><\/path><\/g><\/g><\/svg>\n <span>Culture & Local Experiences<\/span>\n <\/button>\n <button class=\"tab\" data-tab=\"wildlife\">\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 92.17 80.75\"><g id=\"Capa_2\" data-name=\"Capa 2\"><g id=\"Capa_1-2\" data-name=\"Capa 1\"><path d=\"M41.28,67l-1.45-9.86C35,53.33,27.77,51.12,25.65,44.85a14.78,14.78,0,0,1-3.4.27C17.83,44.6,13.66,42,14.46,37c2.33-6.4,3.37-14.22,5.89-20.44,1.82-4.5,6.38-4.37,10.31-2.85a6.17,6.17,0,0,1,4,4.18c3.55-.91,7.56-.34,10,2.6,2.06,2.47,3.67,5.74,5.72,8.28,1.66.6,3.54.45,5.25.91V23.15a3.62,3.62,0,0,1,.83-1,2,2,0,0,1,3,1.05c.47,2.09-.37,5.6,0,7.7,0,.26,1.11,1.17,1.4,1.73,1.11,2.23.57,4.24-.84,6.13-.12.15-.55.36-.55.42v24.2h2.76a4.92,4.92,0,0,1,.21-.61c1.13-1.83,4.35-7.89,5.73-8.81,1.85-1.23,5.74-2.35,7.22-3.64,1.82-1.6,3.66-5.52,5.51-7.37a3,3,0,0,1,1.57-.83c1.24-.4,6.78-1.9,7.76-1.83a2.05,2.05,0,0,1,1.53,3.21c-.84,1.16-6.59,1.86-8.13,2.45-1.78,1.85-3.78,6-5.67,7.49s-5.49,2.38-7.53,3.88C68.45,59.83,67,64,65,66.37c-1.49,1.75-4.78.34-6.65.89-1,.3-3,3.76-4.47,3.81l-14.67.06c-2.09,1.75-3.76,4.05-6,5.63l-17.07,0c-1.72.62-4.37,3.4-6,3.77a58.1,58.1,0,0,1-8.85,0A2,2,0,0,1,1,76.94c1.89-.92,6,.11,8.1-.37,1.31-.29,4.1-3.15,5.46-3.55.69-.21,3.31,0,3.48-.11L23.7,59.12c.46-1.61.78-6.81,1.63-7.66a2,2,0,0,1,3.43,1.15,52,52,0,0,1-1.12,7.33l-5.31,13h3.22l6.39-12c.55-1.57.28-4.61,2.62-4.55,3.14.07,1.51,4.6,1,6.33L30.24,72.93l1.65-.09c1.19-.88,5.2-5.8,6.36-5.8ZM25.78,16.65A2.24,2.24,0,0,0,24,18.17l-5.69,19.9a2.66,2.66,0,0,0,1.21,2.07,15.57,15.57,0,0,0,3.69,1.07,2.32,2.32,0,0,0,2.17-1.6L31,19.83a2.15,2.15,0,0,0-1.06-2.08A11.48,11.48,0,0,0,25.78,16.65ZM48.46,67c-.41-4.77-.19-9.64-1-14.35a4.73,4.73,0,0,0-1.38-1.76c-2.22-2.11-5.16-3.94-7.36-6.06-.69-.67-1.33-1.24-1.22-2.31.23-2.12,2-5,2.28-7.24-.83-1.72-4.34-3.75-2.81-5.82,1.3-1.75,2.84-.35,3.87.73C42.55,32,44,34.19,45.69,36a2.15,2.15,0,0,0,1.07.4,54.56,54.56,0,0,0,9,0c2.15-.25,2.47-2.13.57-2.73s-6.85-.47-8.18-1.4L41.36,22.7c-2-1.74-6.06-2-7.29.78C33,28.64,30.54,34.09,29.56,39.21c-.53,2.77-.5,5.22,1.6,7.31L43.4,54.9C44.49,58.83,44.55,63,45.33,67Zm7.18-26.69H45.43A5.83,5.83,0,0,1,43,38.89a14,14,0,0,0-1.18,3.37c3.54,3.59,9.5,6,9.92,11.63.22,4.38.38,8.79.74,13.15a.78.78,0,0,0,.66-.17,24.2,24.2,0,0,0,2.47-2.5Z\"><\/path><path d=\"M42.9.09c12-1.63,12,18.41.32,17.26C34.28,16.46,34,1.31,42.9.09Zm3.84,12.22C49.15,9.9,48.06,3.54,43.82,4c-3,.3-3.75,3.36-3.46,5.94A3.79,3.79,0,0,0,46.74,12.31Z\"><\/path><\/g><\/g><\/svg>\n <span>Wildlife & Conservation<\/span>\n <\/button>\n <\/div>\n\n <div class=\"tab-content\" id=\"tab-content\">\n <h2>Nature & Adventure<\/h2>\n <div class=\"activities\">\n <ul>\n <li>Cahuita National Park snorkel & hike<\/li>\n <li>Gandoca-Manzanillo jungle & wildlife tour<\/li>\n <li>Pacuare River white water rafting<\/li>\n <li>Tortuguero National Park day trip<\/li>\n <li>Night jungle walk<\/li>\n <\/ul>\n <ul>\n <li>Zipline \/ canopy tour in the jungle<\/li>\n <li>Bike tour of coastal beaches<\/li>\n <li>Horseback riding on the beach<\/li>\n <li>Stand-up paddleboard mangrove tour<\/li>\n <li>Punta Uva sea kayak & snorkel<\/li>\n <\/ul>\n <\/div>\n <button class=\"retreat-btn\">Book now retreat<\/button>\n <\/div>\n <\/div>\n\n <script>\n const tabs = document.querySelectorAll('.tab');\n const content = document.getElementById('tab-content');\n\n const data = {\n adventure: {\n title: \"Nature & Adventure\",\n left: [\n \"Cahuita National Park snorkel & hike\",\n \"Gandoca-Manzanillo jungle & wildlife tour\",\n \"Pacuare River white water rafting\",\n \"Tortuguero National Park day trip\",\n \"Night jungle walk\"\n ],\n right: [\n \"Zipline \/ canopy tour in the jungle\",\n \"Bike tour of coastal beaches\",\n \"Horseback riding on the beach\",\n \"Stand-up paddleboard mangrove tour\",\n \"Punta Uva sea kayak & snorkel\"\n ]\n },\n culture: {\n title: \"Culture & Local Experiences\",\n left: [\n \"Caribbean cooking classes\",\n \"Cacao & chocolate tour\",\n \"Bribri indigenous village visit\",\n \"Local market exploration\",\n \"Cultural dance workshop\"\n ],\n right: [\n \"Pottery & craft workshop\",\n \"Coffee tasting experience\",\n \"Traditional music evening\",\n \"Visit local farms\",\n \"Storytelling & folklore night\"\n ]\n },\n wildlife: {\n title: \"Wildlife & Conservation\",\n left: [\n \"Sloth sanctuary visit\",\n \"Sea turtle conservation program\",\n \"Birdwatching tour\",\n \"Frog night observation\",\n \"Butterfly garden tour\"\n ],\n right: [\n \"Mangrove restoration volunteering\",\n \"Wildlife photography walk\",\n \"Turtle hatchling release\",\n \"Eco sustainability workshop\",\n \"Rainforest conservation hike\"\n ]\n }\n };\n\n tabs.forEach(tab => {\n tab.addEventListener('click', () => {\n tabs.forEach(t => t.classList.remove('active'));\n tab.classList.add('active');\n const key = tab.getAttribute('data-tab');\n const info = data[key];\n\n content.innerHTML = `\n <h2>${info.title}<\/h2>\n <div class=\"activities\">\n <ul>${info.left.map(item => `<li>${item}<\/li>`).join('')}<\/ul>\n <ul>${info.right.map(item => `<li>${item}<\/li>`).join('')}<\/ul>\n <\/div>\n <button class=\"retreat-btn\" onclick=\"location.href='https:\/\/dev.bitsaturnocr.com\/puertoviejo\/retreats\/'\">Book now retreat<\/button>\n `;\n });\n });\n <\/script>\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-9f18d9e e-con-full e-flex e-con e-parent\" data-id=\"9f18d9e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7c3630b elementor-widget elementor-widget-html\" data-id=\"7c3630b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"es\">\n<head>\n <meta charset=\"UTF-8\" \/>\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/>\n <title>Retreat Slider<\/title>\n <style>\n .slider-container {\n position: relative;\n width: 90%;\n max-width: 1200px;\n border-radius: 25px;\n overflow: hidden;\n margin: auto;\n }\n\n .slide {\n position: relative;\n width: 100%;\n height: 670px;\n background-size: cover;\n background-position: center;\n display: flex;\n align-items: flex-end;\n border-radius: 25px;\n overflow: hidden;\n transition: background-image 0.6s ease-in-out;\n }\n\n .overlay {\n position: absolute;\n inset: 0;\n background: linear-gradient(to top, rgba(0, 0, 0, 0.6), rgba(0,0,0,0.1));\n }\n\n .content {\n position: absolute;\n bottom: 150px;\n left: 50px;\n color: #fff;\n max-width: 500px;\n z-index: 2;\n }\n\n .content h2 {\n font-family: \"GOTHICB\", Sans-serif;\n font-size: 2.8rem;\n margin-bottom: 10px;\n font-weight: 700;\n color: #F3EFE8;\n }\n\n .content p {\n font-size: 1rem;\n line-height: 1.6;\n margin-bottom: 25px;\n color: #f5f5f5;\n }\n\n .btn {\n background-color: #F3EFE8;\n color: #5b4636;\n padding: 12px 30px;\n border: none;\n border-radius: 30px;\n font-size: 1rem;\n cursor: pointer;\n transition: all 0.3s ease;\n text-decoration: none !important;\n display: inline-block;\n }\n\n .btn:hover {\n background-color: #f0e7d9;\n }\n\n .timeline {\n position: absolute;\n bottom: 75px;\n left: 50%;\n transform: translateX(-50%);\n display: flex;\n align-items: center;\n justify-content: center;\n width: 90%;\n gap: 180px;\n z-index: 2;\n }\n\n .line {\n position: absolute;\n top: 50%;\n left: 0;\n width: 100%;\n height: 4px;\n background-color: rgba(255,255,255,0.4);\n z-index: 1;\n transform: translateY(-50%);\n }\n\n .dot {\n width: 18px;\n height: 18px;\n border-radius: 50%;\n background-color: #fff;\n border: 4px solid #5b4636;\n z-index: 2;\n transition: background-color 0.3s ease;\n cursor: pointer;\n }\n\n .dot.active {\n background-color: #5b4636;\n }\n\n .date-box {\n position: absolute;\n bottom: 20px;\n left: 60px;\n background-color: #F3EFE8;\n color: #5b4636;\n font-weight: 600;\n padding: 10px 20px;\n border-radius: 10px;\n font-size: 1rem;\n z-index: 2;\n }\n\n @media (max-width: 768px) {\n .slide {\n height: 450px;\n }\n\n .content {\n bottom: 130px;\n left: 30px;\n max-width: 80%;\n }\n\n .content h2 {\n font-size: 2rem;\n }\n\n .timeline {\n gap: 25px;\n }\n\n .dot {\n width: 14px;\n height: 14px;\n }\n }\n <\/style>\n<\/head>\n<body>\n\n <div class=\"slider-container\">\n <div class=\"slide\">\n <div class=\"overlay\"><\/div>\n\n <div class=\"content\" id=\"content\">\n <h2 id=\"title\">Yoga & Wellness<\/h2>\n <p id=\"paragraph\">\n Flow into balance with daily yoga, meditation, and gentle wellness practices that restore harmony to body and mind.\n <\/p>\n <a id=\"btn\" class=\"btn\" href=\"#\">Book now<\/a>\n <\/div>\n\n <div class=\"timeline\">\n <div class=\"line\"><\/div>\n <!-- 6 dots = 6 retreats (solo primera fecha de cada uno) -->\n <div class=\"dot active\"><\/div>\n <div class=\"dot\"><\/div>\n <div class=\"dot\"><\/div>\n <div class=\"dot\"><\/div>\n <div class=\"dot\"><\/div>\n <div class=\"dot\"><\/div>\n <\/div>\n\n <div style=\"display: none;\" class=\"date-box\" id=\"date\">Sun, Nov 30 \u2013 Sat, Dec 6<\/div>\n <\/div>\n <\/div>\n\n<script>\ndocument.addEventListener(\"DOMContentLoaded\", () => {\n const slidesData = [\n {\n \/\/ Yoga & Wellness \u2013 primera fecha\n titulo: \"Yoga & Overall Wellness\",\n parrafo: \"Flow into balance with daily yoga, meditation, and gentle wellness practices that restore harmony to body and mind.\",\n enlaceBtn: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/yoga-overall-wellness\/\",\n imagenFondo: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-content\/uploads\/2025\/11\/yoga_wellness_banner.png\",\n fecha: \"Sun, Nov 30 \u2013 Sat, Dec 6\"\n },\n {\n \/\/ Surf & Soul \u2013 primera fecha\n titulo: \"Surf & Soul\",\n parrafo: \"Reconnect with your natural rhythm and recharge through a balance of ocean adventure and soulful restoration.\",\n enlaceBtn: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/surf-soul\/\",\n imagenFondo: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-content\/uploads\/2025\/11\/surf_soul_banner_2.png\",\n fecha: \"Sun, Dec 7 \u2013 Sat, Dec 13\"\n },\n {\n \/\/ Vitality Re-Set \u2013 primera fecha\n titulo: \"Vitality Re-Set\",\n parrafo: \"Reawaken your energy and restore your vitality through nourishing juices, whole foods and invigorating movement.\",\n enlaceBtn: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/vitality-re-set\/\",\n imagenFondo: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-content\/uploads\/2025\/11\/vitality_Reset_banner.png\",\n fecha: \"Sun, Dec 14 \u2013 Sat, Dec 20\"\n },\n {\n \/\/ Jungle Strong \u2013 primera fecha\n titulo: \"Jungle Strong Fitness & Survival Retreat\",\n parrafo: \"Build strength, stamina and confidence while learning essential survival-inspired skills along the Caribbean coast.\",\n enlaceBtn: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/jungle-strong-fitness\/\",\n imagenFondo: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-content\/uploads\/2025\/11\/jungle_strong_banner.png\",\n fecha: \"Sun, Dec 28 \u2013 Sat, Jan 3\"\n },\n {\n \/\/ 3-day Detox \u2013 primera fecha\n titulo: \"3-day Detox & Reset\",\n parrafo: \"Over 3 days, immerse yourself in a restorative journey of cleansing, renewal and deep nervous system reset.\",\n enlaceBtn: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/3-day-detox-and-reset\/\",\n imagenFondo: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-content\/uploads\/2025\/11\/3_day_detox_banner.png\",\n fecha: \"Sun, Jan 4 \u2013 Wed, Jan 7\"\n },\n {\n \/\/ Full Caribbean \u2013 primera fecha\n titulo: \"Full Caribbean Costa Rica Experience\",\n parrafo: \"Savor a full immersion into Caribbean Costa Rica with curated experiences, cultural connections and mindful rest by the sea.\",\n enlaceBtn: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/full-caribbean-costa-rica-experience\/\",\n imagenFondo: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-content\/uploads\/2025\/11\/full_caribean_banner.png\", \/\/ cambia esta por la foto oficial\n fecha: \"Sun, Jan 11 \u2013 Sat, Jan 17\"\n }\n ];\n\n const slide = document.querySelector(\".slide\");\n const content = document.getElementById(\"content\");\n const title = document.getElementById(\"title\");\n const paragraph = document.getElementById(\"paragraph\");\n const btn = document.getElementById(\"btn\");\n const date = document.getElementById(\"date\");\n const sliderDots = document.querySelectorAll(\".dot\");\n\n let currentSlide = 0;\n let isTransitioning = false;\n let autoInterval = null;\n\n \/\/ \ud83d\udd39 Precargar imagen\n function preloadImage(src, cb) {\n const img = new Image();\n img.onload = () => cb(null, src);\n img.onerror = () => cb(new Error(\"Error al cargar imagen: \" + src));\n img.src = src;\n }\n\n \/\/ \ud83d\udd39 Cambiar slide con preload\n function applySlideWithPreload(index) {\n if (isTransitioning) return;\n isTransitioning = true;\n\n content.classList.remove(\"active\");\n\n const data = slidesData[index];\n preloadImage(data.imagenFondo, () => {\n slide.style.backgroundImage = `url(${data.imagenFondo})`;\n title.textContent = data.titulo;\n paragraph.textContent = data.parrafo;\n btn.href = data.enlaceBtn;\n date.textContent = data.fecha;\n\n sliderDots.forEach((dot, i) => dot.classList.toggle(\"active\", i === index));\n\n setTimeout(() => {\n content.classList.add(\"active\");\n isTransitioning = false;\n }, 120);\n });\n }\n\n \/\/ \ud83d\udd39 Fondo inicial\n slide.style.backgroundImage = `url(${slidesData[0].imagenFondo})`;\n preloadImage(slidesData[0].imagenFondo, () => {\n content.classList.add(\"active\");\n });\n\n \/\/ \ud83d\udd39 Autoplay\n function startAutoPlay() {\n stopAutoPlay();\n autoInterval = setInterval(() => {\n currentSlide = (currentSlide + 1) % slidesData.length;\n applySlideWithPreload(currentSlide);\n }, 5000);\n }\n\n function stopAutoPlay() {\n if (autoInterval) clearInterval(autoInterval);\n }\n\n \/\/ \ud83d\udd39 Click en dots\n sliderDots.forEach((dot, i) => {\n dot.addEventListener(\"click\", () => {\n stopAutoPlay();\n currentSlide = i;\n applySlideWithPreload(i);\n startAutoPlay();\n });\n });\n\n \/\/ \ud83d\udd39 Iniciar\n startAutoPlay();\n\n console.log(\"Slides JSON:\", JSON.stringify(slidesData, null, 2));\n});\n<\/script>\n\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-0e14314 e-con-full elementor-hidden-desktop elementor-hidden-tablet elementor-hidden-mobile e-flex e-con e-parent\" data-id=\"0e14314\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e676fb2 elementor-widget elementor-widget-html\" data-id=\"e676fb2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"es\">\n<head>\n <meta charset=\"UTF-8\" \/>\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/>\n <title>Retreat Slider<\/title>\n <style>\n .slider-container {\n position: relative;\n width: 90%;\n max-width: 1200px;\n border-radius: 25px;\n overflow: hidden;\n margin: auto;\n }\n\n .slide {\n position: relative;\n width: 100%;\n height: 670px;\n background-size: cover;\n background-position: center;\n display: flex;\n align-items: flex-end;\n border-radius: 25px;\n overflow: hidden;\n transition: background-image 0.6s ease-in-out;\n }\n\n .overlay {\n position: absolute;\n inset: 0;\n background: linear-gradient(to top, rgba(0, 0, 0, 0.6), rgba(0,0,0,0.1));\n }\n\n .content {\n position: absolute;\n bottom: 150px;\n left: 50px;\n color: #fff;\n max-width: 500px;\n z-index: 2;\n }\n\n .content h2 {\n font-family: \"GOTHICB\", Sans-serif;\n font-size: 2.8rem;\n margin-bottom: 10px;\n font-weight: 700;\n color: #F3EFE8;\n }\n\n .content p {\n font-size: 1rem;\n line-height: 1.6;\n margin-bottom: 25px;\n color: #f5f5f5;\n }\n\n .btn {\n background-color: #F3EFE8;\n color: #5b4636;\n padding: 12px 30px;\n border: none;\n border-radius: 30px;\n font-size: 1rem;\n cursor: pointer;\n transition: all 0.3s ease;\n text-decoration: none !important;\n display: inline-block;\n }\n\n .btn:hover {\n background-color: #f0e7d9;\n }\n\n .timeline {\n position: absolute;\n bottom: 75px;\n left: 50%;\n transform: translateX(-50%);\n display: flex;\n align-items: center;\n justify-content: center;\n width: 90%;\n gap: 180px;\n z-index: 2;\n }\n\n .line {\n position: absolute;\n top: 50%;\n left: 0;\n width: 100%;\n height: 4px;\n background-color: rgba(255,255,255,0.4);\n z-index: 1;\n transform: translateY(-50%);\n }\n\n .dot {\n width: 18px;\n height: 18px;\n border-radius: 50%;\n background-color: #fff;\n border: 4px solid #5b4636;\n z-index: 2;\n transition: background-color 0.3s ease;\n cursor: pointer;\n }\n\n .dot.active {\n background-color: #5b4636;\n }\n\n .date-box {\n position: absolute;\n bottom: 20px;\n left: 60px;\n background-color: #F3EFE8;\n color: #5b4636;\n font-weight: 600;\n padding: 10px 20px;\n border-radius: 10px;\n font-size: 1rem;\n z-index: 2;\n }\n\n @media (max-width: 768px) {\n .slide {\n height: 450px;\n }\n\n .content {\n bottom: 130px;\n left: 30px;\n max-width: 80%;\n }\n\n .content h2 {\n font-size: 2rem;\n }\n\n .timeline {\n gap: 25px;\n }\n\n .dot {\n width: 14px;\n height: 14px;\n }\n }\n <\/style>\n<\/head>\n<body>\n\n <div class=\"slider-container\">\n <div class=\"slide\">\n <div class=\"overlay\"><\/div>\n\n <div class=\"content\" id=\"content\">\n <h2 id=\"title\">Yoga & Wellness<\/h2>\n <p id=\"paragraph\">\n Flow into balance with daily yoga, meditation, and gentle wellness practices that restore harmony to body and mind.\n <\/p>\n <a id=\"btn\" class=\"btn\" href=\"#\">Book now<\/a>\n <\/div>\n\n <div class=\"timeline\">\n <div class=\"line\"><\/div>\n <!-- 6 dots = 6 retreats (solo primera fecha de cada uno) -->\n <div class=\"dot active\"><\/div>\n <div class=\"dot\"><\/div>\n <div class=\"dot\"><\/div>\n <div class=\"dot\"><\/div>\n <div class=\"dot\"><\/div>\n <div class=\"dot\"><\/div>\n <\/div>\n\n <div class=\"date-box\" id=\"date\">Sun, Nov 30 \u2013 Sat, Dec 6<\/div>\n <\/div>\n <\/div>\n\n<script>\ndocument.addEventListener(\"DOMContentLoaded\", () => {\n const slidesData = [\n {\n \/\/ Yoga & Wellness \u2013 primera fecha\n titulo: \"Yoga & Overall Wellness\",\n parrafo: \"Flow into balance with daily yoga, meditation, and gentle wellness practices that restore harmony to body and mind.\",\n enlaceBtn: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/yoga-overall-wellness\/\",\n imagenFondo: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-content\/uploads\/2025\/11\/yoga_wellness_banner.png\",\n fecha: \"Sun, Nov 30 \u2013 Sat, Dec 6\"\n },\n {\n \/\/ Surf & Soul \u2013 primera fecha\n titulo: \"Surf & Soul\",\n parrafo: \"Reconnect with your natural rhythm and recharge through a balance of ocean adventure and soulful restoration.\",\n enlaceBtn: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/surf-soul\/\",\n imagenFondo: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-content\/uploads\/2025\/11\/surf_soul_banner_2.png\",\n fecha: \"Sun, Dec 7 \u2013 Sat, Dec 13\"\n },\n {\n \/\/ Vitality Re-Set \u2013 primera fecha\n titulo: \"Vitality Re-Set\",\n parrafo: \"Reawaken your energy and restore your vitality through nourishing juices, whole foods and invigorating movement.\",\n enlaceBtn: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/vitality-re-set\/\",\n imagenFondo: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-content\/uploads\/2025\/11\/vitality_Reset_banner.png\",\n fecha: \"Sun, Dec 14 \u2013 Sat, Dec 20\"\n },\n {\n \/\/ Jungle Strong \u2013 primera fecha\n titulo: \"Jungle Strong Fitness & Survival Retreat\",\n parrafo: \"Build strength, stamina and confidence while learning essential survival-inspired skills along the Caribbean coast.\",\n enlaceBtn: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/jungle-strong-fitness\/\",\n imagenFondo: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-content\/uploads\/2025\/11\/jungle_strong_banner.png\",\n fecha: \"Sun, Dec 28 \u2013 Sat, Jan 3\"\n },\n {\n \/\/ 3-day Detox \u2013 primera fecha\n titulo: \"3-day Detox & Reset\",\n parrafo: \"Over 3 days, immerse yourself in a restorative journey of cleansing, renewal and deep nervous system reset.\",\n enlaceBtn: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/3-day-detox-and-reset\/\",\n imagenFondo: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-content\/uploads\/2025\/11\/3_day_detox_banner.png\",\n fecha: \"Sun, Jan 4 \u2013 Wed, Jan 7\"\n },\n {\n \/\/ Full Caribbean \u2013 primera fecha\n titulo: \"Full Caribbean Costa Rica Experience\",\n parrafo: \"Savor a full immersion into Caribbean Costa Rica with curated experiences, cultural connections and mindful rest by the sea.\",\n enlaceBtn: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/full-caribbean-costa-rica-experience\/\",\n imagenFondo: \"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-content\/uploads\/2025\/11\/full_caribean_banner.png\", \/\/ cambia esta por la foto oficial\n fecha: \"Sun, Jan 11 \u2013 Sat, Jan 17\"\n }\n ];\n\n const slide = document.querySelector(\".slide\");\n const content = document.getElementById(\"content\");\n const title = document.getElementById(\"title\");\n const paragraph = document.getElementById(\"paragraph\");\n const btn = document.getElementById(\"btn\");\n const date = document.getElementById(\"date\");\n const sliderDots = document.querySelectorAll(\".dot\");\n\n let currentSlide = 0;\n let isTransitioning = false;\n let autoInterval = null;\n\n \/\/ \ud83d\udd39 Precargar imagen\n function preloadImage(src, cb) {\n const img = new Image();\n img.onload = () => cb(null, src);\n img.onerror = () => cb(new Error(\"Error al cargar imagen: \" + src));\n img.src = src;\n }\n\n \/\/ \ud83d\udd39 Cambiar slide con preload\n function applySlideWithPreload(index) {\n if (isTransitioning) return;\n isTransitioning = true;\n\n content.classList.remove(\"active\");\n\n const data = slidesData[index];\n preloadImage(data.imagenFondo, () => {\n slide.style.backgroundImage = `url(${data.imagenFondo})`;\n title.textContent = data.titulo;\n paragraph.textContent = data.parrafo;\n btn.href = data.enlaceBtn;\n date.textContent = data.fecha;\n\n sliderDots.forEach((dot, i) => dot.classList.toggle(\"active\", i === index));\n\n setTimeout(() => {\n content.classList.add(\"active\");\n isTransitioning = false;\n }, 120);\n });\n }\n\n \/\/ \ud83d\udd39 Fondo inicial\n slide.style.backgroundImage = `url(${slidesData[0].imagenFondo})`;\n preloadImage(slidesData[0].imagenFondo, () => {\n content.classList.add(\"active\");\n });\n\n \/\/ \ud83d\udd39 Autoplay\n function startAutoPlay() {\n stopAutoPlay();\n autoInterval = setInterval(() => {\n currentSlide = (currentSlide + 1) % slidesData.length;\n applySlideWithPreload(currentSlide);\n }, 5000);\n }\n\n function stopAutoPlay() {\n if (autoInterval) clearInterval(autoInterval);\n }\n\n \/\/ \ud83d\udd39 Click en dots\n sliderDots.forEach((dot, i) => {\n dot.addEventListener(\"click\", () => {\n stopAutoPlay();\n currentSlide = i;\n applySlideWithPreload(i);\n startAutoPlay();\n });\n });\n\n \/\/ \ud83d\udd39 Iniciar\n startAutoPlay();\n\n console.log(\"Slides JSON:\", JSON.stringify(slidesData, null, 2));\n});\n<\/script>\n\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Accommodations Sanctuary@Puerto Viejo offers an all-inclusive retreat to renew body, mind, and spirit amid vibrant tropical gardens \u2014 the perfect […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"inline_featured_image":false,"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"enabled","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-2526","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-json\/wp\/v2\/pages\/2526","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-json\/wp\/v2\/comments?post=2526"}],"version-history":[{"count":64,"href":"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-json\/wp\/v2\/pages\/2526\/revisions"}],"predecessor-version":[{"id":3558,"href":"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-json\/wp\/v2\/pages\/2526\/revisions\/3558"}],"wp:attachment":[{"href":"https:\/\/dev.bitsaturnocr.com\/puertoviejo\/wp-json\/wp\/v2\/media?parent=2526"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}