/* Tarjeta de propiedad. */
.card-propiedad {
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--radius);
  overflow: hidden;
  display: flex; flex-direction: column;
  transition: transform var(--transition), box-shadow var(--transition);
}
.card-propiedad:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.card-propiedad--destacada { border-color: var(--color-accent); }

/* Altura fija (no aspect-ratio): así todas las tarjetas se ven iguales
   sin importar el ancho de columna del grid. overflow:hidden por si
   algún <img> grande quiere ignorar el height al cargar. */
.card-propiedad__image {
  position: relative; display: block;
  height: 240px; max-height: 240px;
  overflow: hidden;
  background: var(--color-bg);
}
.card-propiedad__image img,
.card-propiedad__image .custom-logo,
.card-propiedad__image picture {
  display: block;
  width: 100%; height: 100%; max-height: 100%;
  object-fit: cover;
}
.card-propiedad__badge { position: absolute; top: var(--sp-xs); left: var(--sp-xs); }
.card-propiedad__star {
  position: absolute; top: var(--sp-xs); right: var(--sp-xs);
  background: var(--color-accent); color: var(--color-ink);
  width: 30px; height: 30px; border-radius: 50%;
  display: grid; place-items: center; font-size: var(--fs-small); font-weight: 700;
}

.card-propiedad__body { padding: var(--sp-s); flex: 1; }
.card-propiedad__price { font-family: var(--font-heading); font-size: var(--fs-medium); color: var(--color-primary); margin: 0 0 .25rem; }
.card-propiedad__title { font-size: var(--fs-base); margin: 0 0 .25rem; }
.card-propiedad__title a:hover { color: var(--color-primary); }
.card-propiedad__location { color: var(--color-muted); font-size: var(--fs-small); margin: 0 0 var(--sp-s); }
.card-propiedad__meta { display: flex; gap: var(--sp-s); flex-wrap: wrap; font-size: var(--fs-small); color: var(--color-muted); }
.card-propiedad__meta span { background: var(--color-bg); padding: .2rem .55rem; border-radius: 999px; }

.card-propiedad__footer {
  display: flex; align-items: stretch; gap: var(--sp-xs);
  padding: var(--sp-s); border-top: 1px solid var(--color-line);
}

/* Acción primaria de la card: ocupa el ancho, botón sólido. */
.card-propiedad__detail {
  flex: 1;
  display: inline-flex; align-items: center; justify-content: center; gap: .35rem;
  background: var(--color-primary); color: #fff;
  padding: .6rem 1rem; border-radius: var(--radius-sm);
  font-weight: 700; font-size: var(--fs-small); line-height: 1;
  transition: var(--transition);
}
.card-propiedad__detail:hover { background: var(--color-primary-dark); color: #fff; }

/* WhatsApp discreto: ícono cuadrado, contorno suave; se viste de verde
   solo en hover para no competir con la acción primaria. */
.card-propiedad__wa {
  flex: 0 0 auto;
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; border-radius: var(--radius-sm);
  border: 1px solid var(--color-line);
  color: var(--color-whatsapp); background: var(--color-surface);
  transition: var(--transition);
}
.card-propiedad__wa:hover {
  background: var(--color-whatsapp); color: #fff; border-color: var(--color-whatsapp);
}