.banana-retreats-viewall:hover {
	background: #333333;
	color: #FFFFFF;
}
.banana-retreat-card:hover {
	transform: translateY(-7px);
	box-shadow: 0 20px 52px rgba(60,60,60,0.13);
}
.banana-retreat-cta:hover {
	background: #2d9457;
}
@media (max-width: 700px) {
	.banana-section-pad {
		padding: 56px 0 !important;
	}
	/* El div trae justify-content:space-between sin wrap inline; a este ancho el titulo
	   y el boton "Ver Retreats" no entran en una sola fila, asi que se hace wrap. */
	.banana-section-header {
		flex-wrap: wrap;
	}
	.banana-retreats-viewall {
		margin-top: 8px;
	}
	.banana-retreats-grid {
		grid-template-columns: 1fr !important;
	}
	/* El footer de la card (duracion + precio + boton) tampoco entra en una sola fila
	   dentro de una tarjeta a ancho completo de mobile; se apila verticalmente. */
	.banana-retreat-card-footer {
		flex-direction: column;
		align-items: flex-start !important;
		gap: 12px !important;
	}
}
