/* ==========================================================================
   Componente: Card (.card)
   Base reutilizada por Beneficios, Destinos y Servicios
   ========================================================================== */

.card {
  background-color: var(--white);
  border-radius: var(--radius-card);
  padding: var(--space-32);
  box-shadow: var(--shadow-soft);
  transition: var(--transition-base);
}

.card:hover {
  box-shadow: var(--shadow-hover);
  transform: translateY(-6px);
}

.card:hover .card__icon {
  animation: gentle-bounce .6s ease;
}

.card__image {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--radius-image);
  margin-bottom: var(--space-24);
}

.card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  margin-bottom: var(--space-24);
  border-radius: 50%;
  background-color: rgba(222, 143, 174, 0.12);
  color: var(--primary);
  font-size: 1.5rem;
}

.card__title {
  margin-bottom: var(--space-12);
  font-size: 1.25rem;
  color: var(--text-color);
}

.card__text {
  color: var(--gray-700);
  line-height: 1.6;
}