/* Campañas: módulo «Promociones activas» y distintivo en tarjetas y ficha */

.inv-pr {
    --inv-pr-tinta: #20142e;
    --inv-pr-lila: #dfdbea;
    --inv-pr-azul: #505dc3;
    --inv-pr-menta: #00e2b5;
    --inv-pr-gris: #5b546c;
    --inv-pr-ancho: 300px;
    position: relative;
    width: 100%;
    min-width: 0;
    font-family: var(--e-global-typography-text-font-family, "Plus Jakarta Sans"), system-ui, sans-serif;
    color: var(--inv-pr-tinta);
}
.inv-pr *, .inv-pr *::before, .inv-pr *::after { box-sizing: border-box; }
.inv-pr .screen-reader-text, .inv-pr-dist .screen-reader-text {
    position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.inv-pr-cab {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin: 0 0 20px;
}
.inv-pr h2.inv-pr-titulo {
    margin: 0;
    letter-spacing: -.01em;
    font-family: var(--e-global-typography-primary-font-family, "Clash Display"), sans-serif;
    font-size: clamp(24px, 2.4vw, 34px);
    font-weight: 500;
    line-height: 1.1;
    color: var(--inv-pr-tinta);
}
.inv-pr-titulo small {
    display: block;
    margin-bottom: 6px;
    font-family: var(--e-global-typography-text-font-family, "Plus Jakarta Sans"), sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--inv-pr-azul);
}

/* Pista: carrusel con scroll-snap (sin librerías); en rejilla, columnas */
.inv-pr-pista {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: var(--inv-pr-ancho);
    gap: 20px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 2px;
    padding: 2px 2px 14px;
    scrollbar-width: thin;
    scrollbar-color: var(--inv-pr-lila) transparent;
}
.inv-pr-pista:focus-visible { outline: 2px solid var(--inv-pr-azul); outline-offset: 4px; border-radius: 16px; }
.inv-pr--rejilla .inv-pr-pista {
    grid-auto-flow: row;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    overflow: visible;
    padding-bottom: 2px;
}

/* Tarjeta */
.inv-pr .inv-pr-card {
    position: relative; /* el texto para lectores de pantalla no se sale del carrusel */
    display: flex;
    flex-direction: column;
    scroll-snap-align: start;
    min-width: 0;
    background: #fff;
    border: 1px solid #e7e4ef;
    border-radius: 16px;
    overflow: hidden;
    color: inherit;
    text-decoration: none;
    transition: border-color .2s, box-shadow .25s, transform .25s;
}
.inv-pr .inv-pr-card:hover {
    border-color: #cfcae0;
    box-shadow: 0 14px 32px -18px rgba(32, 20, 46, .35);
    transform: translateY(-2px);
    color: inherit;
}
.inv-pr .inv-pr-card:focus-visible { outline: 3px solid var(--inv-pr-azul); outline-offset: 2px; }

.inv-pr-img {
    display: block;
    aspect-ratio: 1 / 1;
    background: #f4f3f8;
    overflow: hidden;
}
.inv-pr-img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s cubic-bezier(.2, .7, .2, 1);
}
.inv-pr-card:hover .inv-pr-img img { transform: scale(1.03); }

.inv-pr-cuerpo {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 6px;
    padding: 16px 18px 18px;
}
.inv-pr-marca {
    align-self: flex-start;
    padding: 2px 9px;
    border-radius: 999px;
    background: #eceefb;
    color: #3f4bb0;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.inv-pr-nombre {
    font-family: var(--e-global-typography-primary-font-family, "Clash Display"), sans-serif;
    font-size: 19px;
    font-weight: 600;
    line-height: 1.2;
}
.inv-pr-desc {
    font-size: 14px;
    line-height: 1.45;
    color: var(--inv-pr-gris);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.inv-pr-pie {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px 12px;
    margin-top: auto;
    padding-top: 10px;
}
.inv-pr-hasta { font-size: 12.5px; color: var(--inv-pr-gris); }
.inv-pr-cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
    font-size: 14px;
    font-weight: 700;
    color: var(--inv-pr-azul);
}
.inv-pr-cta svg, .inv-pr-nav svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.inv-pr-cta svg { transition: transform .2s; }
.inv-pr-card:hover .inv-pr-cta svg { transform: translateX(3px); }

/* Flechas (solo si hay más tarjetas de las que caben). Doble clase: el kit pinta los botones */
.inv-pr-nav { display: flex; gap: 8px; flex-shrink: 0; }
.inv-pr-nav[hidden] { display: none; }
.inv-pr .inv-pr-nav .inv-pr-ant,
.inv-pr .inv-pr-nav .inv-pr-sig {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid #d3cfe0 !important;
    border-radius: 50%;
    background: #fff;
    color: var(--inv-pr-tinta);
    cursor: pointer;
    transition: background-color .2s, border-color .2s, color .2s;
}
.inv-pr .inv-pr-nav .inv-pr-ant:hover,
.inv-pr .inv-pr-nav .inv-pr-sig:hover,
.inv-pr .inv-pr-nav .inv-pr-ant:focus-visible,
.inv-pr .inv-pr-nav .inv-pr-sig:focus-visible {
    background: var(--inv-pr-tinta);
    border-color: var(--inv-pr-tinta) !important;
    color: #fff;
}
.inv-pr .inv-pr-nav button:disabled { opacity: .35; cursor: default; background: #fff; color: var(--inv-pr-tinta); border-color: #d3cfe0 !important; }

/* Compacto (páginas de marca, sobre el listado): miniatura a la izquierda y texto */
.inv-pr--compacto { --inv-pr-ancho: 380px; }
.inv-pr--compacto .inv-pr-cab { margin-bottom: 14px; }
.inv-pr--compacto h2.inv-pr-titulo { font-size: clamp(20px, 1.8vw, 24px); }
.inv-pr--compacto .inv-pr-pista { gap: 14px; }
.inv-pr--compacto .inv-pr-card { flex-direction: row; align-items: stretch; border-radius: 14px; }
/* Creatividad cuadrada y entera (más alta que antes: se lee su texto); el texto, en menos ancho */
.inv-pr--compacto .inv-pr-img { flex: 0 0 172px; aspect-ratio: 1 / 1; min-height: 0; }
.inv-pr--compacto .inv-pr-cuerpo { padding: 12px 14px; gap: 4px; }
.inv-pr--compacto .inv-pr-nombre { font-size: 16px; }
.inv-pr--compacto .inv-pr-desc { -webkit-line-clamp: 2; font-size: 13px; }
.inv-pr--compacto .inv-pr-pie { padding-top: 4px; }
.inv-pr--compacto .inv-pr-nav .inv-pr-ant,
.inv-pr--compacto .inv-pr-nav .inv-pr-sig { width: 38px; height: 38px; }

/* Carrusel con pocas promociones (centros): sin huecos a la derecha.
   1 → dos columnas: el título a la izquierda y la tarjeta (de tamaño normal) a la derecha
   2 → dos tarjetas en horizontal, a medias · 3 y 4 → columnas que llenan el ancho · 5 o más → carrusel */
.inv-pr .inv-pr-desc--extra { display: none; }
@media (min-width: 768px) {
    .inv-pr--n1 .inv-pr-pista, .inv-pr--n2 .inv-pr-pista, .inv-pr--n3 .inv-pr-pista, .inv-pr--n4 .inv-pr-pista {
        grid-auto-flow: row; overflow: visible; padding-bottom: 2px; scroll-snap-type: none;
    }
    .inv-pr--n1 .inv-pr-pista { grid-template-columns: 1fr; }
    .inv-pr--n2 .inv-pr-pista { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .inv-pr--n3 .inv-pr-pista { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .inv-pr--n4 .inv-pr-pista { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .inv-pr--n1 .inv-pr-nav, .inv-pr--n2 .inv-pr-nav, .inv-pr--n3 .inv-pr-nav, .inv-pr--n4 .inv-pr-nav { display: none !important; }
    /* 1: título a la izquierda (centrado en alto) y la tarjeta, de tamaño normal, a la derecha */
    .inv-pr--n1:has(> .inv-pr-cab) { display: grid; grid-template-columns: minmax(0, auto) min(420px, 46%); justify-content: center; column-gap: clamp(40px, 7vw, 120px); align-items: center; }
    .inv-pr--n1 > .inv-pr-cab { margin: 0; }
    .inv-pr.inv-pr--n1 > .inv-pr-cab h2.inv-pr-titulo { max-width: 13ch; font-size: clamp(30px, 3.4vw, 50px); line-height: 1.05; text-wrap: balance; }
    .inv-pr--n1 .inv-pr-pista { max-width: 420px; }
    /* 2: en horizontal */
    .inv-pr--n2 .inv-pr-card { flex-direction: row; align-items: stretch; }
    .inv-pr--n2 .inv-pr-img { flex: 0 0 48%; }
    .inv-pr--n2 .inv-pr-cuerpo { justify-content: center; }
    .inv-pr--n2 .inv-pr-desc--extra { display: -webkit-box; }
    .inv-pr--n2 .inv-pr-cuerpo { padding: 20px 22px; }
    .inv-pr--n2 .inv-pr-nombre { font-size: 20px; }
}
/* Tableta: 2 en vertical y 4 en carrusel, que en horizontal no caben bien */
@media (min-width: 768px) and (max-width: 1024px) {
    .inv-pr--n2 .inv-pr-card { flex-direction: column; }
    .inv-pr--n2 .inv-pr-img { flex: none; }
    .inv-pr--n2 .inv-pr-desc--extra { display: none; }
    .inv-pr--n4 .inv-pr-pista { grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: var(--inv-pr-ancho); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 14px; }
    .inv-pr--n4 .inv-pr-nav { display: flex !important; }
}
@media (max-width: 767px) {
    .inv-pr.inv-pr--n1 { --inv-pr-ancho: 100%; }
}

@media (max-width: 767px) {
    .inv-pr { --inv-pr-ancho: 78%; }
    .inv-pr--compacto { --inv-pr-ancho: 88%; }
    .inv-pr--compacto.inv-pr--uno { --inv-pr-ancho: 100%; }   /* una sola: a todo el ancho */
    .inv-pr-pista { gap: 12px; }
    .inv-pr-nombre { font-size: 17px; }
    .inv-pr--compacto .inv-pr-img { flex-basis: 132px; }
    .inv-pr--rejilla .inv-pr-pista { grid-template-columns: 1fr; gap: 14px; }
}
@media (prefers-reduced-motion: reduce) {
    .inv-pr .inv-pr-card, .inv-pr-img img, .inv-pr-cta svg { transition: none; }
    .inv-pr .inv-pr-card:hover { transform: none; }
    .inv-pr-card:hover .inv-pr-img img { transform: none; }
}

/* Distintivo de campaña: tarjetas del listado, bucles de Elementor y galería de la ficha.
   Tarjeta blanca redondeada (no círculo: los logos de campaña no son redondos) con el logo grande */
.inv-pr-dist {
    --inv-dist: 52px;
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 11;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    max-width: calc(100% - 20px);
    padding: 5px;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 0 0 1px rgba(32, 20, 46, .06), 0 8px 20px -10px rgba(32, 20, 46, .5);
    color: #20142e;
    font-family: var(--e-global-typography-text-font-family, "Plus Jakarta Sans"), sans-serif;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: .01em;
    pointer-events: none;
}
.inv-pr-dist img {
    display: block;
    flex: 0 0 var(--inv-dist);
    width: var(--inv-dist) !important;
    height: var(--inv-dist) !important;
    max-width: none;
    border-radius: 9px;
    object-fit: contain;
}
.inv-pr-dist > span:not(.screen-reader-text) {
    padding-right: 8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.inv-pr-dist:not(:has(img)) { padding: 9px 12px; }
.inv-pr-dist:not(:has(img)) > span { padding: 0; }
.inv-pr-dist--bucle { top: 12px; right: auto; left: 12px; }
/* En la tarjeta del coche, arriba a la izquierda (el logo de la marca va a la derecha) y asomando por encima
   del borde: no tapa el morro. Por encima del borde de los tipos de tarjeta (::after, z-index 20) */
.inv-pr-dist--tarjeta { top: -14px; right: auto; left: 12px; z-index: 21; }
@media (max-width: 767px) { .inv-pr-dist--tarjeta { top: -12px; left: 12px; } }

/* Ficha: en su propia esquina, del mismo tamaño que las etiquetas de la galería */
.inv-gv .inv-gv__campana {
    position: absolute;
    z-index: 4;
    top: var(--inv-gv-badge-offset, 16px);
    pointer-events: none;
}
.inv-gv .inv-gv__campana--left  { left: var(--inv-gv-badge-offset, 16px); }
.inv-gv .inv-gv__campana--right { right: var(--inv-gv-badge-offset, 16px); }
.inv-pr-dist--ficha { position: static; --inv-dist: calc(var(--inv-gv-badge, 80px) - 12px); padding: 6px; border-radius: 16px; font-size: 14px; }

@media (max-width: 767px) {
    .inv-pr-dist { --inv-dist: 44px; border-radius: 12px; }
    .inv-pr-dist img { border-radius: 8px; }
}

/* Sticker de campaña (imagen con su propio fondo): sin caja, sin recorte, con su forma y una sombra
   que sigue su contorno. 60 px de alto en la tarjeta (52 en móvil), 80 en la ficha; ancho hasta el doble */
.inv-pr-dist.inv-pr-dist--img {
    --inv-st: 60px;
    padding: 0; gap: 0; border-radius: 0; background: none; box-shadow: none;
    filter: drop-shadow(0 4px 8px rgba(32, 20, 46, .22));
}
.inv-pr-dist.inv-pr-dist--img img {
    flex: none;
    width: auto !important;
    height: var(--inv-st) !important;
    max-width: calc(var(--inv-st) * 2);
    border-radius: 0;
    object-fit: contain;
}
.inv-pr-dist--ficha.inv-pr-dist--img { --inv-st: var(--inv-gv-badge, 80px); padding: 0; border-radius: 0; }
@media (max-width: 767px) {
    .inv-pr-dist.inv-pr-dist--img { --inv-st: 52px; }
    .inv-pr-dist--ficha.inv-pr-dist--img { --inv-st: var(--inv-gv-badge, 64px); }   /* la galería ya lo reduce en móvil */
    .inv-pr-dist.inv-pr-dist--img img { border-radius: 0; }
}

/* Página Promociones: «Filtrar por» y dos desplegables, como «Ordenar» del listado */
/* A la derecha, como en el listado; «Quitar filtros» a su izquierda para que los desplegables no se muevan */
.inv-pr-barra { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 12px 20px; margin: 0 0 22px; padding: 16px 20px; border-radius: 16px; background: #f6f5fa; }
.inv-pr-filtros { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.inv-pr-filtros-t { font-size: 14px; font-weight: 500; color: #6b6478; white-space: nowrap; }
.inv-pr .inv-pr-sel.inv-pr-sel {
    -webkit-appearance: none; appearance: none; display: block; width: auto; height: 44px; min-width: 220px; margin: 0; padding: 0 40px 0 14px;
    border: 1px solid #d0cddb; border-radius: 10px;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2320142e' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 14px center / 12px 8px;
    color: #20142e; font: 500 14px/1.2 "Plus Jakarta Sans", sans-serif; cursor: pointer; transition: border-color .2s;
}
.inv-pr .inv-pr-sel.inv-pr-sel:hover { border-color: #505dc3; }
.inv-pr .inv-pr-sel.inv-pr-sel:focus-visible { outline: 2px solid #505dc3; outline-offset: 2px; }
.inv-pr .inv-pr-sel.inv-pr-sel.is-on { border-color: #20142e; box-shadow: inset 0 0 0 1px #20142e; }
.inv-pr .inv-pr-barra .inv-pr-quitar.inv-pr-quitar { height: auto; padding: 0; border: 0 !important; background: none !important; color: #505dc3 !important; font: 600 14px/1.2 "Plus Jakarta Sans", sans-serif; text-transform: none; letter-spacing: 0; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.inv-pr .inv-pr-barra .inv-pr-quitar[hidden] { display: none; }
.inv-pr-sin { margin: 0 0 24px; padding: 28px 20px; border: 1px dashed #d3cfe0; border-radius: 16px; text-align: center; color: #20142e; font: 500 15px/1.5 "Plus Jakarta Sans", sans-serif; }
.inv-pr-sin[hidden] { display: none; }
.inv-pr-sin p { margin: 0 0 12px; }
.inv-pr .inv-pr-sin .inv-pr-quitar.inv-pr-quitar { height: 40px; padding: 0 18px; border: 1px solid #20142e !important; border-radius: 999px !important; background: #fff !important; color: #20142e !important; font: 600 14px/1 "Plus Jakarta Sans", sans-serif; text-transform: none; cursor: pointer; }
.inv-pr .inv-pr-sin .inv-pr-quitar.inv-pr-quitar:hover { background: #20142e !important; color: #fff !important; }
.inv-pr .inv-pr-quitar.inv-pr-quitar:focus-visible { outline: 2px solid #505dc3; outline-offset: 2px; }
.inv-pr .inv-pr-card[hidden] { display: none !important; }
@media (max-width: 767px) {
    .inv-pr-barra { flex-direction: column; align-items: stretch; gap: 8px; padding: 14px; margin-bottom: 18px; }
    .inv-pr-filtros { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    .inv-pr-filtros-t { grid-column: 1 / -1; font-size: 13px; }
    .inv-pr .inv-pr-sel.inv-pr-sel { min-width: 0; width: 100%; }
    .inv-pr .inv-pr-barra .inv-pr-quitar.inv-pr-quitar { align-self: flex-start; order: 2; }
}

/* Tarjeta: marca y fecha de fin en una línea, nombre, «Desde …» y botón */
.inv-pr-fila { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 8px; }
.inv-pr-fin {
    display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px;
    background: #eeedf8; color: #20142e; font-size: 12.5px; font-weight: 600; line-height: 1.2; white-space: nowrap;
}
.inv-pr-fin svg { width: 14px; height: 14px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.inv-pr-fin.is-ya { background: #00e2b5; }
.inv-pr-desde { font-size: 14px; color: #6b6478; }
.inv-pr-desde b { font-family: var(--e-global-typography-primary-font-family, "Clash Display"), sans-serif; font-size: 20px; font-weight: 600; color: #20142e; font-variant-numeric: tabular-nums; }
/* auto-fit: con pocas promociones (3 en Black Month) las columnas vacías desaparecen y las tarjetas llenan el ancho;
   al filtrar, igual con las que quedan. Una sola no se estira más de 480 px (05-11-2026) */
.inv-pr--rejilla .inv-pr-pista { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.inv-pr--rejilla .inv-pr-pista:not(:has(> .inv-pr-card:not([hidden]) ~ .inv-pr-card:not([hidden]))) { grid-template-columns: minmax(0, 480px); }
.inv-pr--rejilla .inv-pr-desc { -webkit-line-clamp: 2; }
/* Columnas fijas desde el widget: en ordenador las elegidas, en tableta 2 (en el móvil, 1 como siempre) */
/* Son el máximo: con menos promociones (o al filtrar) las que hay llenan el ancho */
@media (min-width: 1025px) { .inv-pr--rejilla.inv-pr--cols .inv-pr-pista { grid-template-columns: repeat(auto-fit, minmax(calc((100% - (var(--inv-pr-cols, 3) - 1) * 20px) / var(--inv-pr-cols, 3)), 1fr)); } }
@media (min-width: 768px) and (max-width: 1024px) { .inv-pr--rejilla.inv-pr--cols .inv-pr-pista { grid-template-columns: repeat(auto-fit, minmax(calc((100% - 20px) / 2), 1fr)); } }
.inv-pr--compacto .inv-pr-desde b { font-size: 17px; }
.inv-pr .inv-pr-pie .inv-pr-cta { margin-left: 0; }

/* Slider de destacadas (cabecera de Promociones): carátula 16:10 y franja con marca, nombre, fecha y botón */
.inv-prs { --inv-prs-tinta: #20142e; position: relative; width: 100%; min-width: 0; color: var(--inv-prs-tinta); font-family: var(--e-global-typography-text-font-family, "Plus Jakarta Sans"), system-ui, sans-serif; }
.inv-prs *, .inv-prs *::before, .inv-prs *::after { box-sizing: border-box; }
.inv-prs .inv-prs-slide { display: block; border-radius: 20px; overflow: hidden; background: #fff; color: inherit; text-decoration: none; box-shadow: 0 18px 40px -24px rgba(32, 20, 46, .45); }
.inv-prs .inv-prs-slide[hidden] { display: none; }
.inv-prs .inv-prs-slide:focus-visible { outline: 3px solid #505dc3; outline-offset: 3px; }
.inv-prs-img { display: block; aspect-ratio: 16 / 10; background: #f4f3f8; }
.inv-prs-img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.inv-prs-pie { display: flex; align-items: center; gap: 12px 16px; padding: 14px 18px; }
.inv-prs-t { flex: 1; min-width: 0; }
.inv-prs-t span { display: block; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #505dc3; }
.inv-prs-t b { display: block; overflow: hidden; font-family: var(--e-global-typography-primary-font-family, "Clash Display"), sans-serif; font-size: 18px; font-weight: 600; line-height: 1.2; white-space: nowrap; text-overflow: ellipsis; }
.inv-prs-ir { flex: none; display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 18px; border-radius: 999px; background: #00e2b5; color: #20142e; font-family: var(--e-global-typography-primary-font-family, "Clash Display"), sans-serif; font-size: 15px; font-weight: 600; transition: background .15s; }
.inv-prs-slide:hover .inv-prs-ir { background: #00cba3; }
.inv-prs-ir svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .15s; }
.inv-prs-slide:hover .inv-prs-ir svg { transform: translateX(3px); }
.inv-prs .screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.inv-prs-nav { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
.inv-prs-puntos { flex: 1; display: flex; gap: 6px; }
.inv-prs .inv-prs-punto { position: relative; flex: 1; height: 28px; margin: 0; padding: 0; border: 0; border-radius: 0; background: none; cursor: pointer; }
.inv-prs .inv-prs-punto::before { content: ""; position: absolute; left: 0; right: 0; top: 12px; height: 4px; border-radius: 4px; background: #cfcadd; }
.inv-prs-punto i { position: absolute; left: 0; top: 12px; width: 0; height: 4px; border-radius: 4px; background: var(--inv-prs-tinta); }
.inv-prs .inv-prs-punto:focus-visible { outline: 2px solid #505dc3; outline-offset: 2px; }
.inv-prs .inv-prs-pausa { flex: none; display: grid; place-items: center; width: 36px; height: 36px; margin: 0; padding: 0; border: 1px solid #d0cddb; border-radius: 10px; background: #fff; cursor: pointer; }
.inv-prs .inv-prs-pausa svg { width: 14px; height: 14px; fill: var(--inv-prs-tinta); }
.inv-prs .inv-prs-pausa:focus-visible { outline: 2px solid #505dc3; outline-offset: 2px; }
/* Sin destacadas: se oculta la columna de Elementor que lo contiene */
.e-con:has(> .elementor-widget-inv_promos_destacadas .inv-prs--vacio), .e-con:has(> .e-con-inner > .elementor-widget-inv_promos_destacadas .inv-prs--vacio) { display: none !important; }
@media (max-width: 767px) {
    .inv-prs .inv-prs-slide { border-radius: 16px; }
    .inv-prs-pie { padding: 12px 14px; gap: 10px; }
    .inv-prs-t b { font-size: 16px; }
    .inv-prs-ir { width: 42px; padding: 0; justify-content: center; }
    .inv-prs-ir > span:first-child { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
@media (prefers-reduced-motion: reduce) { .inv-prs-ir, .inv-prs-ir svg { transition: none; } }

/* Banner (centros de Onecar.es): la imagen a su tamaño, horizontal en escritorio y cuadrada en móvil */
.inv-prs--banner .inv-prs-img { aspect-ratio: auto; }
.inv-prs--banner .inv-prs-img picture, .inv-prs--banner .inv-prs-img img { display: block; width: 100%; height: auto; }
.inv-prs--banner .inv-prs-pie { padding: 16px 22px; }
.inv-pr--banner .inv-prs .inv-prs-slide { box-shadow: none; border: 1px solid #e7e4ef; }

/* Banner panorámico de Onecar.es (1920×410): en escritorio, a todo el ancho de la sección y solo la creatividad,
   que ya lo dice todo (el nombre y el botón quedan para lectores de pantalla). La columna de Elementor que lo
   contiene y su vecina (el titular) pasan a ocupar el ancho entero, una debajo de otra. En móvil, la cuadrada con su franja */
@media (min-width: 768px) {
    .e-con:has(> .e-con .inv-prs--panoramico), .e-con-inner:has(> .e-con .inv-prs--panoramico) { flex-direction: column !important; flex-wrap: nowrap !important; }
    .e-con:has(> .e-con .inv-prs--panoramico) > .e-con, .e-con-inner:has(> .e-con .inv-prs--panoramico) > .e-con { --width: 100% !important; width: 100% !important; max-width: 100% !important; }
    /* Sección a todo el ancho (plantilla de centros de Onecar.es): con margen a los lados, como el resto de la página */
    .elementor > .e-con-full:has(.inv-prs--panoramico) { padding-inline: 5% !important; }
    .inv-prs--panoramico .inv-prs-slide { border: 0 !important; border-radius: 20px; }
    .inv-prs--panoramico .inv-prs-pie { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
    .inv-prs--panoramico .inv-prs-img img { transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
    .inv-prs--panoramico .inv-prs-slide:hover .inv-prs-img img { transform: scale(1.01); }
    .inv-prs--panoramico .inv-prs-slide:focus-visible { outline-offset: 4px; }
}
.inv-prs--panoramico .inv-prs-img { overflow: hidden; }
@media (prefers-reduced-motion: reduce) { .inv-prs--panoramico .inv-prs-slide:hover .inv-prs-img img { transform: none; } }

/* Franja fina de promociones (páginas de marca, sobre el listado) */
.inv-pr--franja { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 14px; align-items: center; }
.inv-pr--franja .inv-pr-franja-t { display: grid; gap: 4px; }
.inv-pr--franja h2.inv-pr-titulo { font-size: 20px; font-weight: 600; line-height: 1.15; }
.inv-pr--franja .inv-pr-franja-t a { color: var(--inv-pr-azul); font-size: 13.5px; font-weight: 700; text-decoration: none; }
.inv-pr--franja .inv-pr-franja-t a:hover { text-decoration: underline; }
.inv-pr--franja .inv-pr-pista { grid-auto-flow: column; grid-auto-columns: calc((100% - 3 * 14px) / 4); gap: 14px; padding: 2px 2px 4px; scrollbar-width: none; }
.inv-pr--franja .inv-pr-pista::-webkit-scrollbar { display: none; }
.inv-pr .inv-pr-card.inv-pr-mini { flex-direction: row; align-items: center; gap: 12px; border-radius: 14px; }
.inv-pr .inv-pr-card.inv-pr-mini:hover { transform: none; }
.inv-pr-mini .inv-pr-img { flex: 0 0 84px; width: 84px; height: 84px; aspect-ratio: auto; }
.inv-pr-mini .inv-pr-cuerpo { gap: 2px; padding: 8px 10px 8px 0; min-width: 0; }
.inv-pr-mini .inv-pr-nombre { overflow: hidden; font-size: 15px; line-height: 1.15; white-space: nowrap; text-overflow: ellipsis; }
.inv-pr-mini .inv-pr-desde { font-size: 12.5px; }
.inv-pr-mini .inv-pr-desde b { font-size: 13px; font-family: inherit; font-weight: 700; }
.inv-pr-mini .inv-pr-cta { margin: 2px 0 0; font-size: 12.5px; }
@media (max-width: 767px) {
    .inv-pr--franja { grid-template-columns: 1fr; gap: 10px; }
    .inv-pr--franja .inv-pr-franja-t { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
    .inv-pr--franja h2.inv-pr-titulo { font-size: 18px; }
    .inv-pr--franja .inv-pr-pista { grid-auto-columns: 82%; margin-inline: -16px; padding-inline: 16px; scroll-padding-inline: 16px; }
    .inv-pr-mini .inv-pr-img { flex-basis: 76px; width: 76px; height: 76px; }
    .inv-pr--franja-uno .inv-pr-pista { grid-auto-columns: 100%; }   /* una sola: a todo el ancho */
}

/* Resumen bajo el texto de la cabecera */
.inv-prs-resumen { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; font-family: var(--e-global-typography-text-font-family, "Plus Jakarta Sans"), sans-serif; }
.inv-prs-resumen li { margin: 0; padding: 7px 12px; border: 1px solid #d9d5e6; border-radius: 999px; background: rgba(255, 255, 255, .7); color: #20142e; font-size: 13.5px; font-weight: 500; line-height: 1.2; }
.inv-prs-resumen b { font-weight: 700; }
@media (max-width: 767px) { .inv-prs-resumen { display: none; } }

/* Precio en promoción (Gestor de inventario): etiqueta sobre la caja del precio, sin cambiar el alto de la tarjeta */
/* La etiqueta sale del borde de la caja del precio y puede pasar por encima de la de la cuota: así cabe la frase entera
   (se corta con «…» solo si no cabe en el ancho de las dos cajas). Colores: Gestor › Tarjetas de coche */
.inv-vehicle-card .inv-vehicle-pricing { position: relative; }
/* Precio en promoción: la frase encima del precio, en su propia línea (28-10-2026; antes montada sobre la caja) */
.inv-vehicle-card .inv-price-row.is-promo { position: static; }
.inv-vehicle-card .inv-precio-promo {
    position: static; align-self: flex-start; margin-bottom: 2px; max-width: 100%;
    padding: 3px 9px; border-radius: 999px; background: var(--inv-promo-bg, #00e2b5); color: var(--inv-promo-fg, #20142e);
    font: 700 10.5px/1.2 "Plus Jakarta Sans", sans-serif; letter-spacing: .02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* Tipos de tarjeta en promoción (Gestor › Tarjetas de coche). Las variables las pone cada tarjeta:
   --tt-c1/--tt-c2 colores, --tt-w grosor, --tt-g1/--tt-g2 resplandor suave/intenso */
.inv-vehicle-card.inv-tt { isolation: isolate; }
.inv-vehicle-card.inv-tt::after {
    content: ""; position: absolute; inset: 0; z-index: 20; pointer-events: none; border-radius: inherit;
    padding: var(--tt-w, 2px);
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
    mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
}
.inv-vehicle-card.inv-tt--liso::after { background: var(--tt-c1); }
.inv-vehicle-card.inv-tt--degradado::after { background: linear-gradient(135deg, var(--tt-c1), var(--tt-c2)); }
.inv-vehicle-card.inv-tt--no::after { display: none; }
.inv-filter-wrapper .inv-vehicle-card.inv-tt--glow-suave { box-shadow: 0 10px 28px -10px var(--tt-g1), 0 2px 10px rgba(0, 0, 0, .06); }
.inv-filter-wrapper .inv-vehicle-card.inv-tt--glow-intenso { box-shadow: 0 0 0 1px var(--tt-g1), 0 14px 38px -8px var(--tt-g2); }
.inv-filter-wrapper .inv-vehicle-card.inv-tt--glow-suave:hover { box-shadow: 0 14px 34px -10px var(--tt-g2), 0 2px 10px rgba(0, 0, 0, .06); }
.inv-filter-wrapper .inv-vehicle-card.inv-tt--glow-intenso:hover { box-shadow: 0 0 0 1px var(--tt-g2), 0 18px 44px -8px var(--tt-g2); }

/* Ficha: en la esquina superior derecha de la caja del precio, montada sobre el borde (no suma alto a la caja) */
.inv-precio-promo--ficha {
    position: absolute; top: 0; right: -6px; z-index: 2; transform: translateY(-50%); max-width: calc(100% - 12px);
    padding: 5px 11px; border-radius: 999px; background: var(--inv-promo-bg, #00e2b5); color: var(--inv-promo-fg, #20142e); box-shadow: 0 4px 10px -4px rgba(32, 20, 46, .35);
    font: 700 12.5px/1.2 "Plus Jakarta Sans", sans-serif; letter-spacing: .01em; text-transform: none;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* Que se coloque respecto a la caja del precio y no al título o al widget que la contienen */
.elementor-widget:has(.inv-precio-promo--ficha), .elementor-widget:has(.inv-precio-promo--ficha) .elementor-heading-title { position: static; }
.e-con:has(> .elementor-widget .inv-precio-promo--ficha) { position: relative; overflow: visible; }
@media (max-width: 767px) {
    .inv-precio-promo--ficha { right: -2px; max-width: calc(100% - 8px); padding: 4px 9px; font-size: 11px; }
}

/* Landing de campaña: coches de la campaña con «Más información» y «Solicitar oferta» */
.inv-camp-coches { box-sizing: border-box; width: 90%; max-width: 1400px; margin: 48px auto 72px; font-family: "Plus Jakarta Sans", sans-serif; color: #20142e; }
.inv-camp-coches .inv-camp-coches-t { margin: 0 0 20px; font: 600 clamp(26px, 3vw, 36px)/1.15 "Clash Display", "Plus Jakarta Sans", sans-serif; text-transform: none; }
.inv-camp-coches .inv-camp-coches-t span { margin-left: 6px; font: 600 15px/1 "Plus Jakarta Sans", sans-serif; color: #8a849a; vertical-align: middle; }
.inv-vehicle-card-link--campana { display: flex; flex-direction: column; height: 100%; color: inherit; }
.inv-vehicle-card-link--campana .inv-vehicle-title a { color: inherit; text-decoration: none; }
.inv-vehicle-card-link--campana .inv-vehicle-title a:hover { color: #505dc3; }
.inv-camp-acciones { display: grid; gap: 8px; margin-top: auto; padding-top: 14px; }
/* Mismo estilo que «Ver más» de las tarjetas: Clash Display, mayúsculas, esquinas de 10 px */
.inv-camp-acciones .inv-camp-b.inv-camp-b {
    display: flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 14px; margin: 0; box-sizing: border-box; width: 100%;
    border: 1.5px solid #20142e !important; border-radius: 10px !important; background: #fff !important; color: #20142e !important;
    font: 600 16px/1.1 "Clash Display", "Plus Jakarta Sans", sans-serif; letter-spacing: .5px; text-transform: uppercase; text-align: center; text-decoration: none !important; cursor: pointer;
    transition: background .15s, border-color .15s;
}
.inv-camp-acciones .inv-camp-b.inv-camp-b:hover { background: #f4f2f9 !important; }
.inv-camp-acciones .inv-camp-b.inv-camp-b--1 { min-height: 55px; font-size: 18px; background: #00e2b5 !important; border-color: #00e2b5 !important; }
.inv-camp-acciones .inv-camp-b.inv-camp-b--1:hover { background: #00cba2 !important; border-color: #00cba2 !important; }
.inv-camp-acciones .inv-camp-b:focus-visible { outline: 2px solid #505dc3; outline-offset: 2px; }

/* Legales de la campaña (widget «Legales de la campaña»: ficha y landing) */
.inv-camp-legales { font-family: "Plus Jakarta Sans", sans-serif; color: #5b546c; }
.inv-camp-legales-t { margin: 0 0 6px; font-size: 13px; font-weight: 700; color: #20142e; }
.inv-camp-legales-txt { font-size: 12px; line-height: 1.55; }
.inv-camp-legales-txt p { margin: 0 0 6px; }
/* Plegados (landing): solo el título con la flecha; abierto, el texto entero sin recortes */
.inv-camp-legales--plegado { border-top: 1px solid #e4e1ec; }
.inv-camp-legales--plegado > summary.inv-camp-legales-t { display: flex; align-items: center; gap: 6px; min-height: 44px; margin: 0; list-style: none; cursor: pointer; }
.inv-camp-legales--plegado > summary::-webkit-details-marker { display: none; }
.inv-camp-legales--plegado > summary svg { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s; }
.inv-camp-legales--plegado[open] > summary svg { transform: rotate(180deg); }
.inv-camp-legales--plegado > summary:hover { color: #505dc3; }
.inv-camp-legales--plegado > summary:focus-visible { outline: 2px solid #505dc3; outline-offset: 2px; border-radius: 4px; }
.inv-camp-legales--plegado[open] > .inv-camp-legales-txt { padding-bottom: 8px; }
@media (prefers-reduced-motion: reduce) { .inv-camp-legales--plegado > summary svg { transition: none; } }
/* Solo en la landing, cuando las condiciones van solas justo después de los coches. (Antes también «:only-child»:
   en la ficha, dentro de su desplegable, subía el texto 40 px y lo montaba sobre el título, 28-10-2026) */
.inv-camp-coches + .inv-camp-legales { box-sizing: border-box; width: 90%; max-width: 1400px; margin: -40px auto 64px; }

/* Ventana «Solicitar oferta» (dialog nativo: Esc cierra y el foco queda dentro) */
.inv-oferta { width: min(560px, calc(100% - 32px)); max-height: calc(100dvh - 32px); padding: 0; border: 0; border-radius: 24px; background: #fff; color: #20142e; box-shadow: 0 30px 80px -30px rgba(32, 20, 46, .6); overflow: auto; }
.inv-oferta::backdrop { background: rgba(32, 20, 46, .55); backdrop-filter: blur(2px); }
.inv-oferta-caja { position: relative; padding: 28px 28px 8px; font-family: "Plus Jakarta Sans", sans-serif; }
.inv-oferta .inv-oferta-x.inv-oferta-x { position: absolute; top: 14px; right: 14px; display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0 !important; border-radius: 50% !important; background: #f1eff6 !important; color: #20142e !important; cursor: pointer; }
.inv-oferta-x svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.inv-oferta-eyebrow { margin: 0 0 4px; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #505dc3; }
.inv-oferta .inv-oferta-t { margin: 0; font: 600 28px/1.15 "Clash Display", "Plus Jakarta Sans", sans-serif; text-transform: none; }
.inv-oferta-coche { margin: 6px 48px 0 0; font-size: 15px; font-weight: 600; color: #5b546c; }
/* El formulario de HubSpot trae 40 px por dentro: se compensa para alinearlo con el título */
.inv-oferta-form { min-height: 320px; margin: 6px -40px 0; }
.inv-oferta-cargando { margin: 28px 40px 0; font-size: 13px; color: #8a849a; }
.inv-oferta-form.is-listo .inv-oferta-cargando { display: none; }
html.inv-oferta-abierta { overflow: hidden; }
@media (max-width: 767px) {
    .inv-camp-coches { width: auto; margin: 32px 16px 56px; }
    .inv-camp-coches + .inv-camp-legales { width: auto; margin: -24px 16px 48px; }
    .inv-oferta { width: 100%; max-width: none; max-height: 92dvh; margin: auto 0 0; border-radius: 22px 22px 0 0; }
    .inv-oferta-caja { padding: 24px 20px 4px; }
    .inv-oferta-form { margin: 4px -24px 0; }
}

/* Carruseles (Swiper recorta lo que sale): hueco arriba para el distintivo que asoma, sin mover la página */
.swiper:has(.inv-pr-dist--tarjeta) { padding-top: 16px; margin-top: -16px; }