/* ===== RESEÑAS: mismo diseño que el resto del sitio (tarjetas, iconos flat, azules) ===== */
.resena { padding: 2.5rem 0 3.5rem; background: #fff; }
.resena__card { padding: 1.75rem 1.35rem; text-align: center; max-width: 720px; margin: 0 auto; }
.resena__card--form { text-align: left; max-width: 820px; }
.resena__titulo {
  font-family: 'Barlow Condensed', 'Host Grotesk', sans-serif;
  font-size: clamp(1.6rem, 4vw, 2.1rem);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .01em;
  color: var(--color-acento);
  margin: 0 0 1rem;
  display: flex; align-items: center; justify-content: center; gap: .6rem;
}
.resena__card--form .resena__titulo { justify-content: flex-start; margin-bottom: 1.25rem; }
.resena__titulo img { width: 36px; height: 36px; object-fit: contain; }

/* Selector de estrellas */
.stars-container { display: flex; justify-content: center; gap: .35rem; margin: .5rem 0 .75rem; }
.star-btn {
  background: none; border: none; cursor: pointer; padding: .25rem; line-height: 1;
  font-size: 2.6rem; color: #d5dbe6;
  transition: color .2s, transform .2s;
}
.star-btn:hover, .star-btn.active { color: #f5b301; transform: scale(1.12); }
.star-btn.selected { animation: starPop .3s ease; }
.star-btn:focus-visible { outline: 3px solid var(--color-primario); outline-offset: 2px; border-radius: 8px; }
@keyframes starPop { 0% { transform: scale(1); } 50% { transform: scale(1.3); } 100% { transform: scale(1.12); } }
.star-feedback { min-height: 1.5em; font-weight: 600; color: var(--color-texto-secundario); margin: 0 0 1.25rem; }

/* Botones de accion */
.resena-actions { display: flex; flex-direction: column; align-items: center; gap: .75rem; }
.btn-resena { width: 100%; max-width: 360px; justify-content: center; border-radius: 50px; }
.btn-hidden { display: none; }
.btn-visible { display: inline-flex; animation: fadeUp .3s ease; }
@keyframes fadeUp { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.resena-privacy { margin: 1.25rem 0 0; font-size: .85rem; }
.resena-privacy a { color: var(--color-texto-secundario); text-decoration: underline; text-underline-offset: 3px; }
.resena-privacy a:hover { color: var(--color-acento); }

/* Motivos (que evaluamos) */
.resena__motivos { margin-top: 1.5rem; }
.resena__motivos .secciones__card p { margin: 0; color: var(--color-texto-secundario); font-size: .95rem; }
.resena__motivos .secciones__h3 { margin-top: 0; }

/* Formulario y volver */
.back-link { display: inline-flex; align-items: center; gap: .35rem; margin-bottom: 1.25rem; font-weight: 600; color: var(--color-acento); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(31,47,77,.3); }
.back-link:hover { text-decoration-color: var(--color-acento); }
.form-resena-page .contacto__alert { max-width: 820px; margin: 0 auto 1.25rem; }

/* Gracias */
.gracias-page .resena { padding-top: 3.5rem; }
.gracias-content { padding: 2.5rem 1.5rem; }
.gracias-icon { display: block; width: 72px; height: 72px; margin: 0 auto 1rem; }
.resena__titulo--centrado { justify-content: center; }
.gracias-mensaje { color: var(--color-texto-secundario); font-size: 1.05rem; line-height: 1.7; margin: 0 auto 1.5rem; max-width: 520px; }
.gracias-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; }
.gracias-actions .btn, .gracias-actions .cta-bottom__phone { border-radius: 50px; padding-left: 1.4rem; padding-right: 1.4rem; }

@media (min-width: 720px) {
  .resena-actions { flex-direction: row; justify-content: center; }
  .btn-resena { width: auto; }
}

/* Formulario de reseña: calificacion elegida en la columna lateral */
.resena__calif-stars { display: flex; align-items: center; gap: .15rem; margin: 0 0 .6rem; font-size: 1.6rem; color: #d5dbe6; }
.resena__calif-stars i.is-on { color: #f5b301; }
.resena__calif-stars span { margin-left: .5rem; font-size: 1rem; font-weight: 700; color: var(--color-acento); }
.resena__calif .back-link { margin-bottom: 0; font-size: .9rem; }
.contacto__nota a { color: var(--color-acento); text-decoration: underline; text-underline-offset: 3px; }