{"id":1162,"date":"2026-04-23T11:41:41","date_gmt":"2026-04-23T09:41:41","guid":{"rendered":"https:\/\/culturaconarte.es\/casaconpatiociudadrodrigo\/?page_id=1162"},"modified":"2026-04-23T17:22:25","modified_gmt":"2026-04-23T15:22:25","slug":"audioguia-de-ciudad-rodrigo-en-espanol","status":"publish","type":"page","link":"https:\/\/culturaconarte.es\/casaconpatiociudadrodrigo\/audioguia-de-ciudad-rodrigo-en-espanol\/","title":{"rendered":"Audiogu\u00eda de Ciudad Rodrigo en espa\u00f1ol"},"content":{"rendered":"
\n\n\n\n\nAudiogu\u00eda \u00b7 Ciudad Rodrigo \u00b7 El Patio del Vino<\/title>\n \n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Manrope:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\">\n \n<style>\n\/* ============================================================\n SISTEMA DE DISE\u00d1O\n ============================================================ *\/\n:root {\n --crema: #f7f1e3;\n --crema-claro: #fbf7ec;\n --piedra: #e8ddc6;\n --piedra-oscura: #c9b89a;\n --tinta: #2b1e18;\n --tinta-suave: #4a3a30;\n --vino: #5c1f1b;\n --vino-claro: #8a3d2e;\n --oro: #b8894a;\n --oro-claro: #d4a95f;\n --sombra: 0 2px 8px rgba(43, 30, 24, 0.08);\n --sombra-hover: 0 20px 50px -15px rgba(43, 30, 24, 0.35);\n --serif: 'Cormorant Garamond', Georgia, serif;\n --sans: 'Manrope', -apple-system, system-ui, sans-serif;\n}\n \n* { margin: 0; padding: 0; box-sizing: border-box; }\nhtml { scroll-behavior: smooth; }\n \nbody {\n font-family: var(--sans);\n background: var(--crema);\n color: var(--tinta);\n line-height: 1.6;\n -webkit-font-smoothing: antialiased;\n background-image:\n radial-gradient(at 15% 20%, rgba(184, 137, 74, 0.06) 0px, transparent 50%),\n radial-gradient(at 85% 80%, rgba(92, 31, 27, 0.04) 0px, transparent 50%);\n}\n \n\/* ============================================================\n SELECTOR DE IDIOMA (barra superior)\n ============================================================ *\/\n.lang-bar {\n max-width: 1320px;\n margin: 0 auto;\n padding: 1.25rem 1.5rem 0;\n display: flex;\n justify-content: flex-end;\n gap: 0.4rem;\n align-items: center;\n}\n.lang-btn {\n display: inline-flex;\n align-items: center;\n gap: 0.4rem;\n padding: 0.4rem 0.85rem;\n font-family: var(--sans);\n font-size: 0.7rem;\n font-weight: 600;\n letter-spacing: 0.18em;\n text-transform: uppercase;\n color: var(--tinta-suave);\n text-decoration: none;\n background: transparent;\n border: 1px solid transparent;\n border-radius: 50px;\n transition: all 0.2s ease;\n white-space: nowrap;\n}\n.lang-btn:hover {\n border-color: var(--piedra-oscura);\n color: var(--tinta);\n}\n.lang-btn.active {\n color: var(--vino);\n border-color: var(--vino);\n background: rgba(92, 31, 27, 0.05);\n}\n.lang-btn .lang-flag { font-size: 1rem; line-height: 1; }\n \n\/* ============================================================\n HEADER EN 3 COLUMNAS\n ============================================================ *\/\n.header {\n max-width: 1320px;\n margin: 0 auto;\n padding: 2.5rem 1.5rem 3rem;\n}\n.header-inner {\n display: grid;\n grid-template-columns: 1fr auto auto;\n grid-template-areas: \"main intro nav\";\n gap: 3rem;\n align-items: center;\n}\n.header-main { grid-area: main; min-width: 0; }\n.header-intro { grid-area: intro; }\n.header-nav { grid-area: nav; }\n \n.header-main::before {\n content: '';\n display: block;\n width: 60px;\n height: 2px;\n background: var(--oro);\n margin-bottom: 1.75rem;\n}\n.eyebrow {\n font-size: 0.72rem;\n letter-spacing: 0.35em;\n text-transform: uppercase;\n color: var(--oro);\n font-weight: 600;\n margin-bottom: 1.25rem;\n}\n.header-main h1 {\n font-family: var(--serif);\n font-weight: 500;\n font-size: clamp(2.2rem, 4.8vw, 4rem);\n line-height: 1.05;\n color: var(--tinta);\n margin-bottom: 1.25rem;\n letter-spacing: -0.01em;\n}\n.header-main h1 em {\n font-style: italic;\n color: var(--vino);\n font-weight: 400;\n}\n.header-main p {\n font-family: var(--serif);\n font-size: 1.2rem;\n font-style: italic;\n color: var(--vino-claro);\n max-width: 520px;\n}\n \n\/* --- Mini tarjeta de introducci\u00f3n --- *\/\n.header-intro {\n width: 260px;\n background: var(--crema-claro);\n border: 1px solid var(--piedra);\n border-radius: 2px;\n padding: 0.85rem;\n box-shadow: var(--sombra);\n transition: box-shadow 0.3s ease, border-color 0.3s ease;\n}\n.header-intro:hover {\n box-shadow: var(--sombra-hover);\n border-color: var(--oro);\n}\n.header-intro-imagewrap {\n position: relative;\n aspect-ratio: 4 \/ 5;\n overflow: hidden;\n background: var(--crema-claro);\n}\n.header-intro-imagewrap img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n transition: transform 0.6s ease;\n}\n.header-intro:hover .header-intro-imagewrap img {\n transform: scale(1.04);\n}\n.header-intro-play {\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n width: 62px;\n height: 62px;\n border-radius: 50%;\n background: var(--crema);\n border: none;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n box-shadow: 0 4px 18px rgba(43, 30, 24, 0.4);\n transition: background 0.3s ease, transform 0.3s ease;\n}\n.header-intro-play:hover {\n background: var(--vino);\n transform: translate(-50%, -50%) scale(1.08);\n}\n.header-intro-play .icon-play {\n width: 0; height: 0;\n border-left: 14px solid var(--vino);\n border-top: 10px solid transparent;\n border-bottom: 10px solid transparent;\n margin-left: 4px;\n transition: border-left-color 0.2s;\n}\n.header-intro-play .icon-pause {\n display: none;\n width: 14px; height: 18px;\n border-left: 4px solid var(--vino);\n border-right: 4px solid var(--vino);\n transition: border-color 0.2s;\n}\n.header-intro-play:hover .icon-play { border-left-color: var(--crema); }\n.header-intro-play:hover .icon-pause { border-left-color: var(--crema); border-right-color: var(--crema); }\n.header-intro-play.playing .icon-play { display: none; }\n.header-intro-play.playing .icon-pause { display: block; }\n \n.header-intro-info { margin-top: 0.9rem; padding: 0 0.25rem; }\n.header-intro-label {\n font-size: 0.7rem;\n font-weight: 700;\n letter-spacing: 0.3em;\n text-transform: uppercase;\n color: var(--oro);\n text-align: center;\n margin-bottom: 0.6rem;\n padding-top: 0.5rem;\n border-top: 1px solid var(--piedra);\n}\n.header-intro-progress {\n height: 3px;\n background: var(--piedra);\n border-radius: 2px;\n overflow: hidden;\n cursor: pointer;\n}\n.header-intro-progress-filled {\n height: 100%;\n background: var(--oro);\n width: 0%;\n transition: width 0.1s linear;\n}\n.header-intro-times {\n display: flex;\n justify-content: space-between;\n font-size: 0.68rem;\n letter-spacing: 0.06em;\n color: var(--tinta-suave);\n font-variant-numeric: tabular-nums;\n margin-top: 0.4rem;\n opacity: 0.8;\n}\n \n\/* --- Chips de navegaci\u00f3n verticales --- *\/\n.header-nav {\n display: flex;\n flex-direction: column;\n gap: 0.55rem;\n align-items: stretch;\n}\n.header-nav-item {\n width: 230px;\n padding: 0.75rem 1.25rem;\n font-family: var(--sans);\n font-size: 0.72rem;\n font-weight: 600;\n letter-spacing: 0.18em;\n text-transform: uppercase;\n color: var(--tinta-suave);\n text-decoration: none;\n background: var(--crema-claro);\n border: 1px solid var(--piedra-oscura);\n border-radius: 50px;\n text-align: center;\n cursor: pointer;\n transition: all 0.25s ease;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.header-nav-item:hover {\n background: var(--vino);\n color: var(--crema);\n border-color: var(--vino);\n transform: translateX(-2px);\n}\n.header-nav-intro.playing {\n background: var(--oro);\n color: var(--crema);\n border-color: var(--oro);\n}\n.header-nav-intro.playing:hover {\n background: var(--oro-claro);\n border-color: var(--oro-claro);\n}\n \n\/* --- Responsive del hero --- *\/\n@media (max-width: 1100px) {\n .header-inner {\n grid-template-columns: 1fr auto;\n grid-template-areas:\n \"main intro\"\n \"main nav\";\n gap: 2rem 2.5rem;\n }\n .header-nav-item { width: 220px; }\n}\n@media (max-width: 820px) {\n .header { padding: 1.5rem 1.25rem 2rem; }\n .header-inner {\n grid-template-columns: 1fr;\n grid-template-areas: \"main\" \"intro\" \"nav\";\n justify-items: center;\n text-align: center;\n gap: 2rem;\n }\n .header-main::before { margin-left: auto; margin-right: auto; }\n .header-main p { margin: 0 auto; }\n .header-nav {\n flex-direction: row;\n flex-wrap: wrap;\n justify-content: center;\n }\n .header-nav-item { width: auto; }\n .lang-bar { justify-content: center; }\n}\n \n\/* ============================================================\n SECCIONES\n ============================================================ *\/\n.section {\n max-width: 1280px;\n margin: 0 auto;\n padding: 2.5rem 1.5rem;\n scroll-margin-top: 20px;\n}\n.section-header {\n display: flex;\n align-items: baseline;\n gap: 1.5rem;\n margin-bottom: 2rem;\n padding-bottom: 1rem;\n border-bottom: 1px solid var(--piedra);\n}\n.section-header h2 {\n font-family: var(--serif);\n font-size: clamp(1.8rem, 3.5vw, 2.5rem);\n font-weight: 500;\n color: var(--tinta);\n letter-spacing: -0.01em;\n}\n.section-header .count {\n font-size: 0.7rem;\n letter-spacing: 0.3em;\n text-transform: uppercase;\n color: var(--oro);\n font-weight: 600;\n}\n \n\/* ============================================================\n GRID DE TARJETAS\n ============================================================ *\/\n.grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));\n gap: 1.5rem;\n}\n.card {\n background: var(--crema-claro);\n border: 1px solid var(--piedra);\n border-radius: 2px;\n overflow: hidden;\n box-shadow: var(--sombra);\n transition: box-shadow 0.3s ease, border-color 0.3s ease;\n}\n.card-preview {\n position: relative;\n aspect-ratio: 4 \/ 5;\n overflow: hidden;\n background: var(--piedra);\n cursor: pointer;\n transition: filter 0.4s ease;\n}\n.card-preview img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);\n filter: saturate(0.96);\n}\n.card:not(.expanded) .card-preview:hover img { transform: scale(1.04); }\n.card:not(.expanded) .card-preview:hover { filter: brightness(1.04); }\n \n.expand-button {\n position: absolute;\n bottom: 0.9rem;\n right: 0.9rem;\n width: 46px;\n height: 46px;\n border-radius: 50%;\n background: rgba(247, 241, 227, 0.95);\n backdrop-filter: blur(8px);\n border: none;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n box-shadow: 0 3px 14px rgba(43, 30, 24, 0.3);\n transition: all 0.3s cubic-bezier(0.2, 0.8, 0.2, 1);\n z-index: 2;\n}\n.expand-button::before {\n content: '';\n width: 0; height: 0;\n border-left: 13px solid var(--vino);\n border-top: 9px solid transparent;\n border-bottom: 9px solid transparent;\n margin-left: 4px;\n transition: border-left-color 0.2s;\n}\n.card:not(.expanded) .card-preview:hover .expand-button {\n background: var(--vino);\n transform: scale(1.08);\n}\n.card:not(.expanded) .card-preview:hover .expand-button::before {\n border-left-color: var(--crema);\n}\n.card.expanded .expand-button { display: none; }\n \n\/* ============================================================\n TARJETA EXPANDIDA EN 3 COLUMNAS (imagen | contenido | mapa)\n ============================================================ *\/\n.card.expanded {\n grid-column: 1 \/ -1;\n display: grid;\n grid-template-columns: 340px 1fr;\n align-items: start;\n box-shadow: var(--sombra-hover);\n border-color: var(--oro);\n scroll-margin-top: 80px;\n}\n.card.expanded .card-preview {\n aspect-ratio: 4 \/ 5;\n height: auto;\n min-height: 0;\n cursor: default;\n background: var(--crema-claro);\n}\n.card.expanded .card-preview img {\n width: 100%;\n height: 100%;\n object-fit: contain;\n object-position: center;\n transform: none !important;\n}\n \n.card-body-wrapper {\n display: grid;\n grid-template-rows: 0fr;\n transition: grid-template-rows 0.45s cubic-bezier(0.2, 0.8, 0.2, 1);\n}\n.card.expanded .card-body-wrapper { grid-template-rows: 1fr; }\n.card-body { overflow: hidden; }\n \n.card-body-inner {\n padding: 2rem 2.25rem 2rem 2rem;\n display: grid;\n grid-template-columns: 1.5fr 1fr;\n gap: 2rem;\n position: relative;\n align-items: start;\n}\n.body-main { display: flex; flex-direction: column; gap: 1.25rem; min-width: 0; }\n.body-aside { display: flex; flex-direction: column; gap: 0.85rem; min-width: 0; }\n \n.body-label {\n font-family: var(--sans);\n font-size: 0.78rem;\n font-weight: 700;\n letter-spacing: 0.22em;\n text-transform: uppercase;\n color: var(--oro);\n line-height: 1.3;\n}\n.description {\n font-family: var(--serif);\n font-size: 1.15rem;\n line-height: 1.55;\n color: var(--tinta-suave);\n}\n \n.close-btn {\n position: absolute;\n top: 1rem;\n right: 1rem;\n width: 38px;\n height: 38px;\n border-radius: 50%;\n background: var(--piedra);\n border: none;\n cursor: pointer;\n font-size: 1.3rem;\n color: var(--tinta);\n display: flex;\n align-items: center;\n justify-content: center;\n transition: all 0.2s ease;\n z-index: 5;\n}\n.close-btn:hover {\n background: var(--vino);\n color: var(--crema);\n transform: rotate(90deg);\n}\n \n\/* ============================================================\n REPRODUCTOR DE CADA MONUMENTO\n ============================================================ *\/\n.audio-player {\n background: var(--tinta);\n color: var(--crema);\n padding: 1.1rem 1.35rem;\n border-radius: 4px;\n display: flex;\n flex-direction: column;\n gap: 0.8rem;\n}\n.audio-meta {\n display: flex;\n justify-content: space-between;\n align-items: center;\n font-size: 0.7rem;\n letter-spacing: 0.2em;\n text-transform: uppercase;\n opacity: 0.7;\n font-weight: 600;\n}\n.audio-controls { display: flex; align-items: center; gap: 1rem; }\n.audio-play {\n width: 46px; height: 46px; min-width: 46px;\n border-radius: 50%;\n border: none;\n background: var(--oro);\n color: var(--tinta);\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: all 0.2s ease;\n}\n.audio-play:hover { background: var(--oro-claro); transform: scale(1.05); }\n.audio-play .icon-play {\n width: 0; height: 0;\n border-left: 12px solid currentColor;\n border-top: 8px solid transparent;\n border-bottom: 8px solid transparent;\n margin-left: 3px;\n}\n.audio-play .icon-pause {\n display: none;\n width: 12px; height: 14px;\n border-left: 4px solid currentColor;\n border-right: 4px solid currentColor;\n}\n.audio-play.playing .icon-play { display: none; }\n.audio-play.playing .icon-pause { display: block; }\n.audio-progress-container {\n flex: 1;\n display: flex;\n flex-direction: column;\n gap: 0.35rem;\n min-width: 0;\n}\n.audio-progress {\n height: 4px;\n background: rgba(247, 241, 227, 0.2);\n border-radius: 2px;\n cursor: pointer;\n overflow: hidden;\n}\n.audio-progress-filled {\n height: 100%;\n background: var(--oro);\n width: 0%;\n transition: width 0.1s linear;\n}\n.audio-time {\n display: flex;\n justify-content: space-between;\n font-size: 0.75rem;\n letter-spacing: 0.05em;\n opacity: 0.7;\n font-variant-numeric: tabular-nums;\n}\n \n\/* ============================================================\n COMPARTIR\n ============================================================ *\/\n.share-bar {\n display: flex;\n align-items: center;\n gap: 0.55rem;\n flex-wrap: wrap;\n}\n.share-label {\n font-size: 0.7rem;\n letter-spacing: 0.25em;\n text-transform: uppercase;\n color: var(--oro);\n font-weight: 600;\n margin-right: 0.25rem;\n}\n.share-btn {\n width: 36px; height: 36px;\n border-radius: 50%;\n border: 1px solid var(--piedra-oscura);\n background: transparent;\n color: var(--tinta-suave);\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: all 0.2s ease;\n text-decoration: none;\n}\n.share-btn:hover {\n background: var(--vino);\n color: var(--crema);\n border-color: var(--vino);\n transform: translateY(-2px);\n}\n.share-btn svg { width: 15px; height: 15px; }\n.share-btn.copied {\n background: var(--oro);\n color: var(--tinta);\n border-color: var(--oro);\n}\n \n\/* ============================================================\n MAPA\n ============================================================ *\/\n.map-frame {\n width: 100%;\n aspect-ratio: 4 \/ 3;\n border: 1px solid var(--piedra);\n border-radius: 2px;\n overflow: hidden;\n background: var(--piedra);\n}\n.map-frame iframe { width: 100%; height: 100%; border: 0; display: block; }\n.map-link {\n align-self: flex-start;\n display: inline-flex;\n align-items: center;\n gap: 0.5rem;\n padding: 0.65rem 1.15rem;\n background: transparent;\n color: var(--tinta);\n border: 1px solid var(--tinta);\n border-radius: 2px;\n text-decoration: none;\n font-size: 0.75rem;\n font-weight: 600;\n letter-spacing: 0.15em;\n text-transform: uppercase;\n transition: all 0.2s ease;\n}\n.map-link:hover { background: var(--tinta); color: var(--crema); }\n.map-link svg { width: 14px; height: 14px; }\n \n\/* ============================================================\n RESPONSIVE\n ============================================================ *\/\n@media (max-width: 980px) {\n .card.expanded { grid-template-columns: 300px 1fr; }\n .card-body-inner { grid-template-columns: 1fr; gap: 1.75rem; }\n .map-frame { aspect-ratio: 16 \/ 9; }\n}\n@media (max-width: 680px) {\n .card.expanded { grid-template-columns: 1fr; }\n .card.expanded .card-preview { max-height: 60vh; }\n .card-body-inner { padding: 1.5rem 1.25rem 1.75rem; }\n}\n \n\/* ============================================================\n ANIMACI\u00d3N DE ENTRADA\n ============================================================ *\/\n@keyframes fadeUp {\n from { opacity: 0; transform: translateY(20px); }\n to { opacity: 1; transform: translateY(0); }\n}\n.card { animation: fadeUp 0.7s cubic-bezier(0.2, 0.8, 0.2, 1) backwards; }\n.grid .card:nth-child(1) { animation-delay: 0.05s; }\n.grid .card:nth-child(2) { animation-delay: 0.10s; }\n.grid .card:nth-child(3) { animation-delay: 0.15s; }\n.grid .card:nth-child(4) { animation-delay: 0.20s; }\n.grid .card:nth-child(5) { animation-delay: 0.25s; }\n.grid .card:nth-child(6) { animation-delay: 0.30s; }\n.grid .card:nth-child(n+7) { animation-delay: 0.35s; }\n \n\/* Mientras se carga el JSON *\/\n.loading-placeholder {\n text-align: center;\n padding: 3rem;\n font-family: var(--serif);\n font-style: italic;\n color: var(--vino-claro);\n font-size: 1.2rem;\n}\n<\/style>\n<\/head>\n<body>\n \n<!-- ============================================================\n CARGA DE DATOS CENTRALIZADOS\n ============================================================\n \u26a0\ufe0f AJUSTA la URL al sitio real donde subas el guide-data.js.\n Por defecto buscamos en \/wp-content\/uploads\/guide-data.js\n ============================================================ -->\n<script src=\"https:\/\/culturaconarte.es\/casaconpatiociudadrodrigo\/wp-content\/uploads\/guide-data.js\"><\/script>\n \n<script>\n \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n * L\u00cdNEA A CAMBIAR \u00b7 UNA VEZ POR P\u00c1GINA DE WORDPRESS\n * Valores v\u00e1lidos: 'es' 'en' 'fr' 'pt'\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n window.CURRENT_LANG = 'es';\n<\/script>\n \n<!-- ============================================================\n BARRA DE IDIOMAS (se rellena desde JS)\n ============================================================ -->\n<div class=\"lang-bar\" id=\"langBar\"><\/div>\n \n<!-- ============================================================\n CABECERA (se rellena desde JS)\n ============================================================ -->\n<header class=\"header\">\n <div class=\"header-inner\">\n <div class=\"header-main\" id=\"headerMain\"><\/div>\n <aside class=\"header-intro\" id=\"heroIntro\"><\/aside>\n <nav class=\"header-nav\" id=\"headerNav\"><\/nav>\n <\/div>\n<\/header>\n \n<!-- ============================================================\n CONTENEDOR DE SECCIONES (se rellena desde JS)\n ============================================================ -->\n<main id=\"sectionsContainer\">\n <div class=\"loading-placeholder\">Cargando\u2026<\/div>\n<\/main>\n \n<script>\n\/* ===================================================================================\n APP PRINCIPAL\n =================================================================================== *\/\n(function () {\n 'use strict';\n \n \/\/ Comprobamos que los datos se hayan cargado\n if (!window.GUIDE_DATA) {\n document.getElementById('sectionsContainer').innerHTML =\n '<div class=\"loading-placeholder\">\u26a0\ufe0f No se pudo cargar guide-data.js. ' +\n 'Verifica la URL del <code><script src=\"...\"><\/code>.<\/div>';\n return;\n }\n \n \/\/ Idioma activo (con fallback a espa\u00f1ol)\n const LANGS_AVAILABLE = window.GUIDE_DATA.languages.map(l => l.code);\n const LANG = LANGS_AVAILABLE.includes(window.CURRENT_LANG)\n ? window.CURRENT_LANG\n : 'es';\n \n const DATA = window.GUIDE_DATA;\n const T = DATA.ui[LANG]; \/\/ textos de UI en el idioma activo\n const CFG = DATA.config;\n const LANG_SUFFIX = CFG.language_suffix[LANG];\n \n \/\/ Actualizamos el <html lang=\"...\">\n document.documentElement.lang = LANG;\n document.title = T.site_eyebrow + ' \u00b7 ' + T.hero_title_prefix + ' ' + T.hero_title_place;\n \n \/* =============================================================\n HELPERS PARA CONSTRUIR URLs DE ARCHIVOS Y MAPAS\n ============================================================= *\/\n const img = slug => CFG.base_url + CFG.file_prefix + slug + LANG_SUFFIX + '.jpg';\n const mp3 = slug => CFG.base_url + CFG.file_prefix + slug + LANG_SUFFIX + '.mp3';\n const mapEmbed = query =>\n 'https:\/\/maps.google.com\/maps?q=' +\n encodeURIComponent(query + T.map_query_suffix) + '&output=embed';\n const mapsLink = query =>\n 'https:\/\/www.google.com\/maps\/search\/?api=1&query=' +\n encodeURIComponent(query + T.map_query_suffix);\n \n \/* =============================================================\n BARRA DE IDIOMAS\n ============================================================= *\/\n const langBar = document.getElementById('langBar');\n langBar.innerHTML = DATA.languages.map(l => {\n const isActive = l.code === LANG;\n const url = CFG.page_urls[l.code];\n return `\n <a class=\"lang-btn ${isActive ? 'active' : ''}\" href=\"${url}\" aria-label=\"${l.name}\">\n <span class=\"lang-flag\">${l.flag}<\/span>\n <span>${l.short}<\/span>\n <\/a>\n `;\n }).join('');\n \n \/* =============================================================\n HEADER PRINCIPAL\n ============================================================= *\/\n document.getElementById('headerMain').innerHTML = `\n <div class=\"eyebrow\">${T.site_eyebrow}<\/div>\n <h1>${T.hero_title_prefix} <em>${T.hero_title_place}<\/em><br>${T.hero_title_suffix}<\/h1>\n <p>${T.hero_subtitle}<\/p>\n `;\n \n \/* =============================================================\n MINI TARJETA DE INTRODUCCI\u00d3N (hero)\n ============================================================= *\/\n const INTRO_SLUG = 'introduccion';\n document.getElementById('heroIntro').innerHTML = `\n <div class=\"header-intro-imagewrap\">\n <img class=\"lazyload\" decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-orig-src=\"${img(INTRO_SLUG)}\" alt=\"${T.intro_name}\">\n <button class=\"header-intro-play\" aria-label=\"${T.play_pause}\">\n <span class=\"icon-play\"><\/span>\n <span class=\"icon-pause\"><\/span>\n <\/button>\n <\/div>\n <div class=\"header-intro-info\">\n <div class=\"header-intro-label\">${T.start_here}<\/div>\n <div class=\"header-intro-progress\" id=\"heroProgress\">\n <div class=\"header-intro-progress-filled\" id=\"heroProgressFilled\"><\/div>\n <\/div>\n <div class=\"header-intro-times\">\n <span id=\"heroCurrent\">0:00<\/span>\n <span id=\"heroDuration\">\u2014<\/span>\n <\/div>\n <\/div>\n <audio preload=\"metadata\" src=\"${mp3(INTRO_SLUG)}\" id=\"heroAudio\"><\/audio>\n `;\n \n \/* =============================================================\n NAV (chips verticales) \u00b7 \"Introducci\u00f3n\" + secciones\n ============================================================= *\/\n const sectionTitleKeys = {\n catedral: 'section_catedral',\n palacios: 'section_palacios',\n iglesias: 'section_iglesias',\n plazas: 'section_plazas',\n defensas: 'section_defensas',\n raices: 'section_raices'\n };\n const navHTML = [\n `<button class=\"header-nav-item header-nav-intro\" id=\"navIntro\" type=\"button\">${T.nav_intro}<\/button>`\n ].concat(\n DATA.sections.map(s =>\n `<a class=\"header-nav-item\" href=\"#${s.key}\">${T[sectionTitleKeys[s.key]]}<\/a>`\n )\n ).join('');\n document.getElementById('headerNav').innerHTML = navHTML;\n \n \/* =============================================================\n SECCIONES (grid de tarjetas)\n ============================================================= *\/\n const sectionsContainer = document.getElementById('sectionsContainer');\n sectionsContainer.innerHTML = '';\n \n function buildCardHTML(slug) {\n const m = DATA.monuments[slug];\n if (!m) return '';\n const nombre = m.names[LANG];\n const desc = m.descriptions[LANG];\n return `\n <article class=\"card\" id=\"monumento-${slug}\" data-slug=\"${slug}\">\n <div class=\"card-preview\" role=\"button\" tabindex=\"0\" aria-label=\"${T.open_label} ${nombre}\">\n <img class=\"lazyload\" decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-orig-src=\"${img(slug)}\" alt=\"${nombre}\" loading=\"lazy\">\n <button class=\"expand-button\" aria-label=\"${T.open_label}\"><\/button>\n <\/div>\n <div class=\"card-body-wrapper\">\n <div class=\"card-body\">\n <div class=\"card-body-inner\">\n <button class=\"close-btn\" aria-label=\"${T.close}\">\u00d7<\/button>\n \n <div class=\"body-main\">\n <div class=\"body-label\">${nombre}<\/div>\n <p class=\"description\">${desc}<\/p>\n \n <div class=\"audio-player\">\n <div class=\"audio-meta\">\n <span>${T.audio_in_language}<\/span>\n <span>${T.duration} <span class=\"total-time\">\u2014<\/span><\/span>\n <\/div>\n <div class=\"audio-controls\">\n <button class=\"audio-play\" aria-label=\"${T.play_pause}\">\n <span class=\"icon-play\"><\/span>\n <span class=\"icon-pause\"><\/span>\n <\/button>\n <div class=\"audio-progress-container\">\n <div class=\"audio-progress\">\n <div class=\"audio-progress-filled\"><\/div>\n <\/div>\n <div class=\"audio-time\">\n <span class=\"current-time\">0:00<\/span>\n <span class=\"total-time\">\u2014<\/span>\n <\/div>\n <\/div>\n <\/div>\n <audio preload=\"metadata\" src=\"${mp3(slug)}\"><\/audio>\n <\/div>\n \n <div class=\"share-bar\">\n <span class=\"share-label\">${T.share}<\/span>\n <a class=\"share-btn\" data-share=\"whatsapp\" href=\"#\" aria-label=\"WhatsApp\">\n <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M.057 24l1.687-6.163c-1.041-1.804-1.588-3.849-1.587-5.946.003-6.556 5.338-11.891 11.893-11.891 3.181.001 6.167 1.24 8.413 3.488 2.245 2.248 3.481 5.236 3.48 8.414-.003 6.557-5.338 11.892-11.893 11.892-1.99-.001-3.951-.5-5.688-1.448l-6.305 1.654zm6.597-3.807c1.676.995 3.276 1.591 5.392 1.592 5.448 0 9.886-4.434 9.889-9.885.002-5.462-4.415-9.89-9.881-9.892-5.452 0-9.887 4.434-9.889 9.884-.001 2.225.651 3.891 1.746 5.634l-.999 3.648 3.742-.981zm11.387-5.464c-.074-.124-.272-.198-.57-.347-.297-.149-1.758-.868-2.031-.967-.272-.099-.47-.149-.669.149-.198.297-.768.967-.941 1.165-.173.198-.347.223-.644.074-.297-.149-1.255-.462-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.297-.347.446-.521.151-.172.2-.296.3-.495.099-.198.05-.372-.025-.521-.075-.149-.669-1.611-.916-2.206-.242-.579-.487-.501-.669-.51l-.57-.01c-.198 0-.52.074-.792.372s-1.04 1.016-1.04 2.479 1.065 2.876 1.213 3.074c.149.198 2.095 3.2 5.076 4.487.709.306 1.263.489 1.694.626.712.226 1.36.194 1.872.118.571-.085 1.758-.719 2.006-1.413.248-.695.248-1.29.173-1.414z\"\/><\/svg>\n <\/a>\n <a class=\"share-btn\" data-share=\"facebook\" href=\"#\" aria-label=\"Facebook\">\n <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z\"\/><\/svg>\n <\/a>\n <a class=\"share-btn\" data-share=\"twitter\" href=\"#\" aria-label=\"X\">\n <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z\"\/><\/svg>\n <\/a>\n <a class=\"share-btn\" data-share=\"telegram\" href=\"#\" aria-label=\"Telegram\">\n <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M11.944 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0a12 12 0 0 0-.056 0zm4.962 7.224c.1-.002.321.023.465.14a.506.506 0 0 1 .171.325c.016.093.036.306.02.472-.18 1.898-.962 6.502-1.36 8.627-.168.9-.499 1.201-.82 1.23-.696.065-1.225-.46-1.9-.902-1.056-.693-1.653-1.124-2.678-1.8-1.185-.78-.417-1.21.258-1.91.177-.184 3.247-2.977 3.307-3.23.007-.032.014-.15-.056-.212s-.174-.041-.249-.024c-.106.024-1.793 1.14-5.061 3.345-.48.33-.913.49-1.302.48-.428-.008-1.252-.241-1.865-.44-.752-.245-1.349-.374-1.297-.789.027-.216.325-.437.893-.663 3.498-1.524 5.83-2.529 6.998-3.014 3.332-1.386 4.025-1.627 4.476-1.635z\"\/><\/svg>\n <\/a>\n <button class=\"share-btn\" data-share=\"copy\" aria-label=\"${T.copy_link}\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71\"><\/path><path d=\"M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71\"><\/path><\/svg>\n <\/button>\n <\/div>\n <\/div>\n \n <div class=\"body-aside\">\n <div class=\"body-label\">${T.location}<\/div>\n <div class=\"map-frame\">\n <iframe src=\"${mapEmbed(m.maps_query)}\" loading=\"lazy\" title=\"${T.location}: ${nombre}\"><\/iframe>\n <\/div>\n <a class=\"map-link\" href=\"${mapsLink(m.maps_query)}\" target=\"_blank\" rel=\"noopener\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z\"><\/path><circle cx=\"12\" cy=\"10\" r=\"3\"><\/circle><\/svg>\n ${T.how_to_get}\n <\/a>\n <\/div>\n \n <\/div>\n <\/div>\n <\/div>\n <\/article>\n `;\n }\n \n DATA.sections.forEach(s => {\n const sectionEl = document.createElement('section');\n sectionEl.className = 'section';\n sectionEl.id = s.key;\n const count = s.monuments.length;\n const stopsWord = count === 1 ? T.stops_singular : T.stops_plural;\n const sectionTitle = s.key === 'catedral' ? T.section_catedral_full : T[sectionTitleKeys[s.key]];\n \n sectionEl.innerHTML = `\n <div class=\"section-header\">\n <h2>${sectionTitle}<\/h2>\n <span class=\"count\">${count} ${stopsWord}<\/span>\n <\/div>\n <div class=\"grid\">${s.monuments.map(buildCardHTML).join('')}<\/div>\n `;\n sectionsContainer.appendChild(sectionEl);\n });\n \n \/* =============================================================\n PAUSAR OTROS AUDIOS (tarjetas + hero)\n ============================================================= *\/\n function pauseAllExcept(audio) {\n document.querySelectorAll('audio').forEach(a => {\n if (a !== audio && !a.paused) {\n a.pause();\n const container = a.closest('.card') || a.closest('.header-intro');\n const btn = container && container.querySelector('.audio-play, .header-intro-play');\n if (btn) btn.classList.remove('playing');\n }\n });\n }\n \n \/* =============================================================\n MINI REPRODUCTOR DEL HERO (sincronizado con chip \"Introducci\u00f3n\")\n ============================================================= *\/\n (function setupHeroPlayer() {\n const audio = document.getElementById('heroAudio');\n const playBtn = document.querySelector('.header-intro-play');\n const progress = document.getElementById('heroProgress');\n const progressFilled = document.getElementById('heroProgressFilled');\n const curEl = document.getElementById('heroCurrent');\n const durEl = document.getElementById('heroDuration');\n const navIntroBtn = document.getElementById('navIntro');\n \n function togglePlay() {\n pauseAllExcept(audio);\n if (audio.paused) audio.play().catch(e => console.warn(e));\n else audio.pause();\n }\n playBtn.addEventListener('click', togglePlay);\n navIntroBtn.addEventListener('click', togglePlay);\n \n function setPlaying(isPlaying) {\n playBtn.classList.toggle('playing', isPlaying);\n navIntroBtn.classList.toggle('playing', isPlaying);\n }\n \n audio.addEventListener('play', () => setPlaying(true));\n audio.addEventListener('pause', () => setPlaying(false));\n audio.addEventListener('ended', () => {\n setPlaying(false);\n progressFilled.style.width = '100%';\n });\n audio.addEventListener('loadedmetadata', () => { durEl.textContent = formatTime(audio.duration); });\n audio.addEventListener('timeupdate', () => {\n const pct = (audio.currentTime \/ audio.duration) * 100;\n progressFilled.style.width = pct + '%';\n curEl.textContent = formatTime(audio.currentTime);\n });\n progress.addEventListener('click', e => {\n const rect = progress.getBoundingClientRect();\n const pct = (e.clientX - rect.left) \/ rect.width;\n if (audio.duration) audio.currentTime = pct * audio.duration;\n });\n })();\n \n \/* =============================================================\n EXPANDIR \/ CONTRAER TARJETAS\n ============================================================= *\/\n function toggleCard(card) {\n if (card.classList.contains('expanded')) { closeCard(card); return; }\n document.querySelectorAll('.card').forEach(c => { if (c !== card) closeCard(c, false); });\n card.classList.add('expanded');\n history.replaceState(null, '', '#monumento-' + card.dataset.slug);\n setTimeout(() => card.scrollIntoView({ behavior: 'smooth', block: 'start' }), 100);\n }\n function closeCard(card, clearHash) {\n if (clearHash === undefined) clearHash = true;\n if (!card.classList.contains('expanded')) return;\n card.classList.remove('expanded');\n const audio = card.querySelector('audio');\n if (audio) {\n audio.pause();\n const btn = card.querySelector('.audio-play');\n if (btn) btn.classList.remove('playing');\n }\n if (clearHash) history.replaceState(null, '', window.location.pathname);\n }\n \n document.querySelectorAll('.card-preview').forEach(preview => {\n const card = preview.closest('.card');\n preview.addEventListener('click', () => toggleCard(card));\n preview.addEventListener('keydown', e => {\n if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); toggleCard(card); }\n });\n });\n document.querySelectorAll('.close-btn').forEach(btn => {\n btn.addEventListener('click', e => { e.stopPropagation(); closeCard(btn.closest('.card')); });\n });\n document.addEventListener('keydown', e => {\n if (e.key === 'Escape') document.querySelectorAll('.card.expanded').forEach(function(c){ closeCard(c); });\n });\n \n \/* =============================================================\n REPRODUCTORES DE AUDIO DE CADA TARJETA\n ============================================================= *\/\n document.querySelectorAll('.card').forEach(card => {\n const audio = card.querySelector('audio');\n const playBtn = card.querySelector('.audio-play');\n const progress = card.querySelector('.audio-progress');\n const progressFilled = card.querySelector('.audio-progress-filled');\n const currentTimeEl = card.querySelector('.current-time');\n const totalTimeEls = card.querySelectorAll('.total-time');\n if (!audio || !playBtn) return;\n \n playBtn.addEventListener('click', () => {\n pauseAllExcept(audio);\n if (audio.paused) audio.play().catch(err => console.warn('Audio error:', err));\n else audio.pause();\n });\n audio.addEventListener('play', () => playBtn.classList.add('playing'));\n audio.addEventListener('pause', () => playBtn.classList.remove('playing'));\n audio.addEventListener('ended', () => {\n playBtn.classList.remove('playing');\n progressFilled.style.width = '100%';\n });\n audio.addEventListener('loadedmetadata', () => {\n const dur = formatTime(audio.duration);\n totalTimeEls.forEach(el => el.textContent = dur);\n });\n audio.addEventListener('timeupdate', () => {\n const pct = (audio.currentTime \/ audio.duration) * 100;\n progressFilled.style.width = pct + '%';\n currentTimeEl.textContent = formatTime(audio.currentTime);\n });\n progress.addEventListener('click', e => {\n const rect = progress.getBoundingClientRect();\n const pct = (e.clientX - rect.left) \/ rect.width;\n if (audio.duration) audio.currentTime = pct * audio.duration;\n });\n });\n \n function formatTime(s) {\n if (!s || isNaN(s)) return '\u2014';\n const m = Math.floor(s \/ 60);\n const sec = Math.floor(s % 60).toString().padStart(2, '0');\n return m + ':' + sec;\n }\n \n \/* =============================================================\n BOTONES DE COMPARTIR\n ============================================================= *\/\n document.querySelectorAll('.share-btn').forEach(btn => {\n btn.addEventListener('click', async (e) => {\n e.preventDefault();\n const card = btn.closest('.card');\n const slug = card.dataset.slug;\n const m = DATA.monuments[slug];\n if (!m) return;\n const nombre = m.names[LANG];\n \n const pageUrl = window.location.origin + window.location.pathname + '#monumento-' + slug;\n const text = T.share_text.replace('{nombre}', nombre);\n const type = btn.dataset.share;\n \n const urls = {\n whatsapp: 'https:\/\/wa.me\/?text=' + encodeURIComponent(text + ' ' + pageUrl),\n facebook: 'https:\/\/www.facebook.com\/sharer\/sharer.php?u=' + encodeURIComponent(pageUrl),\n twitter: 'https:\/\/twitter.com\/intent\/tweet?text=' + encodeURIComponent(text) + '&url=' + encodeURIComponent(pageUrl),\n telegram: 'https:\/\/t.me\/share\/url?url=' + encodeURIComponent(pageUrl) + '&text=' + encodeURIComponent(text)\n };\n \n if (type === 'copy') {\n try {\n await navigator.clipboard.writeText(pageUrl);\n const orig = btn.innerHTML;\n btn.classList.add('copied');\n btn.innerHTML = '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"><\/polyline><\/svg>';\n setTimeout(() => { btn.classList.remove('copied'); btn.innerHTML = orig; }, 2000);\n } catch { alert('No se pudo copiar'); }\n } else if (urls[type]) {\n window.open(urls[type], '_blank', 'noopener,width=600,height=500');\n }\n });\n });\n \n \/* =============================================================\n DEEP-LINKING POR HASH\n ============================================================= *\/\n window.addEventListener('load', () => {\n const hash = window.location.hash.replace('#monumento-', '');\n if (!hash) return;\n const card = document.getElementById('monumento-' + hash);\n if (card) setTimeout(() => toggleCard(card), 300);\n });\n \n})();\n<\/script>\n<\/body><\/div><\/div><\/div><\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"100-width.php","meta":{"footnotes":""},"class_list":["post-1162","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/culturaconarte.es\/casaconpatiociudadrodrigo\/wp-json\/wp\/v2\/pages\/1162","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/culturaconarte.es\/casaconpatiociudadrodrigo\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/culturaconarte.es\/casaconpatiociudadrodrigo\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/culturaconarte.es\/casaconpatiociudadrodrigo\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/culturaconarte.es\/casaconpatiociudadrodrigo\/wp-json\/wp\/v2\/comments?post=1162"}],"version-history":[{"count":5,"href":"https:\/\/culturaconarte.es\/casaconpatiociudadrodrigo\/wp-json\/wp\/v2\/pages\/1162\/revisions"}],"predecessor-version":[{"id":1178,"href":"https:\/\/culturaconarte.es\/casaconpatiociudadrodrigo\/wp-json\/wp\/v2\/pages\/1162\/revisions\/1178"}],"wp:attachment":[{"href":"https:\/\/culturaconarte.es\/casaconpatiociudadrodrigo\/wp-json\/wp\/v2\/media?parent=1162"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}