
/* Palas (no zapatillas): SOLO la CABECERA (título/ref + foto) en 50/50; de "Escuchar" hacia
   abajo (descripción, specs, compra) a TODO EL ANCHO como antes. Foto a 360px. SIN miniatura. (Víctor) */
.joma-post .jp-grid{grid-template-columns:repeat(2,1fr)!important;gap:30px 22px!important}
.joma-post .jp-grid .jp-card{display:flex;flex-direction:column;overflow:hidden;transition:background .18s ease, box-shadow .18s ease, border-color .18s ease}
.joma-post .jp-grid .jp-card .jp-card-head{flex:0 0 auto;display:grid;grid-template-columns:1fr 1fr;align-items:stretch}
.joma-post .jp-grid .jp-card .jp-head-info{grid-column:1;padding:16px 12px 16px 20px;display:flex;flex-direction:column;justify-content:flex-start}
/* Cartel "Novedad…" ARRIBA-IZQUIERDA (dentro de la columna de info, en flujo, no sobre la foto). (Víctor) */
.joma-post .jp-grid .jp-card .jp-head-info .jp-tag{position:static;align-self:flex-start;top:auto;left:auto;right:auto;margin:0}
/* …y se dejan ~4 líneas en blanco antes de empezar el título. (Víctor) */
.joma-post .jp-grid .jp-card .jp-head-info h4{margin:80px 0 6px}
/* Características: UNA por línea, con el MISMO cuerpo de letra que REF/EAN (.72em) y su color. (Víctor) */
.joma-post .jp-grid .jp-card .jp-specs{list-style:none;margin:10px 0 0;padding:0}
.joma-post .jp-grid .jp-card .jp-specs li{font-size:.9em;color:#0d1b2a;margin:4px 0;line-height:1.45}
.joma-post .jp-grid .jp-card .jp-specs b{color:#0089b5}
/* Flecha + "Galería": a la DERECHA, justo encima del audio, debajo de la imagen. (Víctor) */
.joma-post .jp-grid .jp-card .jp-gal-below{display:block;text-align:right;padding:10px 20px 0;margin:0;font-size:.92rem;font-weight:700;color:#243040;text-decoration:none}
.joma-post .jp-grid .jp-card .jp-gal-below:hover{color:#0089b5}
.joma-post .jp-grid .jp-card .jp-gal-below .jp-arr{font-size:1.15em}
/* Fila con "Ver ficha" (enlace a la product page, en azul y algo mayor) + "Galería". (Víctor) */
.joma-post .jp-grid .jp-card .jp-headlinks{display:flex;align-items:baseline;justify-content:flex-end;gap:16px;padding:10px 20px 0}
.joma-post .jp-grid .jp-card .jp-headlinks .jp-gal-below{padding:0}
.joma-post .jp-grid .jp-card .jp-verficha{font-size:.98rem;font-weight:700;color:#0089b5;text-decoration:none;white-space:nowrap;line-height:1}
.joma-post .jp-grid .jp-card .jp-verficha:hover{color:#005f7f;text-decoration:underline}
.joma-post .jp-grid .jp-card .jp-verficha .jp-arr{font-size:1.05em;font-weight:700}
.joma-post .jp-grid .jp-card .jp-thumb-wrap{grid-column:2;align-self:stretch;position:relative;display:flex;align-items:center;justify-content:center;padding:12px 12px 60px;background:#fff;text-align:center;min-height:360px;transition:background .18s ease}
.joma-post .jp-grid .jp-card .jp-thumb{height:100%!important;width:100%!important;max-height:none!important;max-width:100%!important;object-fit:contain!important;display:block;margin:0!important;clip-path:none!important;mix-blend-mode:multiply;cursor:zoom-in}
.joma-post .jp-grid .jp-card .jp-tag{z-index:3;right:10px;left:auto;top:10px}
/* Galería EN LA FICHA: fila de mini-miniaturas abajo de la foto; al pulsar una se ve en grande. (Víctor) */
.joma-post .jp-grid .jp-card .jp-mgal{position:absolute;left:0;right:0;bottom:12px;display:flex;gap:6px;justify-content:center;flex-wrap:wrap;padding:0 8px;z-index:4}
.joma-post .jp-grid .jp-card .jp-mgal-t{box-sizing:border-box;width:38px;height:38px;border:2px solid #e2e8f0;border-radius:7px;background:#fff center/contain no-repeat;cursor:pointer;padding:0;opacity:.9;box-shadow:0 1px 4px rgba(10,42,82,.12);transition:border-color .15s ease,opacity .15s ease}
.joma-post .jp-grid .jp-card .jp-mgal-t.on{border-color:#009ecf;border-width:1.75px;opacity:1}
.joma-post .jp-grid .jp-card .jp-mgal-t:hover{border-color:#009ecf}
/* Lightbox: tira de MINI-miniaturas debajo. (Víctor) */
.joma-post .jp-lb-cap{bottom:74px!important}
.joma-post .jp-lb-thumbs{position:fixed;left:0;right:0;bottom:14px;display:flex;gap:7px;justify-content:center;flex-wrap:wrap;z-index:100002;padding:0 12px}
.joma-post .jp-lb-th{width:40px;height:40px;border:2px solid rgba(255,255,255,.35);border-radius:7px;overflow:hidden;background:#fff;padding:0;cursor:pointer;opacity:.7;transition:opacity .15s ease,border-color .15s ease}
.joma-post .jp-lb-th.on{border-color:#fff;opacity:1}
.joma-post .jp-lb-th img{width:100%;height:100%;object-fit:contain;display:block}
/* Cuerpo a todo el ancho, desde el audio hacia abajo. La descripción absorbe el
   hueco y la caja de specs (fondo azul) baja: así las 2 cajas de cada fila quedan
   a la MISMA altura; en la ficha con texto más corto se deja la fila en blanco. (Víctor) */
.joma-post .jp-grid .jp-card .jp-card-body{flex:1 1 auto;display:flex;flex-direction:column;padding:2px 20px 18px}
/* La descripción absorbe el hueco para que el módulo de compra quede alineado abajo en la fila. */
.joma-post .jp-grid .jp-card .jp-card-body>p{flex:1 1 auto}
/* Borde de la ficha MÁS VISIBLE (el gris --line era casi invisible). (Víctor) */
.joma-post .jp-grid .jp-card{border:1.5px solid #9099ab!important;border-radius:18px!important}
/* HOVER: toda la ficha toma un color y el BLANCO de la foto (multiply) toma ESE MISMO color. */
.joma-post .jp-grid .jp-card:hover{background:#fff;border:2.5px solid #009ecf!important;box-shadow:0 10px 28px rgba(0,158,207,.22)}
.joma-post .jp-grid .jp-card:hover .jp-thumb-wrap{background:#fff}
/* En TÁCTIL (móvil): NO resaltar ninguna ficha con fondo azul (el hover se queda pegado al tocar). (Víctor) */
@media(hover:none){
  .joma-post .jp-grid .jp-card:hover{background:#fff!important;box-shadow:none!important;border:1.5px solid #9099ab!important}
  .joma-post .jp-grid .jp-card:hover .jp-thumb-wrap{background:#fff!important}
}
@media(max-width:900px){
  .joma-post .jp-grid{grid-template-columns:1fr!important}
}
@media(max-width:640px){
  .joma-post .jp-grid .jp-card .jp-card-head{grid-template-columns:1fr}
  .joma-post .jp-grid .jp-card .jp-thumb-wrap{grid-column:1;grid-row:1;min-height:300px}
  .joma-post .jp-grid .jp-card .jp-head-info{grid-column:1;grid-row:2}
}
