{"id":34,"date":"2025-12-21T11:11:48","date_gmt":"2025-12-21T16:11:48","guid":{"rendered":"https:\/\/www.dandre.com.co\/nuevo-diseno\/?page_id=34"},"modified":"2026-05-06T07:19:18","modified_gmt":"2026-05-06T12:19:18","slug":"brizy-34","status":"publish","type":"page","link":"https:\/\/www.dandre.com.co\/","title":{"rendered":"Brizy #34"},"content":{"rendered":"
\n
\n
\n
\n
\n
\n
\n
\n

<\/span><\/a>
<\/span><\/a>
<\/span><\/a><\/div>\n
\n
\n
\n

Header – D’Andr\u00e9<\/title><\/p>\n<p> \/* Reset y estilos base *\/<br \/>\n * {<br \/>\n margin: 0;<br \/>\n padding: 0;<br \/>\n box-sizing: border-box;<br \/>\n }<\/p>\n<p> body {<br \/>\n font-family: -apple-system, BlinkMacSystemFont, ‘Segoe UI’, Roboto, Oxygen, Ubuntu, sans-serif;<br \/>\n }<\/p>\n<p> \/* Header principal *\/<br \/>\n .dandre-header {<br \/>\n position: fixed;<br \/>\n top: 0;<br \/>\n left: 0;<br \/>\n width: 100%;<br \/>\n background-color: white;<br \/>\n box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);<br \/>\n z-index: 1000;<br \/>\n padding: 15px 5%;<br \/>\n }<\/p>\n<p> .header-container {<br \/>\n display: flex;<br \/>\n justify-content: space-between;<br \/>\n align-items: center;<br \/>\n max-width: 1400px;<br \/>\n margin: 0 auto;<br \/>\n }<\/p>\n<p> \/* Logo *\/<br \/>\n .logo-container {<br \/>\n flex: 0 0 auto;<br \/>\n }<\/p>\n<p> .logo-container a {<br \/>\n display: block;<br \/>\n }<\/p>\n<p> .logo-img {<br \/>\n height: 50px;<br \/>\n width: auto;<br \/>\n max-width: 200px;<br \/>\n }<\/p>\n<p> \/* Navegaci\u00f3n *\/<br \/>\n .nav-container {<br \/>\n display: flex;<br \/>\n align-items: center;<br \/>\n gap: 40px;<br \/>\n }<\/p>\n<p> .nav-links {<br \/>\n display: flex;<br \/>\n list-style: none;<br \/>\n gap: 30px;<br \/>\n margin: 0;<br \/>\n padding: 0;<br \/>\n }<\/p>\n<p> .nav-link {<br \/>\n text-decoration: none;<br \/>\n color: #333;<br \/>\n font-weight: 500;<br \/>\n font-size: 16px;<br \/>\n transition: color 0.3s ease;<br \/>\n position: relative;<br \/>\n padding: 5px 0;<br \/>\n }<\/p>\n<p> .nav-link:hover {<br \/>\n color: #1A3E5F;<br \/>\n }<\/p>\n<p> .nav-link::after {<br \/>\n content: ”;<br \/>\n position: absolute;<br \/>\n bottom: 0;<br \/>\n left: 0;<br \/>\n width: 0;<br \/>\n height: 2px;<br \/>\n background-color: #1A3E5F;<br \/>\n transition: width 0.3s ease;<br \/>\n }<\/p>\n<p> .nav-link:hover::after {<br \/>\n width: 100%;<br \/>\n }<\/p>\n<p> \/* Bot\u00f3n Ver Men\u00fa – Color #1A3E5F *\/<br \/>\n .menu-btn {<br \/>\n background-color: #1A3E5F;<br \/>\n color: white;<br \/>\n border: none;<br \/>\n padding: 12px 25px;<br \/>\n border-radius: 30px;<br \/>\n font-weight: 600;<br \/>\n font-size: 15px;<br \/>\n cursor: pointer;<br \/>\n transition: all 0.3s ease;<br \/>\n text-transform: uppercase;<br \/>\n letter-spacing: 0.5px;<br \/>\n text-decoration: none;<br \/>\n display: inline-block;<br \/>\n }<\/p>\n<p> .menu-btn:hover {<br \/>\n background-color: #0F2840;<br \/>\n transform: translateY(-2px);<br \/>\n box-shadow: 0 5px 15px rgba(26, 62, 95, 0.3);<br \/>\n }<\/p>\n<p> \/* Men\u00fa hamburguesa para m\u00f3viles *\/<br \/>\n .menu-toggle {<br \/>\n display: none;<br \/>\n background: none;<br \/>\n border: none;<br \/>\n font-size: 24px;<br \/>\n color: #333;<br \/>\n cursor: pointer;<br \/>\n padding: 5px;<br \/>\n }<\/p>\n<p> \/* Responsive *\/<br \/>\n @media (max-width: 768px) {<br \/>\n .dandre-header {<br \/>\n padding: 15px 20px;<br \/>\n }<\/p>\n<p> .menu-toggle {<br \/>\n display: block;<br \/>\n }<\/p>\n<p> .nav-container {<br \/>\n position: fixed;<br \/>\n top: 80px;<br \/>\n left: 0;<br \/>\n width: 100%;<br \/>\n background-color: white;<br \/>\n flex-direction: column;<br \/>\n padding: 20px;<br \/>\n box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);<br \/>\n gap: 20px;<br \/>\n transform: translateY(-100%);<br \/>\n opacity: 0;<br \/>\n visibility: hidden;<br \/>\n transition: all 0.4s ease;<br \/>\n }<\/p>\n<p> .nav-container.active {<br \/>\n transform: translateY(0);<br \/>\n opacity: 1;<br \/>\n visibility: visible;<br \/>\n }<\/p>\n<p> .nav-links {<br \/>\n flex-direction: column;<br \/>\n align-items: center;<br \/>\n gap: 20px;<br \/>\n width: 100%;<br \/>\n }<\/p>\n<p> .nav-link {<br \/>\n font-size: 18px;<br \/>\n padding: 10px 0;<br \/>\n }<\/p>\n<p> .logo-img {<br \/>\n height: 40px;<br \/>\n }<\/p>\n<p> .menu-btn {<br \/>\n padding: 12px 30px;<br \/>\n width: 100%;<br \/>\n max-width: 200px;<br \/>\n }<br \/>\n }<\/p>\n<p> <!-- Header --><\/p>\n<header class=\"dandre-header\">\n<div class=\"header-container\">\n <!-- Logo --><\/p>\n<div class=\"logo-container\">\n <!-- ENLACE MODIFICADO: Logo ahora apunta a la URL especificada --><br \/>\n <a href=\"https:\/\/www.dandre.com.co\/\" title=\"Inicio\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/logo.png\" alt=\"D'Andr\u00e9\" class=\"logo-img\"><br \/>\n <\/a>\n <\/div>\n<p> <!-- Bot\u00f3n men\u00fa hamburguesa (solo m\u00f3viles) --><br \/>\n <button class=\"menu-toggle\" id=\"menuToggle\"><br \/>\n \u2630<br \/>\n <\/button><\/p>\n<p> <!-- Navegaci\u00f3n --><\/p>\n<nav class=\"nav-container\" id=\"navContainer\">\n<ul class=\"nav-links\">\n<li><a href=\"#seccion-reservas\" class=\"nav-link\">Reservar<\/a><\/li>\n<\/ul>\n<p> <!-- Bot\u00f3n Ver Men\u00fa con enlace al men\u00fa --><br \/>\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" class=\"menu-btn\" id=\"menuButton\" target=\"_blank\">Ver Men\u00fa<\/a><br \/>\n <\/nav>\n<\/p><\/div>\n<\/header>\n<p> \/\/ Funcionalidad para men\u00fa m\u00f3vil<br \/>\n const menuToggle = document.getElementById(‘menuToggle’);<br \/>\n const navContainer = document.getElementById(‘navContainer’);<\/p>\n<p> \/\/ Alternar men\u00fa en m\u00f3viles<br \/>\n menuToggle.addEventListener(‘click’, () => {<br \/>\n navContainer.classList.toggle(‘active’);<br \/>\n menuToggle.textContent = navContainer.classList.contains(‘active’) ? ‘\u2715’ : ‘\u2630’;<br \/>\n });<\/p>\n<p> \/\/ Cerrar men\u00fa al hacer clic en un enlace (m\u00f3viles)<br \/>\n const navLinks = document.querySelectorAll(‘.nav-link’);<br \/>\n navLinks.forEach(link => {<br \/>\n link.addEventListener(‘click’, () => {<br \/>\n if (window.innerWidth {<br \/>\n if (window.innerWidth > 768) {<br \/>\n navContainer.classList.remove(‘active’);<br \/>\n menuToggle.textContent = ‘\u2630’;<br \/>\n }<br \/>\n });<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n<section id=\"xlmfw1YMQxCG_xlmfw1YMQxCG\" class=\"brz-section brz-css-d-section brz-css-nlgkx6\">\n<div class=\"brz-section__content brz-section--boxed brz-css-d-sectionitem-bg brz-css-18rk4zw\" data-brz-custom-id=\"vCA2EMwdSDT6\">\n<div class=\"brz-container brz-css-d-sectionitem-container brz-css-939o4j\">\n<div id=\"\" class=\"brz-css-d-wrapper brz-css-vv1obi brz-wrapper\">\n<div class=\"brz-wp-shortcode brz-css-d-wpcustomshortcode brz-css-1dyrw91\" data-brz-custom-id=\"njdYR1k4Kqpq\">\n<div>\n<p> <title>Banner D’Andre Gourmet<\/title><\/p>\n<p> \/* === VERSI\u00d3N ESCRITORIO – EXACTAMENTE IGUAL === *\/<br \/>\n * {<br \/>\n margin: 0;<br \/>\n padding: 0;<br \/>\n box-sizing: border-box;<br \/>\n }<\/p>\n<p> body {<br \/>\n overflow-x: hidden;<br \/>\n }<\/p>\n<p> .banner-container {<br \/>\n width: 100vw;<br \/>\n min-height: 100vh;<br \/>\n \/* IMAGEN ORIGINAL PARA ESCRITORIO *\/<br \/>\n background-image: url(‘https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/Diseno-sin-titulo-48.png’);<br \/>\n background-size: cover;<br \/>\n background-position: center;<br \/>\n background-repeat: no-repeat;<br \/>\n background-attachment: fixed;<br \/>\n position: relative;<br \/>\n display: flex;<br \/>\n flex-direction: column;<br \/>\n justify-content: flex-end;<br \/>\n align-items: center;<br \/>\n text-align: center;<br \/>\n padding: 20px;<br \/>\n padding-bottom: 80px;<br \/>\n }<\/p>\n<p> .banner-content {<br \/>\n position: relative;<br \/>\n z-index: 2;<br \/>\n color: white;<br \/>\n max-width: 800px;<br \/>\n padding: 40px;<br \/>\n margin: 0 20px;<br \/>\n margin-bottom: 15px;<br \/>\n \/* MODIFICADO: Texto m\u00e1s abajo, cerca de la flecha *\/<br \/>\n margin-top: auto;<br \/>\n margin-bottom: 70px; \/* Reducido de 100px a 70px para bajar el texto m\u00e1s *\/<br \/>\n }<\/p>\n<p> .main-title {<br \/>\n font-family: ‘Poppins’, sans-serif;<br \/>\n font-weight: 700;<br \/>\n font-size: 3rem;<br \/>\n margin-bottom: 20px;<br \/>\n line-height: 1.1;<br \/>\n text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5);<br \/>\n }<\/p>\n<p> .title-line-1 {<br \/>\n display: block;<br \/>\n font-size: 3rem;<br \/>\n margin-bottom: 5px;<br \/>\n }<\/p>\n<p> .title-line-2 {<br \/>\n display: block;<br \/>\n font-size: 3rem;<br \/>\n }<\/p>\n<p> .subtitle {<br \/>\n font-family: ‘Poppins’, sans-serif;<br \/>\n font-weight: 400;<br \/>\n font-size: 1.2rem;<br \/>\n margin-bottom: 35px;<br \/>\n line-height: 1.6;<br \/>\n max-width: 700px;<br \/>\n text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.5);<br \/>\n }<\/p>\n<p> .subtitle-line-1 {<br \/>\n display: block;<br \/>\n margin-bottom: 5px;<br \/>\n }<\/p>\n<p> .subtitle-line-2 {<br \/>\n display: block;<br \/>\n }<\/p>\n<p> .menu-button {<br \/>\n display: inline-block;<br \/>\n background-color: white;<br \/>\n color: #1A3E5F;<br \/>\n font-family: ‘Poppins’, sans-serif;<br \/>\n font-weight: 700;<br \/>\n font-size: 1rem;<br \/>\n padding: 14px 36px;<br \/>\n border-radius: 50px;<br \/>\n text-decoration: none;<br \/>\n transition: all 0.3s ease;<br \/>\n box-shadow: 0 5px 15px rgba(0, 0, 0, 0.4);<br \/>\n margin-bottom: 10px;<br \/>\n }<\/p>\n<p> .menu-button:hover {<br \/>\n background-color: #f8f8f8;<br \/>\n transform: translateY(-5px);<br \/>\n box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);<br \/>\n }<\/p>\n<p> .down-arrow {<br \/>\n position: absolute;<br \/>\n bottom: 30px;<br \/>\n z-index: 2;<br \/>\n cursor: pointer;<br \/>\n display: flex;<br \/>\n flex-direction: column;<br \/>\n align-items: center;<br \/>\n }<\/p>\n<p> .double-arrow {<br \/>\n color: white;<br \/>\n font-size: 2.2rem;<br \/>\n animation: elegantBounce 2.5s infinite;<br \/>\n transition: all 0.4s ease;<br \/>\n opacity: 0.9;<br \/>\n text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.5);<br \/>\n }<\/p>\n<p> .double-arrow:hover {<br \/>\n opacity: 1;<br \/>\n transform: scale(1.15);<br \/>\n }<\/p>\n<p> .arrow-line {<br \/>\n width: 1px;<br \/>\n height: 30px;<br \/>\n background: linear-gradient(to bottom, rgba(255,255,255,0.9), rgba(255,255,255,0));<br \/>\n margin-top: 8px;<br \/>\n animation: lineFlow 2.5s infinite;<br \/>\n }<\/p>\n<p> @keyframes elegantBounce {<br \/>\n 0%, 20%, 50%, 80%, 100% {<br \/>\n transform: translateY(0);<br \/>\n }<br \/>\n 40% {<br \/>\n transform: translateY(-8px);<br \/>\n }<br \/>\n 60% {<br \/>\n transform: translateY(-4px);<br \/>\n }<br \/>\n }<\/p>\n<p> @keyframes lineFlow {<br \/>\n 0% {<br \/>\n height: 30px;<br \/>\n opacity: 0.8;<br \/>\n }<br \/>\n 50% {<br \/>\n height: 20px;<br \/>\n opacity: 0.4;<br \/>\n }<br \/>\n 100% {<br \/>\n height: 30px;<br \/>\n opacity: 0.8;<br \/>\n }<br \/>\n }<\/p>\n<p> \/* === SOLO PARA M\u00d3VIL (\u2264768px) === *\/<br \/>\n @media (max-width: 768px) {<br \/>\n \/* IMAGEN PARA M\u00d3VIL – CUBRE TODO EL RECUADRO *\/<br \/>\n .banner-container {<br \/>\n \/* IMAGEN NUEVA PARA M\u00d3VIL *\/<br \/>\n background-image: url(‘https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/Diseno-sin-titulo-55.png’) !important;<\/p>\n<p> width: 100vw;<br \/>\n min-height: 100vh;<\/p>\n<p> \/* AJUSTE: Cubrir todo el recuadro sin espacios negros *\/<br \/>\n background-size: cover !important; \/* Cambiado a cover para cubrir todo *\/<br \/>\n background-position: center 40% !important; \/* Ajustado para enfocar mejor *\/<br \/>\n background-attachment: scroll;<br \/>\n background-repeat: no-repeat;<\/p>\n<p> \/* Ajuste de padding *\/<br \/>\n padding: 0 !important;<br \/>\n padding-bottom: 60px;<\/p>\n<p> \/* Asegurar que est\u00e9 centrado *\/<br \/>\n position: relative;<br \/>\n left: 0;<br \/>\n right: 0;<br \/>\n margin: 0 !important;<br \/>\n }<\/p>\n<p> \/* Contenido centrado verticalmente en la IMAGEN – SIN FONDO y M\u00c1S ABAJO *\/<br \/>\n .banner-content {<br \/>\n width: 100%;<br \/>\n max-width: 90%;<br \/>\n padding: 25px 20px;<br \/>\n margin: 0 !important;<br \/>\n box-sizing: border-box;<br \/>\n \/* QUITADO: background-color y backdrop-filter *\/<br \/>\n background-color: transparent !important;<br \/>\n border-radius: 0;<\/p>\n<p> \/* CENTRADO PERO M\u00c1S ABAJO – MODIFICADO *\/<br \/>\n position: absolute !important;<br \/>\n top: 65% !important; \/* Cambiado de 50% a 65% para bajar el texto *\/<br \/>\n left: 50% !important;<br \/>\n transform: translate(-50%, -50%) !important;<br \/>\n z-index: 3;<br \/>\n }<\/p>\n<p> \/* Texto ajustado para mejor legibilidad – SIN FONDO *\/<br \/>\n .main-title {<br \/>\n font-size: 2.2rem;<br \/>\n margin-bottom: 15px;<br \/>\n text-shadow: 2px 2px 12px rgba(0, 0, 0, 0.9); \/* Sombra m\u00e1s fuerte *\/<br \/>\n }<\/p>\n<p> .title-line-1,<br \/>\n .title-line-2 {<br \/>\n font-size: 2.2rem;<br \/>\n margin-bottom: 3px;<br \/>\n }<\/p>\n<p> .subtitle {<br \/>\n font-size: 1rem;<br \/>\n margin-bottom: 25px;<br \/>\n line-height: 1.5;<br \/>\n padding: 0 10px;<br \/>\n text-shadow: 1px 1px 10px rgba(0, 0, 0, 0.9); \/* Sombra m\u00e1s fuerte *\/<br \/>\n }<\/p>\n<p> .subtitle-line-1 {<br \/>\n margin-bottom: 5px;<br \/>\n }<\/p>\n<p> .menu-button {<br \/>\n font-size: 0.95rem;<br \/>\n padding: 12px 30px;<br \/>\n margin-bottom: 10px;<br \/>\n box-shadow: 0 5px 15px rgba(0, 0, 0, 0.6); \/* Sombra m\u00e1s fuerte para el bot\u00f3n *\/<br \/>\n }<\/p>\n<p> .down-arrow {<br \/>\n bottom: 25px;<br \/>\n position: fixed !important;<br \/>\n z-index: 4;<br \/>\n }<\/p>\n<p> .double-arrow {<br \/>\n font-size: 1.8rem;<br \/>\n }<\/p>\n<p> .arrow-line {<br \/>\n height: 22px;<br \/>\n margin-top: 6px;<br \/>\n }<br \/>\n }<\/p>\n<p> @media (max-width: 480px) {<br \/>\n .banner-container {<br \/>\n min-height: 100vh;<br \/>\n padding-bottom: 50px;<br \/>\n \/* AJUSTE: M\u00e1s zoom para cubrir mejor *\/<br \/>\n background-size: cover !important;<br \/>\n background-position: center 45% !important; \/* Ajuste vertical *\/<br \/>\n }<\/p>\n<p> .banner-content {<br \/>\n padding: 20px 15px;<br \/>\n max-width: 95%;<br \/>\n \/* CENTRADO PERO M\u00c1S ABAJO – MODIFICADO *\/<br \/>\n top: 65% !important; \/* Cambiado de 50% a 65% para bajar el texto *\/<br \/>\n transform: translate(-50%, -50%) !important;<br \/>\n background-color: transparent !important; \/* Sin fondo *\/<br \/>\n }<\/p>\n<p> .main-title {<br \/>\n font-size: 1.9rem;<br \/>\n margin-bottom: 12px;<br \/>\n text-shadow: 2px 2px 15px rgba(0, 0, 0, 0.9); \/* Sombra a\u00fan m\u00e1s fuerte *\/<br \/>\n }<\/p>\n<p> .title-line-1,<br \/>\n .title-line-2 {<br \/>\n font-size: 1.9rem;<br \/>\n }<\/p>\n<p> .subtitle {<br \/>\n font-size: 0.95rem;<br \/>\n margin-bottom: 22px;<br \/>\n padding: 0 5px;<br \/>\n text-shadow: 1px 1px 12px rgba(0, 0, 0, 0.9); \/* Sombra a\u00fan m\u00e1s fuerte *\/<br \/>\n }<\/p>\n<p> .menu-button {<br \/>\n font-size: 0.9rem;<br \/>\n padding: 11px 28px;<br \/>\n margin-bottom: 8px;<br \/>\n box-shadow: 0 5px 15px rgba(0, 0, 0, 0.7);<br \/>\n }<\/p>\n<p> .down-arrow {<br \/>\n bottom: 20px;<br \/>\n }<\/p>\n<p> .double-arrow {<br \/>\n font-size: 1.7rem;<br \/>\n }<\/p>\n<p> .arrow-line {<br \/>\n height: 20px;<br \/>\n margin-top: 5px;<br \/>\n }<br \/>\n }<\/p>\n<p> @media (max-width: 360px) {<br \/>\n .banner-container {<br \/>\n min-height: 100vh;<br \/>\n padding-bottom: 40px;<br \/>\n \/* AJUSTE: A\u00fan m\u00e1s zoom para m\u00f3viles peque\u00f1os *\/<br \/>\n background-size: cover !important;<br \/>\n background-position: center 50% !important;<br \/>\n }<\/p>\n<p> .banner-content {<br \/>\n padding: 18px 12px;<br \/>\n max-width: 95%;<br \/>\n \/* CENTRADO PERO M\u00c1S ABAJO – MODIFICADO *\/<br \/>\n top: 65% !important; \/* Cambiado de 50% a 65% para bajar el texto *\/<br \/>\n transform: translate(-50%, -50%) !important;<br \/>\n background-color: transparent !important; \/* Sin fondo *\/<br \/>\n }<\/p>\n<p> .main-title {<br \/>\n font-size: 1.7rem;<br \/>\n margin-bottom: 10px;<br \/>\n text-shadow: 3px 3px 15px rgba(0, 0, 0, 0.9); \/* Sombra muy fuerte *\/<br \/>\n }<\/p>\n<p> .title-line-1,<br \/>\n .title-line-2 {<br \/>\n font-size: 1.7rem;<br \/>\n }<\/p>\n<p> .subtitle {<br \/>\n font-size: 0.9rem;<br \/>\n margin-bottom: 20px;<br \/>\n padding: 0;<br \/>\n text-shadow: 2px 2px 12px rgba(0, 0, 0, 0.9); \/* Sombra muy fuerte *\/<br \/>\n }<\/p>\n<p> .menu-button {<br \/>\n font-size: 0.85rem;<br \/>\n padding: 10px 25px;<br \/>\n margin-bottom: 5px;<br \/>\n box-shadow: 0 5px 15px rgba(0, 0, 0, 0.8);<br \/>\n }<\/p>\n<p> .down-arrow {<br \/>\n bottom: 15px;<br \/>\n }<\/p>\n<p> .double-arrow {<br \/>\n font-size: 1.6rem;<br \/>\n }<\/p>\n<p> .arrow-line {<br \/>\n height: 18px;<br \/>\n }<br \/>\n }<\/p>\n<p> \/* Para tablets (769px – 1024px) *\/<br \/>\n @media (min-width: 769px) and (max-width: 1024px) {<br \/>\n .banner-container {<br \/>\n \/* Versi\u00f3n escritorio se mantiene igual *\/<br \/>\n background-image: url(‘https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/Diseno-sin-titulo-48.png’);<br \/>\n background-size: cover;<br \/>\n background-position: center;<br \/>\n }<\/p>\n<p> .banner-content {<br \/>\n margin-bottom: 70px; \/* Aplicar mismo cambio en tablets *\/<br \/>\n }<br \/>\n }<\/p>\n<section class=\"banner-container\">\n<div class=\"banner-content\">\n<h1 class=\"main-title\">\n <span class=\"title-line-1\">El arte del<\/span><br \/>\n <span class=\"title-line-2\">sabor gourmet<\/span><br \/>\n <\/h1>\n<p class=\"subtitle\">\n <span class=\"subtitle-line-1\">Recetas aut\u00e9nticas, ingredientes seleccionados y una promesa:<\/span><br \/>\n <span class=\"subtitle-line-2\">calidad en cada bocado<\/span>\n <\/p>\n<p> <!-- BOT\u00d3N MODIFICADO CON EL NUEVO ENLACE --><br \/>\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" class=\"menu-button\">Men\u00fa<\/a>\n <\/div>\n<p> <!-- FLECHA ELEGANTE CON L\u00cdNEA SUTIL --><\/p>\n<div class=\"down-arrow\">\n<div class=\"double-arrow\">\n <i class=\"fas fa-angle-double-down\"><\/i>\n <\/div>\n<div class=\"arrow-line\"><\/div>\n<\/p><\/div>\n<\/section>\n<p> function scrollToNext() {<br \/>\n window.scrollTo({<br \/>\n top: window.innerHeight,<br \/>\n behavior: ‘smooth’<br \/>\n });<br \/>\n }<\/p>\n<p> document.querySelector(‘.down-arrow’).addEventListener(‘click’, scrollToNext);<\/p>\n<p> \/\/ Asegurar que el bot\u00f3n funcione correctamente<br \/>\n document.querySelector(‘.menu-button’).addEventListener(‘click’, function(e) {<br \/>\n \/\/ Permitir que el enlace funcione normalmente<br \/>\n console.log(‘Redirigiendo a:’, this.href);<br \/>\n });<\/p>\n<p> document.querySelector(‘.double-arrow’).addEventListener(‘mouseenter’, function() {<br \/>\n this.style.opacity = ‘1’;<br \/>\n });<br \/>\n document.querySelector(‘.double-arrow’).addEventListener(‘mouseleave’, function() {<br \/>\n this.style.opacity = ‘0.9’;<br \/>\n });<\/p>\n<p> \/\/ Forzar ancho completo en m\u00f3vil al cargar<br \/>\n window.addEventListener(‘load’, function() {<br \/>\n if (window.innerWidth <= 768) {<br \/>\n \/\/ Asegurar que el banner ocupe el 100% del viewport<br \/>\n document.querySelector('.banner-container').style.width = '100vw';<br \/>\n document.body.style.overflowX = 'hidden';<br \/>\n }<br \/>\n });<\/p>\n<p> \/\/ Ajustar en redimensionamiento<br \/>\n window.addEventListener('resize', function() {<br \/>\n if (window.innerWidth <= 768) {<br \/>\n document.querySelector('.banner-container').style.width = '100vw';<br \/>\n document.body.style.overflowX = 'hidden';<br \/>\n }<br \/>\n });<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n<section id=\"mzomu_Fpjqjj_mzomu_Fpjqjj\" class=\"brz-section brz-css-d-section brz-css-61gplz\">\n<div class=\"brz-section__content brz-section--boxed brz-css-d-sectionitem-bg brz-css-88y870\" data-brz-custom-id=\"cyJxhYiqZg2M\">\n<div class=\"brz-container brz-css-d-sectionitem-container brz-css-193wwyw\">\n<div id=\"\" class=\"brz-css-d-wrapper brz-css-dsumt5 brz-wrapper\">\n<div class=\"brz-wp-shortcode brz-css-d-wpcustomshortcode brz-css-51j0y0\" data-brz-custom-id=\"nLjKxtHCpD0m\">\n<div>\n<div class=\"fullwidth-carousel\" style=\"width: 100vw;position: relative;left: 50%;right: 50%;margin-left: -50vw;margin-right: -50vw;height: 350px;overflow: hidden;background: transparent\">\n<div class=\"carousel-track\" style=\"display: flex;position: absolute;top: 50%\">\n<p> <!-- IMAGEN 1 --><\/p>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/IMG-20191128-WA0036.jpg\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<p> <!-- IMAGEN 2 --><\/p>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/2.png\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<p> <!-- IMAGEN 3 --><\/p>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/3.png\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<p> <!-- IMAGEN 4 --><\/p>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/4.png\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<p> <!-- IMAGEN 5 --><\/p>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/5.png\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<p> <!-- IMAGEN 6 --><\/p>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/6.png\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<p> <!-- IMAGEN 7 --><\/p>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/7.png\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<p> <!-- IMAGEN 8 --><\/p>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/8.png\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<p> <!-- IMAGEN 9 --><\/p>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/9.png\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<p> <!-- IMAGEN 10 --><\/p>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/10.png\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<p> <!-- DUPLICADO PARA EFECTO INFINITO - Segunda tanda --><\/p>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/1.png\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/2.png\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/3.png\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/4.png\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/5.png\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/6.png\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/7.png\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/8.png\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/9.png\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<div class=\"circle-img\" style=\"width: 220px;height: 220px;margin: 0 25px;border-radius: 50%;overflow: hidden;flex-shrink: 0\">\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: block;width: 100%;height: 100%;cursor: pointer\"><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/10.png\" alt=\"Men\u00fa D'Andre\" style=\"width: 100%;height: 100%;object-fit: cover;display: block\"><br \/>\n <\/a>\n <\/div>\n<\/p><\/div>\n<\/div>\n<p> \/* ANIMACI\u00d3N *\/<br \/>\n @keyframes slideHorizontal {<br \/>\n 0% {<br \/>\n transform: translateX(0) translateY(-50%);<br \/>\n }<br \/>\n 100% {<br \/>\n transform: translateX(-50%) translateY(-50%);<br \/>\n }<br \/>\n }<\/p>\n<p> \/* PAUSA AL PASAR EL MOUSE *\/<br \/>\n .fullwidth-carousel:hover .carousel-track {<br \/>\n animation-play-state: paused;<br \/>\n }<\/p>\n<p> \/* RESPONSIVE MEJORADO CON LOOP INFINITO *\/<br \/>\n @media (max-width: 768px) {<br \/>\n .fullwidth-carousel {<br \/>\n height: 250px !important; \/* Reducido de 350px a 250px *\/<br \/>\n width: 100vw !important; \/* Mantenemos 100vw para el efecto completo *\/<br \/>\n left: 0 !important; \/* Quitado el desplazamiento del 50% *\/<br \/>\n right: 0 !important;<br \/>\n margin-left: 0 !important; \/* Quitado el margen negativo *\/<br \/>\n margin-right: 0 !important;<br \/>\n overflow: hidden !important; \/* Mantenemos hidden *\/<br \/>\n position: relative !important;<br \/>\n }<\/p>\n<p> .carousel-track {<br \/>\n top: 50% !important;<br \/>\n \/* Ajustamos el c\u00e1lculo del translateX para que sea proporcional al contenido *\/<br \/>\n animation: slideHorizontalMobile 30s linear infinite !important;<br \/>\n \/* Aseguramos que el track tenga el ancho necesario para el loop infinito *\/<br \/>\n width: calc(20 * (140px + 24px)) !important; \/* (10 im\u00e1genes * 2) * (ancho + margen) *\/<br \/>\n }<\/p>\n<p> .circle-img {<br \/>\n width: 140px !important; \/* Reducido de 220px a 140px *\/<br \/>\n height: 140px !important;<br \/>\n margin: 0 12px !important; \/* Reducido de 25px a 12px *\/<br \/>\n box-shadow: 0 5px 15px rgba(0,0,0,0.12) !important;<br \/>\n }<\/p>\n<p> \/* Animaci\u00f3n espec\u00edfica para m\u00f3vil que se mueve proporcionalmente *\/<br \/>\n @keyframes slideHorizontalMobile {<br \/>\n 0% {<br \/>\n transform: translateX(0) translateY(-50%);<br \/>\n }<br \/>\n 100% {<br \/>\n \/* Movemos exactamente la mitad del ancho total (porque tenemos 2 sets de 10 im\u00e1genes) *\/<br \/>\n transform: translateX(calc(-50%)) translateY(-50%);<br \/>\n }<br \/>\n }<br \/>\n }<\/p>\n<p> \/* Para m\u00f3viles m\u00e1s peque\u00f1os (480px) *\/<br \/>\n @media (max-width: 480px) {<br \/>\n .fullwidth-carousel {<br \/>\n height: 220px !important;<br \/>\n }<\/p>\n<p> .carousel-track {<br \/>\n width: calc(20 * (120px + 20px)) !important;<br \/>\n animation: slideHorizontalMobileSmall 25s linear infinite !important;<br \/>\n }<\/p>\n<p> .circle-img {<br \/>\n width: 120px !important;<br \/>\n height: 120px !important;<br \/>\n margin: 0 10px !important;<br \/>\n }<\/p>\n<p> @keyframes slideHorizontalMobileSmall {<br \/>\n 0% {<br \/>\n transform: translateX(0) translateY(-50%);<br \/>\n }<br \/>\n 100% {<br \/>\n transform: translateX(calc(-50%)) translateY(-50%);<br \/>\n }<br \/>\n }<br \/>\n }<\/p>\n<p> \/* Para m\u00f3viles extra peque\u00f1os (360px) *\/<br \/>\n @media (max-width: 360px) {<br \/>\n .fullwidth-carousel {<br \/>\n height: 200px !important;<br \/>\n }<\/p>\n<p> .carousel-track {<br \/>\n width: calc(20 * (110px + 16px)) !important;<br \/>\n animation: slideHorizontalMobileXS 22s linear infinite !important;<br \/>\n }<\/p>\n<p> .circle-img {<br \/>\n width: 110px !important;<br \/>\n height: 110px !important;<br \/>\n margin: 0 8px !important;<br \/>\n }<\/p>\n<p> @keyframes slideHorizontalMobileXS {<br \/>\n 0% {<br \/>\n transform: translateX(0) translateY(-50%);<br \/>\n }<br \/>\n 100% {<br \/>\n transform: translateX(calc(-50%)) translateY(-50%);<br \/>\n }<br \/>\n }<br \/>\n }<\/p>\n<p> \/* Para tablets en orientaci\u00f3n vertical *\/<br \/>\n @media (min-width: 769px) and (max-width: 1024px) {<br \/>\n .fullwidth-carousel {<br \/>\n height: 320px !important;<br \/>\n }<\/p>\n<p> .carousel-track {<br \/>\n width: calc(20 * (190px + 40px)) !important;<br \/>\n }<\/p>\n<p> .circle-img {<br \/>\n width: 190px !important;<br \/>\n height: 190px !important;<br \/>\n margin: 0 20px !important;<br \/>\n }<br \/>\n }<\/p>\n<p> \/\/ Script para ajustar din\u00e1micamente el ancho del track en m\u00f3vil<br \/>\n document.addEventListener(‘DOMContentLoaded’, function() {<br \/>\n function adjustCarouselForMobile() {<br \/>\n const carouselTrack = document.querySelector(‘.carousel-track’);<br \/>\n const circleImgs = document.querySelectorAll(‘.circle-img’);<\/p>\n<p> if (window.innerWidth 0) {<br \/>\n \/\/ Calcular el ancho total necesario para el efecto infinito<br \/>\n const imgWidth = 140; \/\/ Ancho de imagen en m\u00f3vil<br \/>\n const imgMargin = 24; \/\/ Margen total (12px a cada lado)<br \/>\n const totalImages = 20; \/\/ 10 im\u00e1genes originales + 10 duplicadas<\/p>\n<p> const totalWidth = totalImages * (imgWidth + imgMargin);<br \/>\n carouselTrack.style.width = totalWidth + ‘px’;<\/p>\n<p> \/\/ Ajustar para diferentes tama\u00f1os de pantalla<br \/>\n if (window.innerWidth <= 480) {<br \/>\n const imgWidthSmall = 120;<br \/>\n const imgMarginSmall = 20;<br \/>\n carouselTrack.style.width = (totalImages * (imgWidthSmall + imgMarginSmall)) + 'px';<br \/>\n }<\/p>\n<p> if (window.innerWidth <= 360) {<br \/>\n const imgWidthXS = 110;<br \/>\n const imgMarginXS = 16;<br \/>\n carouselTrack.style.width = (totalImages * (imgWidthXS + imgMarginXS)) + 'px';<br \/>\n }<br \/>\n }<br \/>\n }<\/p>\n<p> \/\/ Ajustar al cargar<br \/>\n adjustCarouselForMobile();<\/p>\n<p> \/\/ Ajustar al redimensionar<br \/>\n window.addEventListener('resize', adjustCarouselForMobile);<br \/>\n });<\/p>\n<p><!-- TERMINA CARRUSEL --><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n<section id=\"lkRYvWmM9Dxa_lkRYvWmM9Dxa\" class=\"brz-section brz-css-d-section brz-css-1534l2j\">\n<div class=\"brz-section__content brz-section--boxed brz-css-d-sectionitem-bg brz-css-xz0qmf\" data-brz-custom-id=\"tg7ofgDXgDDd\">\n<div class=\"brz-container brz-css-d-sectionitem-container brz-css-1tt3v74\">\n<div id=\"\" class=\"brz-css-d-wrapper brz-css-1jmhd2b brz-wrapper\">\n<div class=\"brz-wp-shortcode brz-css-d-wpcustomshortcode brz-css-1ktn3gs\" data-brz-custom-id=\"oFSPfzQuiJkN\">\n<div><!-- SECCI\u00d3N GALER\u00cdA Y TEXTO --><\/p>\n<div class=\"dandre-gallery-section\" style=\"width: 100%;max-width: 1200px;margin: 60px auto;padding: 0 20px;display: flex;flex-wrap: wrap;gap: 50px;align-items: center;justify-content: center\">\n<p> <!-- COLUMNA IZQUIERDA - GALER\u00cdA CON FLECHAS --><\/p>\n<div class=\"gallery-column\" style=\"flex: 1;min-width: 300px;max-width: 600px;position: relative\">\n<div class=\"gallery-container\" style=\"position: relative\">\n<p> <!-- IMAGEN PRINCIPAL GRANDE --><\/p>\n<div class=\"featured-image\" style=\"width: 100%;border-radius: 15px;overflow: hidden;position: relative\">\n <img decoding=\"async\" id=\"mainImage\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/IMG-20190504-WA0029.jpg\" alt=\"Dandre Gourmet - Plato destacado\" style=\"width: 100%;height: 400px;object-fit: cover;display: block\"><\/p>\n<p> <!-- FLECHA IZQUIERDA --><br \/>\n <button class=\"arrow-btn left-arrow\" style=\"position: absolute;left: 15px;top: 50%;border: none;width: 40px;height: 40px;border-radius: 50%;cursor: pointer;display: flex;align-items: center;justify-content: center;font-size: 20px;color: #333\"><br \/>\n \u2190<br \/>\n <\/button><\/p>\n<p> <!-- FLECHA DERECHA --><br \/>\n <button class=\"arrow-btn right-arrow\" style=\"position: absolute;right: 15px;top: 50%;border: none;width: 40px;height: 40px;border-radius: 50%;cursor: pointer;display: flex;align-items: center;justify-content: center;font-size: 20px;color: #333\"><br \/>\n \u2192<br \/>\n <\/button>\n <\/div>\n<p> <!-- MINIATURAS (opcional, solo visual) --><\/p>\n<div class=\"thumbnail-row\" style=\"display: flex;gap: 10px;justify-content: center;margin-top: 15px\">\n <!-- Miniatura 1 --><\/p>\n<div class=\"thumbnail\" style=\"width: 60px;height: 60px;border-radius: 6px;overflow: hidden;opacity: 0.6\">\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/IMG-20190504-WA0029.jpg\" style=\"width: 100%;height: 100%;object-fit: cover\">\n <\/div>\n<p> <!-- Miniatura 2 --><\/p>\n<div class=\"thumbnail\" style=\"width: 60px;height: 60px;border-radius: 6px;overflow: hidden;opacity: 0.6\">\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/IMG-20190712-WA0044.jpg\" style=\"width: 100%;height: 100%;object-fit: cover\">\n <\/div>\n<p> <!-- Miniatura 3 --><\/p>\n<div class=\"thumbnail\" style=\"width: 60px;height: 60px;border-radius: 6px;overflow: hidden;opacity: 0.6\">\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/IMG-20190714-WA0016.jpg\" style=\"width: 100%;height: 100%;object-fit: cover\">\n <\/div>\n<p> <!-- Miniatura 4 --><\/p>\n<div class=\"thumbnail\" style=\"width: 60px;height: 60px;border-radius: 6px;overflow: hidden;opacity: 0.6\">\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/IMG-20190714-WA0030.jpg\" style=\"width: 100%;height: 100%;object-fit: cover\">\n <\/div>\n<p> <!-- Miniatura 5 --><\/p>\n<div class=\"thumbnail\" style=\"width: 60px;height: 60px;border-radius: 6px;overflow: hidden;opacity: 0.6\">\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/IMG-20191128-WA0036.jpg\" style=\"width: 100%;height: 100%;object-fit: cover\">\n <\/div>\n<p> <!-- Miniatura 6 --><\/p>\n<div class=\"thumbnail\" style=\"width: 60px;height: 60px;border-radius: 6px;overflow: hidden;opacity: 0.6\">\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/Foto-de-lilia-Galvis-7.jpg\" style=\"width: 100%;height: 100%;object-fit: cover\">\n <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- COLUMNA DERECHA - TEXTO Y BOT\u00d3N --><\/p>\n<div class=\"text-column\" style=\"flex: 1;min-width: 300px;max-width: 450px\">\n<div class=\"text-content\" style=\"text-align: left\">\n <!-- T\u00cdTULO: ESPACIO M\u00cdNIMO entre l\u00edneas --><\/p>\n<h2 style=\"font-family: 'Helvetica', Arial, sans-serif;font-weight: bold;font-size: 2rem;color: #1A3E5F;margin-bottom: 2px;letter-spacing: 1px;line-height: 1\">\n \u00danete al movimiento<br \/>\n <\/h2>\n<h1 style=\"font-family: 'Helvetica', Arial, sans-serif;font-weight: bold;font-size: 3.5rem;color: #1A3E5F;margin-bottom: 25px;line-height: 1;margin-top: 0\">\n Dandre Gourmet<br \/>\n <\/h1>\n<p> <!-- TEXTO: Poppins Extra Light --><\/p>\n<p style=\"font-family: 'Poppins', sans-serif;font-weight: 200;font-size: 1.1rem;color: #555;line-height: 1.7;margin-bottom: 20px\">\n En Dandre Gourmet cocinamos cada d\u00eda con productos frescos, naturales y llenos de sabor.\n <\/p>\n<p style=\"font-family: 'Poppins', sans-serif;font-weight: 200;font-size: 1.1rem;color: #555;line-height: 1.7;margin-bottom: 35px\">\n Nuestra misi\u00f3n es simple: ofrecerte comida aut\u00e9ntica, de calidad y deliciosa, lista cuando la necesites.\n <\/p>\n<p> <!-- BOT\u00d3N: #1A3E5F normal, negro al hover, m\u00e1s peque\u00f1o --><br \/>\n <a href=\"https:\/\/maps.app.goo.gl\/Dc5dEJsYMG7RwfUt8\" target=\"_blank\" class=\"visit-button\" style=\"display: inline-block;background-color: #1A3E5F;color: white;text-decoration: none;padding: 14px 36px;font-size: 1.1rem;font-weight: bold;border-radius: 50px;font-family: 'Helvetica', Arial, sans-serif\"><br \/>\n Vis\u00edtanos<br \/>\n <\/a>\n <\/div>\n<\/p><\/div>\n<\/div>\n<p> \/* ESTILOS PARA LA GALER\u00cdA – Copia esto tambi\u00e9n *\/<\/p>\n<p> \/* Importar fuente Poppins *\/<br \/>\n @import url(‘https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap’);<\/p>\n<p> \/* Efecto hover en bot\u00f3n Vis\u00edtanos – Cambia a negro *\/<br \/>\n .visit-button:hover {<br \/>\n background-color: #000000 !important;<br \/>\n color: white !important;<br \/>\n transform: translateY(-3px);<br \/>\n box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4) !important;<br \/>\n }<\/p>\n<p> \/* Efecto hover en flechas *\/<br \/>\n .arrow-btn:hover {<br \/>\n background: white !important;<br \/>\n transform: translateY(-50%) scale(1.1);<br \/>\n box-shadow: 0 5px 15px rgba(0,0,0,0.3) !important;<br \/>\n }<\/p>\n<p> \/* Efecto en miniatura activa (punto indicador) *\/<br \/>\n .thumbnail.active {<br \/>\n opacity: 1 !important;<br \/>\n }<\/p>\n<p> \/* Efecto hover en imagen principal *\/<br \/>\n .featured-image img {<br \/>\n transition: transform 0.5s ease;<br \/>\n }<\/p>\n<p> .featured-image:hover img {<br \/>\n transform: scale(1.02);<br \/>\n }<\/p>\n<p> \/* Responsive – PARA ESCRITORIO se mantiene igual *\/<br \/>\n @media (max-width: 900px) {<br \/>\n .dandre-gallery-section {<br \/>\n flex-direction: column;<br \/>\n gap: 40px;<br \/>\n }<\/p>\n<p> .text-column, .gallery-column {<br \/>\n max-width: 100%;<br \/>\n }<\/p>\n<p> .featured-image img {<br \/>\n height: 350px;<br \/>\n }<\/p>\n<p> .text-column h2 {<br \/>\n font-size: 1.8rem !important;<br \/>\n }<\/p>\n<p> .text-column h1 {<br \/>\n font-size: 2.8rem !important;<br \/>\n }<br \/>\n }<\/p>\n<p> \/* NUEVA REGLA: Solo para m\u00f3viles – Invertir orden de columnas *\/<br \/>\n @media (max-width: 768px) {<br \/>\n .dandre-gallery-section {<br \/>\n flex-direction: column;<br \/>\n }<\/p>\n<p> \/* Texto arriba (order: 1) *\/<br \/>\n .text-column {<br \/>\n order: 1 !important;<br \/>\n margin-bottom: 20px;<br \/>\n }<\/p>\n<p> \/* Im\u00e1genes abajo (order: 2) *\/<br \/>\n .gallery-column {<br \/>\n order: 2 !important;<br \/>\n }<\/p>\n<p> \/* Centrar contenido de texto en m\u00f3vil *\/<br \/>\n .text-content {<br \/>\n text-align: center !important;<br \/>\n }<\/p>\n<p> .visit-button {<br \/>\n margin: 0 auto;<br \/>\n display: block;<br \/>\n width: fit-content;<br \/>\n }<br \/>\n }<\/p>\n<p> @media (max-width: 480px) {<br \/>\n .text-column h2 {<br \/>\n font-size: 1.4rem !important;<br \/>\n }<\/p>\n<p> .text-column h1 {<br \/>\n font-size: 2rem !important;<br \/>\n }<\/p>\n<p> .featured-image img {<br \/>\n height: 250px;<br \/>\n }<\/p>\n<p> .arrow-btn {<br \/>\n width: 35px !important;<br \/>\n height: 35px !important;<br \/>\n font-size: 16px !important;<br \/>\n }<\/p>\n<p> .thumbnail {<br \/>\n width: 45px !important;<br \/>\n height: 45px !important;<br \/>\n }<\/p>\n<p> .visit-button {<br \/>\n padding: 12px 30px !important;<br \/>\n font-size: 1rem !important;<br \/>\n }<\/p>\n<p> .text-column p {<br \/>\n font-size: 1rem !important;<br \/>\n }<br \/>\n }<\/p>\n<p> \/\/ SCRIPT PARA GALER\u00cdA CON FLECHAS – Copia esto tambi\u00e9n<br \/>\n document.addEventListener(‘DOMContentLoaded’, function() {<br \/>\n \/\/ Lista de im\u00e1genes CON TUS 6 NUEVAS IM\u00c1GENES<br \/>\n const images = [<br \/>\n “https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/IMG-20190504-WA0029.jpg”,<br \/>\n “https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/IMG-20190712-WA0044.jpg”,<br \/>\n “https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/IMG-20190714-WA0016.jpg”,<br \/>\n “https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/IMG-20190714-WA0030.jpg”,<br \/>\n “https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/IMG-20191128-WA0036.jpg”,<br \/>\n “https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/Foto-de-lilia-Galvis-7.jpg”<br \/>\n ];<\/p>\n<p> const mainImage = document.getElementById(‘mainImage’);<br \/>\n const leftArrow = document.querySelector(‘.left-arrow’);<br \/>\n const rightArrow = document.querySelector(‘.right-arrow’);<br \/>\n const thumbnails = document.querySelectorAll(‘.thumbnail’);<\/p>\n<p> let currentIndex = 0;<\/p>\n<p> \/\/ Funci\u00f3n para actualizar la imagen<br \/>\n function updateImage() {<br \/>\n mainImage.src = images[currentIndex];<\/p>\n<p> \/\/ Actualizar miniatura activa (si hay miniaturas)<br \/>\n thumbnails.forEach((thumb, index) => {<br \/>\n thumb.classList.remove(‘active’);<br \/>\n if (index === currentIndex % thumbnails.length) {<br \/>\n thumb.classList.add(‘active’);<br \/>\n }<br \/>\n });<br \/>\n }<\/p>\n<p> \/\/ Flecha izquierda – imagen anterior<br \/>\n leftArrow.addEventListener(‘click’, function() {<br \/>\n currentIndex = (currentIndex – 1 + images.length) % images.length;<br \/>\n updateImage();<br \/>\n });<\/p>\n<p> \/\/ Flecha derecha – siguiente imagen<br \/>\n rightArrow.addEventListener(‘click’, function() {<br \/>\n currentIndex = (currentIndex + 1) % images.length;<br \/>\n updateImage();<br \/>\n });<\/p>\n<p> \/\/ Tambi\u00e9n se puede navegar con teclado<br \/>\n document.addEventListener(‘keydown’, function(event) {<br \/>\n if (event.key === ‘ArrowLeft’) {<br \/>\n currentIndex = (currentIndex – 1 + images.length) % images.length;<br \/>\n updateImage();<br \/>\n } else if (event.key === ‘ArrowRight’) {<br \/>\n currentIndex = (currentIndex + 1) % images.length;<br \/>\n updateImage();<br \/>\n }<br \/>\n });<\/p>\n<p> \/\/ Inicializar primera imagen activa<br \/>\n updateImage();<br \/>\n });<\/p>\n<p><!-- TERMINA SECCI\u00d3N GALER\u00cdA --><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n<section id=\"w61T0jiXRkn7_w61T0jiXRkn7\" class=\"brz-section brz-css-d-section brz-css-j3ydh0\">\n<div class=\"brz-section__content brz-section--boxed brz-css-d-sectionitem-bg brz-css-188purw\" data-brz-custom-id=\"f8IY1Y0EyyJ3\">\n<div class=\"brz-container brz-css-d-sectionitem-container brz-css-g3uwlv\"><\/div>\n<\/div>\n<\/section>\n<section id=\"aieegHQ7IB_m_aieegHQ7IB_m\" class=\"brz-section brz-css-d-section brz-css-nd4ebv\">\n<div class=\"brz-section__content brz-section--boxed brz-css-d-sectionitem-bg brz-css-15tqui3\" data-brz-custom-id=\"nPhy5MP6iZHW\">\n<div class=\"brz-container brz-css-d-sectionitem-container brz-css-ai00hc\">\n<div id=\"\" class=\"brz-css-d-wrapper brz-css-tzsxoj brz-wrapper\">\n<div class=\"brz-wp-shortcode brz-css-d-wpcustomshortcode brz-css-17q7ojj\" data-brz-custom-id=\"gpYShyMwEtzT\">\n<div>\n<div class=\"menu-section-brizy\" style=\"background-color: #1A3E5F;padding: 20px 0;font-family: 'Poppins', sans-serif;width: 100vw;position: relative;left: 50%;right: 50%;margin-left: -50vw;margin-right: -50vw\">\n<div style=\"max-width: 1400px;margin: 0 auto;padding: 0 20px\">\n<div class=\"menu-cards-container-brizy\" style=\"display: flex;flex-wrap: wrap;justify-content: center;gap: 25px\">\n<p> <!-- Brunch --><\/p>\n<div class=\"menu-card-brizy\" style=\"flex: 1;min-width: 280px;max-width: 350px;text-align: center;padding: 0 10px\">\n<div class=\"image-container-brizy\" style=\"margin-bottom: 4px;border-radius: 6px;overflow: hidden;display: flex;justify-content: center;align-items: center\">\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/DESAYUNO.png\" alt=\"Brunch\" style=\"width: 100%;max-height: 140px;object-fit: contain;display: block;border-radius: 6px\">\n <\/div>\n<h2 style=\"font-family: 'Poppins', sans-serif;font-weight: 600;color: #E5D9C9;font-size: 1.5rem;margin-bottom: 6px;letter-spacing: 0.5px;margin-top: 0\">Brunch<\/h2>\n<p> <!-- ENLACE MODIFICADO --><br \/>\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: inline-block;background-color: transparent;color: #E5D9C9;border: 1.5px solid #E5D9C9;padding: 4px 16px;text-decoration: none;font-family: 'Poppins', sans-serif;font-weight: 500;border-radius: 15px;font-size: 0.8rem;width: fit-content;margin: 0 auto;min-width: 100px\">Ver men\u00fa<\/a>\n <\/div>\n<p> <!-- Almuerzos --><\/p>\n<div class=\"menu-card-brizy\" style=\"flex: 1;min-width: 280px;max-width: 350px;text-align: center;padding: 0 10px\">\n<div class=\"image-container-brizy\" style=\"margin-bottom: 4px;border-radius: 6px;overflow: hidden;display: flex;justify-content: center;align-items: center\">\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/ALMUERZO.png\" alt=\"Almuerzos\" style=\"width: 100%;max-height: 140px;object-fit: contain;display: block;border-radius: 6px\">\n <\/div>\n<h2 style=\"font-family: 'Poppins', sans-serif;font-weight: 600;color: #E5D9C9;font-size: 1.5rem;margin-bottom: 6px;letter-spacing: 0.5px;margin-top: 0\">Almuerzos<\/h2>\n<p> <!-- ENLACE MODIFICADO --><br \/>\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: inline-block;background-color: transparent;color: #E5D9C9;border: 1.5px solid #E5D9C9;padding: 4px 16px;text-decoration: none;font-family: 'Poppins', sans-serif;font-weight: 500;border-radius: 15px;font-size: 0.8rem;width: fit-content;margin: 0 auto;min-width: 100px\">Ver men\u00fa<\/a>\n <\/div>\n<p> <!-- Bebidas --><\/p>\n<div class=\"menu-card-brizy\" style=\"flex: 1;min-width: 280px;max-width: 350px;text-align: center;padding: 0 10px\">\n<div class=\"image-container-brizy\" style=\"margin-bottom: 4px;border-radius: 6px;overflow: hidden;display: flex;justify-content: center;align-items: center\">\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/Captura-de-pantalla-2025-12-05-a-las-1.55.31-p.m.png\" alt=\"Bebidas\" style=\"width: 100%;max-height: 140px;object-fit: contain;display: block;border-radius: 6px\">\n <\/div>\n<h2 style=\"font-family: 'Poppins', sans-serif;font-weight: 600;color: #E5D9C9;font-size: 1.5rem;margin-bottom: 6px;letter-spacing: 0.5px;margin-top: 0\">Bebidas<\/h2>\n<p> <!-- ENLACE MODIFICADO --><br \/>\n <a href=\"https:\/\/www.dandre.com.co\/index.php\/menu-del-dia\/\" style=\"display: inline-block;background-color: transparent;color: #E5D9C9;border: 1.5px solid #E5D9C9;padding: 4px 16px;text-decoration: none;font-family: 'Poppins', sans-serif;font-weight: 500;border-radius: 15px;font-size: 0.8rem;width: fit-content;margin: 0 auto;min-width: 100px\">Ver men\u00fa<\/a>\n <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/div>\n<p> .menu-card-brizy a:hover {<br \/>\n background-color: #E5D9C9;<br \/>\n color: #1A3E5F;<br \/>\n transform: translateY(-1px);<br \/>\n }<\/p>\n<p> \/* Asegurar que todo quede alineado verticalmente *\/<br \/>\n .menu-card-brizy {<br \/>\n display: flex;<br \/>\n flex-direction: column;<br \/>\n justify-content: flex-start;<br \/>\n }<\/p>\n<p> @media (max-width: 1200px) {<br \/>\n .menu-card-brizy {<br \/>\n max-width: 320px !important;<br \/>\n }<\/p>\n<p> .image-container-brizy img {<br \/>\n max-height: 130px !important;<br \/>\n }<\/p>\n<p> .menu-card-brizy a {<br \/>\n padding: 3px 14px !important;<br \/>\n font-size: 0.75rem !important;<br \/>\n min-width: 90px !important;<br \/>\n border-radius: 14px !important;<br \/>\n }<\/p>\n<p> .image-container-brizy {<br \/>\n margin-bottom: 3px !important;<br \/>\n }<\/p>\n<p> h2 {<br \/>\n margin-bottom: 5px !important;<br \/>\n }<br \/>\n }<\/p>\n<p> @media (max-width: 992px) {<br \/>\n .menu-section-brizy {<br \/>\n padding: 18px 0 !important;<br \/>\n }<\/p>\n<p> .menu-cards-container-brizy {<br \/>\n gap: 20px;<br \/>\n }<\/p>\n<p> .menu-card-brizy {<br \/>\n max-width: 300px !important;<br \/>\n min-width: 250px !important;<br \/>\n }<\/p>\n<p> .image-container-brizy img {<br \/>\n max-height: 120px !important;<br \/>\n }<\/p>\n<p> h2 {<br \/>\n font-size: 1.4rem !important;<br \/>\n margin-bottom: 4px !important;<br \/>\n }<\/p>\n<p> .menu-card-brizy a {<br \/>\n padding: 3px 12px !important;<br \/>\n font-size: 0.75rem !important;<br \/>\n min-width: 85px !important;<br \/>\n border-radius: 12px !important;<br \/>\n border-width: 1px !important;<br \/>\n }<\/p>\n<p> .image-container-brizy {<br \/>\n margin-bottom: 2px !important;<br \/>\n }<br \/>\n }<\/p>\n<p> @media (max-width: 768px) {<br \/>\n .menu-section-brizy {<br \/>\n padding: 15px 0 !important;<br \/>\n }<\/p>\n<p> .menu-cards-container-brizy {<br \/>\n flex-direction: column;<br \/>\n align-items: center;<br \/>\n gap: 25px;<br \/>\n }<\/p>\n<p> .menu-card-brizy {<br \/>\n max-width: 100% !important;<br \/>\n min-width: 250px !important;<br \/>\n padding: 0 15px !important;<br \/>\n }<\/p>\n<p> .image-container-brizy img {<br \/>\n max-height: 120px !important;<br \/>\n }<\/p>\n<p> h2 {<br \/>\n font-size: 1.4rem !important;<br \/>\n margin-bottom: 4px !important;<br \/>\n }<\/p>\n<p> .menu-card-brizy a {<br \/>\n padding: 3px 14px !important;<br \/>\n font-size: 0.75rem !important;<br \/>\n min-width: 85px !important;<br \/>\n border-radius: 12px !important;<br \/>\n border-width: 1px !important;<br \/>\n }<\/p>\n<p> .image-container-brizy {<br \/>\n margin-bottom: 2px !important;<br \/>\n }<br \/>\n }<\/p>\n<p> @media (max-width: 480px) {<br \/>\n .menu-section-brizy {<br \/>\n padding: 12px 0 !important;<br \/>\n }<\/p>\n<p> .image-container-brizy img {<br \/>\n max-height: 110px !important;<br \/>\n }<\/p>\n<p> h2 {<br \/>\n font-size: 1.3rem !important;<br \/>\n margin-bottom: 3px !important;<br \/>\n }<\/p>\n<p> .menu-card-brizy a {<br \/>\n padding: 2px 10px !important;<br \/>\n font-size: 0.7rem !important;<br \/>\n min-width: 80px !important;<br \/>\n border-radius: 10px !important;<br \/>\n border-width: 1px !important;<br \/>\n }<\/p>\n<p> .menu-card-brizy {<br \/>\n padding: 0 10px !important;<br \/>\n }<\/p>\n<p> .image-container-brizy {<br \/>\n margin-bottom: 1px !important;<br \/>\n }<br \/>\n }\n<\/p><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n<section id=\"lvx3wMCLZMZp_lvx3wMCLZMZp\" class=\"brz-section brz-css-d-section brz-css-u77rr3\">\n<div class=\"brz-section__content brz-section--boxed brz-css-d-sectionitem-bg brz-css-16177jw\" data-brz-custom-id=\"jyWVeS6aWsRW\">\n<div class=\"brz-container brz-css-d-sectionitem-container brz-css-kfd99x\">\n<div id=\"\" class=\"brz-css-d-wrapper brz-css-17xihok brz-wrapper\">\n<div class=\"brz-wp-shortcode brz-css-d-wpcustomshortcode brz-css-pdrlbq\" data-brz-custom-id=\"sssE3h5Rxcdq\">\n<div>\n<p> <title>Carrusel 3D Best Sellers<\/title><\/p>\n<p> * {<br \/>\n margin: 0;<br \/>\n padding: 0;<br \/>\n box-sizing: border-box;<br \/>\n }<\/p>\n<p> body {<br \/>\n background-color: #ffffff;<br \/>\n font-family: ‘Helvetica’, Arial, sans-serif;<br \/>\n padding: 20px;<br \/>\n overflow-x: hidden;<br \/>\n }<\/p>\n<p> .best-sellers-container {<br \/>\n max-width: 1400px;<br \/>\n margin: 0 auto;<br \/>\n text-align: center;<br \/>\n padding: 20px 20px;<br \/>\n }<\/p>\n<p> .title {<br \/>\n font-family: ‘Helvetica’, Arial, sans-serif;<br \/>\n font-weight: bold;<br \/>\n color: #1A3E5F;<br \/>\n font-size: 2.5rem;<br \/>\n margin-bottom: 10px;<br \/>\n text-transform: uppercase;<br \/>\n letter-spacing: 1.5px;<br \/>\n }<\/p>\n<p> .carousel-container {<br \/>\n position: relative;<br \/>\n width: 100%;<br \/>\n height: 550px;<br \/>\n margin: 0 auto;<br \/>\n overflow: hidden;<br \/>\n }<\/p>\n<p> .carousel-track {<br \/>\n position: relative;<br \/>\n width: 100%;<br \/>\n height: 100%;<br \/>\n }<\/p>\n<p> .carousel-item {<br \/>\n position: absolute;<br \/>\n overflow: hidden;<br \/>\n box-shadow: 0 10px 30px rgba(0,0,0,0.15);<br \/>\n cursor: pointer;<br \/>\n transition: all 0.8s ease;<br \/>\n }<\/p>\n<p> .carousel-item img {<br \/>\n width: 100%;<br \/>\n height: 100%;<br \/>\n object-fit: cover;<br \/>\n display: block;<br \/>\n }<\/p>\n<p> \/* Posiciones iniciales – CONTENEDORES M\u00c1S ANCHOS *\/<br \/>\n .item1 {<br \/>\n width: 600px;<br \/>\n height: 385px;<br \/>\n left: 50%;<br \/>\n top: 50%;<br \/>\n transform: translate(-50%, -50%);<br \/>\n z-index: 5;<br \/>\n opacity: 1;<br \/>\n }<\/p>\n<p> .item2 {<br \/>\n width: 460px;<br \/>\n height: 286px;<br \/>\n left: 65%;<br \/>\n top: 50%;<br \/>\n transform: translate(-50%, -50%);<br \/>\n zIndex: 4;<br \/>\n opacity: 0.7;<br \/>\n }<\/p>\n<p> .item3 {<br \/>\n width: 360px;<br \/>\n height: 231px;<br \/>\n left: 60%;<br \/>\n top: 25%;<br \/>\n transform: translateX(-50%);<br \/>\n z-index: 3;<br \/>\n opacity: 0.4;<br \/>\n }<\/p>\n<p> .item4 {<br \/>\n width: 360px;<br \/>\n height: 231px;<br \/>\n left: 40%;<br \/>\n top: 25%;<br \/>\n transform: translateX(-50%);<br \/>\n z-index: 3;<br \/>\n opacity: 0.4;<br \/>\n }<\/p>\n<p> .item5 {<br \/>\n width: 460px;<br \/>\n height: 286px;<br \/>\n left: 35%;<br \/>\n top: 50%;<br \/>\n transform: translate(-50%, -50%);<br \/>\n z-index: 4;<br \/>\n opacity: 0.7;<br \/>\n }<\/p>\n<p> \/* Indicadores *\/<br \/>\n .indicators {<br \/>\n margin-top: 10px;<br \/>\n display: flex;<br \/>\n justify-content: center;<br \/>\n gap: 12px;<br \/>\n }<\/p>\n<p> .indicator {<br \/>\n width: 14px;<br \/>\n height: 14px;<br \/>\n border-radius: 50%;<br \/>\n background-color: #E5D9C9;<br \/>\n cursor: pointer;<br \/>\n transition: background-color 0.3s ease;<br \/>\n }<\/p>\n<p> .indicator.active {<br \/>\n background-color: #1A3E5F;<br \/>\n }<\/p>\n<p> \/* Responsive – Ajustado para contenedores m\u00e1s anchos *\/<br \/>\n @media (max-width: 1200px) {<br \/>\n .carousel-container { height: 495px; }<br \/>\n .item1 { width: 540px; height: 346.5px; }<br \/>\n .item2, .item5 { width: 414px; height: 258.5px; }<br \/>\n .item3, .item4 { width: 324px; height: 198px; }<br \/>\n }<\/p>\n<p> @media (max-width: 992px) {<br \/>\n .title { font-size: 2.2rem; margin-bottom: 8px; }<br \/>\n .carousel-container { height: 440px; }<br \/>\n .item1 { width: 480px; height: 308px; }<br \/>\n .item2, .item5 { width: 368px; height: 231px; }<br \/>\n .item3, .item4 { width: 288px; height: 176px; }<br \/>\n }<\/p>\n<p> @media (max-width: 768px) {<br \/>\n .title { font-size: 1.8rem; margin-bottom: 5px; }<br \/>\n .carousel-container { height: 396px; }<br \/>\n .item1 { width: 420px; height: 269.5px; }<br \/>\n .item2 { left: 67%; width: 322px; height: 209px; }<br \/>\n .item5 { left: 33%; width: 322px; height: 209px; }<br \/>\n .item3 { left: 62%; width: 252px; height: 159.5px; }<br \/>\n .item4 { left: 38%; width: 252px; height: 159.5px; }<br \/>\n }<\/p>\n<p> @media (max-width: 576px) {<br \/>\n .best-sellers-container { padding: 15px 10px; }<br \/>\n .title { font-size: 1.5rem; margin-bottom: 5px; }<br \/>\n .carousel-container { height: 352px; }<br \/>\n .item1 { width: 360px; height: 231px; }<br \/>\n .item2 { left: 68%; width: 276px; height: 176px; }<br \/>\n .item5 { left: 32%; width: 276px; height: 176px; }<br \/>\n .item3 { left: 64%; width: 216px; height: 132px; }<br \/>\n .item4 { left: 36%; width: 216px; height: 132px; }<br \/>\n .indicators { margin-top: 8px; }<br \/>\n }<\/p>\n<div class=\"best-sellers-container\">\n<h1 class=\"title\">BEST SELLERS<\/h1>\n<div class=\"carousel-container\">\n<div class=\"carousel-track\">\n <!-- Imagen 1 --><\/p>\n<div class=\"carousel-item item1\" data-index=\"0\">\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/1-1.png\" alt=\"Best Seller 1\">\n <\/div>\n<p> <!-- Imagen 2 --><\/p>\n<div class=\"carousel-item item2\" data-index=\"1\">\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/2-1.png\" alt=\"Best Seller 2\">\n <\/div>\n<p> <!-- Imagen 3 --><\/p>\n<div class=\"carousel-item item3\" data-index=\"2\">\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/3-1.png\" alt=\"Best Seller 3\">\n <\/div>\n<p> <!-- Imagen 4 --><\/p>\n<div class=\"carousel-item item4\" data-index=\"3\">\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/4-2.png\" alt=\"Best Seller 4\">\n <\/div>\n<p> <!-- Imagen 5 --><\/p>\n<div class=\"carousel-item item5\" data-index=\"4\">\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/5-2.png\" alt=\"Best Seller 5\">\n <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"indicators\">\n<div class=\"indicator active\" data-index=\"0\"><\/div>\n<div class=\"indicator\" data-index=\"1\"><\/div>\n<div class=\"indicator\" data-index=\"2\"><\/div>\n<div class=\"indicator\" data-index=\"3\"><\/div>\n<div class=\"indicator\" data-index=\"4\"><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> document.addEventListener(‘DOMContentLoaded’, function() {<br \/>\n const items = document.querySelectorAll(‘.carousel-item’);<br \/>\n const indicators = document.querySelectorAll(‘.indicator’);<br \/>\n let currentIndex = 0;<br \/>\n let autoRotateInterval;<\/p>\n<p> \/\/ Mapa de posiciones para cada \u00edndice – CONTENEDORES M\u00c1S ANCHOS<br \/>\n const positions = [<br \/>\n { \/\/ Posici\u00f3n 0 – Centro<br \/>\n width: ‘600px’, height: ‘385px’,<br \/>\n left: ‘50%’, top: ‘50%’,<br \/>\n transform: ‘translate(-50%, -50%)’,<br \/>\n zIndex: 5, opacity: 1<br \/>\n },<br \/>\n { \/\/ Posici\u00f3n 1 – Derecha (15% desde el centro)<br \/>\n width: ‘460px’, height: ‘286px’,<br \/>\n left: ‘65%’, top: ‘50%’,<br \/>\n transform: ‘translate(-50%, -50%)’,<br \/>\n zIndex: 4, opacity: 0.7<br \/>\n },<br \/>\n { \/\/ Posici\u00f3n 2 – Arriba derecha (10% desde el centro)<br \/>\n width: ‘360px’, height: ‘231px’,<br \/>\n left: ‘60%’, top: ‘25%’,<br \/>\n transform: ‘translateX(-50%)’,<br \/>\n zIndex: 3, opacity: 0.4<br \/>\n },<br \/>\n { \/\/ Posici\u00f3n 3 – Arriba izquierda (10% desde el centro)<br \/>\n width: ‘360px’, height: ‘231px’,<br \/>\n left: ‘40%’, top: ‘25%’,<br \/>\n transform: ‘translateX(-50%)’,<br \/>\n zIndex: 3, opacity: 0.4<br \/>\n },<br \/>\n { \/\/ Posici\u00f3n 4 – Izquierda (15% desde el centro)<br \/>\n width: ‘460px’, height: ‘286px’,<br \/>\n left: ‘35%’, top: ‘50%’,<br \/>\n transform: ‘translate(-50%, -50%)’,<br \/>\n zIndex: 4, opacity: 0.7<br \/>\n }<br \/>\n ];<\/p>\n<p> \/\/ Funci\u00f3n para actualizar las posiciones de las im\u00e1genes<br \/>\n function updatePositions() {<br \/>\n \/\/ Asignar posici\u00f3n a cada imagen basado en su \u00edndice actual<br \/>\n items.forEach((item, i) => {<br \/>\n const posIndex = (i – currentIndex + 5) % 5;<br \/>\n const pos = positions[posIndex];<\/p>\n<p> item.style.width = pos.width;<br \/>\n item.style.height = pos.height;<br \/>\n item.style.left = pos.left;<br \/>\n item.style.top = pos.top;<br \/>\n item.style.transform = pos.transform;<br \/>\n item.style.zIndex = pos.zIndex;<br \/>\n item.style.opacity = pos.opacity;<br \/>\n });<\/p>\n<p> \/\/ Actualizar indicadores<br \/>\n indicators.forEach((indicator, i) => {<br \/>\n if (i === currentIndex) {<br \/>\n indicator.classList.add(‘active’);<br \/>\n } else {<br \/>\n indicator.classList.remove(‘active’);<br \/>\n }<br \/>\n });<br \/>\n }<\/p>\n<p> \/\/ Funci\u00f3n para rotar al siguiente<br \/>\n function rotateNext() {<br \/>\n currentIndex = (currentIndex + 1) % 5;<br \/>\n updatePositions();<br \/>\n }<\/p>\n<p> \/\/ Iniciar rotaci\u00f3n autom\u00e1tica cada 3 segundos<br \/>\n function startAutoRotate() {<br \/>\n autoRotateInterval = setInterval(rotateNext, 3000);<br \/>\n }<\/p>\n<p> \/\/ Detener rotaci\u00f3n autom\u00e1tica<br \/>\n function stopAutoRotate() {<br \/>\n clearInterval(autoRotateInterval);<br \/>\n }<\/p>\n<p> \/\/ Click en indicadores<br \/>\n indicators.forEach((indicator) => {<br \/>\n indicator.addEventListener(‘click’, function() {<br \/>\n const index = parseInt(this.getAttribute(‘data-index’));<br \/>\n if (index !== currentIndex) {<br \/>\n currentIndex = index;<br \/>\n updatePositions();<br \/>\n }<br \/>\n });<br \/>\n });<\/p>\n<p> \/\/ Pausar al hacer hover<br \/>\n const carousel = document.querySelector(‘.carousel-container’);<br \/>\n carousel.addEventListener(‘mouseenter’, stopAutoRotate);<br \/>\n carousel.addEventListener(‘mouseleave’, startAutoRotate);<\/p>\n<p> \/\/ Inicializar<br \/>\n updatePositions();<br \/>\n startAutoRotate();<\/p>\n<p> \/\/ Actualizar posiciones responsive<br \/>\n function updateResponsivePositions() {<br \/>\n const width = window.innerWidth;<\/p>\n<p> \/\/ Ajustar valores para diferentes tama\u00f1os de pantalla<br \/>\n if (width 992) {<br \/>\n positions[0].width = ‘540px’; positions[0].height = ‘346.5px’;<br \/>\n positions[1].width = ‘414px’; positions[1].height = ‘258.5px’; positions[1].left = ‘65%’;<br \/>\n positions[4].width = ‘414px’; positions[4].height = ‘258.5px’; positions[4].left = ‘35%’;<br \/>\n positions[2].width = ‘324px’; positions[2].height = ‘198px’; positions[2].left = ‘60%’;<br \/>\n positions[3].width = ‘324px’; positions[3].height = ‘198px’; positions[3].left = ‘40%’;<br \/>\n } else if (width 768) {<br \/>\n positions[0].width = ‘480px’; positions[0].height = ‘308px’;<br \/>\n positions[1].width = ‘368px’; positions[1].height = ‘231px’; positions[1].left = ‘65%’;<br \/>\n positions[4].width = ‘368px’; positions[4].height = ‘231px’; positions[4].left = ‘35%’;<br \/>\n positions[2].width = ‘288px’; positions[2].height = ‘176px’; positions[2].left = ‘60%’;<br \/>\n positions[3].width = ‘288px’; positions[3].height = ‘176px’; positions[3].left = ‘40%’;<br \/>\n } else if (width 576) {<br \/>\n positions[0].width = ‘420px’; positions[0].height = ‘269.5px’;<br \/>\n positions[1].width = ‘322px’; positions[1].height = ‘209px’; positions[1].left = ‘67%’;<br \/>\n positions[4].width = ‘322px’; positions[4].height = ‘209px’; positions[4].left = ‘33%’;<br \/>\n positions[2].width = ‘252px’; positions[2].height = ‘159.5px’; positions[2].left = ‘62%’;<br \/>\n positions[3].width = ‘252px’; positions[3].height = ‘159.5px’; positions[3].left = ‘38%’;<br \/>\n } else if (width <= 576) {<br \/>\n positions[0].width = '360px'; positions[0].height = '231px';<br \/>\n positions[1].width = '276px'; positions[1].height = '176px'; positions[1].left = '68%';<br \/>\n positions[4].width = '276px'; positions[4].height = '176px'; positions[4].left = '32%';<br \/>\n positions[2].width = '216px'; positions[2].height = '132px'; positions[2].left = '64%';<br \/>\n positions[3].width = '216px'; positions[3].height = '132px'; positions[3].left = '36%';<br \/>\n } else {<br \/>\n \/\/ Valores por defecto<br \/>\n positions[0].width = '600px'; positions[0].height = '385px';<br \/>\n positions[1].width = '460px'; positions[1].height = '286px'; positions[1].left = '65%';<br \/>\n positions[4].width = '460px'; positions[4].height = '286px'; positions[4].left = '35%';<br \/>\n positions[2].width = '360px'; positions[2].height = '231px'; positions[2].left = '60%';<br \/>\n positions[3].width = '360px'; positions[3].height = '231px'; positions[3].left = '40%';<br \/>\n }<\/p>\n<p> updatePositions();<br \/>\n }<\/p>\n<p> \/\/ Escuchar cambios de tama\u00f1o<br \/>\n window.addEventListener('resize', updateResponsivePositions);<br \/>\n });<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n<section id=\"drulpdQQ06GN_drulpdQQ06GN\" class=\"brz-section brz-css-d-section brz-css-wbcdf\">\n<div class=\"brz-section__content brz-section--boxed brz-css-d-sectionitem-bg brz-css-ki39le\" data-brz-custom-id=\"r_dhnwJ8yk_J\">\n<div class=\"brz-container brz-css-d-sectionitem-container brz-css-usaokj\"><\/div>\n<\/div>\n<\/section>\n<section id=\"yAeAMzYgVFW0_yAeAMzYgVFW0\" class=\"brz-section brz-css-d-section brz-css-18n3qi3\">\n<div class=\"brz-section__content brz-section--boxed brz-css-d-sectionitem-bg brz-css-1qgq5sb\" data-brz-custom-id=\"xp2kEvPqCdSw\">\n<div class=\"brz-container brz-css-d-sectionitem-container brz-css-vny7hd\">\n<div id=\"\" class=\"brz-css-d-wrapper brz-css-6pyjq2 brz-wrapper\">\n<div class=\"brz-wp-shortcode brz-css-d-wpcustomshortcode brz-css-17hlve3\" data-brz-custom-id=\"eN3p84NcMK_M\">\n<div>\n<div class=\"vertical-expand-carousel\">\n <!-- Carrusel de reviews con textos expandibles --><\/p>\n<div class=\"carousel-expand-wrapper\">\n<div class=\"track-expand\">\n <!-- Review 1 --><\/p>\n<div class=\"card-expand\" data-full-text=\"Excelente restaurante para almorzar. Muy amables y cordiales para atender. La comida es muy buena, de calidad. Lo mejor es el men\u00fa que incluye sopa y jugo. Es un buen precio por una buena comida. Muchas gracias!\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">F<\/div>\n<div class=\"name-expand\">Felipe del Solar<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Excelente restaurante para almorzar. Muy amables y cordiales para atender…”<\/p>\n<p class=\"full-text\">“Excelente restaurante para almorzar. Muy amables y cordiales para atender. La comida es muy buena, de calidad. Lo mejor es el men\u00fa que incluye sopa y jugo. Es un buen precio por una buena comida. Muchas gracias!”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 2 semanas<\/div>\n<\/p><\/div>\n<p> <!-- Review 2 --><\/p>\n<div class=\"card-expand\" data-full-text=\"\u00a1Un lugar genial! Solemos venir a desayunar, pero el almuerzo tambi\u00e9n es genial. Siempre comemos aqu\u00ed varias veces cuando visitamos Medell\u00edn.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">D<\/div>\n<div class=\"name-expand\">Daniel Vining<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“\u00a1Un lugar genial! Solemos venir a desayunar, pero el almuerzo tambi\u00e9n es genial…”<\/p>\n<p class=\"full-text\">“\u00a1Un lugar genial! Solemos venir a desayunar, pero el almuerzo tambi\u00e9n es genial. Siempre comemos aqu\u00ed varias veces cuando visitamos Medell\u00edn.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 1 mes<\/div>\n<\/p><\/div>\n<p> <!-- Review 3 --><\/p>\n<div class=\"card-expand\" data-full-text=\"Un lugar incre\u00edble para brunch y almuerzo. El servicio y el personal son fabulosos. Comida deliciosa.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">S<\/div>\n<div class=\"name-expand\">Samantha Gomez<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Un lugar incre\u00edble para brunch y almuerzo. El servicio y el personal son fabulosos…”<\/p>\n<p class=\"full-text\">“Un lugar incre\u00edble para brunch y almuerzo. El servicio y el personal son fabulosos. Comida deliciosa.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 3 semanas<\/div>\n<\/p><\/div>\n<p> <!-- Review 4 --><\/p>\n<div class=\"card-expand\" data-full-text=\"El solomito en salsa de champi\u00f1ones fue espectacular. Muchas gracias. La remodelaci\u00f3n les qued\u00f3 muy bien.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">O<\/div>\n<div class=\"name-expand\">Omar Rueda<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“El solomito en salsa de champi\u00f1ones fue espectacular. Muchas gracias…”<\/p>\n<p class=\"full-text\">“El solomito en salsa de champi\u00f1ones fue espectacular. Muchas gracias. La remodelaci\u00f3n les qued\u00f3 muy bien.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 2 meses<\/div>\n<\/p><\/div>\n<p> <!-- Review 5 --><\/p>\n<div class=\"card-expand\" data-full-text=\"Tan bueno, tan fresco y un servicio incre\u00edble.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">H<\/div>\n<div class=\"name-expand\">Herminia Vaz<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Tan bueno, tan fresco y un servicio incre\u00edble.”<\/p>\n<p class=\"full-text\">“Tan bueno, tan fresco y un servicio incre\u00edble.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 1 mes<\/div>\n<\/p><\/div>\n<p> <!-- Review 6 --><\/p>\n<div class=\"card-expand\" data-full-text=\"Los pancakes estaban incre\u00edbles!\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">M<\/div>\n<div class=\"name-expand\">Miguel A.<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Los pancakes estaban incre\u00edbles!”<\/p>\n<p class=\"full-text\">“Los pancakes estaban incre\u00edbles!”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 3 semanas<\/div>\n<\/p><\/div>\n<p> <!-- Review 7 --><\/p>\n<div class=\"card-expand\" data-full-text=\"Excelente lugar para desayunar, limpio tranquilo y la atenci\u00f3n de Andreina fue genial. 10000% recomendado.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">J<\/div>\n<div class=\"name-expand\">Johan Reyes<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Excelente lugar para desayunar, limpio tranquilo y la atenci\u00f3n de Andreina fue genial…”<\/p>\n<p class=\"full-text\">“Excelente lugar para desayunar, limpio tranquilo y la atenci\u00f3n de Andreina fue genial. 10000% recomendado.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 2 semanas<\/div>\n<\/p><\/div>\n<p> <!-- NUEVOS REVIEWS A PARTIR DE AQU\u00cd --><\/p>\n<p> <!-- Review 8 - Rod Major --><\/p>\n<div class=\"card-expand\" data-full-text=\"Excellent stop in Poblado\/Provenza area of Medell\u00edn. Broad menu and very attentive staff.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">R<\/div>\n<div class=\"name-expand\">Rod Major<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Excellent stop in Poblado\/Provenza area of Medell\u00edn. Broad menu and very attentive staff…”<\/p>\n<p class=\"full-text\">“Excellent stop in Poblado\/Provenza area of Medell\u00edn. Broad menu and very attentive staff.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 3 semanas<\/div>\n<\/p><\/div>\n<p> <!-- Review 9 - Danny Teklehaimanot --><\/p>\n<div class=\"card-expand\" data-full-text=\"You have to check this place for brunch or lunch if you are in Medellin.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">D<\/div>\n<div class=\"name-expand\">Danny Teklehaimanot<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“You have to check this place for brunch or lunch if you are in Medellin…”<\/p>\n<p class=\"full-text\">“You have to check this place for brunch or lunch if you are in Medellin.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 3 semanas<\/div>\n<\/p><\/div>\n<p> <!-- Review 10 - Daniel --><\/p>\n<div class=\"card-expand\" data-full-text=\"Excelente servicio por parte del personal del restaurante, la comida se sirvi\u00f3 r\u00e1pidamente y estaba bien cocinada, el mejor caf\u00e9 hasta ahora.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">D<\/div>\n<div class=\"name-expand\">Daniel<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Excelente servicio por parte del personal del restaurante, la comida se sirvi\u00f3 r\u00e1pidamente…”<\/p>\n<p class=\"full-text\">“Excelente servicio por parte del personal del restaurante, la comida se sirvi\u00f3 r\u00e1pidamente y estaba bien cocinada, el mejor caf\u00e9 hasta ahora.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 3 semanas<\/div>\n<\/p><\/div>\n<p> <!-- Review 11 - Alejandra Rueda --><\/p>\n<div class=\"card-expand\" data-full-text=\"Dandre Gourmet es de los mejores restaurantes en Medell\u00edn. La comida es deliciosa, con una presentaci\u00f3n impecable y un servicio s\u00faper c\u00e1lido. Tiene opciones muy completas y frescas, ideales si buscas restaurantes saludables en la zona. Perfecto para celebrar cumplea\u00f1os o cualquier ocasi\u00f3n especial. Sin duda uno de los restaurantes gourmet que m\u00e1s vale la pena en El Poblado.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">A<\/div>\n<div class=\"name-expand\">Alejandra Rueda<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Dandre Gourmet es de los mejores restaurantes en Medell\u00edn. La comida es deliciosa, con una presentaci\u00f3n impecable…”<\/p>\n<p class=\"full-text\">“Dandre Gourmet es de los mejores restaurantes en Medell\u00edn. La comida es deliciosa, con una presentaci\u00f3n impecable y un servicio s\u00faper c\u00e1lido. Tiene opciones muy completas y frescas, ideales si buscas restaurantes saludables en la zona. Perfecto para celebrar cumplea\u00f1os o cualquier ocasi\u00f3n especial. Sin duda uno de los restaurantes gourmet que m\u00e1s vale la pena en El Poblado.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 1 d\u00eda<\/div>\n<\/p><\/div>\n<p> <!-- Review 12 - Genet Pierre --><\/p>\n<div class=\"card-expand\" data-full-text=\"Awesome atmosphere and service!! Food is amazing! I visit every time I'm here!\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">G<\/div>\n<div class=\"name-expand\">Genet Pierre<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Awesome atmosphere and service!! Food is amazing! I visit every time I’m here!…”<\/p>\n<p class=\"full-text\">“Awesome atmosphere and service!! Food is amazing! I visit every time I’m here!”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 3 semanas<\/div>\n<\/p><\/div>\n<p> <!-- Review 13 - Shane Rice --><\/p>\n<div class=\"card-expand\" data-full-text=\"This place is an absolute gem! The food was amazing and the service was great.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">S<\/div>\n<div class=\"name-expand\">Shane Rice<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“This place is an absolute gem! The food was amazing and the service was great…”<\/p>\n<p class=\"full-text\">“This place is an absolute gem! The food was amazing and the service was great.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 3 semanas<\/div>\n<\/p><\/div>\n<p> <!-- Review 14 - Shawn Holloway --><\/p>\n<div class=\"card-expand\" data-full-text=\"Good american breakfast, when I visit Medell\u00edn I always come here for breakfast.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">S<\/div>\n<div class=\"name-expand\">Shawn Holloway<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Good american breakfast, when I visit Medell\u00edn I always come here for breakfast…”<\/p>\n<p class=\"full-text\">“Good american breakfast, when I visit Medell\u00edn I always come here for breakfast.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 3 semanas<\/div>\n<\/p><\/div>\n<p> <!-- PRIMER DUPLICADO PARA EFECTO LOOP INFINITO EN DESKTOP --><\/p>\n<div class=\"card-expand\" data-full-text=\"Excelente restaurante para almorzar. Muy amables y cordiales para atender. La comida es muy buena, de calidad. Lo mejor es el men\u00fa que incluye sopa y jugo. Es un buen precio por una buena comida. Muchas gracias!\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">F<\/div>\n<div class=\"name-expand\">Felipe del Solar<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Excelente restaurante para almorzar. Muy amables y cordiales para atender…”<\/p>\n<p class=\"full-text\">“Excelente restaurante para almorzar. Muy amables y cordiales para atender. La comida es muy buena, de calidad. Lo mejor es el men\u00fa que incluye sopa y jugo. Es un buen precio por una buena comida. Muchas gracias!”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 2 semanas<\/div>\n<\/p><\/div>\n<div class=\"card-expand\" data-full-text=\"\u00a1Un lugar genial! Solemos venir a desayunar, pero el almuerzo tambi\u00e9n es genial. Siempre comemos aqu\u00ed varias veces cuando visitamos Medell\u00edn.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">D<\/div>\n<div class=\"name-expand\">Daniel Vining<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“\u00a1Un lugar genial! Solemos venir a desayunar, pero el almuerzo tambi\u00e9n es genial…”<\/p>\n<p class=\"full-text\">“\u00a1Un lugar genial! Solemos venir a desayunar, pero el almuerzo tambi\u00e9n es genial. Siempre comemos aqu\u00ed varias veces cuando visitamos Medell\u00edn.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 1 mes<\/div>\n<\/p><\/div>\n<div class=\"card-expand\" data-full-text=\"Un lugar incre\u00edble para brunch y almuerzo. El servicio y el personal son fabulosos. Comida deliciosa.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">S<\/div>\n<div class=\"name-expand\">Samantha Gomez<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Un lugar incre\u00edble para brunch y almuerzo. El servicio y el personal son fabulosos…”<\/p>\n<p class=\"full-text\">“Un lugar incre\u00edble para brunch y almuerzo. El servicio y el personal son fabulosos. Comida deliciosa.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 3 semanas<\/div>\n<\/p><\/div>\n<div class=\"card-expand\" data-full-text=\"El solomito en salsa de champi\u00f1ones fue espectacular. Muchas gracias. La remodelaci\u00f3n les qued\u00f3 muy bien.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">O<\/div>\n<div class=\"name-expand\">Omar Rueda<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“El solomito en salsa de champi\u00f1ones fue espectacular. Muchas gracias…”<\/p>\n<p class=\"full-text\">“El solomito en salsa de champi\u00f1ones fue espectacular. Muchas gracias. La remodelaci\u00f3n les qued\u00f3 muy bien.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 2 meses<\/div>\n<\/p><\/div>\n<div class=\"card-expand\" data-full-text=\"Tan bueno, tan fresco y un servicio incre\u00edble.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">H<\/div>\n<div class=\"name-expand\">Herminia Vaz<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Tan bueno, tan fresco y un servicio incre\u00edble.”<\/p>\n<p class=\"full-text\">“Tan bueno, tan fresco y un servicio incre\u00edble.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 1 mes<\/div>\n<\/p><\/div>\n<div class=\"card-expand\" data-full-text=\"Los pancakes estaban incre\u00edbles!\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">M<\/div>\n<div class=\"name-expand\">Miguel A.<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Los pancakes estaban incre\u00edbles!”<\/p>\n<p class=\"full-text\">“Los pancakes estaban incre\u00edbles!”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 3 semanas<\/div>\n<\/p><\/div>\n<div class=\"card-expand\" data-full-text=\"Excelente lugar para desayunar, limpio tranquilo y la atenci\u00f3n de Andreina fue genial. 10000% recomendado.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">J<\/div>\n<div class=\"name-expand\">Johan Reyes<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Excelente lugar para desayunar, limpio tranquilo y la atenci\u00f3n de Andreina fue genial…”<\/p>\n<p class=\"full-text\">“Excelente lugar para desayunar, limpio tranquilo y la atenci\u00f3n de Andreina fue genial. 10000% recomendado.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 2 semanas<\/div>\n<\/p><\/div>\n<div class=\"card-expand\" data-full-text=\"Excellent stop in Poblado\/Provenza area of Medell\u00edn. Broad menu and very attentive staff.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">R<\/div>\n<div class=\"name-expand\">Rod Major<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Excellent stop in Poblado\/Provenza area of Medell\u00edn. Broad menu and very attentive staff…”<\/p>\n<p class=\"full-text\">“Excellent stop in Poblado\/Provenza area of Medell\u00edn. Broad menu and very attentive staff.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 3 semanas<\/div>\n<\/p><\/div>\n<div class=\"card-expand\" data-full-text=\"You have to check this place for brunch or lunch if you are in Medellin.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">D<\/div>\n<div class=\"name-expand\">Danny Teklehaimanot<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“You have to check this place for brunch or lunch if you are in Medellin…”<\/p>\n<p class=\"full-text\">“You have to check this place for brunch or lunch if you are in Medellin.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 3 semanas<\/div>\n<\/p><\/div>\n<div class=\"card-expand\" data-full-text=\"Excelente servicio por parte del personal del restaurante, la comida se sirvi\u00f3 r\u00e1pidamente y estaba bien cocinada, el mejor caf\u00e9 hasta ahora.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">D<\/div>\n<div class=\"name-expand\">Daniel<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Excelente servicio por parte del personal del restaurante, la comida se sirvi\u00f3 r\u00e1pidamente…”<\/p>\n<p class=\"full-text\">“Excelente servicio por parte del personal del restaurante, la comida se sirvi\u00f3 r\u00e1pidamente y estaba bien cocinada, el mejor caf\u00e9 hasta ahora.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 3 semanas<\/div>\n<\/p><\/div>\n<div class=\"card-expand\" data-full-text=\"Dandre Gourmet es de los mejores restaurantes en Medell\u00edn. La comida es deliciosa, con una presentaci\u00f3n impecable y un servicio s\u00faper c\u00e1lido. Tiene opciones muy completas y frescas, ideales si buscas restaurantes saludables en la zona. Perfecto para celebrar cumplea\u00f1os o cualquier ocasi\u00f3n especial. Sin duda uno de los restaurantes gourmet que m\u00e1s vale la pena en El Poblado.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">A<\/div>\n<div class=\"name-expand\">Alejandra Rueda<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Dandre Gourmet es de los mejores restaurantes en Medell\u00edn. La comida es deliciosa, con una presentaci\u00f3n impecable…”<\/p>\n<p class=\"full-text\">“Dandre Gourmet es de los mejores restaurantes en Medell\u00edn. La comida es deliciosa, con una presentaci\u00f3n impecable y un servicio s\u00faper c\u00e1lido. Tiene opciones muy completas y frescas, ideales si buscas restaurantes saludables en la zona. Perfecto para celebrar cumplea\u00f1os o cualquier ocasi\u00f3n especial. Sin duda uno de los restaurantes gourmet que m\u00e1s vale la pena en El Poblado.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 1 d\u00eda<\/div>\n<\/p><\/div>\n<div class=\"card-expand\" data-full-text=\"Awesome atmosphere and service!! Food is amazing! I visit every time I'm here!\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">G<\/div>\n<div class=\"name-expand\">Genet Pierre<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Awesome atmosphere and service!! Food is amazing! I visit every time I’m here!…”<\/p>\n<p class=\"full-text\">“Awesome atmosphere and service!! Food is amazing! I visit every time I’m here!”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 3 semanas<\/div>\n<\/p><\/div>\n<div class=\"card-expand\" data-full-text=\"This place is an absolute gem! The food was amazing and the service was great.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">S<\/div>\n<div class=\"name-expand\">Shane Rice<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“This place is an absolute gem! The food was amazing and the service was great…”<\/p>\n<p class=\"full-text\">“This place is an absolute gem! The food was amazing and the service was great.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 3 semanas<\/div>\n<\/p><\/div>\n<div class=\"card-expand\" data-full-text=\"Good american breakfast, when I visit Medell\u00edn I always come here for breakfast.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">S<\/div>\n<div class=\"name-expand\">Shawn Holloway<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Good american breakfast, when I visit Medell\u00edn I always come here for breakfast…”<\/p>\n<p class=\"full-text\">“Good american breakfast, when I visit Medell\u00edn I always come here for breakfast.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 3 semanas<\/div>\n<\/p><\/div>\n<p> <!-- SEGUNDO DUPLICADO PARA MEJOR EFECTO LOOP --><\/p>\n<div class=\"card-expand\" data-full-text=\"Excelente restaurante para almorzar. Muy amables y cordiales para atender. La comida es muy buena, de calidad. Lo mejor es el men\u00fa que incluye sopa y jugo. Es un buen precio por una buena comida. Muchas gracias!\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">F<\/div>\n<div class=\"name-expand\">Felipe del Solar<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Excelente restaurante para almorzar. Muy amables y cordiales para atender…”<\/p>\n<p class=\"full-text\">“Excelente restaurante para almorzar. Muy amables y cordiales para atender. La comida es muy buena, de calidad. Lo mejor es el men\u00fa que incluye sopa y jugo. Es un buen precio por una buena comida. Muchas gracias!”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 2 semanas<\/div>\n<\/p><\/div>\n<div class=\"card-expand\" data-full-text=\"\u00a1Un lugar genial! Solemos venir a desayunar, pero el almuerzo tambi\u00e9n es genial. Siempre comemos aqu\u00ed varias veces cuando visitamos Medell\u00edn.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">D<\/div>\n<div class=\"name-expand\">Daniel Vining<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“\u00a1Un lugar genial! Solemos venir a desayunar, pero el almuerzo tambi\u00e9n es genial…”<\/p>\n<p class=\"full-text\">“\u00a1Un lugar genial! Solemos venir a desayunar, pero el almuerzo tambi\u00e9n es genial. Siempre comemos aqu\u00ed varias veces cuando visitamos Medell\u00edn.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 1 mes<\/div>\n<\/p><\/div>\n<div class=\"card-expand\" data-full-text=\"Un lugar incre\u00edble para brunch y almuerzo. El servicio y el personal son fabulosos. Comida deliciosa.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">S<\/div>\n<div class=\"name-expand\">Samantha Gomez<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“Un lugar incre\u00edble para brunch y almuerzo. El servicio y el personal son fabulosos…”<\/p>\n<p class=\"full-text\">“Un lugar incre\u00edble para brunch y almuerzo. El servicio y el personal son fabulosos. Comida deliciosa.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 3 semanas<\/div>\n<\/p><\/div>\n<div class=\"card-expand\" data-full-text=\"El solomito en salsa de champi\u00f1ones fue espectacular. Muchas gracias. La remodelaci\u00f3n les qued\u00f3 muy bien.\">\n<div class=\"card-expand-header\">\n<div class=\"avatar-expand\">O<\/div>\n<div class=\"name-expand\">Omar Rueda<\/div>\n<\/p><\/div>\n<div class=\"stars-expand\">\u2605\u2605\u2605\u2605\u2605<\/div>\n<div class=\"text-expand\">\n<p class=\"short-text\">“El solomito en salsa de champi\u00f1ones fue espectacular. Muchas gracias…”<\/p>\n<p class=\"full-text\">“El solomito en salsa de champi\u00f1ones fue espectacular. Muchas gracias. La remodelaci\u00f3n les qued\u00f3 muy bien.”<\/p>\n<\/p><\/div>\n<div class=\"expand-btn\">Ver m\u00e1s<\/div>\n<div class=\"date-expand\">Hace 2 meses<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Contador --><\/p>\n<div class=\"counter-expand\">\n<div class=\"counter-number-expand\">+636<\/div>\n<div class=\"counter-label-expand\">opiniones<\/div>\n<\/p><\/div>\n<\/div>\n<p>\/* ESTILOS PRINCIPALES – TARJETAS VERTICALES CON EXPANSI\u00d3N *\/<br \/>\n.vertical-expand-carousel {<br \/>\n max-width: 1300px;<br \/>\n margin: 0 auto;<br \/>\n padding: 40px 20px;<br \/>\n position: relative;<br \/>\n}<\/p>\n<p>.carousel-expand-wrapper {<br \/>\n overflow: hidden;<br \/>\n position: relative;<br \/>\n margin-bottom: 40px;<br \/>\n padding: 10px 0;<br \/>\n}<\/p>\n<p>.track-expand {<br \/>\n display: flex;<br \/>\n gap: 25px;<br \/>\n animation: slideExpand 70s linear infinite;<br \/>\n width: max-content;<br \/>\n}<\/p>\n<p>.track-expand:hover {<br \/>\n animation-play-state: paused;<br \/>\n}<\/p>\n<p>\/* TARJETA PRINCIPAL – M\u00c1S ANCHA PARA TEXTO *\/<br \/>\n.card-expand {<br \/>\n width: 320px; \/* M\u00c1S ANCHO *\/<br \/>\n height: 380px; \/* ALTO *\/<br \/>\n background: white;<br \/>\n border-radius: 20px;<br \/>\n padding: 25px;<br \/>\n box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);<br \/>\n border: 1px solid #e8e8e8;<br \/>\n transition: all 0.4s ease;<br \/>\n display: flex;<br \/>\n flex-direction: column;<br \/>\n position: relative;<br \/>\n overflow: hidden;<br \/>\n flex-shrink: 0;<br \/>\n cursor: pointer;<br \/>\n}<\/p>\n<p>.card-expand:hover {<br \/>\n transform: translateY(-8px);<br \/>\n box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);<br \/>\n border-color: #d0d0d0;<br \/>\n}<\/p>\n<p>.card-expand.expanded {<br \/>\n height: auto;<br \/>\n min-height: 380px;<br \/>\n z-index: 10;<br \/>\n box-shadow: 0 25px 60px rgba(0, 0, 0, 0.2);<br \/>\n}<\/p>\n<p>\/* HEADER *\/<br \/>\n.card-expand-header {<br \/>\n display: flex;<br \/>\n align-items: center;<br \/>\n gap: 15px;<br \/>\n margin-bottom: 15px;<br \/>\n flex-shrink: 0;<br \/>\n}<\/p>\n<p>\/* SOLO CAMBI\u00c9 ESTO: Avatar con color #1A3E5F *\/<br \/>\n.avatar-expand {<br \/>\n width: 60px;<br \/>\n height: 60px;<br \/>\n border-radius: 50%;<br \/>\n background: #1A3E5F; \/* SOLO CAMBI\u00c9 ESTO *\/<br \/>\n color: white;<br \/>\n display: flex;<br \/>\n align-items: center;<br \/>\n justify-content: center;<br \/>\n font-weight: bold;<br \/>\n font-size: 1.5rem;<br \/>\n flex-shrink: 0;<br \/>\n}<\/p>\n<p>.name-expand {<br \/>\n font-size: 1.1rem;<br \/>\n font-weight: 700;<br \/>\n color: #333;<br \/>\n line-height: 1.3;<br \/>\n}<\/p>\n<p>\/* ESTRELLAS *\/<br \/>\n.stars-expand {<br \/>\n color: #FFD700;<br \/>\n font-size: 1.1rem;<br \/>\n margin: 10px 0 20px 0;<br \/>\n letter-spacing: 2px;<br \/>\n flex-shrink: 0;<br \/>\n}<\/p>\n<p>\/* CONTENEDOR DE TEXTO *\/<br \/>\n.text-expand {<br \/>\n flex: 1;<br \/>\n position: relative;<br \/>\n overflow: hidden;<br \/>\n margin-bottom: 15px;<br \/>\n}<\/p>\n<p>.short-text {<br \/>\n color: #555;<br \/>\n line-height: 1.6;<br \/>\n font-size: 0.95rem;<br \/>\n font-style: italic;<br \/>\n margin: 0;<br \/>\n transition: all 0.3s ease;<br \/>\n}<\/p>\n<p>.card-expand.expanded .short-text {<br \/>\n opacity: 0;<br \/>\n height: 0;<br \/>\n margin: 0;<br \/>\n}<\/p>\n<p>.full-text {<br \/>\n color: #555;<br \/>\n line-height: 1.7;<br \/>\n font-size: 0.95rem;<br \/>\n font-style: italic;<br \/>\n margin: 0;<br \/>\n opacity: 0;<br \/>\n max-height: 0;<br \/>\n overflow: hidden;<br \/>\n transition: all 0.4s ease;<br \/>\n}<\/p>\n<p>.card-expand.expanded .full-text {<br \/>\n opacity: 1;<br \/>\n max-height: 500px;<br \/>\n animation: fadeInText 0.5s ease forwards;<br \/>\n}<\/p>\n<p>@keyframes fadeInText {<br \/>\n from {<br \/>\n opacity: 0;<br \/>\n transform: translateY(10px);<br \/>\n }<br \/>\n to {<br \/>\n opacity: 1;<br \/>\n transform: translateY(0);<br \/>\n }<br \/>\n}<\/p>\n<p>\/* SOLO CAMBI\u00c9 ESTO: Bot\u00f3n de expansi\u00f3n con color #1A3E5F *\/<br \/>\n.expand-btn {<br \/>\n color: #1A3E5F; \/* SOLO CAMBI\u00c9 ESTO *\/<br \/>\n font-size: 0.9rem;<br \/>\n font-weight: 600;<br \/>\n text-align: center;<br \/>\n padding: 8px 0;<br \/>\n border-radius: 8px;<br \/>\n background: rgba(26, 62, 95, 0.08); \/* SOLO CAMBI\u00c9 ESTO *\/<br \/>\n transition: all 0.3s ease;<br \/>\n margin-top: 10px;<br \/>\n cursor: pointer;<br \/>\n flex-shrink: 0;<br \/>\n}<\/p>\n<p>.expand-btn:hover {<br \/>\n background: rgba(26, 62, 95, 0.15); \/* SOLO CAMBI\u00c9 ESTO *\/<br \/>\n transform: translateY(-2px);<br \/>\n}<\/p>\n<p>.card-expand.expanded .expand-btn {<br \/>\n background: rgba(26, 62, 95, 0.2); \/* SOLO CAMBI\u00c9 ESTO *\/<br \/>\n color: #1A3E5F; \/* SOLO CAMBI\u00c9 ESTO *\/<br \/>\n}<\/p>\n<p>\/* FECHA *\/<br \/>\n.date-expand {<br \/>\n color: #888;<br \/>\n font-size: 0.85rem;<br \/>\n text-align: center;<br \/>\n padding-top: 15px;<br \/>\n margin-top: 15px;<br \/>\n border-top: 1px solid #eee;<br \/>\n flex-shrink: 0;<br \/>\n}<\/p>\n<p>\/* SOLO CAMBI\u00c9 ESTO: Contador con color #1A3E5F *\/<br \/>\n.counter-expand {<br \/>\n text-align: center;<br \/>\n padding: 15px 30px;<br \/>\n background: #1A3E5F; \/* SOLO CAMBI\u00c9 ESTO *\/<br \/>\n border-radius: 16px;<br \/>\n max-width: 200px;<br \/>\n margin: 0 auto;<br \/>\n box-shadow: 0 8px 25px rgba(26, 62, 95, 0.3); \/* SOLO CAMBI\u00c9 ESTO *\/<br \/>\n}<\/p>\n<p>.counter-number-expand {<br \/>\n font-size: 2.2rem;<br \/>\n font-weight: 900;<br \/>\n color: white;<br \/>\n text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);<br \/>\n}<\/p>\n<p>.counter-label-expand {<br \/>\n color: rgba(255, 255, 255, 0.95);<br \/>\n font-size: 1rem;<br \/>\n font-weight: 600;<br \/>\n letter-spacing: 1px;<br \/>\n margin-top: 5px;<br \/>\n}<\/p>\n<p>\/* ANIMACI\u00d3N DEL CARRUSEL – ACTUALIZADA PARA M\u00c1S TARJETAS *\/<br \/>\n@keyframes slideExpand {<br \/>\n 0% {<br \/>\n transform: translateX(0);<br \/>\n }<br \/>\n 100% {<br \/>\n \/* 14 tarjetas originales + 14 del primer duplicado + 4 del segundo = 32 tarjetas *\/<br \/>\n transform: translateX(calc(-320px * 32 – 25px * 32));<br \/>\n }<br \/>\n}<\/p>\n<p>\/* RESPONSIVE *\/<br \/>\n@media (max-width: 1200px) {<br \/>\n .card-expand {<br \/>\n width: 300px;<br \/>\n height: 370px;<br \/>\n }<\/p>\n<p> @keyframes slideExpand {<br \/>\n 0% {<br \/>\n transform: translateX(0);<br \/>\n }<br \/>\n 100% {<br \/>\n transform: translateX(calc(-300px * 32 – 25px * 32));<br \/>\n }<br \/>\n }<br \/>\n}<\/p>\n<p>@media (max-width: 992px) {<br \/>\n .card-expand {<br \/>\n width: 280px;<br \/>\n height: 360px;<br \/>\n padding: 22px;<br \/>\n }<\/p>\n<p> .avatar-expand {<br \/>\n width: 55px;<br \/>\n height: 55px;<br \/>\n font-size: 1.4rem;<br \/>\n }<\/p>\n<p> .name-expand {<br \/>\n font-size: 1.05rem;<br \/>\n }<\/p>\n<p> .short-text, .full-text {<br \/>\n font-size: 0.92rem;<br \/>\n }<\/p>\n<p> .counter-expand {<br \/>\n max-width: 180px;<br \/>\n padding: 12px 25px;<br \/>\n }<\/p>\n<p> .counter-number-expand {<br \/>\n font-size: 2rem;<br \/>\n }<br \/>\n}<\/p>\n<p>@media (max-width: 768px) {<br \/>\n .vertical-expand-carousel {<br \/>\n padding: 30px 15px;<br \/>\n }<\/p>\n<p> .card-expand {<br \/>\n width: 260px;<br \/>\n height: 350px;<br \/>\n padding: 20px;<br \/>\n }<\/p>\n<p> .avatar-expand {<br \/>\n width: 50px;<br \/>\n height: 50px;<br \/>\n font-size: 1.3rem;<br \/>\n }<\/p>\n<p> .name-expand {<br \/>\n font-size: 1rem;<br \/>\n }<\/p>\n<p> .short-text, .full-text {<br \/>\n font-size: 0.9rem;<br \/>\n line-height: 1.6;<br \/>\n }<\/p>\n<p> .stars-expand {<br \/>\n font-size: 1rem;<br \/>\n margin: 8px 0 15px 0;<br \/>\n }<\/p>\n<p> .expand-btn {<br \/>\n font-size: 0.85rem;<br \/>\n padding: 7px 0;<br \/>\n }<\/p>\n<p> .date-expand {<br \/>\n font-size: 0.82rem;<br \/>\n padding-top: 12px;<br \/>\n }<br \/>\n}<\/p>\n<p>@media (max-width: 576px) {<br \/>\n .card-expand {<br \/>\n width: 240px;<br \/>\n height: 340px;<br \/>\n padding: 18px;<br \/>\n }<\/p>\n<p> .track-expand {<br \/>\n gap: 20px;<br \/>\n }<br \/>\n}<\/p>\n<p>\/* EFECTO DE EXPANSI\u00d3N PARA M\u00d3VILES *\/<br \/>\n@media (max-width: 768px) {<br \/>\n .card-expand.expanded {<br \/>\n height: auto;<br \/>\n min-height: 400px;<br \/>\n }<br \/>\n}<\/p>\n<p>\/* COMPATIBILIDAD BRIZY *\/<br \/>\n.vertical-expand-carousel * {<br \/>\n box-sizing: border-box !important;<br \/>\n}<\/p>\n<p>\/* =========================================== *\/<br \/>\n\/* NUEVOS ESTILOS ESPEC\u00cdFICOS PARA M\u00d3VIL *\/<br \/>\n\/* No afectan la versi\u00f3n de computador *\/<br \/>\n\/* =========================================== *\/<\/p>\n<p>@media (max-width: 768px) {<br \/>\n .vertical-expand-carousel {<br \/>\n width: 100%;<br \/>\n max-width: 100%;<br \/>\n padding: 30px 10px;<br \/>\n overflow-x: hidden;<br \/>\n }<\/p>\n<p> .carousel-expand-wrapper {<br \/>\n margin-bottom: 30px;<br \/>\n padding: 5px 0;<br \/>\n }<\/p>\n<p> .track-expand {<br \/>\n gap: 20px;<br \/>\n animation: slideExpandMobile 80s linear infinite;<br \/>\n width: max-content;<br \/>\n padding: 0 10px;<br \/>\n }<\/p>\n<p> .card-expand {<br \/>\n width: 280px;<br \/>\n height: 340px;<br \/>\n padding: 20px;<br \/>\n box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);<br \/>\n }<\/p>\n<p> .card-expand:hover {<br \/>\n transform: none;<br \/>\n box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);<br \/>\n }<\/p>\n<p> \/* Animaci\u00f3n espec\u00edfica para m\u00f3vil *\/<br \/>\n @keyframes slideExpandMobile {<br \/>\n 0% {<br \/>\n transform: translateX(0);<br \/>\n }<br \/>\n 100% {<br \/>\n transform: translateX(calc(-280px * 32 – 20px * 32));<br \/>\n }<br \/>\n }<\/p>\n<p> \/* Ajuste del avatar para m\u00f3vil *\/<br \/>\n .avatar-expand {<br \/>\n width: 50px;<br \/>\n height: 50px;<br \/>\n font-size: 1.3rem;<br \/>\n }<\/p>\n<p> .name-expand {<br \/>\n font-size: 1rem;<br \/>\n }<\/p>\n<p> .stars-expand {<br \/>\n font-size: 1rem;<br \/>\n margin: 10px 0 15px 0;<br \/>\n }<\/p>\n<p> .short-text, .full-text {<br \/>\n font-size: 0.9rem;<br \/>\n line-height: 1.5;<br \/>\n }<\/p>\n<p> .expand-btn {<br \/>\n font-size: 0.85rem;<br \/>\n padding: 8px 0;<br \/>\n margin-top: 8px;<br \/>\n }<\/p>\n<p> .date-expand {<br \/>\n font-size: 0.8rem;<br \/>\n padding-top: 12px;<br \/>\n margin-top: 12px;<br \/>\n }<\/p>\n<p> \/* Contador ajustado para m\u00f3vil *\/<br \/>\n .counter-expand {<br \/>\n max-width: 170px;<br \/>\n padding: 12px 20px;<br \/>\n margin-top: 20px;<br \/>\n }<\/p>\n<p> .counter-number-expand {<br \/>\n font-size: 1.8rem;<br \/>\n }<\/p>\n<p> .counter-label-expand {<br \/>\n font-size: 0.9rem;<br \/>\n }<br \/>\n}<\/p>\n<p>\/* Para m\u00f3viles muy peque\u00f1os *\/<br \/>\n@media (max-width: 480px) {<br \/>\n .vertical-expand-carousel {<br \/>\n padding: 20px 5px;<br \/>\n }<\/p>\n<p> .track-expand {<br \/>\n gap: 15px;<br \/>\n animation: slideExpandMobileSmall 70s linear infinite;<br \/>\n padding: 0 5px;<br \/>\n }<\/p>\n<p> .card-expand {<br \/>\n width: 260px;<br \/>\n height: 330px;<br \/>\n padding: 18px;<br \/>\n }<\/p>\n<p> @keyframes slideExpandMobileSmall {<br \/>\n 0% {<br \/>\n transform: translateX(0);<br \/>\n }<br \/>\n 100% {<br \/>\n transform: translateX(calc(-260px * 32 – 15px * 32));<br \/>\n }<br \/>\n }<\/p>\n<p> .avatar-expand {<br \/>\n width: 45px;<br \/>\n height: 45px;<br \/>\n font-size: 1.2rem;<br \/>\n }<\/p>\n<p> .name-expand {<br \/>\n font-size: 0.95rem;<br \/>\n }<\/p>\n<p> .short-text, .full-text {<br \/>\n font-size: 0.85rem;<br \/>\n line-height: 1.5;<br \/>\n }<\/p>\n<p> .counter-expand {<br \/>\n max-width: 150px;<br \/>\n padding: 10px 15px;<br \/>\n }<\/p>\n<p> .counter-number-expand {<br \/>\n font-size: 1.6rem;<br \/>\n }<\/p>\n<p> .counter-label-expand {<br \/>\n font-size: 0.85rem;<br \/>\n }<br \/>\n}<\/p>\n<p>\/* Para m\u00f3viles extra peque\u00f1os *\/<br \/>\n@media (max-width: 360px) {<br \/>\n .track-expand {<br \/>\n gap: 12px;<br \/>\n animation: slideExpandMobileXS 60s linear infinite;<br \/>\n }<\/p>\n<p> .card-expand {<br \/>\n width: 240px;<br \/>\n height: 320px;<br \/>\n padding: 16px;<br \/>\n }<\/p>\n<p> @keyframes slideExpandMobileXS {<br \/>\n 0% {<br \/>\n transform: translateX(0);<br \/>\n }<br \/>\n 100% {<br \/>\n transform: translateX(calc(-240px * 32 – 12px * 32));<br \/>\n }<br \/>\n }<\/p>\n<p> .avatar-expand {<br \/>\n width: 40px;<br \/>\n height: 40px;<br \/>\n font-size: 1.1rem;<br \/>\n }<\/p>\n<p> .name-expand {<br \/>\n font-size: 0.9rem;<br \/>\n }<\/p>\n<p> .short-text, .full-text {<br \/>\n font-size: 0.82rem;<br \/>\n line-height: 1.4;<br \/>\n }<\/p>\n<p> .expand-btn {<br \/>\n font-size: 0.8rem;<br \/>\n padding: 7px 0;<br \/>\n }<\/p>\n<p> .date-expand {<br \/>\n font-size: 0.78rem;<br \/>\n }<br \/>\n}<\/p>\n<p>\/* Touch scrolling mejorado para m\u00f3vil *\/<br \/>\n@media (max-width: 768px) {<br \/>\n .carousel-expand-wrapper {<br \/>\n overflow-x: auto;<br \/>\n -webkit-overflow-scrolling: touch;<br \/>\n scrollbar-width: none; \/* Firefox *\/<br \/>\n }<\/p>\n<p> .carousel-expand-wrapper::-webkit-scrollbar {<br \/>\n display: none; \/* Chrome, Safari, Opera *\/<br \/>\n }<\/p>\n<p> .track-expand {<br \/>\n animation: none !important;<br \/>\n padding-bottom: 10px;<br \/>\n }<\/p>\n<p> \/* Mejorar la experiencia t\u00e1ctil *\/<br \/>\n .card-expand {<br \/>\n cursor: default;<br \/>\n -webkit-tap-highlight-color: transparent;<br \/>\n }<\/p>\n<p> .expand-btn {<br \/>\n touch-action: manipulation;<br \/>\n }<\/p>\n<p> \/* Asegurar que el texto expandido sea legible *\/<br \/>\n .card-expand.expanded {<br \/>\n height: auto;<br \/>\n min-height: 380px;<br \/>\n max-height: 500px;<br \/>\n overflow-y: auto;<br \/>\n }<br \/>\n}<\/p>\n<p>\/\/ SCRIPT PARA EXPANSI\u00d3N DE TEXTOS<br \/>\ndocument.addEventListener(‘DOMContentLoaded’, function() {<br \/>\n const track = document.querySelector(‘.track-expand’);<br \/>\n if (!track) return;<\/p>\n<p> \/\/ Verificar si estamos en m\u00f3vil<br \/>\n const isMobile = window.innerWidth {<br \/>\n const expandBtn = card.querySelector(‘.expand-btn’);<br \/>\n const shortText = card.querySelector(‘.short-text’);<br \/>\n const fullText = card.querySelector(‘.full-text’);<\/p>\n<p> \/\/ Verificar si el texto corto es diferente del texto completo<br \/>\n if (shortText.textContent.replace(\/[“.]\/g, ”) ===<br \/>\n fullText.textContent.replace(\/[“.]\/g, ”)) {<br \/>\n expandBtn.style.display = ‘none’;<br \/>\n }<\/p>\n<p> \/\/ Evento para expandir<br \/>\n expandBtn.addEventListener(‘click’, function(e) {<br \/>\n e.stopPropagation();<br \/>\n card.classList.toggle(‘expanded’);<\/p>\n<p> if (card.classList.contains(‘expanded’)) {<br \/>\n expandBtn.textContent = ‘Ver menos’;<br \/>\n \/\/ Detener animaci\u00f3n del carrusel temporalmente solo en escritorio<br \/>\n if (!isMobile) {<br \/>\n track.style.animationPlayState = ‘paused’;<br \/>\n }<br \/>\n } else {<br \/>\n expandBtn.textContent = ‘Ver m\u00e1s’;<br \/>\n \/\/ Reanudar despu\u00e9s de un breve momento solo en escritorio<br \/>\n if (!isMobile) {<br \/>\n setTimeout(() => {<br \/>\n track.style.animationPlayState = ‘running’;<br \/>\n }, 300);<br \/>\n }<br \/>\n }<br \/>\n });<\/p>\n<p> \/\/ Tambi\u00e9n expandir al hacer clic en la tarjeta<br \/>\n card.addEventListener(‘click’, function(e) {<br \/>\n if (!e.target.classList.contains(‘expand-btn’)) {<br \/>\n card.classList.toggle(‘expanded’);<\/p>\n<p> if (card.classList.contains(‘expanded’)) {<br \/>\n expandBtn.textContent = ‘Ver menos’;<br \/>\n if (!isMobile) {<br \/>\n track.style.animationPlayState = ‘paused’;<br \/>\n }<br \/>\n } else {<br \/>\n expandBtn.textContent = ‘Ver m\u00e1s’;<br \/>\n if (!isMobile) {<br \/>\n setTimeout(() => {<br \/>\n track.style.animationPlayState = ‘running’;<br \/>\n }, 300);<br \/>\n }<br \/>\n }<br \/>\n }<br \/>\n });<br \/>\n });<\/p>\n<p> \/\/ Para touch devices (solo m\u00f3vil)<br \/>\n if (isMobile) {<br \/>\n let touchStartX = 0;<br \/>\n let touchStartY = 0;<br \/>\n let isScrolling = false;<\/p>\n<p> track.addEventListener(‘touchstart’, function(e) {<br \/>\n touchStartX = e.touches[0].clientX;<br \/>\n touchStartY = e.touches[0].clientY;<br \/>\n isScrolling = false;<br \/>\n }, { passive: true });<\/p>\n<p> track.addEventListener(‘touchmove’, function(e) {<br \/>\n const touchX = e.touches[0].clientX;<br \/>\n const touchY = e.touches[0].clientY;<br \/>\n const diffX = Math.abs(touchX – touchStartX);<br \/>\n const diffY = Math.abs(touchY – touchStartY);<\/p>\n<p> \/\/ Si se mueve m\u00e1s horizontal que vertical, es un scroll<br \/>\n if (diffX > diffY && diffX > 5) {<br \/>\n isScrolling = true;<br \/>\n }<br \/>\n }, { passive: true });<\/p>\n<p> track.addEventListener(‘touchend’, function(e) {<br \/>\n if (!isScrolling) {<br \/>\n \/\/ Si no era un scroll, podr\u00eda ser un tap para expandir<br \/>\n const touchEndX = e.changedTouches[0].clientX;<br \/>\n const touchEndY = e.changedTouches[0].clientY;<br \/>\n const diffX = Math.abs(touchEndX – touchStartX);<br \/>\n const diffY = Math.abs(touchEndY – touchStartY);<\/p>\n<p> \/\/ Si fue un tap (poco movimiento)<br \/>\n if (diffX < 5 && diffY < 5) {<br \/>\n \/\/ El evento click ya manejar\u00e1 la expansi\u00f3n<br \/>\n }<br \/>\n }<br \/>\n }, { passive: true });<br \/>\n }<br \/>\n});\n<\/p><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n<section id=\"eGqAN6IccRtt_eGqAN6IccRtt\" class=\"brz-section brz-css-d-section brz-css-1b5g8sy\">\n<div class=\"brz-section__content brz-section--boxed brz-css-d-sectionitem-bg brz-css-pp6uqg\" data-brz-custom-id=\"wpSmTWv9iXtv\">\n<div class=\"brz-container brz-css-d-sectionitem-container brz-css-4a75a5\">\n<div id=\"\" class=\"brz-css-d-wrapper brz-css-18hssfp brz-wrapper\">\n<div class=\"brz-wp-shortcode brz-css-d-wpcustomshortcode brz-css-1tj0g0o\" data-brz-custom-id=\"jaxlm2FWiBF7\">\n<div>\n<p> <title>De la Tierra a tu Mesa<\/title><br \/>\n <!-- Enlace a Google Fonts para Poppins --><\/p>\n<p> * {<br \/>\n margin: 0;<br \/>\n padding: 0;<br \/>\n box-sizing: border-box;<br \/>\n }<\/p>\n<p> body {<br \/>\n padding: 20px;<br \/>\n font-family: ‘Poppins’, sans-serif;<br \/>\n }<\/p>\n<p> .dandre-section {<br \/>\n max-width: 1600px;<br \/>\n margin: 0 auto;<br \/>\n padding: 20px;<br \/>\n }<\/p>\n<p> .features-container {<br \/>\n display: grid;<br \/>\n grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));<br \/>\n gap: 30px;<br \/>\n width: 100%;<br \/>\n }<\/p>\n<p> .feature-card {<br \/>\n background-color: #1A3E5F;<br \/>\n border-radius: 12px;<br \/>\n overflow: hidden;<br \/>\n color: white;<br \/>\n transition: transform 0.3s ease;<br \/>\n display: flex;<br \/>\n flex-direction: column;<br \/>\n height: 100%;<br \/>\n min-height: 280px;<br \/>\n }<\/p>\n<p> .feature-card:hover {<br \/>\n transform: translateY(-10px);<br \/>\n }<\/p>\n<p> .feature-img-container {<br \/>\n display: flex;<br \/>\n justify-content: center;<br \/>\n align-items: center;<br \/>\n padding: 15px 0 5px 0;<br \/>\n background-color: #1A3E5F;<br \/>\n height: 110px;<br \/>\n }<\/p>\n<p> .feature-img {<br \/>\n width: auto;<br \/>\n height: 55px;<br \/>\n object-fit: contain;<br \/>\n display: block;<br \/>\n max-width: 75px;<br \/>\n }<\/p>\n<p> .feature-content {<br \/>\n padding: 5px 25px 20px 25px;<br \/>\n flex-grow: 1;<br \/>\n background-color: #1A3E5F;<br \/>\n }<\/p>\n<p> .feature-title {<br \/>\n font-size: 1.3rem;<br \/>\n margin-bottom: 10px;<br \/>\n color: white;<br \/>\n text-align: center;<br \/>\n font-weight: 600;<br \/>\n font-family: ‘Poppins’, sans-serif;<br \/>\n }<\/p>\n<p> .feature-description {<br \/>\n line-height: 1.5;<br \/>\n font-size: 0.85rem;<br \/>\n color: rgba(255, 255, 255, 0.9);<br \/>\n text-align: center;<br \/>\n font-family: ‘Poppins’, sans-serif;<br \/>\n }<\/p>\n<p> \/* Responsive *\/<br \/>\n @media (max-width: 1200px) {<br \/>\n .dandre-section {<br \/>\n max-width: 95%;<br \/>\n }<\/p>\n<p> .features-container {<br \/>\n grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));<br \/>\n }<br \/>\n }<\/p>\n<p> @media (max-width: 992px) {<br \/>\n .dandre-section {<br \/>\n max-width: 98%;<br \/>\n padding: 10px;<br \/>\n }<\/p>\n<p> .features-container {<br \/>\n grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));<br \/>\n gap: 25px;<br \/>\n }<\/p>\n<p> .feature-card {<br \/>\n min-height: 260px;<br \/>\n }<br \/>\n }<\/p>\n<p> @media (max-width: 768px) {<br \/>\n .features-container {<br \/>\n grid-template-columns: 1fr;<br \/>\n gap: 20px;<br \/>\n }<\/p>\n<p> .feature-card {<br \/>\n min-height: 240px;<br \/>\n }<\/p>\n<p> .feature-img {<br \/>\n height: 50px;<br \/>\n max-width: 70px;<br \/>\n }<\/p>\n<p> .feature-img-container {<br \/>\n height: 100px;<br \/>\n padding: 12px 0 5px 0;<br \/>\n }<\/p>\n<p> .feature-content {<br \/>\n padding: 5px 20px 18px 20px;<br \/>\n }<\/p>\n<p> .feature-title {<br \/>\n font-size: 1.2rem;<br \/>\n }<\/p>\n<p> .feature-description {<br \/>\n font-size: 0.82rem;<br \/>\n }<br \/>\n }<\/p>\n<p> @media (max-width: 480px) {<br \/>\n body {<br \/>\n padding: 10px;<br \/>\n }<\/p>\n<p> .dandre-section {<br \/>\n padding: 10px 5px;<br \/>\n }<\/p>\n<p> .features-container {<br \/>\n gap: 18px;<br \/>\n }<\/p>\n<p> .feature-card {<br \/>\n min-height: 230px;<br \/>\n }<\/p>\n<p> .feature-img {<br \/>\n height: 45px;<br \/>\n max-width: 65px;<br \/>\n }<\/p>\n<p> .feature-img-container {<br \/>\n height: 95px;<br \/>\n padding: 10px 0 5px 0;<br \/>\n }<\/p>\n<p> .feature-content {<br \/>\n padding: 5px 18px 16px 18px;<br \/>\n }<\/p>\n<p> .feature-title {<br \/>\n font-size: 1.15rem;<br \/>\n margin-bottom: 8px;<br \/>\n }<\/p>\n<p> .feature-description {<br \/>\n font-size: 0.8rem;<br \/>\n line-height: 1.45;<br \/>\n }<br \/>\n }<\/p>\n<section class=\"dandre-section\">\n <!-- Secci\u00f3n de caracter\u00edsticas (solo las 3 tarjetas) --><\/p>\n<div class=\"features-container\">\n <!-- Productos frescos --><\/p>\n<div class=\"feature-card\">\n<div class=\"feature-img-container\">\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/Captura-de-pantalla-2025-12-05-a-las-5.44.33-p.m.png\" alt=\"Productos frescos\" class=\"feature-img\">\n <\/div>\n<div class=\"feature-content\">\n<h3 class=\"feature-title\">Productos frescos<\/h3>\n<p class=\"feature-description\">Seleccionamos cuidadosamente cada producto para garantizar frescura, sabor y nutrici\u00f3n en cada plato. Trabajamos con proveedores locales para ofrecerte lo mejor de cada estaci\u00f3n.<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Cocina artesanal --><\/p>\n<div class=\"feature-card\">\n<div class=\"feature-img-container\">\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/Captura-de-pantalla-2025-12-05-a-las-5.45.36-p.m.png\" alt=\"Cocina artesanal\" class=\"feature-img\">\n <\/div>\n<div class=\"feature-content\">\n<h3 class=\"feature-title\">Cocina artesanal<\/h3>\n<p class=\"feature-description\">Preparaciones cuidadas desde el inicio: salsas, masas y aderezos hechos a mano, con recetas propias y procesos que preservan el sabor aut\u00e9ntico de nuestros ingredientes.<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Variedad --><\/p>\n<div class=\"feature-card\">\n<div class=\"feature-img-container\">\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/Captura-de-pantalla-2025-12-05-a-las-5.46.11-p.m.png\" alt=\"Variedad\" class=\"feature-img\">\n <\/div>\n<div class=\"feature-content\">\n<h3 class=\"feature-title\">Variedad<\/h3>\n<p class=\"feature-description\">Desde cl\u00e1sicos irresistibles hasta combinaciones innovadoras, nuestra carta ofrece alternativas para cada antojo y estilo de alimentaci\u00f3n.<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/section>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n<section id=\"rgaxU9efHlyf_rgaxU9efHlyf\" class=\"brz-section brz-css-d-section brz-css-xea658\">\n<div class=\"brz-section__content brz-section--boxed brz-css-d-sectionitem-bg brz-css-9mfap5\" data-brz-custom-id=\"q_NbUIUxjtox\">\n<div class=\"brz-container brz-css-d-sectionitem-container brz-css-11dm4jp\">\n<div id=\"\" class=\"brz-css-d-wrapper brz-css-1d726xi brz-wrapper\">\n<div class=\"brz-wp-shortcode brz-css-d-wpcustomshortcode brz-css-y2xf0r\" data-brz-custom-id=\"o14TwHLa_gr1\">\n<div>\n<div id=\"seccion-reservas\" style=\"display: flex;min-height: 70vh;margin: 0;padding: 0;width: 100vw;font-family: 'Poppins', sans-serif\">\n<p> <!-- MITAD IZQUIERDA - RAPPI (ID\u00c9NTICA) --><\/p>\n<div style=\"flex: 1;background: white;display: flex;flex-direction: column;align-items: center;justify-content: center;padding: 30px;width: 50vw\">\n<div style=\"max-width: 450px;width: 100%;text-align: center\">\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/Captura-de-pantalla-2025-12-05-a-las-6.44.26-p.m.png\" alt=\"Rappi D'Andr\u00e9\" style=\"width: 100%;max-width: 350px;margin-bottom: 20px\"><\/p>\n<h2 style=\"color: #333;font-size: 18px;margin-bottom: 3px;font-weight: 600\">Pide por Rappi<\/h2>\n<p style=\"color: #333;font-size: 20px;margin-bottom: 25px;line-height: 1.5;font-weight: 700\">\n Lo mejor de nuestra cocina,<br \/>donde t\u00fa est\u00e9s\n <\/p>\n<p> <a href=\"https:\/\/www.rappi.com.co\/restaurantes\/900056317-dandre-gourmet\" target=\"_blank\" style=\"display: inline-block;background: #1A3E5F;color: white;padding: 12px 35px;border: none;text-decoration: none;font-weight: 600;font-size: 16px\"><br \/>\n Pedir ahora<br \/>\n <\/a>\n <\/div>\n<\/p><\/div>\n<p> <!-- MITAD DERECHA - FORMULARIO (ID\u00c9NTICO VISUALMENTE) --><\/p>\n<div style=\"flex: 1;background: #1A3E5F;display: flex;flex-direction: column;align-items: center;justify-content: center;padding: 30px;width: 50vw\">\n<div style=\"max-width: 450px;width: 100%\">\n<h2 style=\"text-align: center;color: white;font-size: 28px;margin-bottom: 10px;font-weight: 600\">\n Reserva una mesa<br \/>\n <\/h2>\n<p style=\"text-align: center;color: #E0E0E0;margin-bottom: 25px;font-size: 13px;line-height: 1.5;font-weight: 400\">\n Selecciona los datos de tu reserva y conseguiremos<br \/>los mejores asientos para ti\n <\/p>\n<p> <!-- FORMULARIO - AHORA CON CAMPOS DE CONTACTO Y WHATSAPP --><\/p>\n<p> <!-- CAMPOS NUEVOS AGREGADOS --><\/p>\n<div style=\"margin-bottom: 18px;width: 100%\">\n <label style=\"display: block;margin-bottom: 6px;font-weight: 500;color: white;font-size: 14px\">Nombre completo *<\/label><\/p><\/div>\n<div style=\"margin-bottom: 18px;width: 100%\">\n <label style=\"display: block;margin-bottom: 6px;font-weight: 500;color: white;font-size: 14px\">Tel\u00e9fono *<\/label><\/p><\/div>\n<p> <!-- CAMPOS ORIGINALES DEL FORMULARIO --><\/p>\n<div style=\"margin-bottom: 18px;width: 100%\">\n <label style=\"display: block;margin-bottom: 6px;font-weight: 500;color: white;font-size: 14px\">Tama\u00f1o del grupo *<\/label><\/p>\n<p> Seleccionar…<br \/>\n 2 personas<br \/>\n 3 personas<br \/>\n 4 personas<br \/>\n 5-6 personas<br \/>\n 7-8 personas<\/p><\/div>\n<div style=\"margin-bottom: 18px;width: 100%\">\n <label style=\"display: block;margin-bottom: 6px;font-weight: 500;color: white;font-size: 14px\">Fecha *<\/label><\/p><\/div>\n<div style=\"margin-bottom: 25px;width: 100%\">\n <label style=\"display: block;margin-bottom: 6px;font-weight: 500;color: white;font-size: 14px\">Hora *<\/label><\/p>\n<p> Seleccionar…<br \/>\n 12:00 PM<br \/>\n 12:30 PM<br \/>\n 1:00 PM<br \/>\n 1:30 PM<br \/>\n 2:00 PM<br \/>\n 2:30 PM<br \/>\n 3:00 PM<br \/>\n 3:30 PM<br \/>\n 4:00 PM<br \/>\n 4:30 PM<br \/>\n 5:00 PM<br \/>\n 5:30 PM<br \/>\n 6:00 PM<br \/>\n 6:30 PM<br \/>\n 7:00 PM<br \/>\n 7:30 PM<br \/>\n 8:00 PM<br \/>\n 8:30 PM<br \/>\n 9:00 PM<br \/>\n 9:30 PM<\/p><\/div>\n<p> <button type=\"submit\" style=\"width: 100%;background: white;color: #1A3E5F;padding: 14px;border: none;font-size: 16px;font-weight: 600;cursor: pointer;font-family: 'Poppins', sans-serif\"><br \/>\n Buscar una mesa<br \/>\n <\/button><\/p><\/div>\n<\/p><\/div>\n<\/div>\n<p><!-- ESTILOS RESPONSIVE (MISMO DISE\u00d1O QUE EL ORIGINAL) --><\/p>\n<p>* {<br \/>\n margin: 0;<br \/>\n padding: 0;<br \/>\n box-sizing: border-box;<br \/>\n}<\/p>\n<p>html, body {<br \/>\n margin: 0;<br \/>\n padding: 0;<br \/>\n overflow-x: hidden;<br \/>\n width: 100%;<br \/>\n font-family: ‘Poppins’, sans-serif;<br \/>\n}<\/p>\n<p>\/* CONTENEDOR PRINCIPAL *\/<br \/>\ndiv[style*=”display: flex; min-height: 70vh”] {<br \/>\n margin: 0 !important;<br \/>\n padding: 0 !important;<br \/>\n width: 100vw !important;<br \/>\n max-width: 100vw !important;<br \/>\n}<\/p>\n<p>\/* MITADES *\/<br \/>\ndiv[style*=”background: white”] {<br \/>\n margin: 0 !important;<br \/>\n width: 50vw !important;<br \/>\n max-width: 50vw !important;<br \/>\n}<\/p>\n<p>div[style*=”background: #1A3E5F”] {<br \/>\n margin: 0 !important;<br \/>\n width: 50vw !important;<br \/>\n max-width: 50vw !important;<br \/>\n}<\/p>\n<p>\/* EFECTO HOVER BOT\u00d3N RAPPI *\/<br \/>\na[href*=”rappi.com.co”]:hover {<br \/>\n background: #0F2A47 !important;<br \/>\n transform: translateY(-2px);<br \/>\n}<\/p>\n<p>\/* ESTILOS PARA INPUTS Y SELECTS *\/<br \/>\nselect, input[type=”date”], input[type=”text”], input[type=”tel”] {<br \/>\n -webkit-appearance: none;<br \/>\n -moz-appearance: none;<br \/>\n appearance: none;<br \/>\n border-radius: 0;<br \/>\n}<\/p>\n<p>input[type=”date”]::-webkit-calendar-picker-indicator {<br \/>\n filter: invert(1);<br \/>\n opacity: 0.7;<br \/>\n cursor: pointer;<br \/>\n}<\/p>\n<p>input[type=”date”]::-webkit-calendar-picker-indicator:hover {<br \/>\n opacity: 1;<br \/>\n}<\/p>\n<p>select option {<br \/>\n background: #1A3E5F;<br \/>\n color: white;<br \/>\n}<\/p>\n<p>\/* ANIMACIONES SUAVES *\/<br \/>\na, button, select, input {<br \/>\n transition: all 0.3s ease;<br \/>\n}<\/p>\n<p>\/* RESPONSIVE PARA M\u00d3VILES *\/<br \/>\n@media (max-width: 768px) {<br \/>\n div[style*=”display: flex; min-height: 70vh”] {<br \/>\n flex-direction: column;<br \/>\n width: 100vw !important;<br \/>\n min-height: auto;<br \/>\n }<\/p>\n<p> div[style*=”background: white”] {<br \/>\n width: 100vw !important;<br \/>\n max-width: 100vw !important;<br \/>\n min-height: 50vh;<br \/>\n padding: 20px 20px !important;<br \/>\n }<\/p>\n<p> div[style*=”background: #1A3E5F”] {<br \/>\n width: 100vw !important;<br \/>\n max-width: 100vw !important;<br \/>\n min-height: 50vh;<br \/>\n padding: 25px 20px !important;<br \/>\n }<\/p>\n<p> h2[style*=”font-size: 28px”] {<br \/>\n font-size: 24px !important;<br \/>\n }<\/p>\n<p> h2[style*=”font-size: 18px”] {<br \/>\n font-size: 16px !important;<br \/>\n }<\/p>\n<p> p[style*=”font-size: 20px”] {<br \/>\n font-size: 18px !important;<br \/>\n }<\/p>\n<p> p[style*=”font-size: 13px”] {<br \/>\n font-size: 12px !important;<br \/>\n }<\/p>\n<p> a[style*=”font-size: 16px”],<br \/>\n button[style*=”font-size: 16px”] {<br \/>\n font-size: 15px !important;<br \/>\n padding: 12px 35px !important;<br \/>\n }<\/p>\n<p> select, input[type=”date”], input[type=”text”], input[type=”tel”] {<br \/>\n font-size: 15px !important;<br \/>\n padding: 11px 13px !important;<br \/>\n }<br \/>\n}<\/p>\n<p><!-- SCRIPT PARA ENV\u00cdO A WHATSAPP --><\/p>\n<p>document.addEventListener(‘DOMContentLoaded’, function() {<br \/>\n const formulario = document.getElementById(‘formulario-reserva’);<\/p>\n<p> \/\/ Configurar fecha m\u00ednima como hoy<br \/>\n const fechaInput = document.getElementById(‘fecha’);<br \/>\n if (fechaInput) {<br \/>\n const hoy = new Date().toISOString().split(‘T’)[0];<br \/>\n fechaInput.min = hoy;<\/p>\n<p> \/\/ Fecha por defecto: ma\u00f1ana<br \/>\n const manana = new Date();<br \/>\n manana.setDate(manana.getDate() + 1);<br \/>\n fechaInput.value = manana.toISOString().split(‘T’)[0];<br \/>\n }<\/p>\n<p> \/\/ Manejar env\u00edo del formulario<br \/>\n formulario.addEventListener(‘submit’, function(event) {<br \/>\n event.preventDefault();<\/p>\n<p> \/\/ Obtener todos los valores<br \/>\n const nombre = document.getElementById(‘nombre’).value.trim();<br \/>\n const telefono = document.getElementById(‘telefono’).value.trim();<br \/>\n const personas = document.getElementById(‘personas’).value;<br \/>\n const fecha = document.getElementById(‘fecha’).value;<br \/>\n const hora = document.getElementById(‘hora’).value;<\/p>\n<p> \/\/ Validar campos obligatorios<br \/>\n if (!nombre || !telefono || !personas || !fecha || !hora) {<br \/>\n alert(‘\u26a0\ufe0f Por favor, completa todos los campos obligatorios.’);<br \/>\n return;<br \/>\n }<\/p>\n<p> \/\/ Validar formato de tel\u00e9fono (10 d\u00edgitos)<br \/>\n const telefonoLimpio = telefono.replace(\/D\/g, ”);<br \/>\n if (telefonoLimpio.length !== 10) {<br \/>\n alert(‘\u26a0\ufe0f Por favor, ingresa un n\u00famero de tel\u00e9fono v\u00e1lido de 10 d\u00edgitos.’);<br \/>\n return;<br \/>\n }<\/p>\n<p> \/\/ Formatear fecha en espa\u00f1ol<br \/>\n const fechaObj = new Date(fecha);<br \/>\n const opciones = { weekday: ‘long’, year: ‘numeric’, month: ‘long’, day: ‘numeric’ };<br \/>\n const fechaFormateada = fechaObj.toLocaleDateString(‘es-ES’, opciones);<\/p>\n<p> \/\/ Crear mensaje para WhatsApp<br \/>\n const mensajeWhatsApp = `*NUEVA RESERVA – D’ANDR\u00c9 GOURMET*%0A%0A` +<br \/>\n `*\ud83d\udc64 Nombre:* ${nombre}%0A` +<br \/>\n `*\ud83d\udcde Tel\u00e9fono:* ${telefonoLimpio}%0A` +<br \/>\n `*\ud83d\udc65 Personas:* ${personas}%0A` +<br \/>\n `*\ud83d\udcc5 Fecha:* ${fechaFormateada}%0A` +<br \/>\n `*\u23f0 Hora:* ${hora}%0A%0A` +<br \/>\n `_Reserva enviada desde el sitio web_`;<\/p>\n<p> \/\/ N\u00famero de WhatsApp – CONFIGURADO CON TU N\u00daMERO: 3174842695<br \/>\n const numeroWhatsApp = ‘573174842695’; \/\/ Formato internacional con c\u00f3digo de pa\u00eds<\/p>\n<p> \/\/ Crear enlace de WhatsApp<br \/>\n const whatsappURL = `https:\/\/wa.me\/${numeroWhatsApp}?text=${mensajeWhatsApp}`;<\/p>\n<p> \/\/ Mostrar confirmaci\u00f3n al usuario<br \/>\n const confirmacion = confirm(`\u2705 Reserva lista para enviar:nn` +<br \/>\n `Nombre: ${nombre}n` +<br \/>\n `Tel\u00e9fono: ${telefonoLimpio}n` +<br \/>\n `Personas: ${personas}n` +<br \/>\n `Fecha: ${fechaFormateada}n` +<br \/>\n `Hora: ${hora}nn` +<br \/>\n `\u00bfAbrir WhatsApp para enviar la reserva?`);<\/p>\n<p> if (confirmacion) {<br \/>\n \/\/ Abrir WhatsApp en nueva pesta\u00f1a<br \/>\n window.open(whatsappURL, ‘_blank’);<\/p>\n<p> \/\/ Opcional: Mostrar mensaje final<br \/>\n alert(‘\ud83d\udcf1 WhatsApp se ha abierto con tu reserva. Solo debes hacer clic en “Enviar” para finalizar.’);<\/p>\n<p> \/\/ Opcional: Resetear formulario<br \/>\n \/\/ formulario.reset();<br \/>\n }<br \/>\n });<\/p>\n<p> \/\/ A\u00f1adir efectos hover a los inputs (igual que en tu c\u00f3digo original)<br \/>\n const inputs = formulario.querySelectorAll(‘input, select’);<br \/>\n inputs.forEach(input => {<br \/>\n input.addEventListener(‘focus’, function() {<br \/>\n this.style.borderColor = ‘white’;<br \/>\n this.style.boxShadow = ‘0 0 0 2px rgba(255, 255, 255, 0.2)’;<br \/>\n });<\/p>\n<p> input.addEventListener(‘blur’, function() {<br \/>\n this.style.borderColor = ‘rgba(255, 255, 255, 0.3)’;<br \/>\n this.style.boxShadow = ‘none’;<br \/>\n });<br \/>\n });<br \/>\n});\n<\/p><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n<section id=\"parZlPzYb8qO_parZlPzYb8qO\" class=\"brz-section brz-css-d-section brz-css-vkucjd\">\n<div class=\"brz-section__content brz-section--boxed brz-css-d-sectionitem-bg brz-css-19kx3w8\" data-brz-custom-id=\"ebn0sL_hA5zo\">\n<div class=\"brz-container brz-css-d-sectionitem-container brz-css-ejuocu\">\n<div id=\"\" class=\"brz-css-d-wrapper brz-css-1k95zin brz-wrapper\">\n<div class=\"brz-map brz-map_styles brz-css-d-map brz-css-1v33nn5\" data-brz-custom-id=\"umh8ljTj8D1U\">\n<div class=\"brz-ui-ed-map-content\"><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n<section id=\"rqsth2lopHM4_rqsth2lopHM4\" class=\"brz-section brz-css-d-section brz-css-2rt05s\">\n<div class=\"brz-section__content brz-section--boxed brz-css-d-sectionitem-bg brz-css-sk8o2f\" data-brz-custom-id=\"m2FK5q1Leeet\">\n<div class=\"brz-container brz-css-d-sectionitem-container brz-css-13izhts\">\n<div id=\"\" class=\"brz-css-d-wrapper brz-css-16z2cqz brz-wrapper\">\n<div class=\"brz-map brz-map_styles brz-css-d-map\" data-brz-custom-id=\"sC8DDF78eVPs\">\n<div class=\"brz-ui-ed-map-content\"><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n<section id=\"b2VTZIMu6YiS_b2VTZIMu6YiS\" class=\"brz-section brz-css-d-section brz-css-6mjy4y\">\n<div class=\"brz-section__content brz-section--boxed brz-css-d-sectionitem-bg brz-css-36k3iq\" data-brz-custom-id=\"sDsptmMwdu0X\">\n<div class=\"brz-container brz-css-d-sectionitem-container brz-css-e4d0kh\">\n<div id=\"\" class=\"brz-css-d-wrapper brz-css-18xbaj3 brz-wrapper\">\n<div class=\"brz-wp-shortcode brz-css-d-wpcustomshortcode brz-css-5937ux\" data-brz-custom-id=\"paKaJQgQ76cv\">\n<div>\n<p> <title>Ubicaci\u00f3n Medell\u00edn – WordPress<\/title><\/p>\n<p> * {<br \/>\n margin: 0;<br \/>\n padding: 0;<br \/>\n box-sizing: border-box;<br \/>\n }<\/p>\n<p> body {<br \/>\n background-color: #f5f5f5;<br \/>\n padding: 20px;<br \/>\n }<\/p>\n<p> .container {<br \/>\n font-family: ‘Poppins’, sans-serif;<br \/>\n position: relative;<br \/>\n width: 100%;<br \/>\n max-width: 1000px;<br \/>\n margin: 0 auto;<br \/>\n overflow: hidden;<br \/>\n border-radius: 0;<br \/>\n box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);<br \/>\n }<\/p>\n<p> .image-container {<br \/>\n position: relative;<br \/>\n width: 100%;<br \/>\n height: 400px;<br \/>\n background-color: #000;<br \/>\n border-radius: 0;<br \/>\n }<\/p>\n<p> .image-container img {<br \/>\n width: 100%;<br \/>\n height: 100%;<br \/>\n object-fit: cover;<br \/>\n object-position: center 30%;<br \/>\n opacity: 0.6;<br \/>\n filter: brightness(0.8);<br \/>\n transition: opacity 0.5s ease;<br \/>\n border-radius: 0;<br \/>\n }<\/p>\n<p> .image-container:hover img {<br \/>\n opacity: 0.7;<br \/>\n filter: brightness(0.9);<br \/>\n }<\/p>\n<p> .text-overlay {<br \/>\n position: absolute;<br \/>\n top: 0;<br \/>\n left: 0;<br \/>\n width: 100%;<br \/>\n height: 100%;<br \/>\n display: flex;<br \/>\n flex-direction: column;<br \/>\n justify-content: center;<br \/>\n align-items: center;<br \/>\n color: white;<br \/>\n text-align: center;<br \/>\n padding: 20px;<br \/>\n }<\/p>\n<p> .city-name {<br \/>\n font-size: 2rem; \/* MUCHO m\u00e1s peque\u00f1o (era 4rem) *\/<br \/>\n font-weight: 700;<br \/>\n margin-bottom: 8px; \/* Menor separaci\u00f3n *\/<br \/>\n text-shadow: 0 2px 6px rgba(0, 0, 0, 0.7);<br \/>\n letter-spacing: 1px;<br \/>\n }<\/p>\n<p> .address {<br \/>\n font-size: 1.1rem; \/* Aumentado ligeramente *\/<br \/>\n font-weight: 400;<br \/>\n margin-bottom: 10px; \/* Reducido para acercar al tel\u00e9fono *\/<br \/>\n text-shadow: 0 2px 5px rgba(0, 0, 0, 0.7);<br \/>\n max-width: 70%;<br \/>\n line-height: 1.4;<br \/>\n }<\/p>\n<p> .phone {<br \/>\n font-size: 1.1rem; \/* Tama\u00f1o similar a la direcci\u00f3n *\/<br \/>\n font-weight: 600; \/* Un poco m\u00e1s grueso para destacar *\/<br \/>\n margin-bottom: 30px; \/* Separaci\u00f3n con el bot\u00f3n *\/<br \/>\n text-shadow: 0 2px 5px rgba(0, 0, 0, 0.7);<br \/>\n color: white;<br \/>\n letter-spacing: 0.5px;<br \/>\n }<\/p>\n<p> \/* QUITADO: el cuadro negro detr\u00e1s del n\u00famero *\/<br \/>\n \/* .phone span {<br \/>\n background-color: rgba(0, 0, 0, 0.2);<br \/>\n padding: 5px 15px;<br \/>\n border-radius: 4px;<br \/>\n font-weight: 700;<br \/>\n } *\/<\/p>\n<p> .whatsapp-btn {<br \/>\n background-color: white;<br \/>\n color: #333;<br \/>\n border: none;<br \/>\n padding: 12px 30px; \/* M\u00e1s peque\u00f1o *\/<br \/>\n font-size: 0.9rem; \/* M\u00e1s peque\u00f1o *\/<br \/>\n font-weight: 600;<br \/>\n font-family: ‘Poppins’, sans-serif;<br \/>\n border-radius: 0;<br \/>\n cursor: pointer;<br \/>\n transition: all 0.3s ease;<br \/>\n text-decoration: none;<br \/>\n display: inline-block;<br \/>\n box-shadow: 0 3px 8px rgba(0, 0, 0, 0.3);<br \/>\n letter-spacing: 0.5px;<br \/>\n border: 1px solid transparent;<br \/>\n }<\/p>\n<p> .whatsapp-btn:hover {<br \/>\n background-color: #f0f0f0;<br \/>\n transform: translateY(-2px);<br \/>\n box-shadow: 0 5px 12px rgba(0, 0, 0, 0.4);<br \/>\n border-color: #ccc;<br \/>\n }<\/p>\n<p> .whatsapp-btn:active {<br \/>\n transform: translateY(0);<br \/>\n }<\/p>\n<p> \/* Efectos de borde puntiagudo adicional *\/<br \/>\n .container::before {<br \/>\n content: ”;<br \/>\n position: absolute;<br \/>\n top: -2px;<br \/>\n left: -2px;<br \/>\n right: -2px;<br \/>\n bottom: -2px;<br \/>\n background: linear-gradient(45deg, #fff, #ddd, #fff);<br \/>\n z-index: -1;<br \/>\n border-radius: 0;<br \/>\n }<\/p>\n<p> \/* Responsive para tablets y m\u00f3viles *\/<br \/>\n @media (max-width: 1024px) {<br \/>\n .container {<br \/>\n max-width: 95%;<br \/>\n }<\/p>\n<p> .city-name {<br \/>\n font-size: 1.8rem;<br \/>\n }<\/p>\n<p> .address {<br \/>\n font-size: 1rem;<br \/>\n margin-bottom: 8px;<br \/>\n }<\/p>\n<p> .phone {<br \/>\n font-size: 1rem;<br \/>\n margin-bottom: 25px;<br \/>\n }<br \/>\n }<\/p>\n<p> @media (max-width: 768px) {<br \/>\n .image-container {<br \/>\n height: 350px;<br \/>\n }<\/p>\n<p> .city-name {<br \/>\n font-size: 1.6rem;<br \/>\n }<\/p>\n<p> .address {<br \/>\n font-size: 0.95rem;<br \/>\n margin-bottom: 8px;<br \/>\n max-width: 80%;<br \/>\n }<\/p>\n<p> .phone {<br \/>\n font-size: 0.95rem;<br \/>\n margin-bottom: 20px;<br \/>\n }<\/p>\n<p> .whatsapp-btn {<br \/>\n padding: 10px 25px;<br \/>\n font-size: 0.85rem;<br \/>\n }<br \/>\n }<\/p>\n<p> @media (max-width: 480px) {<br \/>\n .image-container {<br \/>\n height: 300px;<br \/>\n }<\/p>\n<p> .city-name {<br \/>\n font-size: 1.4rem;<br \/>\n }<\/p>\n<p> .address {<br \/>\n font-size: 0.85rem;<br \/>\n margin-bottom: 6px;<br \/>\n max-width: 85%;<br \/>\n }<\/p>\n<p> .phone {<br \/>\n font-size: 0.85rem;<br \/>\n margin-bottom: 15px;<br \/>\n }<\/p>\n<p> .whatsapp-btn {<br \/>\n padding: 8px 20px;<br \/>\n font-size: 0.8rem;<br \/>\n }<\/p>\n<p> body {<br \/>\n padding: 10px;<br \/>\n }<br \/>\n }<\/p>\n<p> \/* Para pantallas muy grandes *\/<br \/>\n @media (min-width: 1600px) {<br \/>\n .container {<br \/>\n max-width: 1200px;<br \/>\n }<\/p>\n<p> .image-container {<br \/>\n height: 450px;<br \/>\n }<\/p>\n<p> .city-name {<br \/>\n font-size: 2.2rem; \/* Relativamente peque\u00f1o incluso en pantallas grandes *\/<br \/>\n }<\/p>\n<p> .address {<br \/>\n font-size: 1.2rem;<br \/>\n }<\/p>\n<p> .phone {<br \/>\n font-size: 1.2rem;<br \/>\n }<br \/>\n }<\/p>\n<div class=\"container\">\n<div class=\"image-container\">\n <!-- Imagen de fondo ACTUALIZADA --><br \/>\n <img decoding=\"async\" src=\"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/IMG-20190714-WA0030.jpg\" alt=\"Medell\u00edn\"><\/p>\n<div class=\"text-overlay\">\n<h1 class=\"city-name\">Medell\u00edn<\/h1>\n<p class=\"address\">Carrera 37 #10-15 El Poblado<\/p>\n<p class=\"phone\">Tel: 604 777 9728<\/p>\n<p> <a href=\"https:\/\/wa.me\/573174842695?text=Hola%20estoy%20interesado%20en%20sus%20servicios\" class=\"whatsapp-btn\" target=\"_blank\">Contacto<\/a>\n <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> document.addEventListener(‘DOMContentLoaded’, function() {<br \/>\n const img = document.querySelector(‘.image-container img’);<\/p>\n<p> \/\/ Efecto de carga de imagen<br \/>\n img.addEventListener(‘load’, function() {<br \/>\n this.style.transition = ‘opacity 1s ease’;<br \/>\n this.style.opacity = ‘0.6’;<br \/>\n });<\/p>\n<p> \/\/ Si la imagen ya est\u00e1 cargada (cach\u00e9)<br \/>\n if (img.complete) {<br \/>\n img.style.opacity = ‘0.6’;<br \/>\n }<\/p>\n<p> \/\/ Ajustar el recorte de imagen seg\u00fan el tama\u00f1o de pantalla<br \/>\n function adjustImagePosition() {<br \/>\n const width = window.innerWidth;<br \/>\n if (width <= 768) {<br \/>\n img.style.objectPosition = 'center 40%';<br \/>\n } else {<br \/>\n img.style.objectPosition = 'center 30%';<br \/>\n }<br \/>\n }<\/p>\n<p> \/\/ Ajustar al cargar y al redimensionar<br \/>\n adjustImagePosition();<br \/>\n window.addEventListener('resize', adjustImagePosition);<br \/>\n });<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n<section id=\"qoI04rTQJEDv_qoI04rTQJEDv\" class=\"brz-section brz-css-d-section brz-css-139kf9j\">\n<div class=\"brz-section__content brz-section--boxed brz-css-d-sectionitem-bg brz-css-1tq24b7\" data-brz-custom-id=\"fFZCsDb0ksWy\">\n<div class=\"brz-container brz-css-d-sectionitem-container brz-css-1vyxx9k\">\n<div id=\"\" class=\"brz-css-d-wrapper brz-css-1htsd9b brz-wrapper\">\n<div class=\"brz-wp-shortcode brz-css-d-wpcustomshortcode brz-css-1qondxu\" data-brz-custom-id=\"j3pLmb24x64M\">\n<div>\n.dandroca-contacto-block {<br \/>\n font-family: -apple-system, BlinkMacSystemFont, ‘Segoe UI’, Roboto, Oxygen, Ubuntu, sans-serif;<br \/>\n width: 100%;<br \/>\n margin: 0 auto;<br \/>\n padding: 20px 15px;<br \/>\n color: white;<br \/>\n background-color: #1A3E5F;<br \/>\n font-size: 12px;<br \/>\n box-sizing: border-box;<br \/>\n}<\/p>\n<p>\/* Contenedor interno para centrar el contenido *\/<br \/>\n.dandroca-contacto-block .contenedor-interno {<br \/>\n max-width: 1000px;<br \/>\n margin: 0 auto;<br \/>\n width: 100%;<br \/>\n}<\/p>\n<p>\/* Contenedor principal – todo lado a lado *\/<br \/>\n.dandroca-contacto-block .contenedor-principal {<br \/>\n display: flex;<br \/>\n flex-wrap: wrap;<br \/>\n gap: 30px;<br \/>\n margin-bottom: 15px;<br \/>\n}<\/p>\n<p>\/* Columna izquierda: Contacto *\/<br \/>\n.dandroca-contacto-block .columna-contacto {<br \/>\n flex: 1;<br \/>\n min-width: 250px;<br \/>\n}<\/p>\n<p>.dandroca-contacto-block .titulo-contacto {<br \/>\n color: white;<br \/>\n font-size: 14px;<br \/>\n font-weight: 600;<br \/>\n margin-bottom: 8px;<br \/>\n border-bottom: 1px solid rgba(255, 255, 255, 0.3);<br \/>\n padding-bottom: 3px;<br \/>\n}<\/p>\n<p>.dandroca-contacto-block .info-contacto {<br \/>\n margin-top: 3px;<br \/>\n}<\/p>\n<p>.dandroca-contacto-block .telefonos {<br \/>\n font-size: 12px;<br \/>\n font-weight: 500;<br \/>\n margin-bottom: 6px;<br \/>\n color: white;<br \/>\n}<\/p>\n<p>.dandroca-contacto-block .email {<br \/>\n font-size: 12px;<br \/>\n color: white;<br \/>\n font-weight: 500;<br \/>\n margin-bottom: 15px;<br \/>\n}<\/p>\n<p>\/* Botones de redes sociales minimalistas *\/<br \/>\n.dandroca-contacto-block .redes-sociales {<br \/>\n display: flex;<br \/>\n gap: 12px;<br \/>\n margin-top: 15px;<br \/>\n}<\/p>\n<p>.dandroca-contacto-block .social-btn {<br \/>\n display: inline-flex;<br \/>\n align-items: center;<br \/>\n justify-content: center;<br \/>\n width: 40px;<br \/>\n height: 40px;<br \/>\n border-radius: 50%;<br \/>\n background-color: rgba(255, 255, 255, 0.1);<br \/>\n border: 1px solid rgba(255, 255, 255, 0.3);<br \/>\n color: white;<br \/>\n text-decoration: none;<br \/>\n transition: all 0.3s ease;<br \/>\n font-size: 18px;<br \/>\n font-weight: 400;<br \/>\n}<\/p>\n<p>.dandroca-contacto-block .social-btn:hover {<br \/>\n background-color: rgba(255, 255, 255, 0.2);<br \/>\n border-color: rgba(255, 255, 255, 0.5);<br \/>\n transform: translateY(-2px);<br \/>\n}<\/p>\n<p>\/* Icono de Instagram en blanco *\/<br \/>\n.dandroca-contacto-block .instagram-btn {<br \/>\n position: relative;<br \/>\n}<\/p>\n<p>.dandroca-contacto-block .instagram-btn::before {<br \/>\n content: “”;<br \/>\n display: inline-block;<br \/>\n width: 20px;<br \/>\n height: 20px;<br \/>\n background-image: url(“data:image\/svg+xml,%3Csvg xmlns=’http:\/\/www.w3.org\/2000\/svg’ viewBox=’0 0 24 24′ fill=’white’%3E%3Cpath d=’M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z’\/%3E%3C\/svg%3E”);<br \/>\n background-repeat: no-repeat;<br \/>\n background-position: center;<br \/>\n background-size: contain;<br \/>\n}<\/p>\n<p>\/* Icono de Facebook en blanco *\/<br \/>\n.dandroca-contacto-block .facebook-btn::before {<br \/>\n content: “”;<br \/>\n display: inline-block;<br \/>\n width: 20px;<br \/>\n height: 20px;<br \/>\n background-image: url(“data:image\/svg+xml,%3Csvg xmlns=’http:\/\/www.w3.org\/2000\/svg’ viewBox=’0 0 24 24′ fill=’white’%3E%3Cpath 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’\/%3E%3C\/svg%3E”);<br \/>\n background-repeat: no-repeat;<br \/>\n background-position: center;<br \/>\n background-size: contain;<br \/>\n}<\/p>\n<p>\/* Contenedor para Direcci\u00f3n y Horario (lado a lado) *\/<br \/>\n.dandroca-contacto-block .columna-derecha {<br \/>\n flex: 2;<br \/>\n min-width: 300px;<br \/>\n display: flex;<br \/>\n gap: 30px;<br \/>\n}<\/p>\n<p>\/* Estilos para Direcci\u00f3n y Horario *\/<br \/>\n.dandroca-contacto-block .seccion-direccion,<br \/>\n.dandroca-contacto-block .seccion-horario {<br \/>\n flex: 1;<br \/>\n}<\/p>\n<p>.dandroca-contacto-block .titulo-seccion {<br \/>\n color: white;<br \/>\n font-size: 14px;<br \/>\n font-weight: 600;<br \/>\n margin-bottom: 8px;<br \/>\n border-bottom: 1px solid rgba(255, 255, 255, 0.3);<br \/>\n padding-bottom: 3px;<br \/>\n}<\/p>\n<p>.dandroca-contacto-block .contenido-seccion {<br \/>\n font-size: 12px;<br \/>\n line-height: 1.4;<br \/>\n color: rgba(255, 255, 255, 0.95);<br \/>\n}<\/p>\n<p>\/* Secci\u00f3n de suscripci\u00f3n *\/<br \/>\n.dandroca-contacto-block .separator {<br \/>\n height: 1px;<br \/>\n background-color: rgba(255, 255, 255, 0.2);<br \/>\n margin: 20px 0;<br \/>\n}<\/p>\n<p>.dandroca-contacto-block .suscripcion {<br \/>\n background-color: rgba(255, 255, 255, 0.1);<br \/>\n padding: 15px;<br \/>\n margin: 15px 0;<br \/>\n border: 1px solid rgba(255, 255, 255, 0.15);<br \/>\n}<\/p>\n<p>.dandroca-contacto-block .suscripcion h3 {<br \/>\n color: white;<br \/>\n margin-top: 0;<br \/>\n margin-bottom: 10px;<br \/>\n font-size: 14px;<br \/>\n font-weight: 600;<br \/>\n}<\/p>\n<p>.dandroca-contacto-block .suscripcion-form {<br \/>\n display: flex;<br \/>\n gap: 8px;<br \/>\n}<\/p>\n<p>.dandroca-contacto-block .email-input {<br \/>\n flex-grow: 1;<br \/>\n padding: 8px 12px;<br \/>\n border: none;<br \/>\n border-radius: 3px;<br \/>\n font-size: 12px;<br \/>\n background-color: white;<br \/>\n}<\/p>\n<p>.dandroca-contacto-block .unete-btn {<br \/>\n background-color: #FF7F50;<br \/>\n color: white;<br \/>\n border: none;<br \/>\n border-radius: 3px;<br \/>\n padding: 8px 20px;<br \/>\n font-size: 12px;<br \/>\n font-weight: 600;<br \/>\n cursor: pointer;<br \/>\n transition: background-color 0.3s;<br \/>\n white-space: nowrap;<br \/>\n}<\/p>\n<p>.dandroca-contacto-block .unete-btn:hover {<br \/>\n background-color: #FF6347;<br \/>\n}<\/p>\n<p>.dandroca-contacto-block .gracias-mensaje {<br \/>\n text-align: center;<br \/>\n font-size: 16px;<br \/>\n color: white;<br \/>\n margin: 20px 0;<br \/>\n font-weight: 600;<br \/>\n display: none;<br \/>\n}<\/p>\n<p>.dandroca-contacto-block .legal-links {<br \/>\n display: flex;<br \/>\n justify-content: center;<br \/>\n gap: 20px;<br \/>\n margin-top: 15px;<br \/>\n font-size: 11px;<br \/>\n}<\/p>\n<p>.dandroca-contacto-block .legal-links a {<br \/>\n color: rgba(255, 255, 255, 0.9);<br \/>\n text-decoration: none;<br \/>\n font-weight: 500;<br \/>\n border-bottom: 1px solid rgba(255, 255, 255, 0.3);<br \/>\n padding-bottom: 1px;<br \/>\n}<\/p>\n<p>.dandroca-contacto-block .legal-links a:hover {<br \/>\n color: white;<br \/>\n border-bottom-color: white;<br \/>\n}<\/p>\n<p>\/* Responsive *\/<br \/>\n@media (max-width: 768px) {<br \/>\n .dandroca-contacto-block {<br \/>\n padding: 15px 12px;<br \/>\n }<\/p>\n<p> .dandroca-contacto-block .contenedor-principal {<br \/>\n flex-direction: column;<br \/>\n gap: 20px;<br \/>\n }<\/p>\n<p> .dandroca-contacto-block .columna-derecha {<br \/>\n flex-direction: column;<br \/>\n gap: 20px;<br \/>\n }<\/p>\n<p> .dandroca-contacto-block .columna-contacto,<br \/>\n .dandroca-contacto-block .columna-derecha {<br \/>\n min-width: 100%;<br \/>\n }<\/p>\n<p> .dandroca-contacto-block .suscripcion-form {<br \/>\n flex-direction: column;<br \/>\n }<\/p>\n<p> .dandroca-contacto-block .redes-sociales {<br \/>\n flex-wrap: wrap;<br \/>\n }<br \/>\n}<\/p>\n<p>@media (max-width: 480px) {<br \/>\n .dandroca-contacto-block {<br \/>\n padding: 10px;<br \/>\n font-size: 11px;<br \/>\n }<\/p>\n<p> .dandroca-contacto-block .titulo-contacto,<br \/>\n .dandroca-contacto-block .titulo-seccion {<br \/>\n font-size: 13px;<br \/>\n }<\/p>\n<p> .dandroca-contacto-block .contenido-seccion,<br \/>\n .dandroca-contacto-block .telefonos,<br \/>\n .dandroca-contacto-block .email {<br \/>\n font-size: 11px;<br \/>\n }<\/p>\n<p> .dandroca-contacto-block .suscripcion h3 {<br \/>\n font-size: 13px;<br \/>\n }<\/p>\n<p> .dandroca-contacto-block .gracias-mensaje {<br \/>\n font-size: 14px;<br \/>\n }<\/p>\n<p> .dandroca-contacto-block .social-btn {<br \/>\n width: 36px;<br \/>\n height: 36px;<br \/>\n font-size: 16px;<br \/>\n }<br \/>\n}<\/p>\n<p>\/* Para asegurar que ocupe todo el ancho en WordPress *\/<br \/>\nbody .dandroca-contacto-block {<br \/>\n width: 100vw;<br \/>\n position: relative;<br \/>\n left: 50%;<br \/>\n right: 50%;<br \/>\n margin-left: -50vw;<br \/>\n margin-right: -50vw;<br \/>\n}<\/p>\n<div class=\"dandroca-contacto-block\">\n<div class=\"contenedor-interno\">\n<div class=\"contenedor-principal\">\n <!-- Columna izquierda: Informaci\u00f3n de contacto --><\/p>\n<div class=\"columna-contacto\">\n<div class=\"titulo-contacto\">Cont\u00e1ctanos<\/div>\n<div class=\"info-contacto\">\n<div class=\"telefonos\">3174842695 \u2013 6047779728<\/div>\n<div class=\"email\">contacto@dandre.com.co<\/div>\n<p> <!-- Botones de Redes Sociales Minimalistas --><\/p>\n<div class=\"redes-sociales\">\n <a href=\"https:\/\/www.facebook.com\/d.andre.restaurante\/?ref=_xav_ig_profile_page_web_bt#\" target=\"_blank\" class=\"social-btn facebook-btn\" title=\"S\u00edguenos en Facebook\" aria-label=\"Facebook\"><br \/>\n <\/a><\/p>\n<p> <a href=\"https:\/\/www.instagram.com\/d.andre.restaurante\/\" target=\"_blank\" class=\"social-btn instagram-btn\" title=\"S\u00edguenos en Instagram\" aria-label=\"Instagram\"><br \/>\n <\/a>\n <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Columna derecha: Direcci\u00f3n y Horario LADO A LADO --><\/p>\n<div class=\"columna-derecha\">\n <!-- Secci\u00f3n Direcci\u00f3n --><\/p>\n<div class=\"seccion-direccion\">\n<div class=\"titulo-seccion\">Direcci\u00f3n<\/div>\n<div class=\"contenido-seccion\">Carrera 37 #10-15<\/div>\n<\/p><\/div>\n<p> <!-- Secci\u00f3n Horario (justo al frente de Direcci\u00f3n) --><\/p>\n<div class=\"seccion-horario\">\n<div class=\"titulo-seccion\">Horario de trabajo<\/div>\n<div class=\"contenido-seccion\">\n Lun – Sab: 7:00 – 16:00<br \/>\n Domingo: 7:30 – 15:30\n <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"separator\"><\/div>\n<p> <!-- Secci\u00f3n de suscripci\u00f3n --><\/p>\n<div class=\"suscripcion\">\n<h3>Suscr\u00edbete ahora *<\/h3>\n<div class=\"suscripcion-form\">\n<p> <button class=\"unete-btn\">\u00danete<\/button>\n <\/div>\n<\/p><\/div>\n<div class=\"separator\"><\/div>\n<p> <!-- Mensaje de gracias --><\/p>\n<div class=\"gracias-mensaje\">\u00a1Gracias por tu mensaje!<\/div>\n<p> <!-- Enlaces legales --><\/p>\n<div class=\"legal-links\">\n <a href=\"#\">T\u00e9rminos y Condiciones<\/a><br \/>\n <a href=\"#\">Pol\u00edtica de privacidad<\/a>\n <\/div>\n<\/p><\/div>\n<\/div>\n<p>document.addEventListener(‘DOMContentLoaded’, function() {<br \/>\n \/\/ Manejar el env\u00edo del formulario de suscripci\u00f3n<br \/>\n const suscripcionBtn = document.querySelector(‘.unete-btn’);<br \/>\n const emailInput = document.querySelector(‘.email-input’);<br \/>\n const graciasMensaje = document.querySelector(‘.gracias-mensaje’);<\/p>\n<p> if (suscripcionBtn) {<br \/>\n suscripcionBtn.addEventListener(‘click’, function() {<br \/>\n const email = emailInput.value.trim();<\/p>\n<p> if (email === ”) {<br \/>\n alert(‘Por favor, ingresa tu email’);<br \/>\n emailInput.focus();<br \/>\n return;<br \/>\n }<\/p>\n<p> if (!isValidEmail(email)) {<br \/>\n alert(‘Por favor, ingresa un email v\u00e1lido’);<br \/>\n emailInput.focus();<br \/>\n return;<br \/>\n }<\/p>\n<p> \/\/ Mostrar mensaje de agradecimiento<br \/>\n graciasMensaje.style.display = ‘block’;<\/p>\n<p> \/\/ Ocultar mensaje despu\u00e9s de 5 segundos<br \/>\n setTimeout(function() {<br \/>\n graciasMensaje.style.display = ‘none’;<br \/>\n }, 5000);<\/p>\n<p> \/\/ Aqu\u00ed normalmente enviar\u00edas los datos a un servidor<br \/>\n console.log(`Email suscrito: ${email}`);<br \/>\n emailInput.value = ”;<br \/>\n });<\/p>\n<p> \/\/ Permitir enviar con la tecla Enter<br \/>\n emailInput.addEventListener(‘keypress’, function(e) {<br \/>\n if (e.key === ‘Enter’) {<br \/>\n suscripcionBtn.click();<br \/>\n }<br \/>\n });<br \/>\n }<\/p>\n<p> \/\/ Funci\u00f3n para validar email<br \/>\n function isValidEmail(email) {<br \/>\n const re = \/^[^s@]+@[^s@]+.[^s@]+$\/;<br \/>\n return re.test(email);<br \/>\n }<br \/>\n});\n<\/p><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n<section id=\"gallery\" data-brz-id=\"pB8AN1FfuVh3_pB8AN1FfuVh3\" class=\"brz-section brz-css-d-section brz-css-dghwob\">\n<div class=\"brz-section__content brz-section--boxed brz-css-d-sectionitem-bg brz-css-g8j2s5\" data-brz-custom-id=\"hCrw_4PKQfm_\">\n<div class=\"brz-bg\">\n<div class=\"brz-bg-color\"><\/div>\n<\/div>\n<div class=\"brz-container brz-css-d-sectionitem-container brz-css-1ww6ftq\">\n<div id=\"\" class=\"brz-css-d-wrapper brz-css-r-wrapper brz-css-14s8ixi brz-wrapper\">\n<div class=\"brz-spacer brz-css-d-spacer brz-css-1pb2gq4\"><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n<section id=\"mriMvov2WNlS_mriMvov2WNlS\" class=\"brz-section brz-css-d-section brz-css-18gz1oh\">\n<div class=\"brz-section__content brz-section--boxed brz-css-d-sectionitem-bg brz-css-fedwnz\" data-brz-custom-id=\"zV3PmMzgySdQ\">\n<div class=\"brz-container brz-css-d-sectionitem-container brz-css-1584nny\">\n<div id=\"\" class=\"brz-css-d-wrapper brz-css-1vzgx6n brz-wrapper\">\n<div class=\"brz-image brz-css-d-image-ju7vq0nhtayt-parent brz-css-1ptdz8h\" data-brz-custom-id=\"ju7VQ0nhTAYt\">\n<div class=\"brz-shortcode__placeholder\"><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section><\/div>\n<p><!-- version:1776855757 --><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Header – D’Andr\u00e9 \/* Reset y estilos base *\/ * { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: -apple-system, BlinkMacSystemFont, ‘Segoe UI’, Roboto, Oxygen, Ubuntu, sans-serif; } \/* Header principal *\/ .dandre-header { position: fixed; top: 0; left: 0; width: 100%; background-color: white; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); z-index: […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"brizy-blank-template.php","meta":{"footnotes":""},"class_list":["post-34","page","type-page","status-publish","hentry"],"brizy_media":[{"id":12,"url":"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/Diseno-sin-titulo-48.png","name":"Diseno-sin-titulo-48.png","meta":{"brizy_attachment_uid":"wp-4ff4805f2212c5adf434a2efa9ba6999.png","brizy_post_uid":["d95896b15847c1e96acdab6398517aaf"]}},{"id":42,"url":"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/Captura-de-pantalla-2025-12-05-a-las-6.14.30-a.m.png","name":"Captura-de-pantalla-2025-12-05-a-las-6.14.30-a.m.png","meta":{"brizy_attachment_uid":"wp-77f43636cd8e9f0cd0f63e775c04288b.png","brizy_post_uid":["d95896b15847c1e96acdab6398517aaf"]}},{"id":89,"url":"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/IMG-20190504-WA0029.jpg","name":"IMG-20190504-WA0029.jpg","meta":{"brizy_attachment_uid":"wp-62303091f9a5b8c55b03fa4e1592921e.jpg","brizy_post_uid":["d95896b15847c1e96acdab6398517aaf"]}},{"id":120,"url":"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/Captura-de-pantalla-2025-12-05-a-las-5.31.43-p.m-scaled.png","name":"Captura-de-pantalla-2025-12-05-a-las-5.31.43-p.m.png","meta":{"brizy_attachment_uid":"wp-bdacfb311a65ef3ae35158174e56a6e4.png","brizy_post_uid":["d95896b15847c1e96acdab6398517aaf"]}},{"id":134,"url":"https:\/\/www.dandre.com.co\/wp-content\/uploads\/2025\/12\/Captura-de-pantalla-2025-12-05-a-las-6.44.26-p.m.png","name":"Captura-de-pantalla-2025-12-05-a-las-6.44.26-p.m.png","meta":{"brizy_attachment_uid":"wp-0f001501113147d05576869aed187ce4.png","brizy_post_uid":["d95896b15847c1e96acdab6398517aaf"]}}],"_links":{"self":[{"href":"https:\/\/www.dandre.com.co\/index.php\/wp-json\/wp\/v2\/pages\/34","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.dandre.com.co\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.dandre.com.co\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.dandre.com.co\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.dandre.com.co\/index.php\/wp-json\/wp\/v2\/comments?post=34"}],"version-history":[{"count":30,"href":"https:\/\/www.dandre.com.co\/index.php\/wp-json\/wp\/v2\/pages\/34\/revisions"}],"predecessor-version":[{"id":2474,"href":"https:\/\/www.dandre.com.co\/index.php\/wp-json\/wp\/v2\/pages\/34\/revisions\/2474"}],"wp:attachment":[{"href":"https:\/\/www.dandre.com.co\/index.php\/wp-json\/wp\/v2\/media?parent=34"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}