/* Sección "Lo que dicen de nosotros" (reseñas) del home.
   Copiado tal cual de index.html. La regla ".rio" (máscara de
   desvanecido en los bordes + overflow) es compartida con el
   carrusel de videos (home-vid.css) — en el original vive sin
   prefijo porque una sola sección de CSS la definía para ambos;
   aquí se repite en los dos archivos para que cada uno funcione
   solo, sin depender del orden en que se carguen. */
.rio{position:relative;z-index:2;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);}
#s-res .sec{position:relative;padding:64px 0 74px;}
#s-res .sec::before{content:"";position:absolute;width:660px;height:660px;border-radius:44% 56% 62% 38% / 50% 42% 58% 50%;background:radial-gradient(circle,rgba(0,165,149,.1),transparent 70%);right:-270px;top:-290px;animation:res_morf 18s ease-in-out infinite alternate;}
#s-res .sec::after{content:"";position:absolute;width:430px;height:430px;border-radius:38% 62% 55% 45% / 45% 55% 45% 55%;background:radial-gradient(circle,rgba(245,148,31,.09),transparent 70%);left:-170px;bottom:-160px;}
@keyframes res_morf{to{border-radius:56% 44% 40% 60% / 44% 56% 44% 56%;}}
#s-res .head{max-width:1240px;margin:0 auto 34px;padding:0 32px;position:relative;z-index:2;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;}
#s-res .eb{display:inline-flex;align-items:center;gap:7px;background:rgba(245,148,31,.1);border:1.5px solid var(--cta);color:var(--cta-hover);font-family:'Poppins';font-size:11px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;border-radius:999px;padding:6px 15px;margin-bottom:12px;}
#s-res h2{font-family:'Poppins';font-weight:800;font-size:clamp(26px,3.2vw,38px);letter-spacing:-1px;line-height:1.1;}
#s-res h2 .cur{font-family:'Caveat';font-weight:700;color:var(--cta-hover);font-size:1.1em;}
#s-res .nota-ejemplo{font-size:11px;color:var(--tinta-suave);margin-top:8px;font-style:italic;}
#s-res .rating-box{background:#fff;border:1.5px solid var(--borde);border-radius:20px;padding:18px 24px;display:flex;align-items:center;gap:16px;box-shadow:0 16px 34px rgba(30,43,39,.08);}
#s-res .rating-box .num{font-family:'Poppins';font-weight:800;font-size:38px;line-height:1;color:var(--tinta);}
#s-res .rating-box .det small{font-size:12px;color:var(--tinta-suave);display:block;}
#s-res .estrellas{color:var(--cta);font-size:15px;letter-spacing:2px;}
#s-res .rio-in{display:flex;gap:18px;width:max-content;animation:res_fluir 46s linear infinite;padding:6px 0 18px;}
#s-res .rio:hover .rio-in{animation-play-state:paused;}
@keyframes res_fluir{to{transform:translateX(-50%);}}
#s-res .res{width:320px;background:#fff;border:1.5px solid var(--borde);border-radius:22px;padding:22px;flex-shrink:0;display:flex;flex-direction:column;gap:12px;transition:transform .25s,box-shadow .25s;border-top:4px solid var(--acc,var(--resalte));}
#s-res .res:hover{transform:translateY(-5px);box-shadow:0 22px 46px rgba(30,43,39,.12);}
#s-res .res .top{display:flex;align-items:center;justify-content:space-between;gap:10px;}
#s-res .res .quien{display:flex;align-items:center;gap:11px;}
#s-res .avatar{width:42px;height:42px;border-radius:50%;background:var(--acc,var(--resalte));color:#fff;font-family:'Poppins';font-weight:800;font-size:15px;display:grid;place-items:center;flex-shrink:0;}
#s-res .res b{font-family:'Poppins';font-weight:700;font-size:14px;display:block;line-height:1.2;}
#s-res .res .lugar{font-size:11px;color:var(--tinta-suave);}
#s-res .verif{display:inline-flex;align-items:center;gap:4px;font-family:'Poppins';font-size:9.5px;font-weight:700;color:var(--resalte-hondo);background:rgba(0,165,149,.09);border-radius:999px;padding:4px 9px;white-space:nowrap;}
#s-res .res .texto{font-size:13.5px;color:var(--tinta);line-height:1.55;}
#s-res .res .prod{display:flex;align-items:center;gap:10px;border-top:1px solid var(--borde);padding-top:12px;margin-top:auto;}
#s-res .res .prod img{width:54px;height:54px;border-radius:12px;object-fit:contain;}
#s-res .res .prod small{font-size:11.5px;color:var(--tinta-suave);font-family:'Poppins';font-weight:600;}
@media(max-width:640px){
  #s-res .res{width:270px;padding:18px;}
  #s-res .res .top{flex-direction:column-reverse;align-items:flex-start;gap:8px;}
  #s-res .res .quien{width:100%;}
  #s-res .rating-box .num{font-size:30px;}
  /* A pedido del dueño: en escritorio la velocidad estaba bien, pero
     en móvil se sentía muy lenta. Se acorta la duración de la misma
     animación solo aquí (46s → 28s), sin tocar la de escritorio. */
  #s-res .rio-in{animation-duration:28s;}
}