/* Reseñas de Google ([mdpd_resenas], mdpd-resenas.php). Genérico: cada sitio pone sus colores en sitio.css
   con --rs-acento (botón, flechas al pasar) y --rs-texto. Adaptado de mardelplatadigital.com (2026-10-05). */
.rs { --rs-acento: #1FB8CD; --rs-texto: #1E293B; --rs-suave: #64748B; --rs-linea: #E2E8EE; display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; text-align: left; }
.rs > * { min-width: 0; } /* sin esto, la fila deslizable ensancha la grilla y desborda en el celular */
.rs-titulo { text-align: center; margin: 0; }
.rs-cab { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 18px; }
.rs-g { width: 40px; height: 40px; flex: none; }
.rs-resumen { display: grid; grid-template-columns: auto auto; align-items: center; column-gap: 10px; margin-right: auto; }
.rs-nota { font-size: 32px; font-weight: 800; line-height: 1; color: var(--rs-texto); }
.rs-resumen small { grid-column: 1 / -1; font-size: 14px; color: var(--rs-suave); }
.rs-est { display: inline-block; font-size: 20px; line-height: 1; letter-spacing: 2px; }
.rs-est::before { content: "★★★★★"; background: linear-gradient(90deg, #FBBC05 calc(var(--n) / 5 * 100%), #CBD5E1 0); -webkit-background-clip: text; background-clip: text; color: transparent; }
.rs-botones { display: flex; flex-wrap: wrap; gap: 10px; }
.rs .rs-btn { display: inline-block; padding: 11px 20px; border-radius: 6px; border: 2px solid var(--rs-acento); background: var(--rs-acento); color: #fff !important; font-weight: 700; text-decoration: none; line-height: 1.2; }
.rs .rs-btn.es-sec { background: transparent; color: var(--rs-acento) !important; }
.rs .rs-btn:hover { filter: brightness(.92); }
.rs-marco { position: relative; }
.rs-lista { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 48px) / 4); gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 4px; }
.rs-lista::-webkit-scrollbar { display: none; }
.rs-item { margin: 0; display: grid; gap: 10px; align-content: start; padding: 20px; border: 1px solid var(--rs-linea); border-radius: 12px; background: #fff; scroll-snap-align: start; }
.rs-autor { display: flex; align-items: center; gap: 10px; }
.rs-autor img, .rs-autor i { width: 40px !important; height: 40px !important; flex: none; border-radius: 50%; object-fit: cover; }
.rs-autor i { display: grid; place-items: center; background: var(--rs-acento); color: #fff; font-style: normal; font-weight: 800; }
.rs-autor b { display: block; font-size: 15px; font-weight: 800; line-height: 1.25; }
.rs-autor b a { color: var(--rs-texto) !important; text-decoration: none; }
.rs-autor small { display: block; font-size: 13px; color: var(--rs-suave); }
.rs-item .rs-est { font-size: 15px; }
.rs-item blockquote { margin: 0; padding: 0; border: 0; background: none; font-size: 15px; line-height: 1.6; font-style: normal; display: -webkit-box; -webkit-line-clamp: 7; -webkit-box-orient: vertical; overflow: hidden; }
.rs-item blockquote::before, .rs-item blockquote::after { content: none; }
.rs-fuente { justify-self: start; font-size: 13px; font-weight: 700; color: var(--rs-suave) !important; text-decoration: none; }
.rs-fuente:hover, .rs-autor b a:hover { color: var(--rs-acento) !important; }
.rs-flecha { position: absolute; top: calc(50% - 23px); z-index: 2; width: 46px; height: 46px; padding: 0; margin: 0; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--rs-linea); background: #fff; color: var(--rs-texto); cursor: pointer; box-shadow: 0 8px 20px -8px rgba(15, 23, 42, .35); transition: background-color .15s, color .15s, opacity .2s; }
.rs-flecha svg { width: 20px; height: 20px; }
.rs-flecha.es-ant { left: -23px; }
.rs-flecha.es-ant svg { transform: scaleX(-1); }
.rs-flecha.es-sig { right: -23px; }
.rs-flecha:hover { background: var(--rs-acento); border-color: var(--rs-acento); color: #fff; }
.rs-flecha:disabled { opacity: 0; pointer-events: none; }
.rs-aviso { margin: -6px 0 0; font-size: 13px; color: var(--rs-suave); }
@media (max-width: 1100px) { .rs-lista { grid-auto-columns: calc((100% - 32px) / 3); } }
@media (max-width: 700px) { .rs-lista { grid-auto-columns: 82%; } .rs-flecha { display: none; } }
@media (prefers-reduced-motion: reduce) { .rs-flecha { transition: none; } }
