/* ==========================================================================
   PRIDO — Archive v3 «Cornisa» (r19 · 2026-09-08)
   Aplica el canvas «Catálogo Cornisa Prido» SOBRE la capa v2 (prido-archive-v2.r19).
   Carga después de ella. Sólo archivos WC. Rollback: ?prido_archive_v3=0.
   Tokens: los del header v3 (--hs3-*, declarados en :root por header-system-v3)
   con fallback literal, para que la cornisa lea como tercera franja del header.
   ========================================================================== */

/* ---------- 1 · tokens ---------- */
body.prido-archive-v3 {
    --v3-ink:        var(--hs3-ink, #1a2a3a);
    --v3-ink-soft:   var(--hs3-ink-soft, #2f4256);
    --v3-muted:      #607287; /* r20: 4,7:1 sobre el canvas #f8fafc (antes #66788d, 4,3:1) */
    --v3-canvas:     var(--hs3-canvas, #f8fafc);
    --v3-surface:    var(--hs3-surface, #ffffff);
    --v3-line:       rgba(201, 212, 221, .74);
    --v3-line-strong:rgba(188, 201, 212, .9);
    --v3-teal:       var(--hs3-teal, #2dc6c1);
    --v3-teal-deep:  var(--hs3-teal-deep, #0e7e7a);
    --v3-cta-bg:     var(--hs3-cta-bg, #1a2a3a);
    --v3-cta-fg:     var(--hs3-cta-fg, #ffffff);
    --v3-r-btn:      var(--hs3-r-btn, 12px);
    --v3-dur:        var(--hs3-dur, .28s);
    --v3-ease:       var(--hs3-ease, cubic-bezier(.25, .46, .45, .94));
    --v3-heading:    var(--hs3-font-heading, 'Outfit', 'Avenir Next', 'Segoe UI', system-ui, sans-serif);
    --v3-ui:         var(--hs3-font-ui, 'Noto Sans', 'Helvetica Neue', Arial, sans-serif);
    /* mismo gutter que el hero v2 (§12.7) y que el bloque filtros+grilla; el JS
       de la v2 publica --v2-hero-gutter en .prido-catalog-page a partir de 1200 */
    --v3-gutter:     clamp(16px, 4vw, 32px);
    /* la cornisa se pega bajo el header VISIBLE; el JS publica el borde real */
    --v3-cornice-top: var(--prido-hs-offset, 114px);
}
:root[data-theme="dark"] body.prido-archive-v3,
body.prido-archive-v3.woodmart-dark {
    --v3-ink:        var(--hs3-ink, #edf4f8);
    --v3-ink-soft:   var(--hs3-ink-soft, #c9d6e0);
    --v3-muted:      var(--hs3-muted, #9fb0bf);
    --v3-canvas:     var(--hs3-canvas, #0A131B);
    --v3-surface:    var(--hs3-surface, #121c26);
    --v3-line:       rgba(255, 255, 255, .10);
    --v3-line-strong:rgba(255, 255, 255, .16);
    --v3-teal-deep:  var(--hs3-teal-deep, #2dc6c1);
    --v3-cta-bg:     var(--hs3-cta-bg, #2dc6c1);
    --v3-cta-fg:     var(--hs3-cta-fg, #0c1219);
}
@media (min-width: 1200px) {
    body.prido-archive-v3 .prido-catalog-page { --v3-gutter: var(--v2-hero-gutter, clamp(32px, 13.333vw - 144px, 160px)); }
}

/* ==========================================================================
   2 · LA CORNISA — tercera franja del header: 34 (migas) + 56 (identidad) + hairline
   ========================================================================== */
.prido-archive-v3 .prido-cornice-sentinel { height: 1px; margin-top: -1px; pointer-events: none; }

.prido-archive-v3 .prido-cornice {
    position: sticky;
    top: var(--v3-cornice-top);
    z-index: 90;                       /* bajo el header (1002) y sobre la grilla */
    background: var(--v3-canvas);
    border-bottom: 1px solid var(--v3-line);
    font-family: var(--v3-ui);
    color: var(--v3-ink);
    transition: box-shadow var(--v3-dur) var(--v3-ease), margin-bottom var(--v3-dur) var(--v3-ease);
}
.prido-archive-v3 .prido-cornice__inner {
    padding-inline: var(--v3-gutter);
}

/* fila A · migas */
.prido-archive-v3 .prido-cornice__crumbs {
    display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
    height: 34px; margin: 0;
    font-size: 13px; line-height: 1; color: var(--v3-muted);
    white-space: nowrap; overflow: hidden;
    transition: height var(--v3-dur) var(--v3-ease), opacity var(--v3-dur) var(--v3-ease);
}
.prido-archive-v3 .prido-cornice__crumbs a { color: inherit; text-decoration: none; }
.prido-archive-v3 .prido-cornice__crumbs a:hover { color: var(--v3-ink); }
.prido-archive-v3 .prido-cornice__sep { color: var(--v3-line-strong); }
.prido-archive-v3 .prido-cornice__current { color: var(--v3-ink); }

/* fila B · identidad + conteo | hechos */
.prido-archive-v3 .prido-cornice__band {
    display: flex; align-items: center; justify-content: space-between; gap: 24px;
    height: 56px;
    transition: height var(--v3-dur) var(--v3-ease);
}
.prido-archive-v3 .prido-cornice__id { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
.prido-archive-v3 .prido-cornice__title {
    margin: 0 !important; padding: 0 !important;
    font-family: var(--v3-heading) !important;
    font-size: 30px !important; font-weight: 600 !important; letter-spacing: -.02em !important; line-height: 1.14 !important;
    color: var(--v3-ink) !important; text-transform: none !important;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    transition: font-size var(--v3-dur) var(--v3-ease);
}
.prido-archive-v3 .prido-cornice__count {
    display: inline-flex; align-items: baseline; gap: 4px; flex: none;
    font-size: 13px; font-weight: 500; color: var(--v3-muted); font-variant-numeric: tabular-nums;
}
.prido-archive-v3 .prido-cornice__facts {
    display: flex; align-items: center; gap: 22px; flex: none;
    margin: 0; padding: 0; list-style: none;
    font-size: 12.5px; color: var(--v3-muted);
}
.prido-archive-v3 .prido-cornice__fact { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.prido-archive-v3 .prido-cornice__fact-ic { display: inline-flex; flex: none; color: var(--v3-teal-deep); }
.prido-archive-v3 .prido-cornice__fact-ic svg { width: 15px; height: 15px; }

/* subcolecciones · píldoras compactas bajo la banda (no están en el canvas: se
   conservan por navegación y enlazado interno, en una fila de 44 px) */
.prido-archive-v3 .prido-cornice__subcats {
    border-top: 1px solid var(--v3-line);
    transition: height var(--v3-dur) var(--v3-ease), opacity var(--v3-dur) var(--v3-ease);
}
.prido-archive-v3 .prido-cornice__subnav {
    display: flex !important; align-items: center; gap: 8px !important; flex-wrap: nowrap !important;
    height: 44px; margin: 0 !important; padding: 0 !important;
    overflow-x: auto; overflow-y: hidden; scrollbar-width: none; -ms-overflow-style: none;
}
.prido-archive-v3 .prido-cornice__subnav::-webkit-scrollbar { display: none; }
.prido-archive-v3 .prido-cornice__subcats-lead {
    flex: none; margin-right: 4px;
    font-family: var(--v3-heading); font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--v3-muted);
}
.prido-archive-v3 .prido-cornice__subnav .prido-subcat-chip {
    display: inline-flex !important; align-items: center; gap: 6px; flex: none;
    height: 30px !important; padding: 0 12px !important; margin: 0 !important;
    border: 1px solid var(--v3-line-strong) !important; border-radius: 999px !important;
    background: var(--v3-surface) !important; color: var(--v3-ink) !important;
    font-family: var(--v3-ui) !important; font-size: 12.5px !important; font-weight: 500 !important; line-height: 1 !important;
    text-decoration: none !important; white-space: nowrap; box-shadow: none !important;
    transition: border-color var(--v3-dur) var(--v3-ease), background var(--v3-dur) var(--v3-ease);
}
.prido-archive-v3 .prido-cornice__subnav .prido-subcat-chip:hover { border-color: var(--v3-ink) !important; background: rgba(26, 42, 58, .06) !important; }
.prido-archive-v3 .prido-cornice__subnav .prido-subcat-chip.is-active {
    border-color: var(--v3-teal) !important; background: rgba(45, 198, 193, .12) !important; color: var(--v3-teal-deep) !important;
}
.prido-archive-v3 .prido-cornice__subnav .prido-subcat-chip__count { font-size: 11px !important; font-weight: 500 !important; color: var(--v3-muted) !important; opacity: 1 !important; }
.prido-archive-v3 .prido-cornice__subnav .prido-subcat-chip.is-active .prido-subcat-chip__count { color: inherit !important; opacity: .85 !important; }

/* pegada al bajar: se van las migas y las subcolecciones, la banda baja a 48 y el
   H1 a 18 — igual que el artboard «Al bajar» */
.prido-archive-v3 .prido-cornice.is-stuck { box-shadow: 0 10px 30px rgba(18, 29, 42, .08); }
/* Faldón: extiende el fondo de la cornisa hacia arriba mientras está pegada. Si por
   un instante el anclaje queda unos píxeles por debajo de la barra superior (el
   header aún animando), lo que se ve en la rendija es este fondo y no las cards
   pasando. Queda detrás del header (z-index 90 < 1002), así que no lo tapa; 16 px bastan para
   una rendija de animación y casi no entran bajo el cristal del header. */
.prido-archive-v3 .prido-cornice.is-stuck::before {
    content: ""; position: absolute; left: 0; right: 0; bottom: 100%; height: 16px;
    background: var(--v3-canvas); pointer-events: none;
}
.prido-archive-v3 .prido-cornice.is-stuck .prido-cornice__crumbs { height: 0; opacity: 0; }
.prido-archive-v3 .prido-cornice.is-stuck .prido-cornice__band { height: 48px; }
.prido-archive-v3 .prido-cornice.is-stuck .prido-cornice__title { font-size: 18px !important; }
.prido-archive-v3 .prido-cornice.is-stuck .prido-cornice__subcats { height: 0; opacity: 0; overflow: hidden; border-top-color: transparent; }
:root[data-theme="dark"] .prido-archive-v3 .prido-cornice.is-stuck { box-shadow: 0 10px 30px rgba(0, 0, 0, .4); }

/* la guía y las anclas internas dejan sitio al header + cornisa condensada */
.prido-archive-v3 #prido-catseo { scroll-margin-top: calc(var(--prido-hs-offset, 114px) + 72px); }

/* ---------- tablet 768–1199: facts fuera, todo lo demás igual ---------- */
@media (max-width: 1199px) {
    .prido-archive-v3 .prido-cornice__facts { display: none; }
    .prido-archive-v3 .prido-cornice__title { font-size: 24px !important; }
}
/* bajo 1025 el riel de subcolecciones se desplaza para centrar la activa y el
   rótulo «Explora» quedaba cortado por la izquierda: fuera */
@media (max-width: 1024px) {
    .prido-archive-v3 .prido-cornice__subcats-lead { display: none; }
}
/* ---------- móvil ≤767: banda de título que se va con el scroll (la barra
   pegajosa es .prido-mbar de la v2) ---------- */
@media (max-width: 767px) {
    .prido-archive-v3 .prido-cornice { position: static; top: auto; box-shadow: none !important; margin-bottom: 0 !important; }
    .prido-archive-v3 .prido-cornice__row-a { height: auto; }
    /* migas en UNA línea: sólo «padre › actual» (a 390 px la ruta completa
       saltaba a dos líneas y se cortaba) */
    .prido-archive-v3 .prido-cornice__crumbs { height: 30px; font-size: 11.5px; flex-wrap: nowrap; }
    .prido-archive-v3 .prido-cornice__crumbs > a,
    .prido-archive-v3 .prido-cornice__crumbs > .prido-cornice__sep { display: none; }
    .prido-archive-v3 .prido-cornice__crumbs > a:nth-last-of-type(1),
    .prido-archive-v3 .prido-cornice__crumbs > a:nth-last-of-type(1) + .prido-cornice__sep { display: inline; }
    .prido-archive-v3 .prido-cornice__current { overflow: hidden; text-overflow: ellipsis; }
    .prido-archive-v3 .prido-cornice__band { height: 50px; }
    .prido-archive-v3 .prido-cornice__title { font-size: 21px !important; }
    .prido-archive-v3 .prido-cornice__count { font-size: 12px; }
    .prido-archive-v3 .prido-cornice__subnav { height: 42px; }
    .prido-archive-v3 .prido-cornice__subcats-lead { display: none; }
    /* la barra pegajosa de la v2 va justo después: sin borde doble */
    .prido-archive-v3 .prido-cornice.is-stuck .prido-cornice__crumbs,
    .prido-archive-v3 .prido-cornice.is-stuck .prido-cornice__subcats { height: auto; opacity: 1; }
}

/* ==========================================================================
   3 · CUERPO — la grilla arranca a 3 columnas (context.php); nada más cambia.
   La v2 ya deja la columna de filtros a 312 px CSS y el pie «Ver N productos».
   ========================================================================== */
/* La columna de filtros es sticky (prido-shop-sidebar, top:16px) y vive dentro del
   inner con zoom:.9, así que su `top` se escala: se compensa /0.9. El JS publica en
   body el borde inferior real de la cornisa pegada (0 cuando no lo está). */
@media (min-width: 1025px) {
    .prido-archive-v3 .prido-shop-sidebar {
        top: calc((var(--v3-cornice-bottom, 0px) + 16px) / 0.9) !important;
        transition: top var(--v3-dur) var(--v3-ease);
    }
}
/* con 3 columnas la card es ~30 % más ancha: la foto puede ir al 100 % sin
   perder aire y el título ya no necesita dos líneas fijas — se deja la v2. */

/* ==========================================================================
   4 · EL ZÓCALO — tres salidas al final de la colección. Va tras la guía y
   ocupa el sitio de la banda B2B (apagada en archivo por prido_fs_b2b_band).
   ========================================================================== */
.prido-archive-v3 .prido-plinth {
    position: relative; overflow: hidden;
    margin-top: 8px;
    background: radial-gradient(120% 150% at 88% 0%, rgba(45, 198, 193, .16) 0%, rgba(45, 198, 193, 0) 54%),
                linear-gradient(135deg, var(--v3-cta-bg, #1a2a3a) 0%, #0f2333 100%);
    color: #fff;
    font-family: var(--v3-ui);
}
:root[data-theme="dark"] .prido-archive-v3 .prido-plinth,
.prido-archive-v3.woodmart-dark .prido-plinth {
    background: radial-gradient(120% 150% at 88% 0%, rgba(45, 198, 193, .16) 0%, rgba(45, 198, 193, 0) 54%),
                linear-gradient(135deg, #16242f 0%, #1d3040 100%);
}
.prido-archive-v3 .prido-plinth__inner {
    width: min(100% - 80px, 1180px); margin-inline: auto;
    padding: 56px 0 48px;
}
.prido-archive-v3 .prido-plinth__head {
    display: flex; align-items: baseline; justify-content: space-between; gap: 24px; min-height: 22px;
    padding-bottom: 20px; border-bottom: 1px solid rgba(255, 255, 255, .14);
}
.prido-archive-v3 .prido-plinth__eyebrow {
    font-family: var(--v3-heading); font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
    color: var(--v3-teal);
}
.prido-archive-v3 .prido-plinth__recall { font-size: 13px; color: rgba(255, 255, 255, .55); }

.prido-archive-v3 .prido-plinth__lanes { display: grid; grid-template-columns: repeat(3, 1fr); }
.prido-archive-v3 .prido-plinth__lane {
    display: flex; flex-direction: column;
    padding: 30px 44px 0;
    border-left: 1px solid rgba(255, 255, 255, .12);
}
.prido-archive-v3 .prido-plinth__lane:first-child { padding-left: 0; border-left: 0; }
.prido-archive-v3 .prido-plinth__lane:last-child { padding-right: 0; }
.prido-archive-v3 .prido-plinth__ic { display: inline-flex; margin-bottom: 16px; color: var(--v3-teal); }
.prido-archive-v3 .prido-plinth__ic svg { width: 20px; height: 20px; }
.prido-archive-v3 .prido-plinth__title {
    margin: 0 0 10px !important; padding: 0 !important;
    font-family: var(--v3-heading) !important; font-size: 17px !important; font-weight: 600 !important; line-height: 1.3 !important; letter-spacing: -.01em !important;
    color: #fff !important; text-transform: none !important;
}
.prido-archive-v3 .prido-plinth__body {
    margin: 0 !important; max-width: 34ch;
    font-size: 14px !important; line-height: 1.55 !important; color: rgba(255, 255, 255, .68) !important;
}
/* margin-top:auto: las tres acciones caen sobre la misma línea base aunque las
   bajadas midan distinto — tres verbos alineados leen como un menú de salidas */
.prido-archive-v3 .prido-plinth__act { margin-top: auto; padding-top: 22px; }
.prido-archive-v3 .prido-plinth__btn {
    box-sizing: border-box; /* en móvil es width:100%: sin esto se salía 4 px */
    display: inline-flex; align-items: center; gap: 8px;
    height: 44px; padding: 0 22px;
    border-radius: var(--v3-r-btn);
    background: #fff; color: var(--v3-cta-bg, #1a2a3a);
    font-family: var(--v3-heading); font-size: 14px; font-weight: 600; line-height: 1;
    text-decoration: none !important;
    transition: background var(--v3-dur) var(--v3-ease), color var(--v3-dur) var(--v3-ease), transform var(--v3-dur) var(--v3-ease);
}
.prido-archive-v3 .prido-plinth__btn:hover { background: var(--v3-teal); color: #0c1219; transform: translateY(-1px); }
:root[data-theme="dark"] .prido-archive-v3 .prido-plinth__btn,
.prido-archive-v3.woodmart-dark .prido-plinth__btn { background: var(--v3-cta-bg); color: var(--v3-cta-fg); }
:root[data-theme="dark"] .prido-archive-v3 .prido-plinth__btn:hover { background: var(--hs3-cta-bg-hover, #4bd3ce); }
.prido-archive-v3 .prido-plinth__btn svg,
.prido-archive-v3 .prido-plinth__link svg { width: 15px; height: 15px; flex: none; }
.prido-archive-v3 .prido-plinth__link {
    display: inline-flex; align-items: center; gap: 7px;
    padding-bottom: 2px; border-bottom: 1px solid rgba(255, 255, 255, .32);
    color: #fff; font-size: 14px; font-weight: 600; text-decoration: none !important;
    transition: color var(--v3-dur) var(--v3-ease), border-color var(--v3-dur) var(--v3-ease);
}
.prido-archive-v3 .prido-plinth__link:hover { color: var(--v3-teal); border-bottom-color: var(--v3-teal); }
.prido-archive-v3 .prido-plinth__detail { margin: 12px 0 0 !important; font-size: 13px !important; color: rgba(255, 255, 255, .5) !important; }
.prido-archive-v3 .prido-plinth__tel { color: rgba(255, 255, 255, .72); font-weight: 600; text-decoration: none; font-variant-numeric: tabular-nums; }
.prido-archive-v3 .prido-plinth__tel:hover { color: rgba(255, 255, 255, .95); }
.prido-archive-v3 .prido-plinth__btn:focus-visible,
.prido-archive-v3 .prido-plinth__link:focus-visible,
.prido-archive-v3 .prido-plinth__tel:focus-visible { outline: 2px solid var(--v3-teal); outline-offset: 3px; }

/* la barra flotante del comparador se monta sobre el último carril en móvil */
body.prido-archive-v3.prido-compare-floating-visible .prido-plinth__inner { padding-bottom: calc(48px + 72px); }

/* con el zócalo, los CTA de cotizar en la página bajan de 4 a 3: la tarjeta B2B
   de la guía sobra; su aside se queda como puro índice (TOC) */
.prido-archive-v3 .prido-catseo__ac { display: none !important; }
/* y el footer real arranca sin la banda: el zócalo ya hizo de pre-footer */
.prido-archive-v3 .prido-fs-b2b { display: none !important; }

@media (max-width: 1199px) {
    .prido-archive-v3 .prido-plinth__inner { width: min(100% - 64px, 1180px); }
    .prido-archive-v3 .prido-plinth__lane { padding: 28px 28px 0; }
}
@media (max-width: 899px) {
    .prido-archive-v3 .prido-plinth__inner { width: calc(100% - 40px); padding: 36px 0 34px; }
    .prido-archive-v3 .prido-plinth__head { flex-direction: column; align-items: flex-start; gap: 8px; padding-bottom: 18px; }
    .prido-archive-v3 .prido-plinth__lanes { grid-template-columns: 1fr; }
    .prido-archive-v3 .prido-plinth__lane { padding: 22px 0; border-left: 0; border-top: 1px solid rgba(255, 255, 255, .12); }
    .prido-archive-v3 .prido-plinth__lane:first-child { border-top: 0; }
    .prido-archive-v3 .prido-plinth__lane:last-child { padding-bottom: 0; }
    /* cabeza del carril en una línea: icono + título */
    .prido-archive-v3 .prido-plinth__lane { display: grid; grid-template-columns: 18px 1fr; column-gap: 11px; align-items: center; }
    .prido-archive-v3 .prido-plinth__ic { margin: 0; }
    .prido-archive-v3 .prido-plinth__ic svg { width: 18px; height: 18px; }
    .prido-archive-v3 .prido-plinth__title { margin: 0 0 8px !important; font-size: 16px !important; }
    .prido-archive-v3 .prido-plinth__body,
    .prido-archive-v3 .prido-plinth__act { grid-column: 1 / -1; }
    .prido-archive-v3 .prido-plinth__body { max-width: none; margin-bottom: 16px !important; font-size: 13.5px !important; line-height: 1.5 !important; }
    .prido-archive-v3 .prido-plinth__act { margin-top: 0; padding-top: 0; }
    .prido-archive-v3 .prido-plinth__btn { width: 100%; height: 46px; justify-content: center; }
    .prido-archive-v3 .prido-plinth__detail { margin-top: 10px !important; }
}
@media (max-width: 419px) {
    .prido-archive-v3 .prido-plinth__body { font-size: 13px !important; }
    .prido-archive-v3 .prido-plinth__lane { padding: 18px 0; }
}


/* ==========================================================================
   5 · PIEL DE LA CARD (.pcv4) — la del canvas: Outfit para eyebrow, precio y
   CTA; Noto Sans para el resto; radio 12; precio grande con el % en teal; sin
   hairline antes de la transferencia; CTA sólido de 40 px. Mismo markup y
   mismo grid de precio de la v2: sólo cambia la piel. Prefijo con
   body.prido-archive-v3 + [data-columns] para ganar a la §12.5 de la v2 (0,6,0 + !important),
   y todas las medidas × --v2-k: el inner lleva zoom .9 y así se ven en los px del canvas.
   ========================================================================== */
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 { font-family: var(--v3-ui) !important; }
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-product-card__inner {
    border: 1px solid var(--v3-line) !important;
    border-radius: var(--v3-r-btn) !important;
    background: var(--v3-surface) !important;
    transition: border-color var(--v3-dur) var(--v3-ease);
}
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4:hover .prido-product-card__inner { border-color: var(--v3-line-strong) !important; }

/* el canvas no lleva badge de media: el % vive en la línea de precio */
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-product-card__sale-badge { display: none !important; }

/* cuerpo */
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-product-card__category,
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-product-card__category-text {
    font-family: var(--v3-heading) !important; font-size: calc(11px * var(--v2-k, 1)) !important; font-weight: 700 !important;
    letter-spacing: .12em !important; text-transform: uppercase !important; color: var(--v3-muted) !important;
}
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-product-card__title,
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-product-card__title a {
    font-family: var(--v3-ui) !important; font-size: calc(15px * var(--v2-k, 1)) !important; font-weight: 600 !important;
    line-height: 1.25 !important; letter-spacing: 0 !important; color: var(--v3-ink) !important;
}
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-product-card__title a:hover { color: var(--v3-teal-deep) !important; }

/* muestras de color: anillo de tinta en la activa, como el canvas */
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .pcv4-sw {
    width: calc(16px * var(--v2-k, 1)) !important; height: calc(16px * var(--v2-k, 1)) !important;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .14) !important;
}
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .pcv4-sw.is-active,
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .pcv4-sw[aria-pressed="true"] {
    box-shadow: 0 0 0 2px var(--v3-surface), 0 0 0 3.5px var(--v3-cta-bg) !important;
}
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .pcv4-sw-more { font-family: var(--v3-ui) !important; font-size: calc(11px * var(--v2-k, 1)) !important; color: var(--v3-muted) !important; }

/* precio: se conserva el grid de la v2, cambia la tipografía */
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-product-card__price .prido-price-from {
    font-family: var(--v3-ui) !important; font-size: calc(11px * var(--v2-k, 1)) !important; font-weight: 500 !important; color: var(--v3-muted) !important;
}
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-product-card__price .prido-price-now {
    font-family: var(--v3-heading) !important; font-size: calc(20px * var(--v2-k, 1)) !important; font-weight: 700 !important; letter-spacing: -.01em !important;
    color: var(--v3-ink) !important;
}
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-product-card__price .prido-price-was {
    font-family: var(--v3-ui) !important; font-size: calc(12px * var(--v2-k, 1)) !important; font-weight: 500 !important; color: var(--v3-muted) !important;
}
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-product-card__price .prido-price-off {
    font-family: var(--v3-ui) !important; font-size: calc(12px * var(--v2-k, 1)) !important; font-weight: 600 !important; color: var(--v3-teal-deep) !important;
}
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-product-card__price .pcv4-iva {
    font-family: var(--v3-ui) !important; font-size: calc(11px * var(--v2-k, 1)) !important; font-weight: 500 !important; color: var(--v3-muted) !important;
}
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4[data-in-stock="0"] .prido-price-now { color: var(--v3-muted) !important; }

/* transferencia: sin hairline, en teal-deep con el importe en negrita */
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-product-card__details {
    margin: 0 !important; padding: 0 !important; border-top: 0 !important; min-height: calc(18px * var(--v2-k, 1));
}
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-transfer-price {
    font-family: var(--v3-ui) !important; font-size: calc(12px * var(--v2-k, 1)) !important; font-weight: 500 !important; color: var(--v3-teal-deep) !important;
}
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-transfer-icon { color: var(--v3-teal-deep) !important; }
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-transfer-label { font-weight: 500 !important; color: var(--v3-teal-deep) !important; }
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-transfer-amount { font-weight: 600 !important; color: var(--v3-teal-deep) !important; }

/* CTA: 40 px, sólido, radio 12, Outfit — «Elegir opciones» también sólido, como el canvas */
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-grilla-cart-wrap--cta { margin: 10px 0 0 !important; }
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-grilla-cart-wrap--cta .prido-grilla-btn-cart,
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-grilla-cart-wrap--cta a.prido-grilla-btn-cart--options {
    height: calc(40px * var(--v2-k, 1)) !important; min-height: calc(40px * var(--v2-k, 1)) !important;
    border-radius: var(--v3-r-btn) !important;
    border: 0 !important;
    background: var(--v3-cta-bg) !important; color: var(--v3-cta-fg) !important;
    font-family: var(--v3-heading) !important; font-size: calc(14px * var(--v2-k, 1)) !important; font-weight: 600 !important;
    transition: filter var(--v3-dur) var(--v3-ease), background var(--v3-dur) var(--v3-ease);
}
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-grilla-cart-wrap--cta .prido-grilla-btn-cart .prido-grilla-btn-label,
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-grilla-cart-wrap--cta a.prido-grilla-btn-cart--options .prido-grilla-btn-label,
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-grilla-cart-wrap--cta a.prido-grilla-btn-cart--options:hover .prido-grilla-btn-label {
    color: var(--v3-cta-fg) !important; font-size: calc(14px * var(--v2-k, 1)) !important;
}
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-grilla-cart-wrap--cta .prido-grilla-btn-cart:hover,
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-grilla-cart-wrap--cta .prido-grilla-btn-cart--options:hover {
    background: var(--hs3-cta-bg-hover, #24394f) !important; filter: none !important;
}
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-grilla-cart-wrap--cta .prido-grilla-btn-cart.added {
    background: var(--v3-teal-deep) !important; color: #fff !important;
}
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-grilla-cart-wrap--cta .prido-grilla-btn-cart:focus-visible { outline: 2px solid var(--v3-teal) !important; outline-offset: calc(3px * var(--v2-k, 1)) !important; }

/* cotizar: enlace secundario en teal-deep, Noto */
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-product-card__quote .prido-cotizar-btn {
    height: calc(34px * var(--v2-k, 1)) !important; min-height: calc(34px * var(--v2-k, 1)) !important;
    font-family: var(--v3-ui) !important; font-size: calc(12.5px * var(--v2-k, 1)) !important; font-weight: 600 !important; color: var(--v3-teal-deep) !important;
}

/* avísame (sin stock): mismo botón, en contorno */
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .prido-card-notify-btn {
    border-radius: var(--v3-r-btn) !important; border: 1px solid var(--v3-line-strong) !important;
    font-family: var(--v3-heading) !important; font-size: calc(14px * var(--v2-k, 1)) !important; font-weight: 600 !important; color: var(--v3-ink) !important;
    background: transparent !important;
}


/* ==========================================================================
   6 · CORNISA como en el mockup: fila A = migas + hechos; fila B = identidad +
   orden/densidad (el JS trae los controles desde la toolbar de la grilla).
   La toolbar «Mostrando N de T» y la fila «Explora» se van en escritorio.
   ========================================================================== */
.prido-archive-v3 .prido-cornice__row-a { display: flex; align-items: center; gap: 24px; min-width: 0; }
/* Las migas comparten fila con los hechos: con una ruta de 5 niveles no caben y
   saltaban a DOS líneas dentro de una fila de 34 px con overflow hidden, así que
   se veían cortadas por la mitad. Una sola línea siempre; lo que sobre se recorta
   con un desvanecido y el término actual con puntos suspensivos. */
.prido-archive-v3 .prido-cornice__row-a .prido-cornice__crumbs {
    flex: 1 1 auto; min-width: 0;
    flex-wrap: nowrap !important; overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent);
            mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent);
}
.prido-archive-v3 .prido-cornice__row-a .prido-cornice__crumbs > * { flex: none; }
.prido-archive-v3 .prido-cornice__row-a .prido-cornice__current {
    min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.prido-archive-v3 .prido-cornice__row-a { height: 34px; overflow: hidden; transition: height var(--v3-dur) var(--v3-ease), opacity var(--v3-dur) var(--v3-ease); }
.prido-archive-v3 .prido-cornice.is-stuck .prido-cornice__row-a { height: 0; opacity: 0; }
/* SIN SALTO al pegarse: al condensarse, la cornisa pierde 34 px (migas) + 8 px
   (banda 56→48) de alto, y como es sticky EN EL FLUJO todo lo de debajo subía de
   golpe esa cantidad. Se compensa con el mismo margen inferior, animado con la
   misma duración y curva: lo que la cornisa ocupa en el documento no cambia. */
.prido-archive-v3 .prido-cornice.is-stuck { margin-bottom: 42px; }
/* …y ese margen no debe COLAPSAR con el del primer bloque del main (se perdían
   16 px y el contenido saltaba igual): con el padre en flex-column los márgenes
   de los hijos no colapsan. Todos los hijos son bloques a ancho completo
   (centinela, cornisa, main, guía, zócalo), así que nada más cambia. */
body.prido-archive-v3 .prido-catalog-page { display: flex; flex-direction: column; }

.prido-archive-v3 .prido-cornice__tools { display: flex; align-items: center; gap: 8px; flex: none; }
.prido-archive-v3 .prido-cornice__tools:empty { display: none; }
/* el select de orden y el conmutador de densidad, con la piel de la cornisa */
.prido-archive-v3 .prido-cornice__tools .prido-grilla-orderby {
    position: relative; display: inline-flex !important; align-items: center; margin: 0 !important;
    min-height: 36px; padding: 0 !important; border: 1px solid var(--v3-line-strong) !important; border-radius: 999px !important;
    background: var(--v3-surface) !important; color: var(--v3-ink) !important; font-family: var(--v3-ui) !important; font-size: 13px !important;
}
.prido-archive-v3 .prido-cornice__tools .prido-grilla-orderby::before {
    content: "Ordenar:"; padding-left: 12px; color: var(--v3-muted); font-weight: 500; white-space: nowrap;
}
.prido-archive-v3 .prido-cornice__tools .prido-grilla-orderby > span:not(.prido-grilla-orderby__chev) { display: none !important; }
.prido-archive-v3 .prido-cornice__tools .prido-orderby-select {
    appearance: none; -webkit-appearance: none; margin: 0 !important; padding: 0 30px 0 6px !important;
    height: 34px !important; border: 0 !important; background: transparent !important; box-shadow: none !important;
    font-family: var(--v3-ui) !important; font-size: 13px !important; font-weight: 500 !important; color: var(--v3-ink) !important; cursor: pointer;
}
.prido-archive-v3 .prido-cornice__tools .prido-grilla-orderby__chev { position: absolute; right: 11px; top: 50%; transform: translateY(-50%); color: var(--v3-muted); pointer-events: none; }
.prido-archive-v3 .prido-cornice__tools .prido-grilla-density {
    display: inline-flex !important; height: 36px; margin: 0 !important; padding: 0 !important;
    border: 1px solid var(--v3-line-strong) !important; border-radius: var(--v3-r-btn) !important; overflow: hidden; background: var(--v3-surface) !important;
}
.prido-archive-v3 .prido-cornice__tools .prido-density-option {
    width: 36px !important; height: 34px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important;
    background: transparent !important; color: var(--v3-muted) !important; display: grid !important; place-items: center; box-shadow: none !important;
}
.prido-archive-v3 .prido-cornice__tools .prido-density-option + .prido-density-option { border-left: 1px solid var(--v3-line-strong) !important; }
.prido-archive-v3 .prido-cornice__tools .prido-density-option.is-active { background: rgba(26, 42, 58, .08) !important; color: var(--v3-ink) !important; }
:root[data-theme="dark"] .prido-archive-v3 .prido-cornice__tools .prido-density-option.is-active { background: rgba(237, 244, 248, .09) !important; }

@media (min-width: 1025px) {
    /* la toolbar entera sobra: el conteo vive en el pie («Mostrando N de T · Cargar más») */
    .prido-archive-v3 .prido-catalog-page .prido-grilla-toolbar { display: none !important; }
}
@media (min-width: 768px) {
    /* las subcolecciones ya están en el panel («Categorías»): la fila no está en el mockup */
    .prido-archive-v3 .prido-cornice__subcats { display: none !important; }
}

/* ==========================================================================
   7 · PANEL DE FILTROS con la piel del mockup — caja con borde y radio, cabecera
   «Filtros» / «Borrar todo», secciones con eyebrow + chevron, casillas de 16 px,
   «Más filtros» en contorno y «Ver N productos» sólido. Mismo markup y mismo
   comportamiento de la v2. Prefijo body.prido-archive-v3 + clase repetida (0,3,1)
   para ganar a la §15 de la v2 (0,3,0). Medidas × --v2-k (el panel vive en el
   inner con zoom .9). El panel se porta a <body> en la hoja móvil: ahí NO aplica
   (sin body.prido-archive-v3 como ancestro… body sí lo es: se acota a ≥768).
   ========================================================================== */
@media (min-width: 768px) {
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel {
        --k: var(--v2-k, 1);
        border: 1px solid var(--v3-line) !important; border-radius: calc(18px * var(--k)) !important;
        background: var(--v3-surface) !important; overflow: hidden !important; padding: 0 !important;
        font-family: var(--v3-ui) !important; color: var(--v3-ink) !important;
    }
    /* cabecera */
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-fhead {
        margin: 0 !important; padding: calc(14px * var(--k)) calc(16px * var(--k)) !important;
        border-bottom: 1px solid var(--v3-line) !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-fhead-row { align-items: center !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-fhead-title {
        font-family: var(--v3-heading) !important; font-size: calc(11px * var(--k)) !important; font-weight: 700 !important;
        letter-spacing: .12em !important; text-transform: uppercase !important; color: var(--v3-ink) !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-fhead-ico { display: none !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-fhead-clear,
    .prido-archive-v3 .prido-catalog-page .prido-filters-panel .prido-fhead-clear {
        margin: 0 !important; padding: 0 calc(8px * var(--k)) !important; min-height: calc(28px * var(--k)) !important;
        border: 0 !important; border-radius: 8px !important; background: transparent !important;
        font-family: var(--v3-ui) !important; font-size: calc(12.5px * var(--k)) !important; font-weight: 500 !important;
        letter-spacing: 0 !important; text-transform: none !important; color: var(--v3-teal-deep) !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-fhead-clear:hover { background: rgba(26, 42, 58, .06) !important; }
    /* chips de lo aplicado */
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filters-active-chips {
        padding: calc(12px * var(--k)) calc(16px * var(--k)) 0 !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filters-active-chips:empty { display: none !important; }
    /* secciones */
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filters-body { padding: 0 !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-section {
        margin: 0 !important; padding: 0 calc(16px * var(--k)) !important;
        border-top: 0 !important; border-bottom: 1px solid var(--v3-line) !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-section-toggle {
        min-height: calc(46px * var(--k)) !important; padding: 0 !important; gap: 8px !important;
        border: 0 !important; background: transparent !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-section-toggle::after,
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-section-toggle::before { content: none !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-section-label {
        font-family: var(--v3-heading) !important; font-size: calc(11px * var(--k)) !important; font-weight: 700 !important;
        letter-spacing: .12em !important; text-transform: uppercase !important; color: var(--v3-muted) !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-section-toggle[aria-expanded="true"] .prido-filter-section-label,
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-section.is-open .prido-filter-section-label,
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-section.has-active .prido-filter-section-label { color: var(--v3-ink) !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-chevron { color: var(--v3-muted) !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-section-body { padding: 0 0 calc(14px * var(--k)) !important; }
    /* casillas */
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-label {
        min-height: calc(34px * var(--k)) !important; padding: 0 calc(6px * var(--k)) !important; margin-left: calc(-6px * var(--k)) !important;
        gap: calc(10px * var(--k)) !important; border-radius: 8px !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-label:hover { background: rgba(26, 42, 58, .06) !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-check-icon {
        width: calc(16px * var(--k)) !important; height: calc(16px * var(--k)) !important;
        border: 1.5px solid var(--v3-line-strong) !important; border-radius: 4px !important; background: transparent !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-checkbox:checked + .prido-filter-check-icon,
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-label.is-checked .prido-filter-check-icon {
        background: var(--v3-teal-deep) !important; border-color: var(--v3-teal-deep) !important; color: #fff !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-name {
        font-family: var(--v3-ui) !important; font-size: calc(13px * var(--k)) !important; font-weight: 400 !important; color: var(--v3-ink) !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-checkbox:checked ~ .prido-filter-name { font-weight: 600 !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-count {
        font-family: var(--v3-ui) !important; font-size: calc(12px * var(--k)) !important; color: var(--v3-muted) !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-show-more,
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-cat-toggle {
        font-family: var(--v3-ui) !important; font-size: calc(12.5px * var(--k)) !important; font-weight: 600 !important;
        color: var(--v3-teal-deep) !important; border: 0 !important; letter-spacing: 0 !important; text-transform: none !important;
    }
    /* muestras de color */
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .pf-sw-grid { column-gap: calc(10px * var(--k)) !important; row-gap: calc(10px * var(--k)) !important; }
    /* precio */
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-slider-range { background: var(--v3-teal-deep) !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-input-group {
        border: 1px solid var(--v3-line-strong) !important; border-radius: 8px !important; padding: 0 calc(8px * var(--k)) !important;
        min-height: calc(34px * var(--k)) !important; background: var(--v3-surface) !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-lab {
        font-family: var(--v3-ui) !important; font-size: calc(10.5px * var(--k)) !important; letter-spacing: .06em !important; color: var(--v3-muted) !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-input { font-family: var(--v3-ui) !important; font-size: calc(13px * var(--k)) !important; font-weight: 600 !important; color: var(--v3-ink) !important; }
    /* «Todos los filtros» es el disparador de la HOJA móvil: en columna se queda oculto */
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filters-all-trigger { display: none !important; }
    /* «Más filtros (N)» → botón de contorno; «Ver N productos» → sólido */
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-fmore-btn {
        display: flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important;
        width: calc(100% - 32px * var(--k)) !important; margin: calc(12px * var(--k)) calc(16px * var(--k)) 0 !important;
        min-height: calc(38px * var(--k)) !important; padding: 0 12px !important;
        border: 1px solid var(--v3-line-strong) !important; border-radius: var(--v3-r-btn) !important; background: transparent !important;
        font-family: var(--v3-ui) !important; font-size: calc(13px * var(--k)) !important; font-weight: 600 !important;
        letter-spacing: 0 !important; text-transform: none !important; text-decoration: none !important; color: var(--v3-ink) !important; box-shadow: none !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-fmore-btn:hover { background: rgba(26, 42, 58, .06) !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-fmore-btn svg { width: 14px !important; height: 14px !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-fmore-btn .lbl { font: inherit !important; color: inherit !important; }
    /* «Ver N productos» (.pf-foot): CTA pegajoso del sidebar. En la columna estorba
       —el filtrado ya es instantáneo por AJAX y el conteo vive en el pie de la
       grilla—, así que fuera (pedido del usuario, 8-sep). En la hoja móvil el
       equivalente es .prido-filters-sheet-footer, que no se toca. */
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .pf-foot { display: none !important; }
    /* sin el pie, el panel cierra en «Más filtros»: última sección sin filete y aire abajo */
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filter-section:last-of-type { border-bottom: 0 !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-fmore-btn { margin-bottom: calc(16px * var(--k)) !important; }
}

/* ==========================================================================
   8 · PANEL, dos piezas que aún no eran las del canvas (r16 · 2026-09-08):
   el PRECIO (barra + extremos como texto, sin las cajas «Desde/Hasta») y el
   COLOR DE TAPIZ (rejilla de 2 columnas con muestra, nombre y conteo, en vez
   de la fila de círculos sueltos). Sólo en la columna (≥768).
   ========================================================================== */
@media (min-width: 768px) {
    /* ---------- 8.1 · precio ---------- */
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-slider-wrap { padding-inline: 0 !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-slider-track,
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-slider-range {
        height: 3px !important; border-radius: 999px !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-slider-track { background: var(--v3-line) !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-slider-range { background: var(--v3-teal-deep) !important; }
    /* manijas al grosor del canvas (el canvas no las dibuja, pero sin ellas no se
       puede arrastrar: quedan discretas, en el teal de la barra) */
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel input[type="range"].prido-price-range-min::-webkit-slider-thumb,
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel input[type="range"].prido-price-range-max::-webkit-slider-thumb {
        width: 14px !important; height: 14px !important;
        background: var(--v3-surface) !important;
        border: 2px solid var(--v3-teal-deep) !important;
        box-shadow: none !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel input[type="range"].prido-price-range-min::-moz-range-thumb,
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel input[type="range"].prido-price-range-max::-moz-range-thumb {
        width: 14px !important; height: 14px !important;
        background: var(--v3-surface) !important; border: 2px solid var(--v3-teal-deep) !important; box-shadow: none !important;
    }
    /* los dos extremos, como en el canvas: sólo la cifra, a los lados. Siguen
       siendo <input>: se pueden escribir, pero ya no parecen cajas de formulario */
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-inputs {
        display: flex !important; align-items: baseline !important; justify-content: space-between !important;
        gap: 8px !important; margin-top: calc(10px * var(--k)) !important; padding: 0 !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-lab,
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-separator { display: none !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-field {
        display: block !important; flex: 0 0 auto !important; min-height: 0 !important; padding: 0 !important; margin: 0 !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-field:last-of-type { text-align: right !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-input-group {
        display: inline-flex !important; align-items: baseline !important; gap: 1px !important;
        min-height: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-currency,
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-input {
        font-family: var(--v3-ui) !important; font-size: calc(12px * var(--k)) !important; font-weight: 500 !important;
        color: var(--v3-muted) !important; letter-spacing: 0 !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-field:last-of-type { text-align: left !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-input {
        /* el input mide lo que su contenido: si no, el «$» quedaba despegado de la cifra */
        field-sizing: content; width: auto !important; min-width: 4ch; max-width: 9ch;
        padding: 0 !important; text-align: left !important; font-variant-numeric: tabular-nums;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-input::-webkit-outer-spin-button,
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-price-input:focus { color: var(--v3-ink) !important; outline: none; }

    /* ---------- 8.2 · color de tapiz ----------
       El JS de la grilla convierte la lista en `.pf-sw-grid` y marca cada término
       como `.pf-sw` (con hex) o `.pf-sw-text`; las capas previas dejan SÓLO el
       círculo (nombre y conteo ocultos). El canvas los quiere en dos columnas con
       su nombre y su cifra, así que se rehace la celda: el color pasa del fondo
       del label a un `::before`. */
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .pf-sw-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        column-gap: calc(8px * var(--k)) !important; row-gap: calc(4px * var(--k)) !important;
        padding: 0 !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .pf-sw-grid .prido-filter-item.pf-sw,
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .pf-sw-grid .prido-filter-item.pf-sw-text { grid-column: auto !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .pf-sw-grid .prido-filter-item.pf-sw .prido-filter-label,
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .pf-sw-grid .prido-filter-item.pf-sw-text .prido-filter-label {
        display: flex !important; align-items: center !important; gap: calc(8px * var(--k)) !important;
        width: auto !important; height: auto !important; min-height: calc(32px * var(--k)) !important;
        aspect-ratio: auto !important;
        padding: 0 calc(6px * var(--k)) !important; margin-left: calc(-6px * var(--k)) !important;
        border: 0 !important; border-radius: 8px !important;
        background: transparent !important; box-shadow: none !important; transform: none !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .pf-sw-grid .prido-filter-label:hover { background: rgba(26, 42, 58, .06) !important; transform: none !important; }
    /* la muestra de color */
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .pf-sw-grid .prido-filter-item.pf-sw .prido-filter-label::before,
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .pf-sw-grid .prido-filter-item.pf-sw-text .prido-filter-label::before {
        content: ""; flex: none;
        width: calc(18px * var(--k)); height: calc(18px * var(--k)); border-radius: 50%;
        background: var(--sw, var(--v3-line-strong));
        box-shadow: 0 0 0 1px rgba(0, 0, 0, .14);
    }
    :root[data-theme="dark"] .prido-archive-v3 .prido-filters-panel.prido-filters-panel .pf-sw-grid .prido-filter-label::before { box-shadow: 0 0 0 1px rgba(255, 255, 255, .18); }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .pf-sw-grid .prido-filter-label:has(input:checked)::before {
        box-shadow: 0 0 0 2px var(--v3-surface), 0 0 0 3.5px var(--v3-teal-deep) !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .pf-sw-grid .prido-filter-label:has(input:checked) { box-shadow: none !important; }
    /* nombre y conteo vuelven */
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .pf-sw-grid .prido-filter-item .prido-filter-check-icon { display: none !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .pf-sw-grid .prido-filter-item .prido-filter-name {
        display: block !important; flex: 1 1 auto !important; min-width: 0;
        overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
        font-family: var(--v3-ui) !important; font-size: calc(13px * var(--k)) !important; font-weight: 400 !important; color: var(--v3-ink) !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .pf-sw-grid .prido-filter-item .prido-filter-count {
        display: block !important; flex: none !important;
        font-family: var(--v3-ui) !important; font-size: calc(12px * var(--k)) !important; color: var(--v3-muted) !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .pf-sw-grid .prido-filter-checkbox:checked ~ .prido-filter-name { font-weight: 600 !important; }
}

/* ==========================================================================
   9 · QUÉ FILTROS VAN EN LA COLUMNA (r17). El canvas muestra Precio · Tipo ·
   Color de tapiz · Mecanismo · Tapiz respaldo · Garantía; el curado de
   prido-grilla.js/prido-filtros.css mostraba Precio · Categorías · Cabecero ·
   Brazos · Soporte lumbar · Mecanismo · Garantía · Certificación · Procedencia
   y dejaba el COLOR —la sección con más peso visual del canvas— escondida tras
   «Más filtros». Se recura aquí; el resto sigue en el cajón, que no pierde nada.
   ========================================================================== */
@media (min-width: 768px) {
    body.prido-archive-v3 .prido-filters-panel:not(.pf-show-xtra) .prido-filters-body > .prido-filter-section:not(
        [data-taxonomy="price_range"]):not(
        [data-taxonomy="product_cat"]):not(
        [data-taxonomy="pa_color"]):not(
        [data-taxonomy="pa_mecanismo"]):not(
        [data-taxonomy="pa_tapiz-respaldo"]):not(
        [data-taxonomy="pa_garantia"]) {
        display: none !important;
    }
    body.prido-archive-v3 .prido-filters-panel:not(.pf-show-xtra) .prido-filters-body > .prido-filter-section[data-taxonomy="pa_color"],
    body.prido-archive-v3 .prido-filters-panel:not(.pf-show-xtra) .prido-filters-body > .prido-filter-section[data-taxonomy="pa_tapiz-respaldo"] {
        display: block !important;
    }
    /* una sección de cola con filtros ACTIVOS dentro se sigue mostrando */
    body.prido-archive-v3 .prido-filters-panel:not(.pf-show-xtra) .prido-filters-body > .prido-filter-section:has(.prido-filter-checkbox:checked) {
        display: block !important;
    }
    /* orden del canvas */
    body.prido-archive-v3 .prido-filters-body > .prido-filter-section[data-taxonomy="price_range"]      { order: 1 !important; }
    body.prido-archive-v3 .prido-filters-body > .prido-filter-section[data-taxonomy="product_cat"]      { order: 2 !important; }
    body.prido-archive-v3 .prido-filters-body > .prido-filter-section[data-taxonomy="pa_color"]         { order: 3 !important; }
    body.prido-archive-v3 .prido-filters-body > .prido-filter-section[data-taxonomy="pa_mecanismo"]     { order: 4 !important; }
    body.prido-archive-v3 .prido-filters-body > .prido-filter-section[data-taxonomy="pa_tapiz-respaldo"]{ order: 5 !important; }
    body.prido-archive-v3 .prido-filters-body > .prido-filter-section[data-taxonomy="pa_garantia"]      { order: 6 !important; }
}

/* ==========================================================================
   10 · SCROLL PROPIO DEL PANEL (r19). La columna es pegajosa pero no tenía
   límite de alto: con «Más filtros» desplegado había que recorrer media página
   para llegar al último filtro. Ahora el panel se acota a lo que queda de
   pantalla bajo la cornisa y la lista de secciones scrollea dentro; la cabecera
   («Filtros / Borrar todo») y los chips se quedan fijos arriba.
   Ojo: el panel vive en el inner con `zoom: .9`, así que 100vh se pinta como
   90vh — se compensa dividiendo por 0.9, igual que el `top` del sidebar.
   ========================================================================== */
@media (min-width: 768px) {
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel {
        display: flex !important;
        flex-direction: column !important;
        max-height: calc((100vh - var(--v3-cornice-bottom, 0px) - 32px) / 0.9) !important;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-fhead,
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filters-active-chips { flex: 0 0 auto !important; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filters-body {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        scrollbar-width: thin;
        scrollbar-color: var(--v3-line-strong) transparent;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filters-body::-webkit-scrollbar { width: 6px; }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filters-body::-webkit-scrollbar-thumb {
        background: var(--v3-line-strong); border-radius: 999px;
    }
    .prido-archive-v3 .prido-filters-panel.prido-filters-panel .prido-filters-body::-webkit-scrollbar-track { background: transparent; }
    /* el sidebar deja de imponer su propio alto: manda el panel */
    .prido-archive-v3 .prido-shop-sidebar { align-self: start; }
}

/* ==========================================================================
   r20 · accesibilidad: objetivo táctil de 24 px en las muestras de color (WCAG 2.5.8).
   El <button> mide 24 px y el punto se pinta en ::before con el diámetro de siempre;
   los márgenes negativos conservan la caja de la fila, así la card no cambia de alto.
   27 px y no 24: la grilla de escritorio va escalada a 0,9 (27 × 0,9 = 24,3).
   ========================================================================== */
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .pcv4-swatches { --sw-d: calc(16px * var(--v2-k, 1)); --sw-t: 27px; gap: calc(var(--sw-t) + 2px - var(--sw-d)) !important; }
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .pcv4-sw {
    position: relative; width: var(--sw-t) !important; height: var(--sw-t) !important;
    margin: calc((var(--sw-d) - var(--sw-t)) / 2) !important;
    border: 0 !important; background: transparent !important; box-shadow: none !important;
}
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .pcv4-sw::before {
    content: ""; position: absolute; inset: calc((var(--sw-t) - var(--sw-d)) / 2); border-radius: 50%;
    background: var(--sw, #999); box-shadow: 0 0 0 1px rgba(0, 0, 0, .14); transition: box-shadow .12s ease;
}
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .pcv4-sw:hover::before,
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .pcv4-sw:focus-visible::before { box-shadow: 0 0 0 1.5px var(--v3-surface), 0 0 0 2.5px var(--v3-ink); }
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .pcv4-sw.is-active::before,
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .pcv4-sw[aria-pressed="true"]::before { box-shadow: 0 0 0 2px var(--v3-surface), 0 0 0 3.5px var(--v3-cta-bg); }
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .pcv4-sw.is-active,
body.prido-archive-v3 .prido-catalog-page .prido-grilla-wrapper[data-columns] .prido-grilla-products .pcv4 .pcv4-sw[aria-pressed="true"] { box-shadow: none !important; }

/* r20 · encabezado solo para lectores de pantalla antes de la grilla (h1 → h2 → h3 de las cards) */
.prido-grilla-sr-title {
    position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0;
    overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}

/* r20 · contraste del chip de subcategoría activo: 5,3:1 sobre su fondo teal al 12 % (antes 4,3:1) */
.prido-archive-v3 .prido-cornice__subnav .prido-subcat-chip.is-active { color: #0b6f6b !important; }
.prido-archive-v3 .prido-cornice__subnav .prido-subcat-chip.is-active .prido-subcat-chip__count { opacity: 1 !important; }

/* r20 · el <input type=range> del precio medía 3,6 px de alto (objetivo táctil < 24 px). Ocupa
   ahora los 24 px de su contenedor; la pista y el rango se dibujan aparte, así que no cambia nada a la vista. */
.prido-archive-v3 .prido-filters-panel.prido-filters-panel input[type="range"].prido-price-range-min,
.prido-archive-v3 .prido-filters-panel.prido-filters-panel input[type="range"].prido-price-range-max {
    height: 27px !important; top: -1.5px; margin: 0;
}

/* r21 · CLS de /tienda/ y categorías (17-oct-2026). El CSS deja desde el primer pintado el estado que
   hoy aplica el JS después de pintar (0,22 de CLS a 1440 px; 0,08 a 768 px).
   1. ≥768: prido-grilla.js (curateSidebar) abre Precio y Categoría, pero el HTML las trae .is-collapsed.
      Se muestran abiertas; si el usuario las cierra, la grilla marca data-prido-user-toggled y manda
      de nuevo .is-collapsed. No aplica en la hoja «Todos los filtros». Si la ventana cruza los 768 px
      (girar el teléfono, cambiar el ancho), mu-plugins/prido-perf-t6.php pone data-prido-t6-noopen en
      <body> y la regla deja de actuar: manda el estado del JS, como antes de r21 (curateSidebar no corre
      en resize y aria-expanded quedaría desfasado de lo que se ve). */
@media (min-width: 768px) {
    body.prido-archive-v3:not([data-prido-t6-noopen]) .prido-filters-panel:not(.is-all-filters-open) .prido-filter-section.is-collapsed:is([data-taxonomy="price_range"], [data-taxonomy="product_cat"]):not([data-prido-user-toggled]) .prido-filter-section-body {
        display: block;
    }
    body.prido-archive-v3:not([data-prido-t6-noopen]) .prido-filters-panel:not(.is-all-filters-open) .prido-filter-section.is-collapsed:is([data-taxonomy="price_range"], [data-taxonomy="product_cat"]):not([data-prido-user-toggled]) .prido-filter-chevron {
        transform: rotate(180deg);
    }
}
/* 2. ≥1200: prido-archive-v2.js (syncHeroAlign) iguala el margen izquierdo del bloque filtros+grilla al
      derecho (prido-filtros.r12 §v6.2 los deja asimétricos) y publica --v2-hero-gutter con el borde
      medido (dentro del zoom .9). Mismo resultado en CSS; el JS queda sin efecto visible. */
@media (min-width: 1200px) {
    .prido-catalog-main > .prido-catalog-shell__inner:has(.prido-shop-layout) {
        margin-left: calc(var(--pf-gutter) - (var(--pf-expand) / 2)) !important;
    }
    body.prido-archive-v3 .prido-catalog-page:has(.prido-shop-layout) {
        --v2-hero-gutter: calc(clamp(32px, 13.333vw - 144px, 160px) - .45 * clamp(0px, 22.222vw - 312px, calc(clamp(32px, 13.333vw - 144px, 160px) / .9 - 16px)));
    }
}
/*    Redondeado como el JS (Math.round del borde medido): al publicarlo en línea no mueve el hero ni medio píxel.
      En @supports porque una custom property no descarta round() al parsear. */
@supports (width: round(1.4px, 1px)) {
    @media (min-width: 1200px) {
        body.prido-archive-v3 .prido-catalog-page:has(.prido-shop-layout) {
            --v2-hero-gutter: round(calc(clamp(32px, 13.333vw - 144px, 160px) - .45 * clamp(0px, 22.222vw - 312px, calc(clamp(32px, 13.333vw - 144px, 160px) / .9 - 16px))), 1px);
        }
    }
}
