/* V11.50 — Catálogo seminuevos y banner compartido. */
.used-catalog-hero{max-width:1450px;margin:22px auto 20px;min-height:175px;position:relative;overflow:hidden;border-radius:14px;background:#202126;display:flex;align-items:center;isolation:isolate;color:#fff;box-shadow:0 10px 25px #1822331b}
.used-catalog-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#17181c 0%,#24252add 50%,#10101455 100%),var(--used-hero-image) center 45%/cover no-repeat;z-index:-1}
.used-catalog-hero:after{content:"";position:absolute;inset:auto -22px -30px auto;width:90px;height:210px;background:#d40013;transform:rotate(33deg);z-index:-1}
.used-catalog-hero-content{padding:30px clamp(22px,5vw,75px)}
.used-catalog-hero h1,.used-catalog-hero h2{font-size:clamp(26px,3.2vw,44px);line-height:1.1;font-style:italic;font-weight:900;margin:0 0 8px;color:#fff}
.used-catalog-hero p{font-size:clamp(14px,1.6vw,20px);margin:0;color:#fff}
.used-catalog{max-width:1450px;margin:0 auto 70px;padding:0 12px}
.used-catalog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:19px}
.used-vehicle-card{min-width:0;background:white;border-radius:15px;overflow:hidden;box-shadow:0 5px 20px #1b243018;display:flex;flex-direction:column;transition:transform .18s,box-shadow .18s}
.used-vehicle-card:hover{transform:translateY(-3px);box-shadow:0 12px 27px #1b24302b}
.used-vehicle-card[hidden]{display:none!important}
.used-vehicle-photo{height:230px;display:block;position:relative;background:#e8ebf0;overflow:hidden}
.used-vehicle-photo img{width:100%;height:100%;object-fit:cover;display:block}
.used-vehicle-placeholder{height:100%;display:grid;place-items:center;color:#777}
.used-vehicle-tag{position:absolute;left:12px;top:12px;background:#d50918;color:#fff;padding:7px 11px;border-radius:7px;font-size:12px;font-weight:800;box-shadow:0 2px 7px #0003}
.used-vehicle-body{padding:16px 17px 18px;display:flex;flex:1;flex-direction:column}
.used-vehicle-brand{font-size:12px;color:#555;text-transform:uppercase}
.used-vehicle-body h2{font-size:23px;line-height:1.08;margin:3px 0 4px;font-weight:900;color:#111}
.used-vehicle-version{font-size:13px;margin:0 0 12px;color:#444}
.used-vehicle-meta{display:flex;gap:18px;flex-wrap:wrap;font-size:13px;color:#333;margin:10px 0}
.used-vehicle-price{display:block;color:#cc0011;font-size:27px;font-weight:900;margin:auto 0 12px}
.used-vehicle-action{display:flex;justify-content:center;align-items:center;gap:15px;text-decoration:none;background:linear-gradient(#f20d20,#bd000d);color:white;padding:12px;border-radius:9px;font-size:13px;font-weight:900}
.used-show-more{display:block;margin:27px auto 0;border:2px solid #c90012;border-radius:12px;padding:12px 35px;background:white;color:#161616;font-size:15px;font-weight:900;cursor:pointer}
.used-show-more small{display:block;font-size:11px;font-weight:500;margin-top:3px}
.used-catalog.is-spacious .used-catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:1050px;margin:auto}
.used-catalog.is-spacious .used-vehicle-photo{height:330px}
.used-detail-banner{margin-bottom:0}
.seminuevo-description.seminuevo-description-inline{margin:15px 0 0;padding:15px;background:#f4f5f7;box-shadow:none;border-radius:12px}
.seminuevo-description-inline h2{font-size:16px;margin-bottom:8px}
.seminuevo-description-inline p{font-size:13px;line-height:1.55;overflow-wrap:anywhere}
@media(max-width:900px){.used-catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.used-catalog-hero{margin:15px 12px}.used-catalog.is-spacious .used-vehicle-photo{height:240px}}
@media(max-width:620px){.used-catalog-grid,.used-catalog.is-spacious .used-catalog-grid{grid-template-columns:1fr;gap:14px}.used-vehicle-photo,.used-catalog.is-spacious .used-vehicle-photo{height:240px}.used-catalog-hero{min-height:135px;border-radius:10px}.used-catalog-hero-content{padding:20px 24px}.used-catalog-hero:before{background:linear-gradient(90deg,#17181cf2,#17181cb5),var(--used-hero-image) center/cover no-repeat}.used-catalog{padding:0 12px}.used-vehicle-body h2{font-size:21px}.used-detail-banner{margin-bottom:0}}

/* ============================================================
 * V11.56 - Fotografías proporcionales en tarjetas de seminuevos
 * ============================================================
 * El catálogo usa tarjetas de diferente ancho según la cantidad
 * de vehículos. La altura fija anterior (230 / 330 / 240 px)
 * hacía que las imágenes cambiaran de proporción visual.
 *
 * Esta regla mantiene el mismo formato panorámico en todos los
 * tamaños: la altura se calcula automáticamente desde el ancho.
 * object-fit: cover conserva la proporción de la fotografía,
 * sin deformarla, y rellena el espacio de la tarjeta.
 * ============================================================ */

.used-catalog .used-vehicle-photo,
.used-catalog.is-spacious .used-vehicle-photo {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
}

.used-catalog .used-vehicle-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

/* La proporción se mantiene también en tabletas y celulares. */
@media (max-width: 900px) {
    .used-catalog .used-vehicle-photo,
    .used-catalog.is-spacious .used-vehicle-photo {
        height: auto;
        aspect-ratio: 16 / 9;
    }
}

@media (max-width: 620px) {
    .used-catalog .used-vehicle-photo,
    .used-catalog.is-spacious .used-vehicle-photo {
        height: auto;
        aspect-ratio: 16 / 9;
    }
}

/* ============================================================
 * V11.58 - Portadas generadas en formato 960 x 540
 * ============================================================
 * La miniatura ya contiene el encuadre completo. El navegador
 * solo la escala según el ancho de la tarjeta, sin recortarla.
 */
.used-catalog .used-vehicle-photo,
.used-catalog.is-spacious .used-vehicle-photo {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    position: relative;
    overflow: hidden;
}

.used-catalog .used-vehicle-photo img {
    display: block;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}
