.banana-review-card {
	transition: box-shadow 0.25s ease-out;
}
.banana-review-card:hover {
	/* Nunca usar transform aca: el popup de video vive DENTRO de esta card en el DOM,
	   y por spec CSS cualquier transform activo en un ancestro se convierte en el
	   "containing block" de sus descendientes position:fixed. Eso hace que el popup
	   (deberia cubrir toda la pantalla) quede encerrado dentro de los limites de la
	   card mientras esta en :hover, y "salte" entre ambos estados al abrir/cerrar -
	   exactamente el bug reportado ("el video vibra entre el popup y la card"). */
	box-shadow: 0 20px 40px rgba(60,60,60,0.14);
}
.banana-review-watch-btn svg path {
	transition: fill 0.2s;
}
.banana-review-watch-btn:hover svg path {
	fill: #F5C83A;
}
.banana-review-video-popup {
	display: none;
}
.banana-review-video-popup.is-open {
	display: flex;
}
.banana-review-video-popup-close:hover {
	background: rgba(0,0,0,0.8);
}
@media (max-width: 1024px) {
	.banana-reviews-grid {
		grid-template-columns: repeat(2, 1fr) !important;
	}
}
@media (max-width: 700px) {
	.banana-reviews-grid {
		grid-template-columns: 1fr !important;
	}
}