.resenas { background: var(--superficie); border-block: 1px solid var(--borde); }
.resenas-carril {
    display: flex;
    gap: 1.4rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    scrollbar-width: none;
    padding-bottom: 4px;
}
.resenas-carril::-webkit-scrollbar { display: none; }
.resena {
    flex: 0 0 clamp(280px, 85%, 340px);
    scroll-snap-align: start;
    background: var(--c-blanco);
    border: 1px solid var(--borde);
    border-radius: var(--radio);
    padding: 1.7rem 1.6rem;
    display: flex;
    flex-direction: column;
    box-shadow: var(--sombra-suave);
}
.resena-cab { display: flex; align-items: center; gap: .8rem; margin-bottom: 1rem; }
.resena-avatar {
    width: 44px; height: 44px; flex-shrink: 0;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 999px;
    color: #fff;
    font-family: var(--fuente-titulo); font-weight: 700; font-size: 1.1rem;
}
.av-1 { background: var(--c-cafe); }
.av-2 { background: var(--c-naranjo-oscuro); }
.av-3 { background: var(--c-carbon); }
.resena-nombre { flex: 1; min-width: 0; font-family: var(--fuente-titulo); font-weight: 600; font-size: .98rem; }
.google-g { width: 20px; height: 20px; flex-shrink: 0; }

.resena-estrellas { display: flex; gap: 1px; color: #FBBC04; margin-bottom: .8rem; }
.resena-estrella { width: 18px; height: 18px; }
.resena-texto { color: var(--texto); font-size: .96rem; line-height: 1.6; }

.resenas-controles { display: flex; justify-content: center; gap: .6rem; margin-top: 1.6rem; }
.resenas-flecha {
    width: 44px; height: 44px;
    border: 1px solid var(--borde); border-radius: 999px;
    background: var(--c-blanco); color: var(--c-carbon);
    cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    box-shadow: var(--sombra-suave);
    transition: background .15s ease, border-color .15s ease, transform .15s ease;
}
.resenas-flecha:hover { background: var(--superficie-tostada); border-color: var(--acento-oscuro); transform: translateY(-2px); }
.resenas-prev .icono { transform: rotate(90deg); }
.resenas-next .icono { transform: rotate(-90deg); }

@media (min-width: 700px) { .resena { flex-basis: calc((100% - 1.4rem) / 2); } }
@media (min-width: 980px) { .resena { flex-basis: calc((100% - 2.8rem) / 3); } }
@media (prefers-reduced-motion: reduce) { .resenas-carril { scroll-behavior: auto; } }
