:root{
  --zl2-bg:#fff; --zl2-text:#111827; --zl2-muted:#6b7280;
  --zl2-border:#e5e7eb; --zl2-sale:#ef4444; --zl2-radius:14px;
  --zl2-shadow:0 10px 20px rgba(0,0,0,.06);
}

/* NUEVA rejilla solo para este listado */
.zl2-wrapper{
  display:grid; gap:20px; grid-template-columns:repeat(5, minmax(0,1fr));
}
@media (max-width:1200px){ .zl2-wrapper{ grid-template-columns:repeat(3,1fr);} }
@media (max-width:900px){  .zl2-wrapper{ grid-template-columns:repeat(2,1fr);} }
@media (max-width:450px){  .zl2-wrapper{ grid-template-columns:1fr;} }

/* Card */
.zl2-card-link{ text-decoration:none; color:inherit; display:block; }
.zl2-card{
  background:var(--zl2-bg);
  border:1px solid var(--zl2-border);
  border-radius:18px;
  overflow:hidden;
  box-shadow:var(--zl2-shadow);
  transition:transform .15s ease, box-shadow .15s ease;
}
.zl2-card:hover{ transform:translateY(-2px); box-shadow:0 16px 30px rgba(0,0,0,.08); }

/* Media */
.zl2-card-media{ position:relative; aspect-ratio: 4 / 3; background:#f3f4f6; }
.zl2-media-img, .zl2-media-video{ width:100%; height:100%; object-fit:cover; display:block; }
.zl2-media-video{ position:absolute; inset:0; }

.zl2-badge{
  position:absolute; top:14px; left:14px; z-index:2;
  background:var(--zl2-sale); color:#fff; font-weight:700;
  font-size:12px; padding:5px 10px; border-radius:999px;
}
.zl2-chip{
  position:absolute; top:14px; right:14px; z-index:2;
  background:rgba(17,24,39,.85); color:#fff; font-size:12px;
  padding:6px 10px; border-radius:999px; display:flex; gap:6px; align-items:center;
}

/* Body */
.zl2-card-body{ padding:16px; display:flex; flex-direction:column; }
.zl2-crumbs{ color:var(--zl2-muted); font-size:12px; }
.zl2-title{
  font-size:18px; line-height:1.3; color:var(--zl2-text); margin:0;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:2.6em; text-align:center;
}
.zl2-meta{ display:flex; justify-content:center; gap:14px; color:var(--zl2-muted); font-size:12px; }

/* Divider y bottom */
.zl2-divider{ height:1px; background:var(--zl2-border); margin:10px 0; }

.zl2-bottom{
  display:flex; align-items:center; justify-content:space-between;
}
.zl2-actions{ display:flex; gap:14px; color:#9ca3af; font-size:16px; }
.zl2-actions .fa{ cursor:default; } /* solo decorativo */

.zl2-pricebox{ display:flex; align-items:baseline; gap:6px; }
.zl2-price-type{ color:#9ca3af; font-size:12px; }
.zl2-price{ font-weight:800; font-size:18px; color:#111; }

/* ======== Extras para estilo tipo tarjeta inmobiliaria ======== */
.zl2-card-media{ position:relative; aspect-ratio: 16/9; }
.zl2-photo-count{
  position:absolute; top:14px; left:14px; z-index:2;
  background:rgba(17,24,39,.85); color:#fff; font-size:12px;
  padding:6px 10px; border-radius:999px; display:flex; gap:6px; align-items:center;
}
.zl2-status{
  position:absolute; top:14px; right:14px; z-index:2;
  background:#10b981; color:#fff; font-weight:700;
  font-size:12px; padding:5px 10px; border-radius:999px;
}

/* Ubicación bajo el título */
.zl2-loc{
  display:flex; align-items:center; justify-content:center; gap:6px;
  color:var(--zl2-muted); font-size:13px; margin-top:6px;
}

/* Fila de specs (camas/baños/área) */
.zl2-specs{
  display:flex; justify-content:center; align-items:center; gap:18px;
  margin-top:10px; color:#374151; font-size:13px;
}
.zl2-specs .zl2-spec{ display:flex; align-items:center; gap:6px; white-space:nowrap; }
.zl2-specs .fa{ color:#6b7280; }

/* Precio más marcado */
.zl2-pricebox{ gap:8px; }
.zl2-price-type{ text-transform:uppercase; letter-spacing:.3px; }
.zl2-price{ font-weight:900; font-size:20px; }

