#__CDP_ID__{position:relative;width:100%;max-width:1400px;margin:0 auto;padding:0 48px;box-sizing:border-box;font-family:inherit} #__CDP_ID__ *{box-sizing:border-box} #__CDP_ID__ .cdp-track{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding:4px 0} #__CDP_ID__ .cdp-track::-webkit-scrollbar{display:none} #__CDP_ID__ .cdp-card{flex:0 0 calc((100% - 40px)/3);min-width:0;display:flex;flex-direction:column;scroll-snap-align:start;background:#fffdf8;border:1px solid #eadfc4;padding:18px} #__CDP_ID__ .cdp-badge{align-self:flex-start;background:#2e7d4f;color:white;font-size:12px;font-weight:800;letter-spacing:1px;padding:8px 17px;border-radius:20px;margin-bottom:14px} #__CDP_ID__ .cdp-img{display:block;width:100%;height:auto;max-height:460px;object-fit:contain;border-radius:3px} #__CDP_ID__ .cdp-btnwrap{text-align:center;margin-top:14px} #__CDP_ID__ .cdp-btn{display:inline-block;background:#c4703f;color:#fff!important;border:0;border-radius:24px;padding:11px 30px;font-size:12px;font-weight:800;letter-spacing:1px;text-transform:uppercase;cursor:pointer} #__CDP_ID__ .cdp-btn:hover{background:#a85a2d} #__CDP_ID__ .cdp-btn:disabled{opacity:.6;cursor:wait} #__CDP_ID__ .cdp-arrow{position:absolute;top:45%;transform:translateY(-50%);width:38px;height:38px;border:1px solid #eadfc4;border-radius:50%;background:white;color:#c4703f;font-size:24px;cursor:pointer;z-index:2;line-height:1;padding:0} #__CDP_ID__ .cdp-prev{left:0} #__CDP_ID__ .cdp-next{right:0} #__CDP_ID__ .cdp-dots{text-align:center;margin-top:18px} #__CDP_ID__ .cdp-dot{width:9px;height:9px;border:0;border-radius:50%;background:#e0d3b8;margin:0 4px;padding:0;cursor:pointer} #__CDP_ID__ .cdp-dot.active{background:#c4703f} #__CDP_ID__ .cdp-message{text-align:center;font-size:13px;margin-top:8px} @media(max-width:1000px){#__CDP_ID__ .cdp-card{flex-basis:calc((100% - 20px)/2)}} @media(max-width:600px){#__CDP_ID__{padding:0 32px}#__CDP_ID__ .cdp-card{flex-basis:100%;padding:14px}#__CDP_ID__ .cdp-arrow{width:28px;height:28px;font-size:19px}} (function(){ var root = document.getElementById('__CDP_ID__'); if (!root || root.dataset.cdpReady) return; root.dataset.cdpReady = '1'; var posters = [ 'https://cafedoparaiso.com/wp-content/uploads/2026/09/A-little-coffee-a-lot-of-happiness-Poster.png', 'https://cafedoparaiso.com/wp-content/uploads/2026/09/Better-brew-bigger-dreams.webp', 'https://cafedoparaiso.com/wp-content/uploads/2026/09/But-first-Coffee-posters.webp', 'https://cafedoparaiso.com/wp-content/uploads/2026/09/Coffe-more-then-a-drink-its-a-journey-poster.webp', 'https://cafedoparaiso.com/wp-content/uploads/2026/09/Come-for-the-coffee-stay-for-the-vibe-poster.png', 'https://cafedoparaiso.com/wp-content/uploads/2026/09/expectional-coffee-unofrgetable-momentents-poster.png', 'https://cafedoparaiso.com/wp-content/uploads/2026/09/Fall-in-love-with-every-sip-coffee-poster.png', 'https://cafedoparaiso.com/wp-content/uploads/2026/09/Good-Coffee-better-Days-poster.png', 'https://cafedoparaiso.com/wp-content/uploads/2026/09/Great-coffee-begins-at-the-source-poster.webp', 'https://cafedoparaiso.com/wp-content/uploads/2026/09/Specialty-Coffe-poster.webp' ]; var track = root.querySelector('.cdp-track'); var dotsBox = root.querySelector('.cdp-dots'); var message = root.querySelector('.cdp-message'); posters.forEach(function(url, i){ var card = document.createElement('div'); card.className = 'cdp-card'; var badge = document.createElement('span'); badge.className = 'cdp-badge'; badge.textContent = 'FREE'; var img = document.createElement('img'); img.className = 'cdp-img'; img.src = url; img.alt = 'Coffee Poster ' + (i + 1); img.loading = i = track.scrollWidth - 5) { return pages() - 1; } return Math.min(pages() - 1, Math.round(track.scrollLeft / (step() * perView()))); } function updateDots(){ var active = currentPage(); Array.prototype.forEach.call(dotsBox.children, function(dot, i){ dot.classList.toggle('active', i === active); dot.setAttribute('aria-current', i === active ? 'true' : 'false'); }); } function buildDots(){ dotsBox.innerHTML = ''; for (var i = 0; i < pages(); i++){ var dot = document.createElement('button'); dot.type = 'button'; dot.className = 'cdp-dot'; dot.setAttribute('aria-label', 'Go to poster page ' + (i + 1)); dot.dataset.page = i; dotsBox.appendChild(dot); } updateDots(); } function goToPage(page){ track.scrollTo({ left: Math.min(page * perView() * step(), track.scrollWidth), behavior: 'smooth' }); } root.querySelector('.cdp-prev').addEventListener('click', function(){ var page = currentPage(); goToPage(page = pages() - 1 ? 0 : page + 1); }); dotsBox.addEventListener('click', function(e){ var dot = e.target.closest('.cdp-dot'); if (dot) goToPage(Number(dot.dataset.page)); }); track.addEventListener('scroll', updateDots, {passive:true}); var resizeTimer; window.addEventListener('resize', function(){ clearTimeout(resizeTimer); resizeTimer = setTimeout(buildDots, 150); }); track.addEventListener('click', function(e){ var btn = e.target.closest('.cdp-btn'); if (!btn) return; var url = btn.dataset.url; if (!url || btn.disabled) return; btn.disabled = true; btn.textContent = 'PLEASE WAIT...'; message.textContent = ''; fetch(url) .then(function(response){ if (!response.ok) throw new Error('Download failed'); return response.blob(); }) .then(function(blob){ var objectUrl = URL.createObjectURL(blob); var a = document.createElement('a'); a.href = objectUrl; a.download = url.split('/').pop() || 'coffee-poster.png'; document.body.appendChild(a); a.click(); a.remove(); setTimeout(function(){ URL.revokeObjectURL(objectUrl); }, 2000); message.textContent = 'Your download should start shortly.'; }) .catch(function(){ message.textContent = 'Direct download unavailable. Opening the poster in a new tab.'; window.open(url, '_blank', 'noopener'); }) .finally(function(){ btn.disabled = false; btn.textContent = 'DOWNLOAD'; }); }); buildDots(); })();