Custom Audio Player<\/title>\n <style>\n \/* Reset basic styles *\/\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n \/* Main container *\/\n .custom-player {\n max-width: 600px;\n background-color: #333;\n border-radius: 12px;\n display: flex;\n align-items: center;\n padding: 16px;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;\n color: white;\n box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);\n margin: 20px auto;\n overflow: hidden;\n }\n\n \/* Image container *\/\n .player-artwork {\n width: 70px;\n height: 70px;\n flex-shrink: 0;\n margin-right: 16px;\n position: relative;\n overflow: hidden;\n border-radius: 6px;\n }\n\n .player-artwork img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n }\n\n \/* Info container *\/\n .player-info {\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n justify-content: center;\n min-width: 0; \/* Important for truncating text *\/\n }\n\n .player-title {\n font-size: 18px;\n font-weight: 600;\n margin-bottom: 4px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .player-artist {\n font-size: 14px;\n color: #ccc;\n margin-bottom: 8px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n \/* Progress bar *\/\n .progress-container {\n width: 100%;\n height: 4px;\n background-color: rgba(255, 255, 255, 0.2);\n border-radius: 2px;\n cursor: pointer;\n position: relative;\n }\n\n .progress-bar {\n height: 100%;\n background-color: #04d99d; \/* Requested highlight color *\/\n border-radius: 2px;\n width: 0%;\n transition: width 0.1s linear;\n }\n\n \/* Controls container *\/\n .player-controls {\n display: flex;\n align-items: center;\n margin-left: auto;\n flex-shrink: 0;\n }\n\n \/* Play button *\/\n .play-button {\n width: 40px;\n height: 40px;\n background-color: #04d99d; \/* Changed to highlight color *\/\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n margin-left: 16px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);\n }\n\n .play-icon, .pause-icon {\n color: white;\n font-size: 16px;\n width: 0;\n height: 0;\n }\n\n .play-icon {\n border-style: solid;\n border-width: 8px 0 8px 12px;\n border-color: transparent transparent transparent white; \/* Changed to white to contrast with green button *\/\n margin-left: 3px;\n }\n\n .pause-icon {\n display: none;\n width: 12px;\n height: 16px;\n position: relative;\n }\n\n .pause-icon:before, .pause-icon:after {\n content: \"\";\n position: absolute;\n background-color: white; \/* Changed to white to contrast with green button *\/\n width: 4px;\n height: 16px;\n top: 0;\n }\n\n .pause-icon:before {\n left: 2px;\n }\n\n .pause-icon:after {\n right: 2px;\n }\n\n \/* Options button (three dots) *\/\n .options-button {\n width: 28px;\n height: 28px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n margin-left: 16px;\n opacity: 0.8;\n }\n\n .options-icon {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n width: 16px;\n }\n\n .dot {\n width: 3px;\n height: 3px;\n background-color: white;\n border-radius: 50%;\n }\n\n \/* Time *\/\n .time-display {\n font-size: 11px;\n color: #ccc;\n margin-top: 4px;\n display: flex;\n justify-content: space-between;\n }\n\n \/* Responsive *\/\n @media (max-width: 460px) {\n .player-artwork {\n width: 60px;\n height: 60px;\n }\n\n .player-title {\n font-size: 16px;\n }\n\n .player-artist {\n font-size: 12px;\n }\n\n .options-button {\n display: none;\n }\n }\n\n @media (max-width: 360px) {\n .custom-player {\n padding: 12px;\n }\n\n .player-artwork {\n width: 50px;\n height: 50px;\n margin-right: 12px;\n }\n\n .play-button {\n width: 36px;\n height: 36px;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"custom-player\">\n <div class=\"player-artwork\">\n <img decoding=\"async\" src=\"https:\/\/www.plateapr.com\/wp-content\/uploads\/2025\/07\/FAB2024-29.jpg\" alt=\"Artwork\">\n <\/div>\n\n <div class=\"player-info\">\n <div class=\"player-title\">Puerto Rican Cuatro<\/div>\n <div class=\"player-artist\">Source: Fabiola M\u00e9ndez<\/div>\n\n <div class=\"progress-container\" id=\"progress-container\">\n <div class=\"progress-bar\" id=\"progress-bar\"><\/div>\n <\/div>\n\n <div class=\"time-display\">\n <span id=\"current-time\">0:00<\/span>\n <span id=\"duration\">0:00<\/span>\n <\/div>\n <\/div>\n\n <div class=\"player-controls\">\n <div class=\"options-button\">\n <div class=\"options-icon\">\n <div class=\"dot\"><\/div>\n <div class=\"dot\"><\/div>\n <div class=\"dot\"><\/div>\n <\/div>\n <\/div>\n\n <div class=\"play-button\" id=\"play-button\">\n <div class=\"play-icon\" id=\"play-icon\"><\/div>\n <div class=\"pause-icon\" id=\"pause-icon\"><\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <script>\n document.addEventListener('DOMContentLoaded', function() {\n \/\/ Variables\n const audio = new Audio('https:\/\/www.plateapr.com\/wp-content\/uploads\/2025\/07\/Fabiola.m4a');\n const playButton = document.getElementById('play-button');\n const playIcon = document.getElementById('play-icon');\n const pauseIcon = document.getElementById('pause-icon');\n const progressBar = document.getElementById('progress-bar');\n const progressContainer = document.getElementById('progress-container');\n const currentTimeElement = document.getElementById('current-time');\n const durationElement = document.getElementById('duration');\n\n \/\/ Initialization\n let isPlaying = false;\n\n \/\/ Format time\n function formatTime(seconds) {\n const min = Math.floor(seconds \/ 60);\n const sec = Math.floor(seconds % 60);\n return `${min}:${sec < 10 ? '0' + sec : sec}`;\n }\n\n \/\/ Update progress\n function updateProgress() {\n const { currentTime, duration } = audio;\n const progressPercent = (currentTime \/ duration) * 100;\n progressBar.style.width = `${progressPercent}%`;\n currentTimeElement.textContent = formatTime(currentTime);\n }\n\n \/\/ Load metadata\n audio.addEventListener('loadedmetadata', function() {\n durationElement.textContent = formatTime(audio.duration);\n });\n\n \/\/ Time event\n audio.addEventListener('timeupdate', updateProgress);\n\n \/\/ End event\n audio.addEventListener('ended', function() {\n isPlaying = false;\n playIcon.style.display = 'block';\n pauseIcon.style.display = 'none';\n progressBar.style.width = '0%';\n audio.currentTime = 0;\n });\n\n \/\/ Click on play\/pause button\n playButton.addEventListener('click', function() {\n if (isPlaying) {\n audio.pause();\n playIcon.style.display = 'block';\n pauseIcon.style.display = 'none';\n } else {\n audio.play().catch(e => console.error('Error playing audio:', e));\n playIcon.style.display = 'none';\n pauseIcon.style.display = 'block';\n }\n\n isPlaying = !isPlaying;\n });\n\n \/\/ Click on progress bar\n progressContainer.addEventListener('click', function(e) {\n const width = this.clientWidth;\n const clickX = e.offsetX;\n const duration = audio.duration;\n\n audio.currentTime = (clickX \/ width) * duration;\n });\n });\n <\/script>\n<\/body>\n<\/html>\n\n\n\n<p>But behind every cuatro like the one that inspired M\u00e9ndez\u2014an instrument that now has weekly exposure at <a href=\"https:\/\/www.plateapr.com\/residencia-bad-bunny-en-numeros\/\">Bad Bunny’s Residency<\/a> with artists like Jos\u00e9 Eduardo Santana performing before 14,000 spectators\u2014there’s an artisan who preserves a tradition spanning over 200 years: the luthier.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>According to the <a href=\"http:\/\/www.cuatro-pr.org\/node\/53\">Cuatro Project<\/a>, a collective that seeks to preserve the instrument’s traditions, the first cuatros were documented in the early 19th century. They were rustic four-string instruments made with native woods like guaraguao and laurel.<\/li>\n<\/ul>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Over time, it evolved to have ten strings or five double strings, giving it the broader musical range we know today.<\/li>\n<\/ul>\n\n\n\n<p>Today, that legacy continues in workshops around the island where this centuries-old art is preserved.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">What does a luthier do?<\/h2>\n\n\n\n<p>A luthier is an artisan who builds stringed instruments by hand. In Puerto Rico, these craftspeople specialize in making and repairing the Puerto Rican cuatro, preserving a tradition that defines our musical identity.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\ud83c\udfb6 The art behind the instrument<\/h3>\n\n\n\n<p>Luthier <strong>\u00c1ngel Jos\u00e9 Ortiz<\/strong> from Coamo, who has nearly two decades of experience, spoke with <strong>Platea<\/strong> about the artisanal process of creating a cuatro.<\/p>\n\n\n\n<p>His workshop is one of the few places where this art is still preserved.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img decoding=\"async\" src=\"https:\/\/www.plateapr.com\/wp-content\/uploads\/2025\/07\/c29a1bd0-37d8-4554-bea0-630772b9a599-576x1024.jpg\" alt=\"\" class=\"wp-image-27158\" style=\"width:471px;height:auto\"\/><figcaption class=\"wp-element-caption\"><em>Luthier \u00c1ngel Jos\u00e9 Ortiz has dedicated himself to preserving the art of lutherie since 2008. (Photo: Provided).<\/em><\/figcaption><\/figure>\n\n\n\n<p>“Each maker transmits a specific sound. I can make something identical to another maker, and my instrument will sound different,” explained Ortiz, who describes his sound as “strong, clear, clean.”<\/p>\n\n\n\n<p>Each cuatro is a customized work that can take weeks to create, which is why luthiers work primarily on commission.<\/p>\n\n\n<div class=\"alert-banner alert-banner--green h-padding-30 h-margin-top-30 h-margin-bottom-30\">\n <div class=\"alert-banner__heading grid-x h-margin-bottom-10\">\n <div class=\"alert-banner__title cell auto\"> <\/div>\n <\/div>\n <div class=\"alert-banner__text\">\n <p><strong>Did you know:<\/strong> Currently, the Instituto de Cultura Puertorrique\u00f1a app registers only <a href=\"https:\/\/www.plateapr.com\/artesanias-que-podrian-desaparecer-puerto-rico\/#:~:text=de%20la%20rutina-,5,-.%20Cuatro%C2%A0\">five certified luthiers<\/a> who create cuatros: Benjam\u00edn Phi Vel\u00e1zquez, Efra\u00edn Figueroa Cabrera, Freddy Burgos Nieves, Jaime Alicea, and Wilfredo Burgos Nieves, although other independent artisans also keep the tradition alive.<\/p>\n\n <\/div>\n<\/div>\n\n\n\n<h2 class=\"wp-block-heading\">The woods that sing<\/h2>\n\n\n\n<p>Before a luthier can begin their work, they must carefully select the raw material that will give voice to the instrument.<\/p>\n\n\n\n<p>As documented in <a href=\"http:\/\/www.cuatro-pr.org\/\">Proyecto Cuatro<\/a>, the first artisans used endemic woods from the island: <strong>guaraguao<\/strong>, <strong>laurel<\/strong>, <strong>maga<\/strong>, <strong>algarrobo<\/strong>, <strong>cedro macho<\/strong>, and <strong>roble blanco<\/strong>.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Today, a luthier must verify that the wood they will use is completely dry, a process that can take months or years.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/www.plateapr.com\/wp-content\/uploads\/2025\/07\/Spotlight-Bobets-Bakehouse-819x1024.png\" alt=\"\" class=\"wp-image-27150\"\/><figcaption class=\"wp-element-caption\"><em>The process of making a cuatro, like the one shown made with maga wood, can take Ortiz up to three months. (Photos: Provided).<\/em><\/figcaption><\/figure>\n\n\n\n<p>“Wood is a living material,” described Ortiz, explaining how it can absorb or release moisture from the environment, affecting the tuning and sound of the instrument.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>That’s why the creation process, which <strong>takes up to 12 weeks<\/strong>, begins with the careful selection of completely dry woods.<\/li>\n<\/ul>\n\n\n\n<p>Each stage, from carving the sound box to installing the fan bracing system, determines the sonic qualities of the final instrument.<\/p>\n\n\n\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>How to create a Puerto Rican cuatro<\/title>\n <style>\n \/* Reset and variables - isolated with ID pasos-para-fabricar-un-cuatro *\/\n #pasos-para-fabricar-un-cuatro * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n font-family: inherit;\n }\n\n #pasos-para-fabricar-un-cuatro {\n --cuatro-primary: #04d99d;\n --cuatro-primary-light: #62d4a1;\n --cuatro-accent: #07c76b;\n --cuatro-text: #2c3e50;\n --cuatro-text-light: #6c7b7f;\n --cuatro-bg: #ffffff;\n --cuatro-border: #e8f4f0;\n --cuatro-shadow: rgba(4, 217, 157, 0.08);\n\n max-width: 100%;\n margin: 0 auto;\n background: linear-gradient(135deg, #fef9e7 0%, #f8f9fa 100%);\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;\n padding: 1rem 0;\n position: relative;\n min-height: 100vh;\n }\n\n \/* Header with more artisanal style *\/\n #pasos-para-fabricar-un-cuatro .cuatro_header {\n text-align: center;\n margin-bottom: 1.5rem;\n padding: 0 1rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_title {\n font-size: 1.4rem;\n font-weight: 800;\n color: var(--cuatro-text);\n margin-bottom: 0.5rem;\n line-height: 1.2;\n text-shadow: 0 2px 4px rgba(0,0,0,0.1);\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_subtitle {\n color: var(--cuatro-text-light);\n font-size: 0.95rem;\n line-height: 1.3;\n max-width: 600px;\n margin: 0 auto;\n font-style: italic;\n }\n\n \/* Decorative elements *\/\n #pasos-para-fabricar-un-cuatro .cuatro_header::after {\n content: \"\ud83c\udfb5\";\n display: block;\n font-size: 2rem;\n margin-top: 0.5rem;\n opacity: 0.7;\n }\n\n \/* Carousel with more artistic design - FIXED OVERFLOW *\/\n #pasos-para-fabricar-un-cuatro .cuatro_carousel_wrapper {\n position: relative;\n width: 100%;\n overflow: visible; \/* Changed from hidden *\/\n padding: 1.5rem 1rem 0 1rem; \/* Added top padding for number badges *\/\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_carousel_container {\n display: flex;\n width: 100%;\n position: relative;\n overflow: hidden; \/* Keep hidden here for slide clipping *\/\n border-radius: 20px; \/* Optional: adds nice rounded corners to viewport *\/\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_carousel_track {\n display: flex;\n width: 100%;\n transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);\n will-change: transform;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_slide {\n width: 100%;\n flex-shrink: 0;\n display: flex;\n justify-content: center;\n align-items: flex-start;\n padding: 1rem 0.75rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card {\n width: 100%;\n max-width: 520px;\n background: linear-gradient(145deg, #ffffff 0%, #fdfbfb 100%);\n border: 3px solid var(--cuatro-border);\n border-radius: 15px;\n padding: 1.5rem;\n padding-top: 2rem; \/* Extra top padding for number *\/\n box-shadow: 0 10px 25px var(--cuatro-shadow), 0 4px 10px rgba(0,0,0,0.05);\n transition: all 0.4s ease;\n position: relative;\n opacity: 0.75;\n transform: scale(0.95) rotateY(5deg);\n perspective: 1000px;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_slide.active .cuatro_card {\n opacity: 1;\n transform: scale(1) rotateY(0deg);\n border-color: var(--cuatro-primary-light);\n box-shadow: 0 15px 35px rgba(4, 217, 157, 0.15), 0 5px 15px rgba(0,0,0,0.1);\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_number {\n position: absolute;\n top: -18px;\n left: 2rem;\n background: linear-gradient(135deg, #07c76b 0%, #04d99d 50%, #62d4a1 100%);\n color: white;\n width: 2.5rem;\n height: 2.5rem;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n font-weight: 800;\n font-size: 1.1rem;\n box-shadow: 0 6px 15px rgba(4, 217, 157, 0.4);\n border: 3px solid white;\n z-index: 10;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_content {\n padding-top: 0.8rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_title {\n font-size: 1.3rem;\n font-weight: 700;\n color: var(--cuatro-text);\n margin-bottom: 1rem;\n line-height: 1.3;\n position: relative;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_title::after {\n content: \"\";\n position: absolute;\n bottom: -8px;\n left: 0;\n width: 50px;\n height: 3px;\n background: linear-gradient(90deg, var(--cuatro-primary) 0%, var(--cuatro-primary-light) 100%);\n border-radius: 2px;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_text {\n color: var(--cuatro-text-light);\n font-size: 1rem;\n line-height: 1.6;\n margin-bottom: 1rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_details {\n background: rgba(4, 217, 157, 0.05);\n border-left: 4px solid var(--cuatro-primary);\n padding: 1rem;\n border-radius: 8px;\n font-size: 0.95rem;\n line-height: 1.5;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_text strong,\n #pasos-para-fabricar-un-cuatro .cuatro_card_details strong {\n color: var(--cuatro-text);\n font-weight: 600;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_time_estimate {\n display: inline-flex;\n align-items: center;\n gap: 0.5rem;\n background: var(--cuatro-primary-light);\n color: white;\n padding: 0.4rem 0.8rem;\n border-radius: 20px;\n font-size: 0.85rem;\n font-weight: 600;\n margin-top: 0.5rem;\n }\n\n \/* Navigation with more elaborate style *\/\n #pasos-para-fabricar-un-cuatro .cuatro_navigation {\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 1rem;\n margin-top: 2rem;\n padding: 0 1rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_nav_btn {\n background: linear-gradient(135deg, #07c76b 0%, #04d99d 50%, #62d4a1 100%);\n color: white;\n border: none;\n width: 2.5rem;\n height: 2.5rem;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all 0.3s ease;\n box-shadow: 0 6px 15px rgba(4, 217, 157, 0.3);\n border: 2px solid white;\n position: relative;\n z-index: 100;\n pointer-events: auto;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_nav_btn:hover:not(:disabled) {\n transform: scale(1.1) translateY(-2px);\n box-shadow: 0 8px 20px rgba(4, 217, 157, 0.4);\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_nav_btn svg {\n width: 18px;\n height: 18px;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_indicators {\n display: flex;\n gap: 0.6rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_dot {\n width: 0.6rem;\n height: 0.6rem;\n border-radius: 50%;\n background-color: #ddd;\n cursor: pointer;\n transition: all 0.3s ease;\n border: 2px solid transparent;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_dot.active {\n background-color: var(--cuatro-primary);\n width: 2rem;\n border-radius: 1rem;\n border-color: white;\n box-shadow: 0 2px 8px rgba(4, 217, 157, 0.3);\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_counter {\n color: var(--cuatro-text);\n font-size: 0.9rem;\n font-weight: 600;\n min-width: 3.5rem;\n text-align: center;\n background: white;\n padding: 0.4rem 0.8rem;\n border-radius: 20px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.1);\n }\n\n \/* More elegant progress bar *\/\n #pasos-para-fabricar-un-cuatro .cuatro_progress {\n width: 100%;\n max-width: 400px;\n height: 6px;\n background-color: #f0f0f0;\n margin: 2rem auto 0;\n border-radius: 3px;\n overflow: hidden;\n box-shadow: inset 0 2px 4px rgba(0,0,0,0.1);\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_progress_bar {\n height: 100%;\n background: linear-gradient(90deg, var(--cuatro-primary) 0%, var(--cuatro-primary-light) 100%);\n width: 12.5%;\n transition: width 0.5s ease;\n border-radius: 3px;\n box-shadow: 0 0 10px rgba(4, 217, 157, 0.5);\n }\n\n \/* Responsive Design *\/\n @media (min-width: 768px) {\n #pasos-para-fabricar-un-cuatro {\n padding: 3rem 0;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_title {\n font-size: 2.2rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_subtitle {\n font-size: 1.1rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_slide {\n padding: 1.5rem 1rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card {\n padding: 2.5rem;\n padding-top: 3rem;\n max-width: 650px;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_number {\n width: 3rem;\n height: 3rem;\n font-size: 1.2rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_title {\n font-size: 1.5rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_text {\n font-size: 1.1rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_nav_btn {\n width: 3rem;\n height: 3rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_nav_btn svg {\n width: 20px;\n height: 20px;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_navigation {\n gap: 1.5rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_counter {\n font-size: 1rem;\n min-width: 4rem;\n }\n }\n\n @media (min-width: 1024px) {\n #pasos-para-fabricar-un-cuatro {\n max-width: 1200px;\n padding: 4rem 2rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_title {\n font-size: 2.8rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_slide {\n padding: 2rem 1.5rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card {\n padding: 3rem;\n padding-top: 3.5rem;\n max-width: 750px;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_title {\n font-size: 1.7rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_text {\n font-size: 1.15rem;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div id=\"pasos-para-fabricar-un-cuatro\">\n <header class=\"cuatro_header\">\n <h1 class=\"cuatro_title\">How to create a Puerto Rican cuatro<\/h1>\n <p class=\"cuatro_subtitle\">\n The traditional art of criollo lutherie step by step\n <\/p>\n <\/header>\n\n <div class=\"cuatro_carousel_wrapper\">\n <div class=\"cuatro_carousel_container\">\n <div class=\"cuatro_carousel_track\" id=\"cuatro-track\">\n \n <div class=\"cuatro_slide active\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">1<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Design and initial cut<\/h3>\n <p class=\"cuatro_card_text\">Uses a cuatro template to trace its design on a piece of wood. Then cuts and sands it to create the body and neck of the instrument to the desired size.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_slide\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">2<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Creating the sound box<\/h3>\n <p class=\"cuatro_card_text\">Hollows out the body with a drill until leaving a bottom almost an inch thick. This hollow space is known as the sound box and is what helps amplify the cuatro’s sound.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_slide\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">3<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Soundboard and rosette<\/h3>\n <p class=\"cuatro_card_text\">Joins two wooden planks to create the soundboard, which will cover the sound box. Also makes a hole in the center of the soundboard and insets the rosette, which is the ornament around the edge of the centered opening.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_slide\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">4<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Fan bracing system<\/h3>\n <p class=\"cuatro_card_text\">On the interior side of the soundboard, the luthier glues strips that will form the fan bracing. This system will assist in amplifying and directing the sound. Once the soundboard is finished, it’s glued to the sound box as aligned and precise as possible.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_slide\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">5<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Marquetry and fingerboard<\/h3>\n <p class=\"cuatro_card_text\">On the edges of the cuatro, creates the channels where the marquetry will go, the fine ornament that surrounds it. Also works on the fingerboard, the wood on the neck where fingers are placed to create musical notes.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_slide\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">6<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Frets and custom design<\/h3>\n <p class=\"cuatro_card_text\">Once the fingerboard is glued to the neck, installs the frets, which mark the position of the notes. Carves the neck with a unique design of their authorship that identifies their artisanal work. Also creates the headstock where the tuning pegs will go.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_slide\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">7<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Final touches<\/h3>\n <p class=\"cuatro_card_text\">Among the final steps, glues the bridge, the base where the instrument’s strings are placed. Then, installs the strings, calibrates the nut, a thin bar at the beginning of the fingerboard that keeps the strings straight and properly positioned, and tunes the instrument for use.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_navigation\">\n <button id=\"cuatro-prev-btn\" class=\"cuatro_nav_btn\" disabled>\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n <polyline points=\"15 18 9 12 15 6\"><\/polyline>\n <\/svg>\n <\/button>\n\n <div class=\"cuatro_counter\">\n <span id=\"cuatro-current\">1<\/span> \/ <span id=\"cuatro-total\">7<\/span>\n <\/div>\n\n <div class=\"cuatro_indicators\" id=\"cuatro-indicators\">\n <div class=\"cuatro_dot active\"><\/div>\n <div class=\"cuatro_dot\"><\/div>\n <div class=\"cuatro_dot\"><\/div>\n <div class=\"cuatro_dot\"><\/div>\n <div class=\"cuatro_dot\"><\/div>\n <div class=\"cuatro_dot\"><\/div>\n <div class=\"cuatro_dot\"><\/div>\n <\/div>\n\n <button id=\"cuatro-next-btn\" class=\"cuatro_nav_btn\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n <polyline points=\"9 18 15 12 9 6\"><\/polyline>\n <\/svg>\n <\/button>\n <\/div>\n\n <div class=\"cuatro_progress\">\n <div class=\"cuatro_progress_bar\" id=\"cuatro-progress-bar\"><\/div>\n <\/div>\n <\/div>\n\n <script>\n \/\/ Simple inline script that will definitely work\n window.addEventListener('load', function() {\n var currentIndex = 0;\n var totalSlides = 7;\n\n \/\/ Get elements using getElementById for maximum compatibility\n var track = document.getElementById('cuatro-track');\n var prevBtn = document.getElementById('cuatro-prev-btn');\n var nextBtn = document.getElementById('cuatro-next-btn');\n var currentSpan = document.getElementById('cuatro-current');\n var totalSpan = document.getElementById('cuatro-total');\n var progressBar = document.getElementById('cuatro-progress-bar');\n\n \/\/ Simple update function\n function updateCarousel() {\n \/\/ Move the track\n if (track) {\n track.style.transform = 'translateX(-' + (currentIndex * 100) + '%)';\n }\n\n \/\/ Update counter\n if (currentSpan) {\n currentSpan.innerHTML = currentIndex + 1;\n }\n\n \/\/ Update buttons\n if (prevBtn) {\n prevBtn.disabled = currentIndex === 0;\n }\n if (nextBtn) {\n nextBtn.disabled = currentIndex === totalSlides - 1;\n }\n\n \/\/ Update progress\n if (progressBar) {\n var progress = ((currentIndex + 1) \/ totalSlides) * 100;\n progressBar.style.width = progress + '%';\n }\n\n \/\/ Update active states\n var slides = document.querySelectorAll('#pasos-para-fabricar-un-cuatro .cuatro_slide');\n for (var i = 0; i < slides.length; i++) {\n if (i === currentIndex) {\n slides[i].className = 'cuatro_slide active';\n } else {\n slides[i].className = 'cuatro_slide';\n }\n }\n\n var dots = document.querySelectorAll('#pasos-para-fabricar-un-cuatro .cuatro_dot');\n for (var j = 0; j < dots.length; j++) {\n if (j === currentIndex) {\n dots[j].className = 'cuatro_dot active';\n } else {\n dots[j].className = 'cuatro_dot';\n }\n }\n }\n\n \/\/ Next button\n if (nextBtn) {\n nextBtn.onclick = function() {\n if (currentIndex < totalSlides - 1) {\n currentIndex++;\n updateCarousel();\n }\n return false;\n };\n }\n\n \/\/ Previous button\n if (prevBtn) {\n prevBtn.onclick = function() {\n if (currentIndex > 0) {\n currentIndex--;\n updateCarousel();\n }\n return false;\n };\n }\n\n \/\/ Dot clicks\n var dots = document.querySelectorAll('#pasos-para-fabricar-un-cuatro .cuatro_dot');\n for (var k = 0; k < dots.length; k++) {\n (function(index) {\n dots[index].onclick = function() {\n currentIndex = index;\n updateCarousel();\n };\n })(k);\n }\n\n \/\/ Initialize\n if (totalSpan) {\n totalSpan.innerHTML = totalSlides;\n }\n updateCarousel();\n });\n <\/script>\n<\/body>\n<\/html>\n\n\n\n<h2 class=\"wp-block-heading\">Preserving the tradition<\/h2>\n\n\n\n<p>In his workshop in Coamo, Ortiz doesn't just create instruments; he also teaches the art of building them.<\/p>\n\n\n\n<p><strong>\"The more luthiers there are, the more cuatros there will be,\"<\/strong> affirmed Ortiz, who feels proud to transmit his knowledge \"so that the culture stays alive.\"<\/p>\n\n\n\n<p>As a guitar musician, Ausberto Ramos Rodr\u00edguez, 43, always had curiosity about the manufacturing process. He saw an ad on Facebook for Ortiz's course and decided to take it between February and August of last year.<\/p>\n\n\n\n<p>\"I had always had that interest in making guitar instruments and the world of lutherie attracted me quite a bit,\" said Ramos Rodr\u00edguez, a native of Vega Alta.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img decoding=\"async\" src=\"https:\/\/www.plateapr.com\/wp-content\/uploads\/2025\/07\/1-b7f3a783-1024x577.jpg\" alt=\"\" class=\"wp-image-27153\" style=\"aspect-ratio:1.7747041333877456;width:783px;height:auto\"\/><figcaption class=\"wp-element-caption\"><em>One of Ortiz's students crafting the acoustic soundboard of his instrument. Photo: Provided<\/em><\/figcaption><\/figure>\n\n\n\n<p>Meanwhile, Javier Ortiz, 52, a resident of Morovis, also took the course to learn about woods and how the natural material affects the sound.<\/p>\n\n\n\n<p>For both apprentices, their teacher's guidance was excellent as they watched wooden planks transform into instruments with their own hands.<\/p>\n\n\n\n<p>\"The most beautiful thing is being able to hear the instrument once you finish it. I mean, that feeling that <strong>with your hands you made something that sounds<\/strong> <strong>and brings you joy<\/strong>,\" added Ramos Rodr\u00edguez.<\/p>\n\n\n\n<p>Both students agree: learning and continuing the tradition is fundamental to preserving this Puerto Rican cultural heritage.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">The relationship between musician and luthier<\/h2>\n\n\n\n<p>For professional cuatristas like M\u00e9ndez, who is <a href=\"https:\/\/www.berklee.edu\/berklee-now\/news\/berklee-alumna-fabiola-m-mendez-receives-a-2022-whippoorwill-arts-fellowship\">the first graduate<\/a> of Berklee College of Music to specialize in the Puerto Rican cuatro, finding the right luthier is just as important as learning to play it.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/www.plateapr.com\/wp-content\/uploads\/2025\/07\/Copy-of-Web-Hero-Images-pocillo-68-1024x576.png\" alt=\"\" class=\"wp-image-27159\"\/><figcaption class=\"wp-element-caption\"><em>Cuatrista Fabiola M\u00e9ndez with her first cuatro. Photo: Provided<\/em><\/figcaption><\/figure>\n\n\n\n<p>\"When you find that luthier who makes instruments <strong>the way you like them, who knows you<\/strong>, well, you create that quite long-lasting relationship,\" said the cuatrista.<\/p>\n\n\n\n<p>Throughout her career, M\u00e9ndez has worked with renowned artisans like Jesiel Mart\u00ednez, a young 27-year-old luthier with 12 years of experience who designed a cuatro used in <a href=\"https:\/\/www.plateapr.com\/debi-tirar-mas-fotos-de-bad-bunny-una-inmersion-en-la-identidad-puertorriquena\/\">DeB\u00cd TiRAR M\u00e1S FOToS<\/a>, Bad Bunny's latest album, and Aurelio Cruz, who has dedicated his life to lutherie since age 13.<\/p>\n\n\n\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Where to find cuatro artisans<\/title>\n <style>\n \/* Reset and variables - isolated with prefix cuatro_ *\/\n .cuatro_container * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n font-family: inherit;\n }\n\n .cuatro_container {\n --cuatro-primary: #04d99d;\n --cuatro-primary-light: #5eedc0;\n --cuatro-text: #2c3e50;\n --cuatro-text-light: #6c7b7f;\n --cuatro-bg: #ffffff;\n --cuatro-border: #e8f4f0;\n --cuatro-shadow: rgba(4, 217, 157, 0.08);\n\n max-width: 100%;\n margin: 0 auto;\n background-color: var(--cuatro-bg);\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;\n padding: 1rem 0;\n position: relative;\n }\n\n \/* Header *\/\n .cuatro_header {\n text-align: center;\n margin-bottom: 1rem;\n padding: 0 1rem;\n }\n\n .cuatro_title {\n font-size: 1.3rem;\n font-weight: 700;\n color: var(--cuatro-text);\n margin-bottom: 1rem;\n line-height: 1.1;\n }\n\n .cuatro_subtitle {\n color: var(--cuatro-text-light);\n font-size: 0.9rem;\n line-height: 1.2;\n max-width: 600px;\n margin: 0 auto;\n }\n\n .cuatro_subtitle a {\n color: var(--cuatro-primary);\n text-decoration: none;\n font-weight: 500;\n border-bottom: 1px solid transparent;\n transition: border-color 0.2s ease;\n }\n\n .cuatro_subtitle a:hover {\n border-bottom-color: var(--cuatro-primary);\n }\n\n \/* New carousel architecture - designed from scratch to be robust *\/\n .cuatro_carousel_wrapper {\n position: relative;\n width: 100%;\n overflow: hidden;\n padding: 0 1rem;\n }\n\n .cuatro_carousel_container {\n display: flex;\n width: 100%;\n position: relative;\n }\n\n .cuatro_carousel_track {\n display: flex;\n width: 100%;\n transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);\n will-change: transform;\n }\n\n .cuatro_slide {\n width: 100%;\n flex-shrink: 0;\n display: flex;\n justify-content: center;\n align-items: flex-start;\n padding: 1rem 0.75rem;\n }\n\n .cuatro_card {\n width: 100%;\n max-width: 500px;\n background-color: var(--cuatro-bg);\n border: 2px solid var(--cuatro-border);\n border-radius: 10px;\n padding: 1.3rem;\n box-shadow: 0 8px 20px var(--cuatro-shadow);\n transition: all 0.3s ease;\n position: relative;\n opacity: 0.7;\n transform: scale(0.98);\n }\n\n .cuatro_slide.active .cuatro_card {\n opacity: 1;\n transform: scale(1);\n border-color: var(--cuatro-primary-light);\n box-shadow: 0 12px 25px rgba(4, 217, 157, 0.12);\n }\n\n .cuatro_card_content {\n padding-top: 0;\n }\n\n .cuatro_card_title {\n font-size: 1.25rem;\n font-weight: 700;\n color: var(--cuatro-text);\n margin-bottom: 1rem;\n line-height: 1.4;\n }\n\n .cuatro_card_text {\n color: var(--cuatro-text-light);\n font-size: 1rem;\n line-height: 1.5;\n }\n\n .cuatro_card_text strong {\n color: var(--cuatro-text);\n display: block;\n margin-bottom: 0.25rem;\n }\n\n .cuatro_card_text a {\n color: var(--cuatro-primary);\n text-decoration: none;\n font-weight: 500;\n border-bottom: 1px solid transparent;\n transition: border-color 0.2s ease;\n }\n\n .cuatro_card_text a:hover {\n border-bottom-color: var(--cuatro-primary);\n }\n\n \/* Navigation *\/\n .cuatro_navigation {\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 1rem;\n margin-top: 2rem;\n padding: 0 1rem;\n }\n\n .cuatro_nav_btn {\n background-color: var(--cuatro-primary);\n color: white;\n border: none;\n width: 3rem;\n height: 3rem;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all 0.2s ease;\n box-shadow: 0 4px 12px rgba(4, 217, 157, 0.2);\n }\n\n .cuatro_nav_btn:hover:not(:disabled) {\n background-color: #03b583;\n transform: scale(1.05);\n }\n\n .cuatro_nav_btn:disabled {\n background-color: #ddd;\n cursor: not-allowed;\n opacity: 0.5;\n transform: scale(1);\n box-shadow: none;\n }\n\n .cuatro_indicators {\n display: flex;\n gap: 0.5rem;\n }\n\n .cuatro_dot {\n width: 0.5rem;\n height: 0.5rem;\n border-radius: 50%;\n background-color: #ddd;\n cursor: pointer;\n transition: all 0.2s ease;\n }\n\n .cuatro_dot.active {\n background-color: var(--cuatro-primary);\n width: 1.5rem;\n border-radius: 0.75rem;\n }\n\n .cuatro_counter {\n color: var(--cuatro-text-light);\n font-size: 0.9rem;\n font-weight: 500;\n min-width: 3rem;\n text-align: center;\n }\n\n \/* Progress bar *\/\n .cuatro_progress {\n width: 100%;\n height: 2px;\n background-color: #f0f0f0;\n margin-top: 1.5rem;\n border-radius: 1px;\n overflow: hidden;\n }\n\n .cuatro_progress_bar {\n height: 100%;\n background-color: var(--cuatro-primary);\n width: 33.33%;\n transition: width 0.4s ease;\n border-radius: 1px;\n }\n\n \/* Responsive Design - Progressive scaling of the complete system *\/\n @media (min-width: 768px) {\n .cuatro_container {\n padding: 3rem 0;\n }\n\n .cuatro_title {\n font-size: 2.1rem;\n }\n\n .cuatro_subtitle {\n font-size: 1rem;\n }\n\n .cuatro_slide {\n padding: 1rem 1rem;\n }\n\n .cuatro_card {\n padding: 2rem;\n max-width: 600px;\n }\n\n .cuatro_card_title {\n font-size: 1.4rem;\n }\n\n .cuatro_card_text {\n font-size: 1.05rem;\n }\n }\n\n @media (min-width: 1024px) {\n .cuatro_container {\n max-width: 1200px;\n padding: 4rem 2rem;\n }\n\n .cuatro_title {\n font-size: 2.5rem;\n }\n\n .cuatro_slide {\n padding: 1rem 1.5rem;\n }\n\n .cuatro_card {\n padding: 3rem;\n max-width: 700px;\n }\n\n .cuatro_card_title {\n font-size: 1.5rem;\n }\n\n .cuatro_card_text {\n font-size: 1.1rem;\n }\n }\n\n @media (min-width: 1400px) {\n .cuatro_card {\n max-width: 800px;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"cuatro_container\">\n \n <header class=\"cuatro_header\">\n <h1 class=\"cuatro_title\">3\ufe0f\u20e3 Tips for your custom cuatro<\/h1>\n <p class=\"cuatro_subtitle\">\n If you're considering ordering your own cuatro, these are the key aspects you should discuss with your luthier\n <\/p>\n <\/header>\n\n \n <div class=\"cuatro_carousel_wrapper\">\n <div class=\"cuatro_carousel_container\">\n <div class=\"cuatro_carousel_track\" id=\"cuatro_track\">\n \n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"cuatro_navigation\">\n <button id=\"cuatro_prev_btn\" class=\"cuatro_nav_btn\" disabled>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n <polyline points=\"15 18 9 12 15 6\"><\/polyline>\n <\/svg>\n <\/button>\n\n <div class=\"cuatro_indicators\" id=\"cuatro_indicators\">\n \n <\/div>\n\n <button id=\"cuatro_next_btn\" class=\"cuatro_nav_btn\">\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n <polyline points=\"9 18 15 12 9 6\"><\/polyline>\n <\/svg>\n <\/button>\n <\/div>\n\n \n <div class=\"cuatro_progress\">\n <div class=\"cuatro_progress_bar\" id=\"cuatro_progress_bar\"><\/div>\n <\/div>\n <\/div>\n\n <script>\n (function() {\n \/\/ IIFE for complete code isolation\n\n \/\/ Data for custom cuatro tips\n const cuatroData = [\n {\n id: 1,\n title: \"\ud83c\udfb6 Balanced sonority\",\n content: `\"There should be a balanced register between low and high sounds,\" explained M\u00e9ndez.`\n },\n {\n id: 2,\n title: \"\ud83c\udfb6 Comfortable action\",\n content: `The strings should have just the right tension. \"If I feel the action is too hard, it means I have to press too much,\" emphasized the Emmy-nominated composer.`\n },\n {\n id: 3,\n title: \"\ud83d\udcb8 Investment in quality\",\n content: `\"A cheap cuatro ends up being expensive... It's hard to play and doesn't sound good, versus paying a little more for a student cuatro made by Puerto Rican luthiers,\" she advised.`\n }\n ];\n\n \/\/ DOM references\n const track = document.getElementById('cuatro_track');\n const indicatorsContainer = document.getElementById('cuatro_indicators');\n const prevBtn = document.getElementById('cuatro_prev_btn');\n const nextBtn = document.getElementById('cuatro_next_btn');\n const progressBar = document.getElementById('cuatro_progress_bar');\n\n let currentIndex = 0;\n const totalSlides = cuatroData.length;\n\n \/\/ Build slide structure\n function buildCarousel() {\n \/\/ Create each slide with its corresponding card\n cuatroData.forEach((item, index) => {\n const slide = document.createElement('div');\n slide.className = `cuatro_slide ${index === 0 ? 'active' : ''}`;\n\n slide.innerHTML = `\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">${item.title}<\/h3>\n <p class=\"cuatro_card_text\">${item.content}<\/p>\n <\/div>\n <\/div>\n `;\n\n track.appendChild(slide);\n });\n }\n\n \/\/ Build navigation indicators\n function buildIndicators() {\n for (let i = 0; i < totalSlides; i++) {\n const dot = document.createElement('div');\n dot.className = `cuatro_dot ${i === 0 ? 'active' : ''}`;\n dot.addEventListener('click', () => navigateToSlide(i));\n indicatorsContainer.appendChild(dot);\n }\n }\n\n \/\/ Main navigation function - robust architecture\n function navigateToSlide(targetIndex) {\n \/\/ Index validation\n if (targetIndex < 0 || targetIndex >= totalSlides) return;\n\n \/\/ Update current index\n currentIndex = targetIndex;\n\n \/\/ Calculate displacement - each slide takes exactly 100% of the container\n const translateXValue = -(currentIndex * 100);\n\n \/\/ Apply transformation to track\n track.style.transform = `translateX(${translateXValue}%)`;\n\n \/\/ Update visual states of slides\n const slides = document.querySelectorAll('.cuatro_slide');\n slides.forEach((slide, index) => {\n slide.classList.toggle('active', index === currentIndex);\n });\n\n \/\/ Update indicators\n const dots = document.querySelectorAll('.cuatro_dot');\n dots.forEach((dot, index) => {\n dot.classList.toggle('active', index === currentIndex);\n });\n\n \/\/ Update navigation controls\n prevBtn.disabled = currentIndex === 0;\n nextBtn.disabled = currentIndex === totalSlides - 1;\n\n \/\/ Update progress bar\n const progressPercentage = ((currentIndex + 1) \/ totalSlides) * 100;\n progressBar.style.width = `${progressPercentage}%`;\n }\n\n \/\/ Set up all interactivity\n function setupInteractivity() {\n \/\/ Navigation buttons\n prevBtn.addEventListener('click', () => {\n if (currentIndex > 0) {\n navigateToSlide(currentIndex - 1);\n }\n });\n\n nextBtn.addEventListener('click', () => {\n if (currentIndex < totalSlides - 1) {\n navigateToSlide(currentIndex + 1);\n }\n });\n\n \/\/ Touch navigation for mobile devices\n let touchStartX = 0;\n let touchEndX = 0;\n let touchStartTime = 0;\n\n track.addEventListener('touchstart', (e) => {\n touchStartX = e.changedTouches[0].screenX;\n touchStartTime = Date.now();\n }, { passive: true });\n\n track.addEventListener('touchend', (e) => {\n touchEndX = e.changedTouches[0].screenX;\n const touchDuration = Date.now() - touchStartTime;\n\n \/\/ Only process quick swipes to avoid conflicts with scroll\n if (touchDuration < 300) {\n handleTouchSwipe();\n }\n }, { passive: true });\n\n function handleTouchSwipe() {\n const swipeThreshold = 50;\n const swipeDistance = touchStartX - touchEndX;\n\n if (Math.abs(swipeDistance) > swipeThreshold) {\n if (swipeDistance > 0) {\n \/\/ Swipe left - next slide\n if (currentIndex < totalSlides - 1) {\n navigateToSlide(currentIndex + 1);\n }\n } else {\n \/\/ Swipe right - previous slide\n if (currentIndex > 0) {\n navigateToSlide(currentIndex - 1);\n }\n }\n }\n }\n\n \/\/ Keyboard navigation for accessibility\n document.addEventListener('keydown', (e) => {\n if (e.target.closest('.cuatro_container')) {\n if (e.key === 'ArrowLeft' && currentIndex > 0) {\n e.preventDefault();\n navigateToSlide(currentIndex - 1);\n } else if (e.key === 'ArrowRight' && currentIndex < totalSlides - 1) {\n e.preventDefault();\n navigateToSlide(currentIndex + 1);\n }\n }\n });\n }\n\n \/\/ Complete component initialization\n function initializeCarousel() {\n \/\/ Verify all DOM elements exist before proceeding\n if (!track || !indicatorsContainer || !prevBtn || !nextBtn || !progressBar) {\n console.error('Some cuatro carousel DOM elements were not found');\n return;\n }\n\n buildCarousel();\n buildIndicators();\n setupInteractivity();\n\n \/\/ Set initial values\n navigateToSlide(0);\n }\n\n \/\/ Run initialization when DOM is fully loaded\n if (document.readyState === 'loading') {\n document.addEventListener('DOMContentLoaded', initializeCarousel);\n } else {\n \/\/ Use setTimeout to ensure DOM is fully rendered\n setTimeout(initializeCarousel, 0);\n }\n })();\n <\/script>\n<\/body>\n<\/html>\n\n\n\n<h2 class=\"wp-block-heading\">Which artisans make cuatros and offer workshops?<\/h2>\n\n\n\n<p>For those looking for a custom cuatro or wanting to learn the art of lutherie, these are the workshops and artisans available in Puerto Rico:<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong><a href=\"https:\/\/www.facebook.com\/jesiel.martinez.16\">Jesiel Mart\u00ednez<\/a><\/strong><\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Artisan Jesiel Mart\u00ednez is located in Barrio Alto Sano, San Sebasti\u00e1n. He's 27 years old and already has about 12 years of experience making cuatros, bordon\u00faas, tiples, electric cuatros, requintos, guitars, Cuban tres, g\u00fciros, and other musical instruments.<\/li>\n<\/ul>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Some of his instruments have been featured in the album <a href=\"https:\/\/www.plateapr.com\/debi-tirar-mas-fotos-de-bad-bunny-una-inmersion-en-la-identidad-puertorriquena\/\">DeB\u00cd TiRAR M\u00e1S FOToS by Bad Bunny<\/a>, such as M\u00e9ndez's bordon\u00faa and <a href=\"https:\/\/youtu.be\/gGrPqp_SNy8?si=MtCng8SkQ3yQookv\">cuatrista Jos\u00e9 Eduardo Santana's electric cuatro<\/a>. You can contact him at (939) 437-0412.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\"><strong><a href=\"https:\/\/www.facebook.com\/reparacionmusicalinstruments\">Aurelio Cruz<\/a><\/strong><\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Since age 13, this artisan has dedicated his life to the lutherie of tiples, cuatros, bordon\u00faas, and other popular and endemic stringed instruments from the island. You can see his most recent works through <a href=\"https:\/\/www.facebook.com\/reparacionmusicalinstruments\">his Facebook page<\/a> and request a free quote by contacting (787) 618-6872 or through his email.<\/li>\n<\/ul>\n\n\n<div class=\"alert-banner alert-banner--green h-padding-30 h-margin-top-30 h-margin-bottom-30\">\n <div class=\"alert-banner__heading grid-x h-margin-bottom-10\">\n <div class=\"alert-banner__title cell auto\"> <\/div>\n <\/div>\n <div class=\"alert-banner__text\">\n <p><strong>Platea tip: <\/strong><a href=\"https:\/\/www.plateapr.com\/artesanias-que-podrian-desaparecer-puerto-rico\/\">Puerto Rican crafts that could disappear if not preserved<\/a><\/p>\n\n <\/div>\n<\/div>\n\n\n\n<h3 class=\"wp-block-heading\"><strong><a href=\"https:\/\/www.google.com\/maps\/place\/Taller+100x35\/@18.2929153,-66.3937792,809m\/data=!3m1!1e3!4m6!3m5!1s0x8c033b4918761753:0xefdc5a225cd87e44!8m2!3d18.2929153!4d-66.3937792!16s%2Fg%2F11h4k6st4r?entry=ttu&g_ep=EgoyMDI1MDcyOC4wIKXMDSoASAFQAw%3D%3D\">Taller 100x35<\/a><\/strong><\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Distinguished luthier \u00c1ngel Luis \"Wimbo\" Rivera works with cuatros, tres, tiples, bordon\u00faas, requintos, and guitars in his workshop in Morovis, with over three decades of experience in his craft. You can call or send a text message to (787) 618-0703.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\"><strong><a href=\"https:\/\/puertoricancuatro.com\/\">Puerto Rican Cuatro<\/a><\/strong><\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li>The process of crafting Puerto Rican Cuatro's artisanal pieces requires four to six weeks, ensuring an excellent quality finish. Interested parties can order a Puerto Rican cuatro or other instruments by visiting <strong>puertoricancuatro.com<\/strong>.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\"><strong><a href=\"https:\/\/www.tallerdelcuatro.com\/\">El Taller del Cuatro<\/a><\/strong><\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li>This family business has dedicated over two decades to the construction and repair of cuatros, as well as offering musical instruction on the instrument and selling accessories related to this Puerto Rican musical symbol. Customers can place their orders directly at their facilities in Bayam\u00f3n or through their digital platform <strong><a href=\"http:\/\/www.tallerdelcuatro.com\">www.tallerdelcuatro.com<\/a><\/strong>.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">From craftsmanship to the future of the instrument<\/h2>\n\n\n\n<p>As more popular songs continue to integrate the cuatro and listeners identify the instrument, the luthier's craft will continue to be fundamental in Puerto Rico.<\/p>\n\n\n\n<p>\"They do us a huge favor,\" emphasizes M\u00e9ndez about artists like Bad Bunny, \"they put the instrument in the place it deserves, but with a different narrative, especially in the eyes of young people\u2014that it's a <em>'cool'<\/em> instrument, that it's an instrument that represents me as a Puerto Rican and, therefore, I'm going to embrace it with pride, and <strong>I'm going to respect it and want to listen to that music and promote it<\/strong>.\"<\/p>\n\n\n\n<p>\ud83c\udfa7 <strong>Save this playlist if you want to appreciate the Puerto Rican cuatro across various genres:<\/strong><\/p>\n\n\n\n<iframe data-testid=\"embed-iframe\" style=\"border-radius:12px\" src=\"https:\/\/open.spotify.com\/embed\/playlist\/4F3GRoIwDGDpFNt5VJiy1Z?utm_source=generator&theme=0\" width=\"100%\" height=\"352\" frameBorder=\"0\" allowfullscreen=\"\" allow=\"autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture\" loading=\"lazy\"><\/iframe>\n\n","protected":false},"excerpt":{"rendered":"<p>The parents of cuatrista Fabiola M\u00e9ndez keep her first cuatro as a relic from her childhood. “At six years old, my parents tell me, I picked up papi’s cuatro and started playing melodies on it. They saw that interest in me and put me in classes,” said M\u00e9ndez, who is now a distinguished composer who […]<\/p>\n","protected":false},"author":52,"featured_media":6135,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[89],"post_tag":[140],"authors":[167],"page_type":[],"geo_location":[],"class_list":["post-6134","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-inspirational","tag-art-culture","post_author-cindy-burgos-alvarado"],"acf":[],"yoast_head":"\n<title>Crafted by Hand, Heard Around the World: The Puerto Rican Cuatro | Platea<\/title>\n<meta name=\"description\" content=\"You've heard its sound on Bad Bunny's Tiny Desk performance. Now discover the cuatro, Puerto Rico's national instrument.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.plateapr.com\/en\/inspirational\/puerto-rican-cuatro-national-instrument\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Crafted by Hand, Heard Around the World: The Puerto Rican Cuatro | Platea\" \/>\n<meta property=\"og:description\" content=\"You've heard its sound on Bad Bunny's Tiny Desk performance. Now discover the cuatro, Puerto Rico's national instrument.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.plateapr.com\/en\/inspirational\/puerto-rican-cuatro-national-instrument\/\" \/>\n<meta property=\"og:site_name\" content=\"Platea\" \/>\n<meta property=\"article:published_time\" content=\"2025-12-12T19:45:07+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-12-12T19:45:08+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.plateapr.com\/en\/wp-content\/uploads\/sites\/2\/2025\/12\/Copy-of-Web-Hero-Images-pocillo-67-1024x576.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1024\" \/>\n\t<meta property=\"og:image:height\" content=\"576\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"hroloncintron\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"hroloncintron\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"9 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.plateapr.com\/en\/inspirational\/puerto-rican-cuatro-national-instrument\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.plateapr.com\/en\/inspirational\/puerto-rican-cuatro-national-instrument\/\"},\"author\":{\"name\":\"hroloncintron\",\"@id\":\"https:\/\/www.plateapr.com\/en\/#\/schema\/person\/19c6f7fe785106043495e8215fd10f1b\"},\"headline\":\"Crafted by Hand, Heard Around the World: The Puerto Rican Cuatro\",\"datePublished\":\"2025-12-12T19:45:07+00:00\",\"dateModified\":\"2025-12-12T19:45:08+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.plateapr.com\/en\/inspirational\/puerto-rican-cuatro-national-instrument\/\"},\"wordCount\":1660,\"publisher\":{\"@id\":\"https:\/\/www.plateapr.com\/en\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.plateapr.com\/en\/inspirational\/puerto-rican-cuatro-national-instrument\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.plateapr.com\/en\/wp-content\/uploads\/sites\/2\/2025\/12\/Copy-of-Web-Hero-Images-pocillo-67.png\",\"keywords\":[\"Art & Culture\"],\"articleSection\":[\"Inspirational\"],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.plateapr.com\/en\/inspirational\/puerto-rican-cuatro-national-instrument\/#primaryimage\",\"url\":\"https:\/\/www.plateapr.com\/en\/wp-content\/uploads\/sites\/2\/2025\/12\/Copy-of-Web-Hero-Images-pocillo-67.png\",\"contentUrl\":\"https:\/\/www.plateapr.com\/en\/wp-content\/uploads\/sites\/2\/2025\/12\/Copy-of-Web-Hero-Images-pocillo-67.png\",\"width\":1280,\"height\":720,\"caption\":\"puerto rican cuatro\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.plateapr.com\/en\/inspirational\/puerto-rican-cuatro-national-instrument\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.plateapr.com\/en\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Inspirational\",\"item\":\"https:\/\/www.plateapr.com\/en\/category\/inspirational\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Crafted by Hand, Heard Around the World: The Puerto Rican Cuatro\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.plateapr.com\/en\/#website\",\"url\":\"https:\/\/www.plateapr.com\/en\/\",\"name\":\"Platea\",\"description\":\"Curated guides from locals on what to do and where to eat in Puerto Rico\",\"publisher\":{\"@id\":\"https:\/\/www.plateapr.com\/en\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.plateapr.com\/en\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.plateapr.com\/en\/#organization\",\"name\":\"Platea\",\"url\":\"https:\/\/www.plateapr.com\/en\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.plateapr.com\/en\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.plateapr.com\/en\/wp-content\/uploads\/sites\/2\/2021\/11\/platea-logo.png\",\"contentUrl\":\"https:\/\/www.plateapr.com\/en\/wp-content\/uploads\/sites\/2\/2021\/11\/platea-logo.png\",\"width\":512,\"height\":512,\"caption\":\"Platea\"},\"image\":{\"@id\":\"https:\/\/www.plateapr.com\/en\/#\/schema\/logo\/image\/\"}}]}<\/script>\n","yoast_head_json":{"title":"Crafted by Hand, Heard Around the World: The Puerto Rican Cuatro | Platea","description":"You've heard its sound on Bad Bunny's Tiny Desk performance. Now discover the cuatro, Puerto Rico's national instrument.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.plateapr.com\/en\/inspirational\/puerto-rican-cuatro-national-instrument\/","og_locale":"en_US","og_type":"article","og_title":"Crafted by Hand, Heard Around the World: The Puerto Rican Cuatro | Platea","og_description":"You've heard its sound on Bad Bunny's Tiny Desk performance. Now discover the cuatro, Puerto Rico's national instrument.","og_url":"https:\/\/www.plateapr.com\/en\/inspirational\/puerto-rican-cuatro-national-instrument\/","og_site_name":"Platea","article_published_time":"2025-12-12T19:45:07+00:00","article_modified_time":"2025-12-12T19:45:08+00:00","og_image":[{"width":1024,"height":576,"url":"https:\/\/www.plateapr.com\/en\/wp-content\/uploads\/sites\/2\/2025\/12\/Copy-of-Web-Hero-Images-pocillo-67-1024x576.png","type":"image\/png"}],"author":"hroloncintron","twitter_card":"summary_large_image","twitter_misc":{"Written by":"hroloncintron","Est. reading time":"9 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.plateapr.com\/en\/inspirational\/puerto-rican-cuatro-national-instrument\/#article","isPartOf":{"@id":"https:\/\/www.plateapr.com\/en\/inspirational\/puerto-rican-cuatro-national-instrument\/"},"author":{"name":"hroloncintron","@id":"https:\/\/www.plateapr.com\/en\/#\/schema\/person\/19c6f7fe785106043495e8215fd10f1b"},"headline":"Crafted by Hand, Heard Around the World: The Puerto Rican Cuatro","datePublished":"2025-12-12T19:45:07+00:00","dateModified":"2025-12-12T19:45:08+00:00","mainEntityOfPage":{"@id":"https:\/\/www.plateapr.com\/en\/inspirational\/puerto-rican-cuatro-national-instrument\/"},"wordCount":1660,"publisher":{"@id":"https:\/\/www.plateapr.com\/en\/#organization"},"image":{"@id":"https:\/\/www.plateapr.com\/en\/inspirational\/puerto-rican-cuatro-national-instrument\/#primaryimage"},"thumbnailUrl":"https:\/\/www.plateapr.com\/en\/wp-content\/uploads\/sites\/2\/2025\/12\/Copy-of-Web-Hero-Images-pocillo-67.png","keywords":["Art & Culture"],"articleSection":["Inspirational"],"inLanguage":"en-US"},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.plateapr.com\/en\/inspirational\/puerto-rican-cuatro-national-instrument\/#primaryimage","url":"https:\/\/www.plateapr.com\/en\/wp-content\/uploads\/sites\/2\/2025\/12\/Copy-of-Web-Hero-Images-pocillo-67.png","contentUrl":"https:\/\/www.plateapr.com\/en\/wp-content\/uploads\/sites\/2\/2025\/12\/Copy-of-Web-Hero-Images-pocillo-67.png","width":1280,"height":720,"caption":"puerto rican cuatro"},{"@type":"BreadcrumbList","@id":"https:\/\/www.plateapr.com\/en\/inspirational\/puerto-rican-cuatro-national-instrument\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.plateapr.com\/en\/"},{"@type":"ListItem","position":2,"name":"Inspirational","item":"https:\/\/www.plateapr.com\/en\/category\/inspirational\/"},{"@type":"ListItem","position":3,"name":"Crafted by Hand, Heard Around the World: The Puerto Rican Cuatro"}]},{"@type":"WebSite","@id":"https:\/\/www.plateapr.com\/en\/#website","url":"https:\/\/www.plateapr.com\/en\/","name":"Platea","description":"Curated guides from locals on what to do and where to eat in Puerto Rico","publisher":{"@id":"https:\/\/www.plateapr.com\/en\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.plateapr.com\/en\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.plateapr.com\/en\/#organization","name":"Platea","url":"https:\/\/www.plateapr.com\/en\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.plateapr.com\/en\/#\/schema\/logo\/image\/","url":"https:\/\/www.plateapr.com\/en\/wp-content\/uploads\/sites\/2\/2021\/11\/platea-logo.png","contentUrl":"https:\/\/www.plateapr.com\/en\/wp-content\/uploads\/sites\/2\/2021\/11\/platea-logo.png","width":512,"height":512,"caption":"Platea"},"image":{"@id":"https:\/\/www.plateapr.com\/en\/#\/schema\/logo\/image\/"}}]}},"block_categories_all":[{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>The parents of cuatrista Fabiola M\u00e9ndez keep her first cuatro as a relic from her childhood.<\/p>\n","innerContent":["\n<p>The parents of cuatrista Fabiola M\u00e9ndez keep her first cuatro as a relic from her childhood.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>\"At six years old, my parents tell me, I picked up papi's cuatro and started playing melodies on it. They saw that interest in me and put me in classes,\" said M\u00e9ndez, who is now a distinguished composer who recently brought <strong>the sound of the cuatro to a global audience<\/strong> at <a href=\"https:\/\/www.youtube.com\/watch?v=1yJjALda0X4\">NPR's Tiny Desk<\/a> alongside Bad Bunny.<\/p>\n","innerContent":["\n<p>\"At six years old, my parents tell me, I picked up papi's cuatro and started playing melodies on it. They saw that interest in me and put me in classes,\" said M\u00e9ndez, who is now a distinguished composer who recently brought <strong>the sound of the cuatro to a global audience<\/strong> at <a href=\"https:\/\/www.youtube.com\/watch?v=1yJjALda0X4\">NPR's Tiny Desk<\/a> alongside Bad Bunny.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/html","attrs":[],"innerBlocks":[],"innerHTML":"\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Custom Audio Player<\/title>\n <style>\n \/* Reset basic styles *\/\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n \/* Main container *\/\n .custom-player {\n max-width: 600px;\n background-color: #333;\n border-radius: 12px;\n display: flex;\n align-items: center;\n padding: 16px;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;\n color: white;\n box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);\n margin: 20px auto;\n overflow: hidden;\n }\n\n \/* Image container *\/\n .player-artwork {\n width: 70px;\n height: 70px;\n flex-shrink: 0;\n margin-right: 16px;\n position: relative;\n overflow: hidden;\n border-radius: 6px;\n }\n\n .player-artwork img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n }\n\n \/* Info container *\/\n .player-info {\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n justify-content: center;\n min-width: 0; \/* Important for truncating text *\/\n }\n\n .player-title {\n font-size: 18px;\n font-weight: 600;\n margin-bottom: 4px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .player-artist {\n font-size: 14px;\n color: #ccc;\n margin-bottom: 8px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n \/* Progress bar *\/\n .progress-container {\n width: 100%;\n height: 4px;\n background-color: rgba(255, 255, 255, 0.2);\n border-radius: 2px;\n cursor: pointer;\n position: relative;\n }\n\n .progress-bar {\n height: 100%;\n background-color: #04d99d; \/* Requested highlight color *\/\n border-radius: 2px;\n width: 0%;\n transition: width 0.1s linear;\n }\n\n \/* Controls container *\/\n .player-controls {\n display: flex;\n align-items: center;\n margin-left: auto;\n flex-shrink: 0;\n }\n\n \/* Play button *\/\n .play-button {\n width: 40px;\n height: 40px;\n background-color: #04d99d; \/* Changed to highlight color *\/\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n margin-left: 16px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);\n }\n\n .play-icon, .pause-icon {\n color: white;\n font-size: 16px;\n width: 0;\n height: 0;\n }\n\n .play-icon {\n border-style: solid;\n border-width: 8px 0 8px 12px;\n border-color: transparent transparent transparent white; \/* Changed to white to contrast with green button *\/\n margin-left: 3px;\n }\n\n .pause-icon {\n display: none;\n width: 12px;\n height: 16px;\n position: relative;\n }\n\n .pause-icon:before, .pause-icon:after {\n content: \"\";\n position: absolute;\n background-color: white; \/* Changed to white to contrast with green button *\/\n width: 4px;\n height: 16px;\n top: 0;\n }\n\n .pause-icon:before {\n left: 2px;\n }\n\n .pause-icon:after {\n right: 2px;\n }\n\n \/* Options button (three dots) *\/\n .options-button {\n width: 28px;\n height: 28px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n margin-left: 16px;\n opacity: 0.8;\n }\n\n .options-icon {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n width: 16px;\n }\n\n .dot {\n width: 3px;\n height: 3px;\n background-color: white;\n border-radius: 50%;\n }\n\n \/* Time *\/\n .time-display {\n font-size: 11px;\n color: #ccc;\n margin-top: 4px;\n display: flex;\n justify-content: space-between;\n }\n\n \/* Responsive *\/\n @media (max-width: 460px) {\n .player-artwork {\n width: 60px;\n height: 60px;\n }\n\n .player-title {\n font-size: 16px;\n }\n\n .player-artist {\n font-size: 12px;\n }\n\n .options-button {\n display: none;\n }\n }\n\n @media (max-width: 360px) {\n .custom-player {\n padding: 12px;\n }\n\n .player-artwork {\n width: 50px;\n height: 50px;\n margin-right: 12px;\n }\n\n .play-button {\n width: 36px;\n height: 36px;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"custom-player\">\n <div class=\"player-artwork\">\n <img src=\"https:\/\/www.plateapr.com\/wp-content\/uploads\/2025\/07\/FAB2024-29.jpg\" alt=\"Artwork\">\n <\/div>\n\n <div class=\"player-info\">\n <div class=\"player-title\">Puerto Rican Cuatro<\/div>\n <div class=\"player-artist\">Source: Fabiola M\u00e9ndez<\/div>\n\n <div class=\"progress-container\" id=\"progress-container\">\n <div class=\"progress-bar\" id=\"progress-bar\"><\/div>\n <\/div>\n\n <div class=\"time-display\">\n <span id=\"current-time\">0:00<\/span>\n <span id=\"duration\">0:00<\/span>\n <\/div>\n <\/div>\n\n <div class=\"player-controls\">\n <div class=\"options-button\">\n <div class=\"options-icon\">\n <div class=\"dot\"><\/div>\n <div class=\"dot\"><\/div>\n <div class=\"dot\"><\/div>\n <\/div>\n <\/div>\n\n <div class=\"play-button\" id=\"play-button\">\n <div class=\"play-icon\" id=\"play-icon\"><\/div>\n <div class=\"pause-icon\" id=\"pause-icon\"><\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <script>\n document.addEventListener('DOMContentLoaded', function() {\n \/\/ Variables\n const audio = new Audio('https:\/\/www.plateapr.com\/wp-content\/uploads\/2025\/07\/Fabiola.m4a');\n const playButton = document.getElementById('play-button');\n const playIcon = document.getElementById('play-icon');\n const pauseIcon = document.getElementById('pause-icon');\n const progressBar = document.getElementById('progress-bar');\n const progressContainer = document.getElementById('progress-container');\n const currentTimeElement = document.getElementById('current-time');\n const durationElement = document.getElementById('duration');\n\n \/\/ Initialization\n let isPlaying = false;\n\n \/\/ Format time\n function formatTime(seconds) {\n const min = Math.floor(seconds \/ 60);\n const sec = Math.floor(seconds % 60);\n return `${min}:${sec < 10 ? '0' + sec : sec}`;\n }\n\n \/\/ Update progress\n function updateProgress() {\n const { currentTime, duration } = audio;\n const progressPercent = (currentTime \/ duration) * 100;\n progressBar.style.width = `${progressPercent}%`;\n currentTimeElement.textContent = formatTime(currentTime);\n }\n\n \/\/ Load metadata\n audio.addEventListener('loadedmetadata', function() {\n durationElement.textContent = formatTime(audio.duration);\n });\n\n \/\/ Time event\n audio.addEventListener('timeupdate', updateProgress);\n\n \/\/ End event\n audio.addEventListener('ended', function() {\n isPlaying = false;\n playIcon.style.display = 'block';\n pauseIcon.style.display = 'none';\n progressBar.style.width = '0%';\n audio.currentTime = 0;\n });\n\n \/\/ Click on play\/pause button\n playButton.addEventListener('click', function() {\n if (isPlaying) {\n audio.pause();\n playIcon.style.display = 'block';\n pauseIcon.style.display = 'none';\n } else {\n audio.play().catch(e => console.error('Error playing audio:', e));\n playIcon.style.display = 'none';\n pauseIcon.style.display = 'block';\n }\n\n isPlaying = !isPlaying;\n });\n\n \/\/ Click on progress bar\n progressContainer.addEventListener('click', function(e) {\n const width = this.clientWidth;\n const clickX = e.offsetX;\n const duration = audio.duration;\n\n audio.currentTime = (clickX \/ width) * duration;\n });\n });\n <\/script>\n<\/body>\n<\/html>\n","innerContent":["\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Custom Audio Player<\/title>\n <style>\n \/* Reset basic styles *\/\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n \/* Main container *\/\n .custom-player {\n max-width: 600px;\n background-color: #333;\n border-radius: 12px;\n display: flex;\n align-items: center;\n padding: 16px;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;\n color: white;\n box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);\n margin: 20px auto;\n overflow: hidden;\n }\n\n \/* Image container *\/\n .player-artwork {\n width: 70px;\n height: 70px;\n flex-shrink: 0;\n margin-right: 16px;\n position: relative;\n overflow: hidden;\n border-radius: 6px;\n }\n\n .player-artwork img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n }\n\n \/* Info container *\/\n .player-info {\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n justify-content: center;\n min-width: 0; \/* Important for truncating text *\/\n }\n\n .player-title {\n font-size: 18px;\n font-weight: 600;\n margin-bottom: 4px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .player-artist {\n font-size: 14px;\n color: #ccc;\n margin-bottom: 8px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n \/* Progress bar *\/\n .progress-container {\n width: 100%;\n height: 4px;\n background-color: rgba(255, 255, 255, 0.2);\n border-radius: 2px;\n cursor: pointer;\n position: relative;\n }\n\n .progress-bar {\n height: 100%;\n background-color: #04d99d; \/* Requested highlight color *\/\n border-radius: 2px;\n width: 0%;\n transition: width 0.1s linear;\n }\n\n \/* Controls container *\/\n .player-controls {\n display: flex;\n align-items: center;\n margin-left: auto;\n flex-shrink: 0;\n }\n\n \/* Play button *\/\n .play-button {\n width: 40px;\n height: 40px;\n background-color: #04d99d; \/* Changed to highlight color *\/\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n margin-left: 16px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);\n }\n\n .play-icon, .pause-icon {\n color: white;\n font-size: 16px;\n width: 0;\n height: 0;\n }\n\n .play-icon {\n border-style: solid;\n border-width: 8px 0 8px 12px;\n border-color: transparent transparent transparent white; \/* Changed to white to contrast with green button *\/\n margin-left: 3px;\n }\n\n .pause-icon {\n display: none;\n width: 12px;\n height: 16px;\n position: relative;\n }\n\n .pause-icon:before, .pause-icon:after {\n content: \"\";\n position: absolute;\n background-color: white; \/* Changed to white to contrast with green button *\/\n width: 4px;\n height: 16px;\n top: 0;\n }\n\n .pause-icon:before {\n left: 2px;\n }\n\n .pause-icon:after {\n right: 2px;\n }\n\n \/* Options button (three dots) *\/\n .options-button {\n width: 28px;\n height: 28px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n margin-left: 16px;\n opacity: 0.8;\n }\n\n .options-icon {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n width: 16px;\n }\n\n .dot {\n width: 3px;\n height: 3px;\n background-color: white;\n border-radius: 50%;\n }\n\n \/* Time *\/\n .time-display {\n font-size: 11px;\n color: #ccc;\n margin-top: 4px;\n display: flex;\n justify-content: space-between;\n }\n\n \/* Responsive *\/\n @media (max-width: 460px) {\n .player-artwork {\n width: 60px;\n height: 60px;\n }\n\n .player-title {\n font-size: 16px;\n }\n\n .player-artist {\n font-size: 12px;\n }\n\n .options-button {\n display: none;\n }\n }\n\n @media (max-width: 360px) {\n .custom-player {\n padding: 12px;\n }\n\n .player-artwork {\n width: 50px;\n height: 50px;\n margin-right: 12px;\n }\n\n .play-button {\n width: 36px;\n height: 36px;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"custom-player\">\n <div class=\"player-artwork\">\n <img src=\"https:\/\/www.plateapr.com\/wp-content\/uploads\/2025\/07\/FAB2024-29.jpg\" alt=\"Artwork\">\n <\/div>\n\n <div class=\"player-info\">\n <div class=\"player-title\">Puerto Rican Cuatro<\/div>\n <div class=\"player-artist\">Source: Fabiola M\u00e9ndez<\/div>\n\n <div class=\"progress-container\" id=\"progress-container\">\n <div class=\"progress-bar\" id=\"progress-bar\"><\/div>\n <\/div>\n\n <div class=\"time-display\">\n <span id=\"current-time\">0:00<\/span>\n <span id=\"duration\">0:00<\/span>\n <\/div>\n <\/div>\n\n <div class=\"player-controls\">\n <div class=\"options-button\">\n <div class=\"options-icon\">\n <div class=\"dot\"><\/div>\n <div class=\"dot\"><\/div>\n <div class=\"dot\"><\/div>\n <\/div>\n <\/div>\n\n <div class=\"play-button\" id=\"play-button\">\n <div class=\"play-icon\" id=\"play-icon\"><\/div>\n <div class=\"pause-icon\" id=\"pause-icon\"><\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <script>\n document.addEventListener('DOMContentLoaded', function() {\n \/\/ Variables\n const audio = new Audio('https:\/\/www.plateapr.com\/wp-content\/uploads\/2025\/07\/Fabiola.m4a');\n const playButton = document.getElementById('play-button');\n const playIcon = document.getElementById('play-icon');\n const pauseIcon = document.getElementById('pause-icon');\n const progressBar = document.getElementById('progress-bar');\n const progressContainer = document.getElementById('progress-container');\n const currentTimeElement = document.getElementById('current-time');\n const durationElement = document.getElementById('duration');\n\n \/\/ Initialization\n let isPlaying = false;\n\n \/\/ Format time\n function formatTime(seconds) {\n const min = Math.floor(seconds \/ 60);\n const sec = Math.floor(seconds % 60);\n return `${min}:${sec < 10 ? '0' + sec : sec}`;\n }\n\n \/\/ Update progress\n function updateProgress() {\n const { currentTime, duration } = audio;\n const progressPercent = (currentTime \/ duration) * 100;\n progressBar.style.width = `${progressPercent}%`;\n currentTimeElement.textContent = formatTime(currentTime);\n }\n\n \/\/ Load metadata\n audio.addEventListener('loadedmetadata', function() {\n durationElement.textContent = formatTime(audio.duration);\n });\n\n \/\/ Time event\n audio.addEventListener('timeupdate', updateProgress);\n\n \/\/ End event\n audio.addEventListener('ended', function() {\n isPlaying = false;\n playIcon.style.display = 'block';\n pauseIcon.style.display = 'none';\n progressBar.style.width = '0%';\n audio.currentTime = 0;\n });\n\n \/\/ Click on play\/pause button\n playButton.addEventListener('click', function() {\n if (isPlaying) {\n audio.pause();\n playIcon.style.display = 'block';\n pauseIcon.style.display = 'none';\n } else {\n audio.play().catch(e => console.error('Error playing audio:', e));\n playIcon.style.display = 'none';\n pauseIcon.style.display = 'block';\n }\n\n isPlaying = !isPlaying;\n });\n\n \/\/ Click on progress bar\n progressContainer.addEventListener('click', function(e) {\n const width = this.clientWidth;\n const clickX = e.offsetX;\n const duration = audio.duration;\n\n audio.currentTime = (clickX \/ width) * duration;\n });\n });\n <\/script>\n<\/body>\n<\/html>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>But behind every cuatro like the one that inspired M\u00e9ndez\u2014an instrument that now has weekly exposure at <a href=\"https:\/\/www.plateapr.com\/residencia-bad-bunny-en-numeros\/\">Bad Bunny's Residency<\/a> with artists like Jos\u00e9 Eduardo Santana performing before 14,000 spectators\u2014there's an artisan who preserves a tradition spanning over 200 years: the luthier.<\/p>\n","innerContent":["\n<p>But behind every cuatro like the one that inspired M\u00e9ndez\u2014an instrument that now has weekly exposure at <a href=\"https:\/\/www.plateapr.com\/residencia-bad-bunny-en-numeros\/\">Bad Bunny's Residency<\/a> with artists like Jos\u00e9 Eduardo Santana performing before 14,000 spectators\u2014there's an artisan who preserves a tradition spanning over 200 years: the luthier.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/list","attrs":[],"innerBlocks":[{"blockName":"core\/list-item","attrs":[],"innerBlocks":[],"innerHTML":"\n<li>According to the <a href=\"http:\/\/www.cuatro-pr.org\/node\/53\">Cuatro Project<\/a>, a collective that seeks to preserve the instrument's traditions, the first cuatros were documented in the early 19th century. They were rustic four-string instruments made with native woods like guaraguao and laurel.<\/li>\n","innerContent":["\n<li>According to the <a href=\"http:\/\/www.cuatro-pr.org\/node\/53\">Cuatro Project<\/a>, a collective that seeks to preserve the instrument's traditions, the first cuatros were documented in the early 19th century. They were rustic four-string instruments made with native woods like guaraguao and laurel.<\/li>\n"]}],"innerHTML":"\n<ul class=\"wp-block-list\"><\/ul>\n","innerContent":["\n<ul class=\"wp-block-list\">",null,"<\/ul>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/list","attrs":[],"innerBlocks":[{"blockName":"core\/list-item","attrs":[],"innerBlocks":[],"innerHTML":"\n<li>Over time, it evolved to have ten strings or five double strings, giving it the broader musical range we know today.<\/li>\n","innerContent":["\n<li>Over time, it evolved to have ten strings or five double strings, giving it the broader musical range we know today.<\/li>\n"]}],"innerHTML":"\n<ul class=\"wp-block-list\"><\/ul>\n","innerContent":["\n<ul class=\"wp-block-list\">",null,"<\/ul>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Today, that legacy continues in workshops around the island where this centuries-old art is preserved.<\/p>\n","innerContent":["\n<p>Today, that legacy continues in workshops around the island where this centuries-old art is preserved.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/heading","attrs":[],"innerBlocks":[],"innerHTML":"\n<h2 class=\"wp-block-heading\">What does a luthier do?<\/h2>\n","innerContent":["\n<h2 class=\"wp-block-heading\">What does a luthier do?<\/h2>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>A luthier is an artisan who builds stringed instruments by hand. In Puerto Rico, these craftspeople specialize in making and repairing the Puerto Rican cuatro, preserving a tradition that defines our musical identity.<\/p>\n","innerContent":["\n<p>A luthier is an artisan who builds stringed instruments by hand. In Puerto Rico, these craftspeople specialize in making and repairing the Puerto Rican cuatro, preserving a tradition that defines our musical identity.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/heading","attrs":{"level":3},"innerBlocks":[],"innerHTML":"\n<h3 class=\"wp-block-heading\">\ud83c\udfb6 The art behind the instrument<\/h3>\n","innerContent":["\n<h3 class=\"wp-block-heading\">\ud83c\udfb6 The art behind the instrument<\/h3>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Luthier <strong>\u00c1ngel Jos\u00e9 Ortiz<\/strong> from Coamo, who has nearly two decades of experience, spoke with <strong>Platea<\/strong> about the artisanal process of creating a cuatro.<\/p>\n","innerContent":["\n<p>Luthier <strong>\u00c1ngel Jos\u00e9 Ortiz<\/strong> from Coamo, who has nearly two decades of experience, spoke with <strong>Platea<\/strong> about the artisanal process of creating a cuatro.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>His workshop is one of the few places where this art is still preserved.<\/p>\n","innerContent":["\n<p>His workshop is one of the few places where this art is still preserved.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/image","attrs":{"id":27158,"width":"471px","height":"auto","sizeSlug":"large","linkDestination":"none"},"innerBlocks":[],"innerHTML":"\n<figure class=\"wp-block-image size-large is-resized\"><img src=\"https:\/\/www.plateapr.com\/wp-content\/uploads\/2025\/07\/c29a1bd0-37d8-4554-bea0-630772b9a599-576x1024.jpg\" alt=\"\" class=\"wp-image-27158\" style=\"width:471px;height:auto\"\/><figcaption class=\"wp-element-caption\"><em>Luthier \u00c1ngel Jos\u00e9 Ortiz has dedicated himself to preserving the art of lutherie since 2008. (Photo: Provided).<\/em><\/figcaption><\/figure>\n","innerContent":["\n<figure class=\"wp-block-image size-large is-resized\"><img src=\"https:\/\/www.plateapr.com\/wp-content\/uploads\/2025\/07\/c29a1bd0-37d8-4554-bea0-630772b9a599-576x1024.jpg\" alt=\"\" class=\"wp-image-27158\" style=\"width:471px;height:auto\"\/><figcaption class=\"wp-element-caption\"><em>Luthier \u00c1ngel Jos\u00e9 Ortiz has dedicated himself to preserving the art of lutherie since 2008. (Photo: Provided).<\/em><\/figcaption><\/figure>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>\"Each maker transmits a specific sound. I can make something identical to another maker, and my instrument will sound different,\" explained Ortiz, who describes his sound as \"strong, clear, clean.\"<\/p>\n","innerContent":["\n<p>\"Each maker transmits a specific sound. I can make something identical to another maker, and my instrument will sound different,\" explained Ortiz, who describes his sound as \"strong, clear, clean.\"<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Each cuatro is a customized work that can take weeks to create, which is why luthiers work primarily on commission.<\/p>\n","innerContent":["\n<p>Each cuatro is a customized work that can take weeks to create, which is why luthiers work primarily on commission.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"acf\/alert-banner","attrs":{"name":"acf\/alert-banner","data":{"color":"green","_color":"field_6176b5f4d68b3","show_icon":"0","_show_icon":"field_6176b5d3d68b1","title":"","_title":"field_6176b5cad68b0","text":"<strong>Did you know:<\/strong> Currently, the Instituto de Cultura Puertorrique\u00f1a app registers only <a href=\"https:\/\/www.plateapr.com\/artesanias-que-podrian-desaparecer-puerto-rico\/#:~:text=de%20la%20rutina-,5,-.%20Cuatro%C2%A0\">five certified luthiers<\/a> who create cuatros: Benjam\u00edn Phi Vel\u00e1zquez, Efra\u00edn Figueroa Cabrera, Freddy Burgos Nieves, Jaime Alicea, and Wilfredo Burgos Nieves, although other independent artisans also keep the tradition alive.","_text":"field_6176b5dfd68b2"},"align":"full","mode":"preview"},"innerBlocks":[],"innerHTML":"","innerContent":[]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/heading","attrs":[],"innerBlocks":[],"innerHTML":"\n<h2 class=\"wp-block-heading\">The woods that sing<\/h2>\n","innerContent":["\n<h2 class=\"wp-block-heading\">The woods that sing<\/h2>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Before a luthier can begin their work, they must carefully select the raw material that will give voice to the instrument.<\/p>\n","innerContent":["\n<p>Before a luthier can begin their work, they must carefully select the raw material that will give voice to the instrument.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>As documented in <a href=\"http:\/\/www.cuatro-pr.org\/\">Proyecto Cuatro<\/a>, the first artisans used endemic woods from the island: <strong>guaraguao<\/strong>, <strong>laurel<\/strong>, <strong>maga<\/strong>, <strong>algarrobo<\/strong>, <strong>cedro macho<\/strong>, and <strong>roble blanco<\/strong>.<\/p>\n","innerContent":["\n<p>As documented in <a href=\"http:\/\/www.cuatro-pr.org\/\">Proyecto Cuatro<\/a>, the first artisans used endemic woods from the island: <strong>guaraguao<\/strong>, <strong>laurel<\/strong>, <strong>maga<\/strong>, <strong>algarrobo<\/strong>, <strong>cedro macho<\/strong>, and <strong>roble blanco<\/strong>.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/list","attrs":[],"innerBlocks":[{"blockName":"core\/list-item","attrs":[],"innerBlocks":[],"innerHTML":"\n<li>Today, a luthier must verify that the wood they will use is completely dry, a process that can take months or years.<\/li>\n","innerContent":["\n<li>Today, a luthier must verify that the wood they will use is completely dry, a process that can take months or years.<\/li>\n"]}],"innerHTML":"\n<ul class=\"wp-block-list\"><\/ul>\n","innerContent":["\n<ul class=\"wp-block-list\">",null,"<\/ul>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/image","attrs":{"id":27150,"sizeSlug":"large","linkDestination":"none"},"innerBlocks":[],"innerHTML":"\n<figure class=\"wp-block-image size-large\"><img src=\"https:\/\/www.plateapr.com\/wp-content\/uploads\/2025\/07\/Spotlight-Bobets-Bakehouse-819x1024.png\" alt=\"\" class=\"wp-image-27150\"\/><figcaption class=\"wp-element-caption\"><em>The process of making a cuatro, like the one shown made with maga wood, can take Ortiz up to three months. (Photos: Provided).<\/em><\/figcaption><\/figure>\n","innerContent":["\n<figure class=\"wp-block-image size-large\"><img src=\"https:\/\/www.plateapr.com\/wp-content\/uploads\/2025\/07\/Spotlight-Bobets-Bakehouse-819x1024.png\" alt=\"\" class=\"wp-image-27150\"\/><figcaption class=\"wp-element-caption\"><em>The process of making a cuatro, like the one shown made with maga wood, can take Ortiz up to three months. (Photos: Provided).<\/em><\/figcaption><\/figure>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>\"Wood is a living material,\" described Ortiz, explaining how it can absorb or release moisture from the environment, affecting the tuning and sound of the instrument.<\/p>\n","innerContent":["\n<p>\"Wood is a living material,\" described Ortiz, explaining how it can absorb or release moisture from the environment, affecting the tuning and sound of the instrument.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/list","attrs":[],"innerBlocks":[{"blockName":"core\/list-item","attrs":[],"innerBlocks":[],"innerHTML":"\n<li>That's why the creation process, which <strong>takes up to 12 weeks<\/strong>, begins with the careful selection of completely dry woods.<\/li>\n","innerContent":["\n<li>That's why the creation process, which <strong>takes up to 12 weeks<\/strong>, begins with the careful selection of completely dry woods.<\/li>\n"]}],"innerHTML":"\n<ul class=\"wp-block-list\"><\/ul>\n","innerContent":["\n<ul class=\"wp-block-list\">",null,"<\/ul>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Each stage, from carving the sound box to installing the fan bracing system, determines the sonic qualities of the final instrument.<\/p>\n","innerContent":["\n<p>Each stage, from carving the sound box to installing the fan bracing system, determines the sonic qualities of the final instrument.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/html","attrs":[],"innerBlocks":[],"innerHTML":"\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>How to create a Puerto Rican cuatro<\/title>\n <style>\n \/* Reset and variables - isolated with ID pasos-para-fabricar-un-cuatro *\/\n #pasos-para-fabricar-un-cuatro * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n font-family: inherit;\n }\n\n #pasos-para-fabricar-un-cuatro {\n --cuatro-primary: #04d99d;\n --cuatro-primary-light: #62d4a1;\n --cuatro-accent: #07c76b;\n --cuatro-text: #2c3e50;\n --cuatro-text-light: #6c7b7f;\n --cuatro-bg: #ffffff;\n --cuatro-border: #e8f4f0;\n --cuatro-shadow: rgba(4, 217, 157, 0.08);\n\n max-width: 100%;\n margin: 0 auto;\n background: linear-gradient(135deg, #fef9e7 0%, #f8f9fa 100%);\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;\n padding: 1rem 0;\n position: relative;\n min-height: 100vh;\n }\n\n \/* Header with more artisanal style *\/\n #pasos-para-fabricar-un-cuatro .cuatro_header {\n text-align: center;\n margin-bottom: 1.5rem;\n padding: 0 1rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_title {\n font-size: 1.4rem;\n font-weight: 800;\n color: var(--cuatro-text);\n margin-bottom: 0.5rem;\n line-height: 1.2;\n text-shadow: 0 2px 4px rgba(0,0,0,0.1);\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_subtitle {\n color: var(--cuatro-text-light);\n font-size: 0.95rem;\n line-height: 1.3;\n max-width: 600px;\n margin: 0 auto;\n font-style: italic;\n }\n\n \/* Decorative elements *\/\n #pasos-para-fabricar-un-cuatro .cuatro_header::after {\n content: \"\ud83c\udfb5\";\n display: block;\n font-size: 2rem;\n margin-top: 0.5rem;\n opacity: 0.7;\n }\n\n \/* Carousel with more artistic design - FIXED OVERFLOW *\/\n #pasos-para-fabricar-un-cuatro .cuatro_carousel_wrapper {\n position: relative;\n width: 100%;\n overflow: visible; \/* Changed from hidden *\/\n padding: 1.5rem 1rem 0 1rem; \/* Added top padding for number badges *\/\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_carousel_container {\n display: flex;\n width: 100%;\n position: relative;\n overflow: hidden; \/* Keep hidden here for slide clipping *\/\n border-radius: 20px; \/* Optional: adds nice rounded corners to viewport *\/\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_carousel_track {\n display: flex;\n width: 100%;\n transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);\n will-change: transform;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_slide {\n width: 100%;\n flex-shrink: 0;\n display: flex;\n justify-content: center;\n align-items: flex-start;\n padding: 1rem 0.75rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card {\n width: 100%;\n max-width: 520px;\n background: linear-gradient(145deg, #ffffff 0%, #fdfbfb 100%);\n border: 3px solid var(--cuatro-border);\n border-radius: 15px;\n padding: 1.5rem;\n padding-top: 2rem; \/* Extra top padding for number *\/\n box-shadow: 0 10px 25px var(--cuatro-shadow), 0 4px 10px rgba(0,0,0,0.05);\n transition: all 0.4s ease;\n position: relative;\n opacity: 0.75;\n transform: scale(0.95) rotateY(5deg);\n perspective: 1000px;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_slide.active .cuatro_card {\n opacity: 1;\n transform: scale(1) rotateY(0deg);\n border-color: var(--cuatro-primary-light);\n box-shadow: 0 15px 35px rgba(4, 217, 157, 0.15), 0 5px 15px rgba(0,0,0,0.1);\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_number {\n position: absolute;\n top: -18px;\n left: 2rem;\n background: linear-gradient(135deg, #07c76b 0%, #04d99d 50%, #62d4a1 100%);\n color: white;\n width: 2.5rem;\n height: 2.5rem;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n font-weight: 800;\n font-size: 1.1rem;\n box-shadow: 0 6px 15px rgba(4, 217, 157, 0.4);\n border: 3px solid white;\n z-index: 10;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_content {\n padding-top: 0.8rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_title {\n font-size: 1.3rem;\n font-weight: 700;\n color: var(--cuatro-text);\n margin-bottom: 1rem;\n line-height: 1.3;\n position: relative;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_title::after {\n content: \"\";\n position: absolute;\n bottom: -8px;\n left: 0;\n width: 50px;\n height: 3px;\n background: linear-gradient(90deg, var(--cuatro-primary) 0%, var(--cuatro-primary-light) 100%);\n border-radius: 2px;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_text {\n color: var(--cuatro-text-light);\n font-size: 1rem;\n line-height: 1.6;\n margin-bottom: 1rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_details {\n background: rgba(4, 217, 157, 0.05);\n border-left: 4px solid var(--cuatro-primary);\n padding: 1rem;\n border-radius: 8px;\n font-size: 0.95rem;\n line-height: 1.5;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_text strong,\n #pasos-para-fabricar-un-cuatro .cuatro_card_details strong {\n color: var(--cuatro-text);\n font-weight: 600;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_time_estimate {\n display: inline-flex;\n align-items: center;\n gap: 0.5rem;\n background: var(--cuatro-primary-light);\n color: white;\n padding: 0.4rem 0.8rem;\n border-radius: 20px;\n font-size: 0.85rem;\n font-weight: 600;\n margin-top: 0.5rem;\n }\n\n \/* Navigation with more elaborate style *\/\n #pasos-para-fabricar-un-cuatro .cuatro_navigation {\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 1rem;\n margin-top: 2rem;\n padding: 0 1rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_nav_btn {\n background: linear-gradient(135deg, #07c76b 0%, #04d99d 50%, #62d4a1 100%);\n color: white;\n border: none;\n width: 2.5rem;\n height: 2.5rem;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all 0.3s ease;\n box-shadow: 0 6px 15px rgba(4, 217, 157, 0.3);\n border: 2px solid white;\n position: relative;\n z-index: 100;\n pointer-events: auto;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_nav_btn:hover:not(:disabled) {\n transform: scale(1.1) translateY(-2px);\n box-shadow: 0 8px 20px rgba(4, 217, 157, 0.4);\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_nav_btn svg {\n width: 18px;\n height: 18px;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_indicators {\n display: flex;\n gap: 0.6rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_dot {\n width: 0.6rem;\n height: 0.6rem;\n border-radius: 50%;\n background-color: #ddd;\n cursor: pointer;\n transition: all 0.3s ease;\n border: 2px solid transparent;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_dot.active {\n background-color: var(--cuatro-primary);\n width: 2rem;\n border-radius: 1rem;\n border-color: white;\n box-shadow: 0 2px 8px rgba(4, 217, 157, 0.3);\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_counter {\n color: var(--cuatro-text);\n font-size: 0.9rem;\n font-weight: 600;\n min-width: 3.5rem;\n text-align: center;\n background: white;\n padding: 0.4rem 0.8rem;\n border-radius: 20px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.1);\n }\n\n \/* More elegant progress bar *\/\n #pasos-para-fabricar-un-cuatro .cuatro_progress {\n width: 100%;\n max-width: 400px;\n height: 6px;\n background-color: #f0f0f0;\n margin: 2rem auto 0;\n border-radius: 3px;\n overflow: hidden;\n box-shadow: inset 0 2px 4px rgba(0,0,0,0.1);\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_progress_bar {\n height: 100%;\n background: linear-gradient(90deg, var(--cuatro-primary) 0%, var(--cuatro-primary-light) 100%);\n width: 12.5%;\n transition: width 0.5s ease;\n border-radius: 3px;\n box-shadow: 0 0 10px rgba(4, 217, 157, 0.5);\n }\n\n \/* Responsive Design *\/\n @media (min-width: 768px) {\n #pasos-para-fabricar-un-cuatro {\n padding: 3rem 0;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_title {\n font-size: 2.2rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_subtitle {\n font-size: 1.1rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_slide {\n padding: 1.5rem 1rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card {\n padding: 2.5rem;\n padding-top: 3rem;\n max-width: 650px;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_number {\n width: 3rem;\n height: 3rem;\n font-size: 1.2rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_title {\n font-size: 1.5rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_text {\n font-size: 1.1rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_nav_btn {\n width: 3rem;\n height: 3rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_nav_btn svg {\n width: 20px;\n height: 20px;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_navigation {\n gap: 1.5rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_counter {\n font-size: 1rem;\n min-width: 4rem;\n }\n }\n\n @media (min-width: 1024px) {\n #pasos-para-fabricar-un-cuatro {\n max-width: 1200px;\n padding: 4rem 2rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_title {\n font-size: 2.8rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_slide {\n padding: 2rem 1.5rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card {\n padding: 3rem;\n padding-top: 3.5rem;\n max-width: 750px;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_title {\n font-size: 1.7rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_text {\n font-size: 1.15rem;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div id=\"pasos-para-fabricar-un-cuatro\">\n <header class=\"cuatro_header\">\n <h1 class=\"cuatro_title\">How to create a Puerto Rican cuatro<\/h1>\n <p class=\"cuatro_subtitle\">\n The traditional art of criollo lutherie step by step\n <\/p>\n <\/header>\n\n <div class=\"cuatro_carousel_wrapper\">\n <div class=\"cuatro_carousel_container\">\n <div class=\"cuatro_carousel_track\" id=\"cuatro-track\">\n \n <div class=\"cuatro_slide active\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">1<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Design and initial cut<\/h3>\n <p class=\"cuatro_card_text\">Uses a cuatro template to trace its design on a piece of wood. Then cuts and sands it to create the body and neck of the instrument to the desired size.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_slide\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">2<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Creating the sound box<\/h3>\n <p class=\"cuatro_card_text\">Hollows out the body with a drill until leaving a bottom almost an inch thick. This hollow space is known as the sound box and is what helps amplify the cuatro's sound.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_slide\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">3<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Soundboard and rosette<\/h3>\n <p class=\"cuatro_card_text\">Joins two wooden planks to create the soundboard, which will cover the sound box. Also makes a hole in the center of the soundboard and insets the rosette, which is the ornament around the edge of the centered opening.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_slide\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">4<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Fan bracing system<\/h3>\n <p class=\"cuatro_card_text\">On the interior side of the soundboard, the luthier glues strips that will form the fan bracing. This system will assist in amplifying and directing the sound. Once the soundboard is finished, it's glued to the sound box as aligned and precise as possible.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_slide\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">5<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Marquetry and fingerboard<\/h3>\n <p class=\"cuatro_card_text\">On the edges of the cuatro, creates the channels where the marquetry will go, the fine ornament that surrounds it. Also works on the fingerboard, the wood on the neck where fingers are placed to create musical notes.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_slide\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">6<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Frets and custom design<\/h3>\n <p class=\"cuatro_card_text\">Once the fingerboard is glued to the neck, installs the frets, which mark the position of the notes. Carves the neck with a unique design of their authorship that identifies their artisanal work. Also creates the headstock where the tuning pegs will go.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_slide\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">7<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Final touches<\/h3>\n <p class=\"cuatro_card_text\">Among the final steps, glues the bridge, the base where the instrument's strings are placed. Then, installs the strings, calibrates the nut, a thin bar at the beginning of the fingerboard that keeps the strings straight and properly positioned, and tunes the instrument for use.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_navigation\">\n <button id=\"cuatro-prev-btn\" class=\"cuatro_nav_btn\" disabled>\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n <polyline points=\"15 18 9 12 15 6\"><\/polyline>\n <\/svg>\n <\/button>\n\n <div class=\"cuatro_counter\">\n <span id=\"cuatro-current\">1<\/span> \/ <span id=\"cuatro-total\">7<\/span>\n <\/div>\n\n <div class=\"cuatro_indicators\" id=\"cuatro-indicators\">\n <div class=\"cuatro_dot active\"><\/div>\n <div class=\"cuatro_dot\"><\/div>\n <div class=\"cuatro_dot\"><\/div>\n <div class=\"cuatro_dot\"><\/div>\n <div class=\"cuatro_dot\"><\/div>\n <div class=\"cuatro_dot\"><\/div>\n <div class=\"cuatro_dot\"><\/div>\n <\/div>\n\n <button id=\"cuatro-next-btn\" class=\"cuatro_nav_btn\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n <polyline points=\"9 18 15 12 9 6\"><\/polyline>\n <\/svg>\n <\/button>\n <\/div>\n\n <div class=\"cuatro_progress\">\n <div class=\"cuatro_progress_bar\" id=\"cuatro-progress-bar\"><\/div>\n <\/div>\n <\/div>\n\n <script>\n \/\/ Simple inline script that will definitely work\n window.addEventListener('load', function() {\n var currentIndex = 0;\n var totalSlides = 7;\n\n \/\/ Get elements using getElementById for maximum compatibility\n var track = document.getElementById('cuatro-track');\n var prevBtn = document.getElementById('cuatro-prev-btn');\n var nextBtn = document.getElementById('cuatro-next-btn');\n var currentSpan = document.getElementById('cuatro-current');\n var totalSpan = document.getElementById('cuatro-total');\n var progressBar = document.getElementById('cuatro-progress-bar');\n\n \/\/ Simple update function\n function updateCarousel() {\n \/\/ Move the track\n if (track) {\n track.style.transform = 'translateX(-' + (currentIndex * 100) + '%)';\n }\n\n \/\/ Update counter\n if (currentSpan) {\n currentSpan.innerHTML = currentIndex + 1;\n }\n\n \/\/ Update buttons\n if (prevBtn) {\n prevBtn.disabled = currentIndex === 0;\n }\n if (nextBtn) {\n nextBtn.disabled = currentIndex === totalSlides - 1;\n }\n\n \/\/ Update progress\n if (progressBar) {\n var progress = ((currentIndex + 1) \/ totalSlides) * 100;\n progressBar.style.width = progress + '%';\n }\n\n \/\/ Update active states\n var slides = document.querySelectorAll('#pasos-para-fabricar-un-cuatro .cuatro_slide');\n for (var i = 0; i < slides.length; i++) {\n if (i === currentIndex) {\n slides[i].className = 'cuatro_slide active';\n } else {\n slides[i].className = 'cuatro_slide';\n }\n }\n\n var dots = document.querySelectorAll('#pasos-para-fabricar-un-cuatro .cuatro_dot');\n for (var j = 0; j < dots.length; j++) {\n if (j === currentIndex) {\n dots[j].className = 'cuatro_dot active';\n } else {\n dots[j].className = 'cuatro_dot';\n }\n }\n }\n\n \/\/ Next button\n if (nextBtn) {\n nextBtn.onclick = function() {\n if (currentIndex < totalSlides - 1) {\n currentIndex++;\n updateCarousel();\n }\n return false;\n };\n }\n\n \/\/ Previous button\n if (prevBtn) {\n prevBtn.onclick = function() {\n if (currentIndex > 0) {\n currentIndex--;\n updateCarousel();\n }\n return false;\n };\n }\n\n \/\/ Dot clicks\n var dots = document.querySelectorAll('#pasos-para-fabricar-un-cuatro .cuatro_dot');\n for (var k = 0; k < dots.length; k++) {\n (function(index) {\n dots[index].onclick = function() {\n currentIndex = index;\n updateCarousel();\n };\n })(k);\n }\n\n \/\/ Initialize\n if (totalSpan) {\n totalSpan.innerHTML = totalSlides;\n }\n updateCarousel();\n });\n <\/script>\n<\/body>\n<\/html>\n","innerContent":["\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>How to create a Puerto Rican cuatro<\/title>\n <style>\n \/* Reset and variables - isolated with ID pasos-para-fabricar-un-cuatro *\/\n #pasos-para-fabricar-un-cuatro * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n font-family: inherit;\n }\n\n #pasos-para-fabricar-un-cuatro {\n --cuatro-primary: #04d99d;\n --cuatro-primary-light: #62d4a1;\n --cuatro-accent: #07c76b;\n --cuatro-text: #2c3e50;\n --cuatro-text-light: #6c7b7f;\n --cuatro-bg: #ffffff;\n --cuatro-border: #e8f4f0;\n --cuatro-shadow: rgba(4, 217, 157, 0.08);\n\n max-width: 100%;\n margin: 0 auto;\n background: linear-gradient(135deg, #fef9e7 0%, #f8f9fa 100%);\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;\n padding: 1rem 0;\n position: relative;\n min-height: 100vh;\n }\n\n \/* Header with more artisanal style *\/\n #pasos-para-fabricar-un-cuatro .cuatro_header {\n text-align: center;\n margin-bottom: 1.5rem;\n padding: 0 1rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_title {\n font-size: 1.4rem;\n font-weight: 800;\n color: var(--cuatro-text);\n margin-bottom: 0.5rem;\n line-height: 1.2;\n text-shadow: 0 2px 4px rgba(0,0,0,0.1);\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_subtitle {\n color: var(--cuatro-text-light);\n font-size: 0.95rem;\n line-height: 1.3;\n max-width: 600px;\n margin: 0 auto;\n font-style: italic;\n }\n\n \/* Decorative elements *\/\n #pasos-para-fabricar-un-cuatro .cuatro_header::after {\n content: \"\ud83c\udfb5\";\n display: block;\n font-size: 2rem;\n margin-top: 0.5rem;\n opacity: 0.7;\n }\n\n \/* Carousel with more artistic design - FIXED OVERFLOW *\/\n #pasos-para-fabricar-un-cuatro .cuatro_carousel_wrapper {\n position: relative;\n width: 100%;\n overflow: visible; \/* Changed from hidden *\/\n padding: 1.5rem 1rem 0 1rem; \/* Added top padding for number badges *\/\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_carousel_container {\n display: flex;\n width: 100%;\n position: relative;\n overflow: hidden; \/* Keep hidden here for slide clipping *\/\n border-radius: 20px; \/* Optional: adds nice rounded corners to viewport *\/\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_carousel_track {\n display: flex;\n width: 100%;\n transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);\n will-change: transform;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_slide {\n width: 100%;\n flex-shrink: 0;\n display: flex;\n justify-content: center;\n align-items: flex-start;\n padding: 1rem 0.75rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card {\n width: 100%;\n max-width: 520px;\n background: linear-gradient(145deg, #ffffff 0%, #fdfbfb 100%);\n border: 3px solid var(--cuatro-border);\n border-radius: 15px;\n padding: 1.5rem;\n padding-top: 2rem; \/* Extra top padding for number *\/\n box-shadow: 0 10px 25px var(--cuatro-shadow), 0 4px 10px rgba(0,0,0,0.05);\n transition: all 0.4s ease;\n position: relative;\n opacity: 0.75;\n transform: scale(0.95) rotateY(5deg);\n perspective: 1000px;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_slide.active .cuatro_card {\n opacity: 1;\n transform: scale(1) rotateY(0deg);\n border-color: var(--cuatro-primary-light);\n box-shadow: 0 15px 35px rgba(4, 217, 157, 0.15), 0 5px 15px rgba(0,0,0,0.1);\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_number {\n position: absolute;\n top: -18px;\n left: 2rem;\n background: linear-gradient(135deg, #07c76b 0%, #04d99d 50%, #62d4a1 100%);\n color: white;\n width: 2.5rem;\n height: 2.5rem;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n font-weight: 800;\n font-size: 1.1rem;\n box-shadow: 0 6px 15px rgba(4, 217, 157, 0.4);\n border: 3px solid white;\n z-index: 10;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_content {\n padding-top: 0.8rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_title {\n font-size: 1.3rem;\n font-weight: 700;\n color: var(--cuatro-text);\n margin-bottom: 1rem;\n line-height: 1.3;\n position: relative;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_title::after {\n content: \"\";\n position: absolute;\n bottom: -8px;\n left: 0;\n width: 50px;\n height: 3px;\n background: linear-gradient(90deg, var(--cuatro-primary) 0%, var(--cuatro-primary-light) 100%);\n border-radius: 2px;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_text {\n color: var(--cuatro-text-light);\n font-size: 1rem;\n line-height: 1.6;\n margin-bottom: 1rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_details {\n background: rgba(4, 217, 157, 0.05);\n border-left: 4px solid var(--cuatro-primary);\n padding: 1rem;\n border-radius: 8px;\n font-size: 0.95rem;\n line-height: 1.5;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_text strong,\n #pasos-para-fabricar-un-cuatro .cuatro_card_details strong {\n color: var(--cuatro-text);\n font-weight: 600;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_time_estimate {\n display: inline-flex;\n align-items: center;\n gap: 0.5rem;\n background: var(--cuatro-primary-light);\n color: white;\n padding: 0.4rem 0.8rem;\n border-radius: 20px;\n font-size: 0.85rem;\n font-weight: 600;\n margin-top: 0.5rem;\n }\n\n \/* Navigation with more elaborate style *\/\n #pasos-para-fabricar-un-cuatro .cuatro_navigation {\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 1rem;\n margin-top: 2rem;\n padding: 0 1rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_nav_btn {\n background: linear-gradient(135deg, #07c76b 0%, #04d99d 50%, #62d4a1 100%);\n color: white;\n border: none;\n width: 2.5rem;\n height: 2.5rem;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all 0.3s ease;\n box-shadow: 0 6px 15px rgba(4, 217, 157, 0.3);\n border: 2px solid white;\n position: relative;\n z-index: 100;\n pointer-events: auto;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_nav_btn:hover:not(:disabled) {\n transform: scale(1.1) translateY(-2px);\n box-shadow: 0 8px 20px rgba(4, 217, 157, 0.4);\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_nav_btn svg {\n width: 18px;\n height: 18px;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_indicators {\n display: flex;\n gap: 0.6rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_dot {\n width: 0.6rem;\n height: 0.6rem;\n border-radius: 50%;\n background-color: #ddd;\n cursor: pointer;\n transition: all 0.3s ease;\n border: 2px solid transparent;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_dot.active {\n background-color: var(--cuatro-primary);\n width: 2rem;\n border-radius: 1rem;\n border-color: white;\n box-shadow: 0 2px 8px rgba(4, 217, 157, 0.3);\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_counter {\n color: var(--cuatro-text);\n font-size: 0.9rem;\n font-weight: 600;\n min-width: 3.5rem;\n text-align: center;\n background: white;\n padding: 0.4rem 0.8rem;\n border-radius: 20px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.1);\n }\n\n \/* More elegant progress bar *\/\n #pasos-para-fabricar-un-cuatro .cuatro_progress {\n width: 100%;\n max-width: 400px;\n height: 6px;\n background-color: #f0f0f0;\n margin: 2rem auto 0;\n border-radius: 3px;\n overflow: hidden;\n box-shadow: inset 0 2px 4px rgba(0,0,0,0.1);\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_progress_bar {\n height: 100%;\n background: linear-gradient(90deg, var(--cuatro-primary) 0%, var(--cuatro-primary-light) 100%);\n width: 12.5%;\n transition: width 0.5s ease;\n border-radius: 3px;\n box-shadow: 0 0 10px rgba(4, 217, 157, 0.5);\n }\n\n \/* Responsive Design *\/\n @media (min-width: 768px) {\n #pasos-para-fabricar-un-cuatro {\n padding: 3rem 0;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_title {\n font-size: 2.2rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_subtitle {\n font-size: 1.1rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_slide {\n padding: 1.5rem 1rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card {\n padding: 2.5rem;\n padding-top: 3rem;\n max-width: 650px;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_number {\n width: 3rem;\n height: 3rem;\n font-size: 1.2rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_title {\n font-size: 1.5rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_text {\n font-size: 1.1rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_nav_btn {\n width: 3rem;\n height: 3rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_nav_btn svg {\n width: 20px;\n height: 20px;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_navigation {\n gap: 1.5rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_counter {\n font-size: 1rem;\n min-width: 4rem;\n }\n }\n\n @media (min-width: 1024px) {\n #pasos-para-fabricar-un-cuatro {\n max-width: 1200px;\n padding: 4rem 2rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_title {\n font-size: 2.8rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_slide {\n padding: 2rem 1.5rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card {\n padding: 3rem;\n padding-top: 3.5rem;\n max-width: 750px;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_title {\n font-size: 1.7rem;\n }\n\n #pasos-para-fabricar-un-cuatro .cuatro_card_text {\n font-size: 1.15rem;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div id=\"pasos-para-fabricar-un-cuatro\">\n <header class=\"cuatro_header\">\n <h1 class=\"cuatro_title\">How to create a Puerto Rican cuatro<\/h1>\n <p class=\"cuatro_subtitle\">\n The traditional art of criollo lutherie step by step\n <\/p>\n <\/header>\n\n <div class=\"cuatro_carousel_wrapper\">\n <div class=\"cuatro_carousel_container\">\n <div class=\"cuatro_carousel_track\" id=\"cuatro-track\">\n \n <div class=\"cuatro_slide active\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">1<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Design and initial cut<\/h3>\n <p class=\"cuatro_card_text\">Uses a cuatro template to trace its design on a piece of wood. Then cuts and sands it to create the body and neck of the instrument to the desired size.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_slide\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">2<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Creating the sound box<\/h3>\n <p class=\"cuatro_card_text\">Hollows out the body with a drill until leaving a bottom almost an inch thick. This hollow space is known as the sound box and is what helps amplify the cuatro's sound.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_slide\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">3<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Soundboard and rosette<\/h3>\n <p class=\"cuatro_card_text\">Joins two wooden planks to create the soundboard, which will cover the sound box. Also makes a hole in the center of the soundboard and insets the rosette, which is the ornament around the edge of the centered opening.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_slide\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">4<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Fan bracing system<\/h3>\n <p class=\"cuatro_card_text\">On the interior side of the soundboard, the luthier glues strips that will form the fan bracing. This system will assist in amplifying and directing the sound. Once the soundboard is finished, it's glued to the sound box as aligned and precise as possible.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_slide\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">5<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Marquetry and fingerboard<\/h3>\n <p class=\"cuatro_card_text\">On the edges of the cuatro, creates the channels where the marquetry will go, the fine ornament that surrounds it. Also works on the fingerboard, the wood on the neck where fingers are placed to create musical notes.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_slide\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">6<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Frets and custom design<\/h3>\n <p class=\"cuatro_card_text\">Once the fingerboard is glued to the neck, installs the frets, which mark the position of the notes. Carves the neck with a unique design of their authorship that identifies their artisanal work. Also creates the headstock where the tuning pegs will go.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_slide\">\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_number\">7<\/div>\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">Final touches<\/h3>\n <p class=\"cuatro_card_text\">Among the final steps, glues the bridge, the base where the instrument's strings are placed. Then, installs the strings, calibrates the nut, a thin bar at the beginning of the fingerboard that keeps the strings straight and properly positioned, and tunes the instrument for use.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"cuatro_navigation\">\n <button id=\"cuatro-prev-btn\" class=\"cuatro_nav_btn\" disabled>\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n <polyline points=\"15 18 9 12 15 6\"><\/polyline>\n <\/svg>\n <\/button>\n\n <div class=\"cuatro_counter\">\n <span id=\"cuatro-current\">1<\/span> \/ <span id=\"cuatro-total\">7<\/span>\n <\/div>\n\n <div class=\"cuatro_indicators\" id=\"cuatro-indicators\">\n <div class=\"cuatro_dot active\"><\/div>\n <div class=\"cuatro_dot\"><\/div>\n <div class=\"cuatro_dot\"><\/div>\n <div class=\"cuatro_dot\"><\/div>\n <div class=\"cuatro_dot\"><\/div>\n <div class=\"cuatro_dot\"><\/div>\n <div class=\"cuatro_dot\"><\/div>\n <\/div>\n\n <button id=\"cuatro-next-btn\" class=\"cuatro_nav_btn\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n <polyline points=\"9 18 15 12 9 6\"><\/polyline>\n <\/svg>\n <\/button>\n <\/div>\n\n <div class=\"cuatro_progress\">\n <div class=\"cuatro_progress_bar\" id=\"cuatro-progress-bar\"><\/div>\n <\/div>\n <\/div>\n\n <script>\n \/\/ Simple inline script that will definitely work\n window.addEventListener('load', function() {\n var currentIndex = 0;\n var totalSlides = 7;\n\n \/\/ Get elements using getElementById for maximum compatibility\n var track = document.getElementById('cuatro-track');\n var prevBtn = document.getElementById('cuatro-prev-btn');\n var nextBtn = document.getElementById('cuatro-next-btn');\n var currentSpan = document.getElementById('cuatro-current');\n var totalSpan = document.getElementById('cuatro-total');\n var progressBar = document.getElementById('cuatro-progress-bar');\n\n \/\/ Simple update function\n function updateCarousel() {\n \/\/ Move the track\n if (track) {\n track.style.transform = 'translateX(-' + (currentIndex * 100) + '%)';\n }\n\n \/\/ Update counter\n if (currentSpan) {\n currentSpan.innerHTML = currentIndex + 1;\n }\n\n \/\/ Update buttons\n if (prevBtn) {\n prevBtn.disabled = currentIndex === 0;\n }\n if (nextBtn) {\n nextBtn.disabled = currentIndex === totalSlides - 1;\n }\n\n \/\/ Update progress\n if (progressBar) {\n var progress = ((currentIndex + 1) \/ totalSlides) * 100;\n progressBar.style.width = progress + '%';\n }\n\n \/\/ Update active states\n var slides = document.querySelectorAll('#pasos-para-fabricar-un-cuatro .cuatro_slide');\n for (var i = 0; i < slides.length; i++) {\n if (i === currentIndex) {\n slides[i].className = 'cuatro_slide active';\n } else {\n slides[i].className = 'cuatro_slide';\n }\n }\n\n var dots = document.querySelectorAll('#pasos-para-fabricar-un-cuatro .cuatro_dot');\n for (var j = 0; j < dots.length; j++) {\n if (j === currentIndex) {\n dots[j].className = 'cuatro_dot active';\n } else {\n dots[j].className = 'cuatro_dot';\n }\n }\n }\n\n \/\/ Next button\n if (nextBtn) {\n nextBtn.onclick = function() {\n if (currentIndex < totalSlides - 1) {\n currentIndex++;\n updateCarousel();\n }\n return false;\n };\n }\n\n \/\/ Previous button\n if (prevBtn) {\n prevBtn.onclick = function() {\n if (currentIndex > 0) {\n currentIndex--;\n updateCarousel();\n }\n return false;\n };\n }\n\n \/\/ Dot clicks\n var dots = document.querySelectorAll('#pasos-para-fabricar-un-cuatro .cuatro_dot');\n for (var k = 0; k < dots.length; k++) {\n (function(index) {\n dots[index].onclick = function() {\n currentIndex = index;\n updateCarousel();\n };\n })(k);\n }\n\n \/\/ Initialize\n if (totalSpan) {\n totalSpan.innerHTML = totalSlides;\n }\n updateCarousel();\n });\n <\/script>\n<\/body>\n<\/html>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/heading","attrs":[],"innerBlocks":[],"innerHTML":"\n<h2 class=\"wp-block-heading\">Preserving the tradition<\/h2>\n","innerContent":["\n<h2 class=\"wp-block-heading\">Preserving the tradition<\/h2>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>In his workshop in Coamo, Ortiz doesn't just create instruments; he also teaches the art of building them.<\/p>\n","innerContent":["\n<p>In his workshop in Coamo, Ortiz doesn't just create instruments; he also teaches the art of building them.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p><strong>\"The more luthiers there are, the more cuatros there will be,\"<\/strong> affirmed Ortiz, who feels proud to transmit his knowledge \"so that the culture stays alive.\"<\/p>\n","innerContent":["\n<p><strong>\"The more luthiers there are, the more cuatros there will be,\"<\/strong> affirmed Ortiz, who feels proud to transmit his knowledge \"so that the culture stays alive.\"<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>As a guitar musician, Ausberto Ramos Rodr\u00edguez, 43, always had curiosity about the manufacturing process. He saw an ad on Facebook for Ortiz's course and decided to take it between February and August of last year.<\/p>\n","innerContent":["\n<p>As a guitar musician, Ausberto Ramos Rodr\u00edguez, 43, always had curiosity about the manufacturing process. He saw an ad on Facebook for Ortiz's course and decided to take it between February and August of last year.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>\"I had always had that interest in making guitar instruments and the world of lutherie attracted me quite a bit,\" said Ramos Rodr\u00edguez, a native of Vega Alta.<\/p>\n","innerContent":["\n<p>\"I had always had that interest in making guitar instruments and the world of lutherie attracted me quite a bit,\" said Ramos Rodr\u00edguez, a native of Vega Alta.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/image","attrs":{"id":27153,"width":"783px","height":"auto","aspectRatio":"1.7747041333877456","sizeSlug":"large","linkDestination":"none"},"innerBlocks":[],"innerHTML":"\n<figure class=\"wp-block-image size-large is-resized\"><img src=\"https:\/\/www.plateapr.com\/wp-content\/uploads\/2025\/07\/1-b7f3a783-1024x577.jpg\" alt=\"\" class=\"wp-image-27153\" style=\"aspect-ratio:1.7747041333877456;width:783px;height:auto\"\/><figcaption class=\"wp-element-caption\"><em>One of Ortiz's students crafting the acoustic soundboard of his instrument. Photo: Provided<\/em><\/figcaption><\/figure>\n","innerContent":["\n<figure class=\"wp-block-image size-large is-resized\"><img src=\"https:\/\/www.plateapr.com\/wp-content\/uploads\/2025\/07\/1-b7f3a783-1024x577.jpg\" alt=\"\" class=\"wp-image-27153\" style=\"aspect-ratio:1.7747041333877456;width:783px;height:auto\"\/><figcaption class=\"wp-element-caption\"><em>One of Ortiz's students crafting the acoustic soundboard of his instrument. Photo: Provided<\/em><\/figcaption><\/figure>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Meanwhile, Javier Ortiz, 52, a resident of Morovis, also took the course to learn about woods and how the natural material affects the sound.<\/p>\n","innerContent":["\n<p>Meanwhile, Javier Ortiz, 52, a resident of Morovis, also took the course to learn about woods and how the natural material affects the sound.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>For both apprentices, their teacher's guidance was excellent as they watched wooden planks transform into instruments with their own hands.<\/p>\n","innerContent":["\n<p>For both apprentices, their teacher's guidance was excellent as they watched wooden planks transform into instruments with their own hands.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>\"The most beautiful thing is being able to hear the instrument once you finish it. I mean, that feeling that <strong>with your hands you made something that sounds<\/strong> <strong>and brings you joy<\/strong>,\" added Ramos Rodr\u00edguez.<\/p>\n","innerContent":["\n<p>\"The most beautiful thing is being able to hear the instrument once you finish it. I mean, that feeling that <strong>with your hands you made something that sounds<\/strong> <strong>and brings you joy<\/strong>,\" added Ramos Rodr\u00edguez.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Both students agree: learning and continuing the tradition is fundamental to preserving this Puerto Rican cultural heritage.<\/p>\n","innerContent":["\n<p>Both students agree: learning and continuing the tradition is fundamental to preserving this Puerto Rican cultural heritage.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/heading","attrs":[],"innerBlocks":[],"innerHTML":"\n<h2 class=\"wp-block-heading\">The relationship between musician and luthier<\/h2>\n","innerContent":["\n<h2 class=\"wp-block-heading\">The relationship between musician and luthier<\/h2>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>For professional cuatristas like M\u00e9ndez, who is <a href=\"https:\/\/www.berklee.edu\/berklee-now\/news\/berklee-alumna-fabiola-m-mendez-receives-a-2022-whippoorwill-arts-fellowship\">the first graduate<\/a> of Berklee College of Music to specialize in the Puerto Rican cuatro, finding the right luthier is just as important as learning to play it.<\/p>\n","innerContent":["\n<p>For professional cuatristas like M\u00e9ndez, who is <a href=\"https:\/\/www.berklee.edu\/berklee-now\/news\/berklee-alumna-fabiola-m-mendez-receives-a-2022-whippoorwill-arts-fellowship\">the first graduate<\/a> of Berklee College of Music to specialize in the Puerto Rican cuatro, finding the right luthier is just as important as learning to play it.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/image","attrs":{"id":27159,"sizeSlug":"large","linkDestination":"none"},"innerBlocks":[],"innerHTML":"\n<figure class=\"wp-block-image size-large\"><img src=\"https:\/\/www.plateapr.com\/wp-content\/uploads\/2025\/07\/Copy-of-Web-Hero-Images-pocillo-68-1024x576.png\" alt=\"\" class=\"wp-image-27159\"\/><figcaption class=\"wp-element-caption\"><em>Cuatrista Fabiola M\u00e9ndez with her first cuatro. Photo: Provided<\/em><\/figcaption><\/figure>\n","innerContent":["\n<figure class=\"wp-block-image size-large\"><img src=\"https:\/\/www.plateapr.com\/wp-content\/uploads\/2025\/07\/Copy-of-Web-Hero-Images-pocillo-68-1024x576.png\" alt=\"\" class=\"wp-image-27159\"\/><figcaption class=\"wp-element-caption\"><em>Cuatrista Fabiola M\u00e9ndez with her first cuatro. Photo: Provided<\/em><\/figcaption><\/figure>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>\"When you find that luthier who makes instruments <strong>the way you like them, who knows you<\/strong>, well, you create that quite long-lasting relationship,\" said the cuatrista.<\/p>\n","innerContent":["\n<p>\"When you find that luthier who makes instruments <strong>the way you like them, who knows you<\/strong>, well, you create that quite long-lasting relationship,\" said the cuatrista.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Throughout her career, M\u00e9ndez has worked with renowned artisans like Jesiel Mart\u00ednez, a young 27-year-old luthier with 12 years of experience who designed a cuatro used in <a href=\"https:\/\/www.plateapr.com\/debi-tirar-mas-fotos-de-bad-bunny-una-inmersion-en-la-identidad-puertorriquena\/\">DeB\u00cd TiRAR M\u00e1S FOToS<\/a>, Bad Bunny's latest album, and Aurelio Cruz, who has dedicated his life to lutherie since age 13.<\/p>\n","innerContent":["\n<p>Throughout her career, M\u00e9ndez has worked with renowned artisans like Jesiel Mart\u00ednez, a young 27-year-old luthier with 12 years of experience who designed a cuatro used in <a href=\"https:\/\/www.plateapr.com\/debi-tirar-mas-fotos-de-bad-bunny-una-inmersion-en-la-identidad-puertorriquena\/\">DeB\u00cd TiRAR M\u00e1S FOToS<\/a>, Bad Bunny's latest album, and Aurelio Cruz, who has dedicated his life to lutherie since age 13.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/html","attrs":[],"innerBlocks":[],"innerHTML":"\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Where to find cuatro artisans<\/title>\n <style>\n \/* Reset and variables - isolated with prefix cuatro_ *\/\n .cuatro_container * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n font-family: inherit;\n }\n\n .cuatro_container {\n --cuatro-primary: #04d99d;\n --cuatro-primary-light: #5eedc0;\n --cuatro-text: #2c3e50;\n --cuatro-text-light: #6c7b7f;\n --cuatro-bg: #ffffff;\n --cuatro-border: #e8f4f0;\n --cuatro-shadow: rgba(4, 217, 157, 0.08);\n\n max-width: 100%;\n margin: 0 auto;\n background-color: var(--cuatro-bg);\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;\n padding: 1rem 0;\n position: relative;\n }\n\n \/* Header *\/\n .cuatro_header {\n text-align: center;\n margin-bottom: 1rem;\n padding: 0 1rem;\n }\n\n .cuatro_title {\n font-size: 1.3rem;\n font-weight: 700;\n color: var(--cuatro-text);\n margin-bottom: 1rem;\n line-height: 1.1;\n }\n\n .cuatro_subtitle {\n color: var(--cuatro-text-light);\n font-size: 0.9rem;\n line-height: 1.2;\n max-width: 600px;\n margin: 0 auto;\n }\n\n .cuatro_subtitle a {\n color: var(--cuatro-primary);\n text-decoration: none;\n font-weight: 500;\n border-bottom: 1px solid transparent;\n transition: border-color 0.2s ease;\n }\n\n .cuatro_subtitle a:hover {\n border-bottom-color: var(--cuatro-primary);\n }\n\n \/* New carousel architecture - designed from scratch to be robust *\/\n .cuatro_carousel_wrapper {\n position: relative;\n width: 100%;\n overflow: hidden;\n padding: 0 1rem;\n }\n\n .cuatro_carousel_container {\n display: flex;\n width: 100%;\n position: relative;\n }\n\n .cuatro_carousel_track {\n display: flex;\n width: 100%;\n transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);\n will-change: transform;\n }\n\n .cuatro_slide {\n width: 100%;\n flex-shrink: 0;\n display: flex;\n justify-content: center;\n align-items: flex-start;\n padding: 1rem 0.75rem;\n }\n\n .cuatro_card {\n width: 100%;\n max-width: 500px;\n background-color: var(--cuatro-bg);\n border: 2px solid var(--cuatro-border);\n border-radius: 10px;\n padding: 1.3rem;\n box-shadow: 0 8px 20px var(--cuatro-shadow);\n transition: all 0.3s ease;\n position: relative;\n opacity: 0.7;\n transform: scale(0.98);\n }\n\n .cuatro_slide.active .cuatro_card {\n opacity: 1;\n transform: scale(1);\n border-color: var(--cuatro-primary-light);\n box-shadow: 0 12px 25px rgba(4, 217, 157, 0.12);\n }\n\n .cuatro_card_content {\n padding-top: 0;\n }\n\n .cuatro_card_title {\n font-size: 1.25rem;\n font-weight: 700;\n color: var(--cuatro-text);\n margin-bottom: 1rem;\n line-height: 1.4;\n }\n\n .cuatro_card_text {\n color: var(--cuatro-text-light);\n font-size: 1rem;\n line-height: 1.5;\n }\n\n .cuatro_card_text strong {\n color: var(--cuatro-text);\n display: block;\n margin-bottom: 0.25rem;\n }\n\n .cuatro_card_text a {\n color: var(--cuatro-primary);\n text-decoration: none;\n font-weight: 500;\n border-bottom: 1px solid transparent;\n transition: border-color 0.2s ease;\n }\n\n .cuatro_card_text a:hover {\n border-bottom-color: var(--cuatro-primary);\n }\n\n \/* Navigation *\/\n .cuatro_navigation {\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 1rem;\n margin-top: 2rem;\n padding: 0 1rem;\n }\n\n .cuatro_nav_btn {\n background-color: var(--cuatro-primary);\n color: white;\n border: none;\n width: 3rem;\n height: 3rem;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all 0.2s ease;\n box-shadow: 0 4px 12px rgba(4, 217, 157, 0.2);\n }\n\n .cuatro_nav_btn:hover:not(:disabled) {\n background-color: #03b583;\n transform: scale(1.05);\n }\n\n .cuatro_nav_btn:disabled {\n background-color: #ddd;\n cursor: not-allowed;\n opacity: 0.5;\n transform: scale(1);\n box-shadow: none;\n }\n\n .cuatro_indicators {\n display: flex;\n gap: 0.5rem;\n }\n\n .cuatro_dot {\n width: 0.5rem;\n height: 0.5rem;\n border-radius: 50%;\n background-color: #ddd;\n cursor: pointer;\n transition: all 0.2s ease;\n }\n\n .cuatro_dot.active {\n background-color: var(--cuatro-primary);\n width: 1.5rem;\n border-radius: 0.75rem;\n }\n\n .cuatro_counter {\n color: var(--cuatro-text-light);\n font-size: 0.9rem;\n font-weight: 500;\n min-width: 3rem;\n text-align: center;\n }\n\n \/* Progress bar *\/\n .cuatro_progress {\n width: 100%;\n height: 2px;\n background-color: #f0f0f0;\n margin-top: 1.5rem;\n border-radius: 1px;\n overflow: hidden;\n }\n\n .cuatro_progress_bar {\n height: 100%;\n background-color: var(--cuatro-primary);\n width: 33.33%;\n transition: width 0.4s ease;\n border-radius: 1px;\n }\n\n \/* Responsive Design - Progressive scaling of the complete system *\/\n @media (min-width: 768px) {\n .cuatro_container {\n padding: 3rem 0;\n }\n\n .cuatro_title {\n font-size: 2.1rem;\n }\n\n .cuatro_subtitle {\n font-size: 1rem;\n }\n\n .cuatro_slide {\n padding: 1rem 1rem;\n }\n\n .cuatro_card {\n padding: 2rem;\n max-width: 600px;\n }\n\n .cuatro_card_title {\n font-size: 1.4rem;\n }\n\n .cuatro_card_text {\n font-size: 1.05rem;\n }\n }\n\n @media (min-width: 1024px) {\n .cuatro_container {\n max-width: 1200px;\n padding: 4rem 2rem;\n }\n\n .cuatro_title {\n font-size: 2.5rem;\n }\n\n .cuatro_slide {\n padding: 1rem 1.5rem;\n }\n\n .cuatro_card {\n padding: 3rem;\n max-width: 700px;\n }\n\n .cuatro_card_title {\n font-size: 1.5rem;\n }\n\n .cuatro_card_text {\n font-size: 1.1rem;\n }\n }\n\n @media (min-width: 1400px) {\n .cuatro_card {\n max-width: 800px;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"cuatro_container\">\n \n <header class=\"cuatro_header\">\n <h1 class=\"cuatro_title\">3\ufe0f\u20e3 Tips for your custom cuatro<\/h1>\n <p class=\"cuatro_subtitle\">\n If you're considering ordering your own cuatro, these are the key aspects you should discuss with your luthier\n <\/p>\n <\/header>\n\n \n <div class=\"cuatro_carousel_wrapper\">\n <div class=\"cuatro_carousel_container\">\n <div class=\"cuatro_carousel_track\" id=\"cuatro_track\">\n \n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"cuatro_navigation\">\n <button id=\"cuatro_prev_btn\" class=\"cuatro_nav_btn\" disabled>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n <polyline points=\"15 18 9 12 15 6\"><\/polyline>\n <\/svg>\n <\/button>\n\n <div class=\"cuatro_indicators\" id=\"cuatro_indicators\">\n \n <\/div>\n\n <button id=\"cuatro_next_btn\" class=\"cuatro_nav_btn\">\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n <polyline points=\"9 18 15 12 9 6\"><\/polyline>\n <\/svg>\n <\/button>\n <\/div>\n\n \n <div class=\"cuatro_progress\">\n <div class=\"cuatro_progress_bar\" id=\"cuatro_progress_bar\"><\/div>\n <\/div>\n <\/div>\n\n <script>\n (function() {\n \/\/ IIFE for complete code isolation\n\n \/\/ Data for custom cuatro tips\n const cuatroData = [\n {\n id: 1,\n title: \"\ud83c\udfb6 Balanced sonority\",\n content: `\"There should be a balanced register between low and high sounds,\" explained M\u00e9ndez.`\n },\n {\n id: 2,\n title: \"\ud83c\udfb6 Comfortable action\",\n content: `The strings should have just the right tension. \"If I feel the action is too hard, it means I have to press too much,\" emphasized the Emmy-nominated composer.`\n },\n {\n id: 3,\n title: \"\ud83d\udcb8 Investment in quality\",\n content: `\"A cheap cuatro ends up being expensive... It's hard to play and doesn't sound good, versus paying a little more for a student cuatro made by Puerto Rican luthiers,\" she advised.`\n }\n ];\n\n \/\/ DOM references\n const track = document.getElementById('cuatro_track');\n const indicatorsContainer = document.getElementById('cuatro_indicators');\n const prevBtn = document.getElementById('cuatro_prev_btn');\n const nextBtn = document.getElementById('cuatro_next_btn');\n const progressBar = document.getElementById('cuatro_progress_bar');\n\n let currentIndex = 0;\n const totalSlides = cuatroData.length;\n\n \/\/ Build slide structure\n function buildCarousel() {\n \/\/ Create each slide with its corresponding card\n cuatroData.forEach((item, index) => {\n const slide = document.createElement('div');\n slide.className = `cuatro_slide ${index === 0 ? 'active' : ''}`;\n\n slide.innerHTML = `\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">${item.title}<\/h3>\n <p class=\"cuatro_card_text\">${item.content}<\/p>\n <\/div>\n <\/div>\n `;\n\n track.appendChild(slide);\n });\n }\n\n \/\/ Build navigation indicators\n function buildIndicators() {\n for (let i = 0; i < totalSlides; i++) {\n const dot = document.createElement('div');\n dot.className = `cuatro_dot ${i === 0 ? 'active' : ''}`;\n dot.addEventListener('click', () => navigateToSlide(i));\n indicatorsContainer.appendChild(dot);\n }\n }\n\n \/\/ Main navigation function - robust architecture\n function navigateToSlide(targetIndex) {\n \/\/ Index validation\n if (targetIndex < 0 || targetIndex >= totalSlides) return;\n\n \/\/ Update current index\n currentIndex = targetIndex;\n\n \/\/ Calculate displacement - each slide takes exactly 100% of the container\n const translateXValue = -(currentIndex * 100);\n\n \/\/ Apply transformation to track\n track.style.transform = `translateX(${translateXValue}%)`;\n\n \/\/ Update visual states of slides\n const slides = document.querySelectorAll('.cuatro_slide');\n slides.forEach((slide, index) => {\n slide.classList.toggle('active', index === currentIndex);\n });\n\n \/\/ Update indicators\n const dots = document.querySelectorAll('.cuatro_dot');\n dots.forEach((dot, index) => {\n dot.classList.toggle('active', index === currentIndex);\n });\n\n \/\/ Update navigation controls\n prevBtn.disabled = currentIndex === 0;\n nextBtn.disabled = currentIndex === totalSlides - 1;\n\n \/\/ Update progress bar\n const progressPercentage = ((currentIndex + 1) \/ totalSlides) * 100;\n progressBar.style.width = `${progressPercentage}%`;\n }\n\n \/\/ Set up all interactivity\n function setupInteractivity() {\n \/\/ Navigation buttons\n prevBtn.addEventListener('click', () => {\n if (currentIndex > 0) {\n navigateToSlide(currentIndex - 1);\n }\n });\n\n nextBtn.addEventListener('click', () => {\n if (currentIndex < totalSlides - 1) {\n navigateToSlide(currentIndex + 1);\n }\n });\n\n \/\/ Touch navigation for mobile devices\n let touchStartX = 0;\n let touchEndX = 0;\n let touchStartTime = 0;\n\n track.addEventListener('touchstart', (e) => {\n touchStartX = e.changedTouches[0].screenX;\n touchStartTime = Date.now();\n }, { passive: true });\n\n track.addEventListener('touchend', (e) => {\n touchEndX = e.changedTouches[0].screenX;\n const touchDuration = Date.now() - touchStartTime;\n\n \/\/ Only process quick swipes to avoid conflicts with scroll\n if (touchDuration < 300) {\n handleTouchSwipe();\n }\n }, { passive: true });\n\n function handleTouchSwipe() {\n const swipeThreshold = 50;\n const swipeDistance = touchStartX - touchEndX;\n\n if (Math.abs(swipeDistance) > swipeThreshold) {\n if (swipeDistance > 0) {\n \/\/ Swipe left - next slide\n if (currentIndex < totalSlides - 1) {\n navigateToSlide(currentIndex + 1);\n }\n } else {\n \/\/ Swipe right - previous slide\n if (currentIndex > 0) {\n navigateToSlide(currentIndex - 1);\n }\n }\n }\n }\n\n \/\/ Keyboard navigation for accessibility\n document.addEventListener('keydown', (e) => {\n if (e.target.closest('.cuatro_container')) {\n if (e.key === 'ArrowLeft' && currentIndex > 0) {\n e.preventDefault();\n navigateToSlide(currentIndex - 1);\n } else if (e.key === 'ArrowRight' && currentIndex < totalSlides - 1) {\n e.preventDefault();\n navigateToSlide(currentIndex + 1);\n }\n }\n });\n }\n\n \/\/ Complete component initialization\n function initializeCarousel() {\n \/\/ Verify all DOM elements exist before proceeding\n if (!track || !indicatorsContainer || !prevBtn || !nextBtn || !progressBar) {\n console.error('Some cuatro carousel DOM elements were not found');\n return;\n }\n\n buildCarousel();\n buildIndicators();\n setupInteractivity();\n\n \/\/ Set initial values\n navigateToSlide(0);\n }\n\n \/\/ Run initialization when DOM is fully loaded\n if (document.readyState === 'loading') {\n document.addEventListener('DOMContentLoaded', initializeCarousel);\n } else {\n \/\/ Use setTimeout to ensure DOM is fully rendered\n setTimeout(initializeCarousel, 0);\n }\n })();\n <\/script>\n<\/body>\n<\/html>\n","innerContent":["\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Where to find cuatro artisans<\/title>\n <style>\n \/* Reset and variables - isolated with prefix cuatro_ *\/\n .cuatro_container * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n font-family: inherit;\n }\n\n .cuatro_container {\n --cuatro-primary: #04d99d;\n --cuatro-primary-light: #5eedc0;\n --cuatro-text: #2c3e50;\n --cuatro-text-light: #6c7b7f;\n --cuatro-bg: #ffffff;\n --cuatro-border: #e8f4f0;\n --cuatro-shadow: rgba(4, 217, 157, 0.08);\n\n max-width: 100%;\n margin: 0 auto;\n background-color: var(--cuatro-bg);\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;\n padding: 1rem 0;\n position: relative;\n }\n\n \/* Header *\/\n .cuatro_header {\n text-align: center;\n margin-bottom: 1rem;\n padding: 0 1rem;\n }\n\n .cuatro_title {\n font-size: 1.3rem;\n font-weight: 700;\n color: var(--cuatro-text);\n margin-bottom: 1rem;\n line-height: 1.1;\n }\n\n .cuatro_subtitle {\n color: var(--cuatro-text-light);\n font-size: 0.9rem;\n line-height: 1.2;\n max-width: 600px;\n margin: 0 auto;\n }\n\n .cuatro_subtitle a {\n color: var(--cuatro-primary);\n text-decoration: none;\n font-weight: 500;\n border-bottom: 1px solid transparent;\n transition: border-color 0.2s ease;\n }\n\n .cuatro_subtitle a:hover {\n border-bottom-color: var(--cuatro-primary);\n }\n\n \/* New carousel architecture - designed from scratch to be robust *\/\n .cuatro_carousel_wrapper {\n position: relative;\n width: 100%;\n overflow: hidden;\n padding: 0 1rem;\n }\n\n .cuatro_carousel_container {\n display: flex;\n width: 100%;\n position: relative;\n }\n\n .cuatro_carousel_track {\n display: flex;\n width: 100%;\n transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);\n will-change: transform;\n }\n\n .cuatro_slide {\n width: 100%;\n flex-shrink: 0;\n display: flex;\n justify-content: center;\n align-items: flex-start;\n padding: 1rem 0.75rem;\n }\n\n .cuatro_card {\n width: 100%;\n max-width: 500px;\n background-color: var(--cuatro-bg);\n border: 2px solid var(--cuatro-border);\n border-radius: 10px;\n padding: 1.3rem;\n box-shadow: 0 8px 20px var(--cuatro-shadow);\n transition: all 0.3s ease;\n position: relative;\n opacity: 0.7;\n transform: scale(0.98);\n }\n\n .cuatro_slide.active .cuatro_card {\n opacity: 1;\n transform: scale(1);\n border-color: var(--cuatro-primary-light);\n box-shadow: 0 12px 25px rgba(4, 217, 157, 0.12);\n }\n\n .cuatro_card_content {\n padding-top: 0;\n }\n\n .cuatro_card_title {\n font-size: 1.25rem;\n font-weight: 700;\n color: var(--cuatro-text);\n margin-bottom: 1rem;\n line-height: 1.4;\n }\n\n .cuatro_card_text {\n color: var(--cuatro-text-light);\n font-size: 1rem;\n line-height: 1.5;\n }\n\n .cuatro_card_text strong {\n color: var(--cuatro-text);\n display: block;\n margin-bottom: 0.25rem;\n }\n\n .cuatro_card_text a {\n color: var(--cuatro-primary);\n text-decoration: none;\n font-weight: 500;\n border-bottom: 1px solid transparent;\n transition: border-color 0.2s ease;\n }\n\n .cuatro_card_text a:hover {\n border-bottom-color: var(--cuatro-primary);\n }\n\n \/* Navigation *\/\n .cuatro_navigation {\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 1rem;\n margin-top: 2rem;\n padding: 0 1rem;\n }\n\n .cuatro_nav_btn {\n background-color: var(--cuatro-primary);\n color: white;\n border: none;\n width: 3rem;\n height: 3rem;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all 0.2s ease;\n box-shadow: 0 4px 12px rgba(4, 217, 157, 0.2);\n }\n\n .cuatro_nav_btn:hover:not(:disabled) {\n background-color: #03b583;\n transform: scale(1.05);\n }\n\n .cuatro_nav_btn:disabled {\n background-color: #ddd;\n cursor: not-allowed;\n opacity: 0.5;\n transform: scale(1);\n box-shadow: none;\n }\n\n .cuatro_indicators {\n display: flex;\n gap: 0.5rem;\n }\n\n .cuatro_dot {\n width: 0.5rem;\n height: 0.5rem;\n border-radius: 50%;\n background-color: #ddd;\n cursor: pointer;\n transition: all 0.2s ease;\n }\n\n .cuatro_dot.active {\n background-color: var(--cuatro-primary);\n width: 1.5rem;\n border-radius: 0.75rem;\n }\n\n .cuatro_counter {\n color: var(--cuatro-text-light);\n font-size: 0.9rem;\n font-weight: 500;\n min-width: 3rem;\n text-align: center;\n }\n\n \/* Progress bar *\/\n .cuatro_progress {\n width: 100%;\n height: 2px;\n background-color: #f0f0f0;\n margin-top: 1.5rem;\n border-radius: 1px;\n overflow: hidden;\n }\n\n .cuatro_progress_bar {\n height: 100%;\n background-color: var(--cuatro-primary);\n width: 33.33%;\n transition: width 0.4s ease;\n border-radius: 1px;\n }\n\n \/* Responsive Design - Progressive scaling of the complete system *\/\n @media (min-width: 768px) {\n .cuatro_container {\n padding: 3rem 0;\n }\n\n .cuatro_title {\n font-size: 2.1rem;\n }\n\n .cuatro_subtitle {\n font-size: 1rem;\n }\n\n .cuatro_slide {\n padding: 1rem 1rem;\n }\n\n .cuatro_card {\n padding: 2rem;\n max-width: 600px;\n }\n\n .cuatro_card_title {\n font-size: 1.4rem;\n }\n\n .cuatro_card_text {\n font-size: 1.05rem;\n }\n }\n\n @media (min-width: 1024px) {\n .cuatro_container {\n max-width: 1200px;\n padding: 4rem 2rem;\n }\n\n .cuatro_title {\n font-size: 2.5rem;\n }\n\n .cuatro_slide {\n padding: 1rem 1.5rem;\n }\n\n .cuatro_card {\n padding: 3rem;\n max-width: 700px;\n }\n\n .cuatro_card_title {\n font-size: 1.5rem;\n }\n\n .cuatro_card_text {\n font-size: 1.1rem;\n }\n }\n\n @media (min-width: 1400px) {\n .cuatro_card {\n max-width: 800px;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"cuatro_container\">\n \n <header class=\"cuatro_header\">\n <h1 class=\"cuatro_title\">3\ufe0f\u20e3 Tips for your custom cuatro<\/h1>\n <p class=\"cuatro_subtitle\">\n If you're considering ordering your own cuatro, these are the key aspects you should discuss with your luthier\n <\/p>\n <\/header>\n\n \n <div class=\"cuatro_carousel_wrapper\">\n <div class=\"cuatro_carousel_container\">\n <div class=\"cuatro_carousel_track\" id=\"cuatro_track\">\n \n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"cuatro_navigation\">\n <button id=\"cuatro_prev_btn\" class=\"cuatro_nav_btn\" disabled>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n <polyline points=\"15 18 9 12 15 6\"><\/polyline>\n <\/svg>\n <\/button>\n\n <div class=\"cuatro_indicators\" id=\"cuatro_indicators\">\n \n <\/div>\n\n <button id=\"cuatro_next_btn\" class=\"cuatro_nav_btn\">\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n <polyline points=\"9 18 15 12 9 6\"><\/polyline>\n <\/svg>\n <\/button>\n <\/div>\n\n \n <div class=\"cuatro_progress\">\n <div class=\"cuatro_progress_bar\" id=\"cuatro_progress_bar\"><\/div>\n <\/div>\n <\/div>\n\n <script>\n (function() {\n \/\/ IIFE for complete code isolation\n\n \/\/ Data for custom cuatro tips\n const cuatroData = [\n {\n id: 1,\n title: \"\ud83c\udfb6 Balanced sonority\",\n content: `\"There should be a balanced register between low and high sounds,\" explained M\u00e9ndez.`\n },\n {\n id: 2,\n title: \"\ud83c\udfb6 Comfortable action\",\n content: `The strings should have just the right tension. \"If I feel the action is too hard, it means I have to press too much,\" emphasized the Emmy-nominated composer.`\n },\n {\n id: 3,\n title: \"\ud83d\udcb8 Investment in quality\",\n content: `\"A cheap cuatro ends up being expensive... It's hard to play and doesn't sound good, versus paying a little more for a student cuatro made by Puerto Rican luthiers,\" she advised.`\n }\n ];\n\n \/\/ DOM references\n const track = document.getElementById('cuatro_track');\n const indicatorsContainer = document.getElementById('cuatro_indicators');\n const prevBtn = document.getElementById('cuatro_prev_btn');\n const nextBtn = document.getElementById('cuatro_next_btn');\n const progressBar = document.getElementById('cuatro_progress_bar');\n\n let currentIndex = 0;\n const totalSlides = cuatroData.length;\n\n \/\/ Build slide structure\n function buildCarousel() {\n \/\/ Create each slide with its corresponding card\n cuatroData.forEach((item, index) => {\n const slide = document.createElement('div');\n slide.className = `cuatro_slide ${index === 0 ? 'active' : ''}`;\n\n slide.innerHTML = `\n <div class=\"cuatro_card\">\n <div class=\"cuatro_card_content\">\n <h3 class=\"cuatro_card_title\">${item.title}<\/h3>\n <p class=\"cuatro_card_text\">${item.content}<\/p>\n <\/div>\n <\/div>\n `;\n\n track.appendChild(slide);\n });\n }\n\n \/\/ Build navigation indicators\n function buildIndicators() {\n for (let i = 0; i < totalSlides; i++) {\n const dot = document.createElement('div');\n dot.className = `cuatro_dot ${i === 0 ? 'active' : ''}`;\n dot.addEventListener('click', () => navigateToSlide(i));\n indicatorsContainer.appendChild(dot);\n }\n }\n\n \/\/ Main navigation function - robust architecture\n function navigateToSlide(targetIndex) {\n \/\/ Index validation\n if (targetIndex < 0 || targetIndex >= totalSlides) return;\n\n \/\/ Update current index\n currentIndex = targetIndex;\n\n \/\/ Calculate displacement - each slide takes exactly 100% of the container\n const translateXValue = -(currentIndex * 100);\n\n \/\/ Apply transformation to track\n track.style.transform = `translateX(${translateXValue}%)`;\n\n \/\/ Update visual states of slides\n const slides = document.querySelectorAll('.cuatro_slide');\n slides.forEach((slide, index) => {\n slide.classList.toggle('active', index === currentIndex);\n });\n\n \/\/ Update indicators\n const dots = document.querySelectorAll('.cuatro_dot');\n dots.forEach((dot, index) => {\n dot.classList.toggle('active', index === currentIndex);\n });\n\n \/\/ Update navigation controls\n prevBtn.disabled = currentIndex === 0;\n nextBtn.disabled = currentIndex === totalSlides - 1;\n\n \/\/ Update progress bar\n const progressPercentage = ((currentIndex + 1) \/ totalSlides) * 100;\n progressBar.style.width = `${progressPercentage}%`;\n }\n\n \/\/ Set up all interactivity\n function setupInteractivity() {\n \/\/ Navigation buttons\n prevBtn.addEventListener('click', () => {\n if (currentIndex > 0) {\n navigateToSlide(currentIndex - 1);\n }\n });\n\n nextBtn.addEventListener('click', () => {\n if (currentIndex < totalSlides - 1) {\n navigateToSlide(currentIndex + 1);\n }\n });\n\n \/\/ Touch navigation for mobile devices\n let touchStartX = 0;\n let touchEndX = 0;\n let touchStartTime = 0;\n\n track.addEventListener('touchstart', (e) => {\n touchStartX = e.changedTouches[0].screenX;\n touchStartTime = Date.now();\n }, { passive: true });\n\n track.addEventListener('touchend', (e) => {\n touchEndX = e.changedTouches[0].screenX;\n const touchDuration = Date.now() - touchStartTime;\n\n \/\/ Only process quick swipes to avoid conflicts with scroll\n if (touchDuration < 300) {\n handleTouchSwipe();\n }\n }, { passive: true });\n\n function handleTouchSwipe() {\n const swipeThreshold = 50;\n const swipeDistance = touchStartX - touchEndX;\n\n if (Math.abs(swipeDistance) > swipeThreshold) {\n if (swipeDistance > 0) {\n \/\/ Swipe left - next slide\n if (currentIndex < totalSlides - 1) {\n navigateToSlide(currentIndex + 1);\n }\n } else {\n \/\/ Swipe right - previous slide\n if (currentIndex > 0) {\n navigateToSlide(currentIndex - 1);\n }\n }\n }\n }\n\n \/\/ Keyboard navigation for accessibility\n document.addEventListener('keydown', (e) => {\n if (e.target.closest('.cuatro_container')) {\n if (e.key === 'ArrowLeft' && currentIndex > 0) {\n e.preventDefault();\n navigateToSlide(currentIndex - 1);\n } else if (e.key === 'ArrowRight' && currentIndex < totalSlides - 1) {\n e.preventDefault();\n navigateToSlide(currentIndex + 1);\n }\n }\n });\n }\n\n \/\/ Complete component initialization\n function initializeCarousel() {\n \/\/ Verify all DOM elements exist before proceeding\n if (!track || !indicatorsContainer || !prevBtn || !nextBtn || !progressBar) {\n console.error('Some cuatro carousel DOM elements were not found');\n return;\n }\n\n buildCarousel();\n buildIndicators();\n setupInteractivity();\n\n \/\/ Set initial values\n navigateToSlide(0);\n }\n\n \/\/ Run initialization when DOM is fully loaded\n if (document.readyState === 'loading') {\n document.addEventListener('DOMContentLoaded', initializeCarousel);\n } else {\n \/\/ Use setTimeout to ensure DOM is fully rendered\n setTimeout(initializeCarousel, 0);\n }\n })();\n <\/script>\n<\/body>\n<\/html>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/heading","attrs":[],"innerBlocks":[],"innerHTML":"\n<h2 class=\"wp-block-heading\">Which artisans make cuatros and offer workshops?<\/h2>\n","innerContent":["\n<h2 class=\"wp-block-heading\">Which artisans make cuatros and offer workshops?<\/h2>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>For those looking for a custom cuatro or wanting to learn the art of lutherie, these are the workshops and artisans available in Puerto Rico:<\/p>\n","innerContent":["\n<p>For those looking for a custom cuatro or wanting to learn the art of lutherie, these are the workshops and artisans available in Puerto Rico:<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/heading","attrs":{"level":3},"innerBlocks":[],"innerHTML":"\n<h3 class=\"wp-block-heading\"><strong><a href=\"https:\/\/www.facebook.com\/jesiel.martinez.16\">Jesiel Mart\u00ednez<\/a><\/strong><\/h3>\n","innerContent":["\n<h3 class=\"wp-block-heading\"><strong><a href=\"https:\/\/www.facebook.com\/jesiel.martinez.16\">Jesiel Mart\u00ednez<\/a><\/strong><\/h3>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/list","attrs":[],"innerBlocks":[{"blockName":"core\/list-item","attrs":[],"innerBlocks":[],"innerHTML":"\n<li>Artisan Jesiel Mart\u00ednez is located in Barrio Alto Sano, San Sebasti\u00e1n. He's 27 years old and already has about 12 years of experience making cuatros, bordon\u00faas, tiples, electric cuatros, requintos, guitars, Cuban tres, g\u00fciros, and other musical instruments.<\/li>\n","innerContent":["\n<li>Artisan Jesiel Mart\u00ednez is located in Barrio Alto Sano, San Sebasti\u00e1n. He's 27 years old and already has about 12 years of experience making cuatros, bordon\u00faas, tiples, electric cuatros, requintos, guitars, Cuban tres, g\u00fciros, and other musical instruments.<\/li>\n"]}],"innerHTML":"\n<ul class=\"wp-block-list\"><\/ul>\n","innerContent":["\n<ul class=\"wp-block-list\">",null,"<\/ul>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/list","attrs":[],"innerBlocks":[{"blockName":"core\/list-item","attrs":[],"innerBlocks":[],"innerHTML":"\n<li>Some of his instruments have been featured in the album <a href=\"https:\/\/www.plateapr.com\/debi-tirar-mas-fotos-de-bad-bunny-una-inmersion-en-la-identidad-puertorriquena\/\">DeB\u00cd TiRAR M\u00e1S FOToS by Bad Bunny<\/a>, such as M\u00e9ndez's bordon\u00faa and <a href=\"https:\/\/youtu.be\/gGrPqp_SNy8?si=MtCng8SkQ3yQookv\">cuatrista Jos\u00e9 Eduardo Santana's electric cuatro<\/a>. You can contact him at (939) 437-0412.<\/li>\n","innerContent":["\n<li>Some of his instruments have been featured in the album <a href=\"https:\/\/www.plateapr.com\/debi-tirar-mas-fotos-de-bad-bunny-una-inmersion-en-la-identidad-puertorriquena\/\">DeB\u00cd TiRAR M\u00e1S FOToS by Bad Bunny<\/a>, such as M\u00e9ndez's bordon\u00faa and <a href=\"https:\/\/youtu.be\/gGrPqp_SNy8?si=MtCng8SkQ3yQookv\">cuatrista Jos\u00e9 Eduardo Santana's electric cuatro<\/a>. You can contact him at (939) 437-0412.<\/li>\n"]}],"innerHTML":"\n<ul class=\"wp-block-list\"><\/ul>\n","innerContent":["\n<ul class=\"wp-block-list\">",null,"<\/ul>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/heading","attrs":{"level":3},"innerBlocks":[],"innerHTML":"\n<h3 class=\"wp-block-heading\"><strong><a href=\"https:\/\/www.facebook.com\/reparacionmusicalinstruments\">Aurelio Cruz<\/a><\/strong><\/h3>\n","innerContent":["\n<h3 class=\"wp-block-heading\"><strong><a href=\"https:\/\/www.facebook.com\/reparacionmusicalinstruments\">Aurelio Cruz<\/a><\/strong><\/h3>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/list","attrs":[],"innerBlocks":[{"blockName":"core\/list-item","attrs":[],"innerBlocks":[],"innerHTML":"\n<li>Since age 13, this artisan has dedicated his life to the lutherie of tiples, cuatros, bordon\u00faas, and other popular and endemic stringed instruments from the island. You can see his most recent works through <a href=\"https:\/\/www.facebook.com\/reparacionmusicalinstruments\">his Facebook page<\/a> and request a free quote by contacting (787) 618-6872 or through his email.<\/li>\n","innerContent":["\n<li>Since age 13, this artisan has dedicated his life to the lutherie of tiples, cuatros, bordon\u00faas, and other popular and endemic stringed instruments from the island. You can see his most recent works through <a href=\"https:\/\/www.facebook.com\/reparacionmusicalinstruments\">his Facebook page<\/a> and request a free quote by contacting (787) 618-6872 or through his email.<\/li>\n"]}],"innerHTML":"\n<ul class=\"wp-block-list\"><\/ul>\n","innerContent":["\n<ul class=\"wp-block-list\">",null,"<\/ul>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"acf\/alert-banner","attrs":{"name":"acf\/alert-banner","data":{"color":"green","_color":"field_6176b5f4d68b3","show_icon":"0","_show_icon":"field_6176b5d3d68b1","title":"","_title":"field_6176b5cad68b0","text":"<strong>Platea tip: <\/strong><a href=\"https:\/\/www.plateapr.com\/artesanias-que-podrian-desaparecer-puerto-rico\/\">Puerto Rican crafts that could disappear if not preserved<\/a>","_text":"field_6176b5dfd68b2"},"align":"full","mode":"preview"},"innerBlocks":[],"innerHTML":"","innerContent":[]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/heading","attrs":{"level":3},"innerBlocks":[],"innerHTML":"\n<h3 class=\"wp-block-heading\"><strong><a href=\"https:\/\/www.google.com\/maps\/place\/Taller+100x35\/@18.2929153,-66.3937792,809m\/data=!3m1!1e3!4m6!3m5!1s0x8c033b4918761753:0xefdc5a225cd87e44!8m2!3d18.2929153!4d-66.3937792!16s%2Fg%2F11h4k6st4r?entry=ttu&g_ep=EgoyMDI1MDcyOC4wIKXMDSoASAFQAw%3D%3D\">Taller 100x35<\/a><\/strong><\/h3>\n","innerContent":["\n<h3 class=\"wp-block-heading\"><strong><a href=\"https:\/\/www.google.com\/maps\/place\/Taller+100x35\/@18.2929153,-66.3937792,809m\/data=!3m1!1e3!4m6!3m5!1s0x8c033b4918761753:0xefdc5a225cd87e44!8m2!3d18.2929153!4d-66.3937792!16s%2Fg%2F11h4k6st4r?entry=ttu&g_ep=EgoyMDI1MDcyOC4wIKXMDSoASAFQAw%3D%3D\">Taller 100x35<\/a><\/strong><\/h3>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/list","attrs":[],"innerBlocks":[{"blockName":"core\/list-item","attrs":[],"innerBlocks":[],"innerHTML":"\n<li>Distinguished luthier \u00c1ngel Luis \"Wimbo\" Rivera works with cuatros, tres, tiples, bordon\u00faas, requintos, and guitars in his workshop in Morovis, with over three decades of experience in his craft. You can call or send a text message to (787) 618-0703.<\/li>\n","innerContent":["\n<li>Distinguished luthier \u00c1ngel Luis \"Wimbo\" Rivera works with cuatros, tres, tiples, bordon\u00faas, requintos, and guitars in his workshop in Morovis, with over three decades of experience in his craft. You can call or send a text message to (787) 618-0703.<\/li>\n"]}],"innerHTML":"\n<ul class=\"wp-block-list\"><\/ul>\n","innerContent":["\n<ul class=\"wp-block-list\">",null,"<\/ul>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/heading","attrs":{"level":3},"innerBlocks":[],"innerHTML":"\n<h3 class=\"wp-block-heading\"><strong><a href=\"https:\/\/puertoricancuatro.com\/\">Puerto Rican Cuatro<\/a><\/strong><\/h3>\n","innerContent":["\n<h3 class=\"wp-block-heading\"><strong><a href=\"https:\/\/puertoricancuatro.com\/\">Puerto Rican Cuatro<\/a><\/strong><\/h3>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/list","attrs":[],"innerBlocks":[{"blockName":"core\/list-item","attrs":[],"innerBlocks":[],"innerHTML":"\n<li>The process of crafting Puerto Rican Cuatro's artisanal pieces requires four to six weeks, ensuring an excellent quality finish. Interested parties can order a Puerto Rican cuatro or other instruments by visiting <strong>puertoricancuatro.com<\/strong>.<\/li>\n","innerContent":["\n<li>The process of crafting Puerto Rican Cuatro's artisanal pieces requires four to six weeks, ensuring an excellent quality finish. Interested parties can order a Puerto Rican cuatro or other instruments by visiting <strong>puertoricancuatro.com<\/strong>.<\/li>\n"]}],"innerHTML":"\n<ul class=\"wp-block-list\"><\/ul>\n","innerContent":["\n<ul class=\"wp-block-list\">",null,"<\/ul>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/heading","attrs":{"level":3},"innerBlocks":[],"innerHTML":"\n<h3 class=\"wp-block-heading\"><strong><a href=\"https:\/\/www.tallerdelcuatro.com\/\">El Taller del Cuatro<\/a><\/strong><\/h3>\n","innerContent":["\n<h3 class=\"wp-block-heading\"><strong><a href=\"https:\/\/www.tallerdelcuatro.com\/\">El Taller del Cuatro<\/a><\/strong><\/h3>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/list","attrs":[],"innerBlocks":[{"blockName":"core\/list-item","attrs":[],"innerBlocks":[],"innerHTML":"\n<li>This family business has dedicated over two decades to the construction and repair of cuatros, as well as offering musical instruction on the instrument and selling accessories related to this Puerto Rican musical symbol. Customers can place their orders directly at their facilities in Bayam\u00f3n or through their digital platform <strong><a href=\"http:\/\/www.tallerdelcuatro.com\">www.tallerdelcuatro.com<\/a><\/strong>.<\/li>\n","innerContent":["\n<li>This family business has dedicated over two decades to the construction and repair of cuatros, as well as offering musical instruction on the instrument and selling accessories related to this Puerto Rican musical symbol. Customers can place their orders directly at their facilities in Bayam\u00f3n or through their digital platform <strong><a href=\"http:\/\/www.tallerdelcuatro.com\">www.tallerdelcuatro.com<\/a><\/strong>.<\/li>\n"]}],"innerHTML":"\n<ul class=\"wp-block-list\"><\/ul>\n","innerContent":["\n<ul class=\"wp-block-list\">",null,"<\/ul>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/heading","attrs":[],"innerBlocks":[],"innerHTML":"\n<h2 class=\"wp-block-heading\">From craftsmanship to the future of the instrument<\/h2>\n","innerContent":["\n<h2 class=\"wp-block-heading\">From craftsmanship to the future of the instrument<\/h2>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>As more popular songs continue to integrate the cuatro and listeners identify the instrument, the luthier's craft will continue to be fundamental in Puerto Rico.<\/p>\n","innerContent":["\n<p>As more popular songs continue to integrate the cuatro and listeners identify the instrument, the luthier's craft will continue to be fundamental in Puerto Rico.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>\"They do us a huge favor,\" emphasizes M\u00e9ndez about artists like Bad Bunny, \"they put the instrument in the place it deserves, but with a different narrative, especially in the eyes of young people\u2014that it's a <em>'cool'<\/em> instrument, that it's an instrument that represents me as a Puerto Rican and, therefore, I'm going to embrace it with pride, and <strong>I'm going to respect it and want to listen to that music and promote it<\/strong>.\"<\/p>\n","innerContent":["\n<p>\"They do us a huge favor,\" emphasizes M\u00e9ndez about artists like Bad Bunny, \"they put the instrument in the place it deserves, but with a different narrative, especially in the eyes of young people\u2014that it's a <em>'cool'<\/em> instrument, that it's an instrument that represents me as a Puerto Rican and, therefore, I'm going to embrace it with pride, and <strong>I'm going to respect it and want to listen to that music and promote it<\/strong>.\"<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>\ud83c\udfa7 <strong>Save this playlist if you want to appreciate the Puerto Rican cuatro across various genres:<\/strong><\/p>\n","innerContent":["\n<p>\ud83c\udfa7 <strong>Save this playlist if you want to appreciate the Puerto Rican cuatro across various genres:<\/strong><\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/html","attrs":[],"innerBlocks":[],"innerHTML":"\n<iframe data-testid=\"embed-iframe\" style=\"border-radius:12px\" src=\"https:\/\/open.spotify.com\/embed\/playlist\/4F3GRoIwDGDpFNt5VJiy1Z?utm_source=generator&theme=0\" width=\"100%\" height=\"352\" frameBorder=\"0\" allowfullscreen=\"\" allow=\"autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture\" loading=\"lazy\"><\/iframe>\n","innerContent":["\n<iframe data-testid=\"embed-iframe\" style=\"border-radius:12px\" src=\"https:\/\/open.spotify.com\/embed\/playlist\/4F3GRoIwDGDpFNt5VJiy1Z?utm_source=generator&theme=0\" width=\"100%\" height=\"352\" frameBorder=\"0\" allowfullscreen=\"\" allow=\"autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture\" loading=\"lazy\"><\/iframe>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n","innerContent":["\n"]}],"_links":{"self":[{"href":"https:\/\/www.plateapr.com\/en\/wp-json\/wp\/v2\/posts\/6134","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.plateapr.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.plateapr.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.plateapr.com\/en\/wp-json\/wp\/v2\/users\/52"}],"replies":[{"embeddable":true,"href":"https:\/\/www.plateapr.com\/en\/wp-json\/wp\/v2\/comments?post=6134"}],"version-history":[{"count":0,"href":"https:\/\/www.plateapr.com\/en\/wp-json\/wp\/v2\/posts\/6134\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.plateapr.com\/en\/wp-json\/wp\/v2\/media\/6135"}],"wp:attachment":[{"href":"https:\/\/www.plateapr.com\/en\/wp-json\/wp\/v2\/media?parent=6134"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.plateapr.com\/en\/wp-json\/wp\/v2\/categories?post=6134"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.plateapr.com\/en\/wp-json\/wp\/v2\/post_tag?post=6134"},{"taxonomy":"post_author","embeddable":true,"href":"https:\/\/www.plateapr.com\/en\/wp-json\/wp\/v2\/authors?post=6134"},{"taxonomy":"page_type","embeddable":true,"href":"https:\/\/www.plateapr.com\/en\/wp-json\/wp\/v2\/page_type?post=6134"},{"taxonomy":"geo_location","embeddable":true,"href":"https:\/\/www.plateapr.com\/en\/wp-json\/wp\/v2\/geo_location?post=6134"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":6134,"date":"2025-12-12T14:45:07","date_gmt":"2025-12-12T19:45:07","guid":{"rendered":"https:\/\/www.plateapr.com\/en\/?p=6134"},"modified":"2025-12-12T14:45:08","modified_gmt":"2025-12-12T19:45:08","slug":"puerto-rican-cuatro-national-instrument","status":"publish","type":"post","link":"https:\/\/www.plateapr.com\/en\/inspirational\/puerto-rican-cuatro-national-instrument\/","title":{"rendered":"Crafted by Hand, Heard Around the World: The Puerto Rican Cuatro"},"content":{"rendered":"\n

The parents of cuatrista Fabiola M\u00e9ndez keep her first cuatro as a relic from her childhood.<\/p>\n\n\n\n