/* ============================================================
   TARJETAS DE OPINIÓN CON ESTRELLAS (Alex, 16-oct-2026)
   Encima de cada testimonio: avatar con la inicial, nombre y cinco estrellas.
   Se carga después de style.css; solo añade, no cambia el resto.
   ============================================================ */
.testi-card { position: relative; }
.testi-card::before {
  content: '\201C';
  position: absolute; right: 18px; top: 2px;
  font-family: var(--font-head); font-size: 4.2rem; line-height: 1;
  color: rgba(25, 167, 184, .16);
  pointer-events: none;
}
.opinion-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.opinion-head .avatar {
  flex: none;
  width: 44px; height: 44px; border-radius: 50%;
  background: linear-gradient(135deg, var(--teal), var(--teal-bright));
  color: #fff;
  font-family: var(--font-head); font-weight: 800; font-size: 1.05rem;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 14px rgba(15, 113, 128, .3);
}
.opinion-head .who { margin-bottom: 3px; line-height: 1.2; }
.stars { display: flex; align-items: center; gap: 7px; line-height: 1; }
.stars span { color: #f5b301; font-size: 1.02rem; letter-spacing: 1px; text-shadow: 0 1px 0 rgba(0, 0, 0, .08); }
.stars small { color: #6b7d82; font-family: var(--font-body); font-weight: 600; font-size: .8rem; }
.testi-card img { cursor: default; }