/* ═══════════════════════════════════════════════════════════
   VICORSA — condiciones comerciales (envío, entrega, pago, IVA)
   Carga DESPUÉS de drawer.css: es la última hoja del tema, así
   que no necesita pelear con !important contra nadie.
   Clases nuevas y exclusivas: vic-conf · vic-envio · vic-resp ·
   vic-benef. Verificadas contra las 98 clases vic-* del tema.
   Tokens del theme.json, ningún color suelto.
   ═══════════════════════════════════════════════════════════ */

/* ── El encabezado es fijo: lo que arranca debajo necesita aire ──
   Las plantillas de tienda reservan el hueco con vic_encabezado_tienda(),
   pero una página normal (términos, facturación, privacidad, devoluciones)
   usa la plantilla del tema padre y su <main> arrancaba en top:0 —medido—
   así que el buscador tapaba el primer párrafo. El alto real lo mide el JS
   y lo publica en --vic-cabeza-h; el respaldo de 176px es el valor medido
   a 359px por si el JS no ha corrido todavía. */
body.page:not(.woocommerce-page):not(.home) .wp-site-blocks > main{
  padding-top:calc(var(--vic-cabeza-h, 176px) + 26px);
}
/* Al saltar a un ancla del menú, que el título no quede bajo el encabezado */
#nosotros,#especialidades,#pedido,#garantias,#catalogo{
  scroll-margin-top:calc(var(--vic-cabeza-h, 176px) + 12px);
}

/* ── Avisos de WooCommerce con la paleta del sitio ───────────
   Salían con el borde mostaza por defecto del plugin, que no existe
   en la marca. Mismo mensaje, lenguaje visual de VICORSA. */
.woocommerce-message,.woocommerce-info,.woocommerce-error{
  border:1px solid var(--wp--preset--color--vic-linea)!important;
  border-left:4px solid var(--wp--preset--color--vic-teal)!important;
  border-radius:18px!important;
  background:var(--wp--preset--color--vic-papel)!important;
  color:var(--wp--preset--color--vic-tinta)!important;
  font-size:14px;line-height:1.45;
  padding:16px 18px!important;
}
.woocommerce-info{border-left-color:var(--wp--preset--color--vic-azul)!important}
.woocommerce-error{border-left-color:#C0392B!important}
.woocommerce-message::before,.woocommerce-info::before,.woocommerce-error::before{display:none!important}
.woocommerce-message .button,.woocommerce-info .button{
  background:var(--wp--preset--color--vic-azul)!important;color:#fff!important;
  border-radius:999px!important;padding:9px 18px!important;font-size:13.5px!important;
}

/* ── Páginas de contenido (nosotros, garantías, legales) ─────
   Sin esto se veían como un documento suelto de WordPress: título
   enorme, párrafos a todo lo ancho y ningún elemento del sistema. */
body.page:not(.woocommerce-page):not(.home) .wp-site-blocks > main .entry-content,
body.page:not(.woocommerce-page):not(.home) .wp-site-blocks > main .wp-block-post-content{
  max-width:760px;margin-inline:auto;
}
body.page:not(.woocommerce-page):not(.home) .wp-block-post-title{
  max-width:760px;margin:0 auto 6px;
  font-size:clamp(2rem,5.4vw,2.9rem);line-height:1.06;letter-spacing:-.02em;
  color:var(--wp--preset--color--vic-tinta);
}
body.page:not(.woocommerce-page) .entry-content > h2{
  margin:38px 0 10px;font-size:clamp(1.25rem,3.4vw,1.6rem);line-height:1.15;
  letter-spacing:-.015em;color:var(--wp--preset--color--vic-tinta);
}
body.page:not(.woocommerce-page) .entry-content > p,
body.page:not(.woocommerce-page) .entry-content li{
  font-size:16px;line-height:1.62;color:var(--wp--preset--color--vic-cuerpo);
}
body.page:not(.woocommerce-page) .entry-content > p.vic-lead{
  font-size:18px;line-height:1.5;color:var(--wp--preset--color--vic-tinta);
  border-left:3px solid var(--wp--preset--color--vic-teal);
  padding-left:16px;margin:14px 0 26px;
}
body.page:not(.woocommerce-page) .entry-content ul,
body.page:not(.woocommerce-page) .entry-content ol{
  padding-left:20px;margin:12px 0;
}
body.page:not(.woocommerce-page) .entry-content li{margin:6px 0}
body.page:not(.woocommerce-page) .entry-content a{
  color:var(--wp--preset--color--vic-azul);text-underline-offset:3px;
}
/* Correos y URLs largos: contacto@vicorsacomercializadora.com mide 292px y a
   359px se salía 45px de su párrafo (medido). Que parta, no que desborde. */
body.page:not(.woocommerce-page) .entry-content a[href^="mailto:"],
.vic-cierre a[href^="mailto:"],
footer a[href^="mailto:"]{
  overflow-wrap:anywhere;word-break:break-word;
}
body.page:not(.woocommerce-page) .entry-content .vic-benef{margin:22px 0}

/* Cierre de página: catálogo o WhatsApp, siempre a la vista */
.vic-cierre{
  display:flex;flex-wrap:wrap;gap:18px;align-items:center;justify-content:space-between;
  margin:34px 0 6px;padding:24px 26px;border-radius:28px;
  background:var(--wp--preset--color--vic-tinta);
}
.vic-cierre b{display:block;font-size:17px;color:#fff;line-height:1.25}
.vic-cierre span{display:block;font-size:13.5px;margin-top:6px;color:var(--wp--preset--color--vic-linea);max-width:44ch}
.vic-cierre .bt{display:flex;flex-wrap:wrap;gap:10px}
.vic-cierre a{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:46px;padding:0 22px;border-radius:999px;
  font-size:14.5px;font-weight:800;text-decoration:none;white-space:nowrap;
}
.vic-cierre a.p{background:var(--wp--preset--color--vic-azul);color:#fff}
.vic-cierre a.s{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.34)}
@media (max-width:640px){
  .vic-cierre{padding:20px;border-radius:24px;gap:14px}
  .vic-cierre .bt{width:100%}
  .vic-cierre a{flex:1 1 100%}
}

/* ── Cómo se pide: 6 pasos ───────────────────────────────────
   El grid viejo (.vic-proc) estaba cableado a 4 tarjetas exactas
   con nth-child y la foto en la columna central: con 6 pasos se
   rompía. Clase nueva, layout propio, sin tocar aquella cascada. */
/* ⚠️ El shorthand con `0` a los lados pisaba el `margin-left/right:auto`
   que el layout `constrained` de WordPress le pone a los hijos: la foto
   quedaba pegada a la izquierda del grupo alignfull (medido: centro en
   628 contra 720 del contenedor). Los laterales van en `auto`. */
.vic-pasos-foto{margin:34px auto 22px!important}
.vic-pasos-foto img{
  width:100%;height:auto;object-fit:cover;aspect-ratio:24/7;border-radius:32px;
}
.vic-pasos{
  display:grid!important;grid-template-columns:repeat(3,1fr);gap:16px;
}
.vic-pasos > .wp-block-group{
  display:flex;flex-direction:column;align-items:flex-start;
}
.vic-pasos > .wp-block-group > p:first-child{
  width:auto!important;flex:0 0 auto;align-self:flex-start;
}
@media (max-width:1000px){ .vic-pasos{grid-template-columns:repeat(2,1fr);gap:12px} }
@media (max-width:640px){
  .vic-pasos{gap:10px}
  .vic-pasos > .wp-block-group{padding:16px 16px 17px!important;border-radius:20px!important}
  .vic-pasos h3{font-size:.95rem!important;margin:0 0 5px!important;line-height:1.25}
  .vic-pasos p{font-size:12px!important;line-height:1.45}
  .vic-pasos-foto img{aspect-ratio:16/9}
  .vic-pasos-foto{margin:24px auto 18px!important}
}

/* ── Ficha: las condiciones bajo el botón de añadir ─────────── */
.vic-conf{
  margin:22px 0 0;
  border:1px solid var(--wp--preset--color--vic-linea);
  border-radius:24px;
  background:var(--wp--preset--color--vic-papel);
  overflow:hidden;
}
.vic-conf-f{
  display:flex;align-items:flex-start;gap:12px;
  padding:14px 18px;
  border-bottom:1px solid var(--wp--preset--color--vic-linea);
}
.vic-conf-f:last-child{border-bottom:0}
.vic-conf-f .ic{
  flex:0 0 34px;height:34px;display:flex;align-items:center;justify-content:center;
  border-radius:999px;
  background:var(--wp--preset--color--vic-soft);
  color:var(--wp--preset--color--vic-azul);
}
.vic-conf-f .tx{display:block;line-height:1.35}
.vic-conf-f .tx b{
  display:block;font-size:14.5px;font-weight:800;
  color:var(--wp--preset--color--vic-tinta);
}
.vic-conf-f .tx i{
  display:block;font-style:normal;font-size:12.5px;margin-top:2px;
  color:var(--wp--preset--color--vic-mute);
}

/* ── Envío sin costo: barra de avance en carrito y panel ────── */
.vic-envio{
  margin:0 0 16px;padding:14px 16px;
  border-radius:18px;
  background:var(--wp--preset--color--vic-soft);
}
.vic-envio.ok{background:rgba(0,192,157,.14)}
/* ⚠️ Nada de flex aquí: el <strong> del monto y el resto de la frase se
   convertían en ítems flex y la línea salía partida en tres columnas
   ("Te faltan | $5,500.00 | para que el envío…"). Texto corrido, icono inline. */
.vic-envio-txt{
  display:block;
  margin:0 0 10px;font-size:13.5px;line-height:1.4;
  color:var(--wp--preset--color--vic-tinta);
}
.vic-envio-txt svg{
  display:inline-block;vertical-align:-3px;margin-right:7px;
  color:var(--wp--preset--color--vic-azul);
}
.vic-envio.ok .vic-envio-txt svg{color:var(--wp--preset--color--vic-teal-osc)}
.vic-envio-txt .woocommerce-Price-amount{font-weight:800}
.vic-envio-pista{
  display:block;height:6px;border-radius:999px;
  background:rgba(10,34,49,.10);overflow:hidden;
}
.vic-envio-pista i{
  display:block;height:100%;border-radius:999px;
  background:var(--wp--preset--color--vic-azul);
  transition:width .35s ease;
}
.vic-envio.ok .vic-envio-pista i{background:var(--wp--preset--color--vic-teal)}

/* ── Quién responde por el contenido clínico ────────────────── */
.vic-resp{
  display:flex;align-items:flex-start;gap:9px;
  max-width:760px;margin:28px auto 0;
  font-size:12.5px;line-height:1.5;
  color:var(--wp--preset--color--vic-mute);
}
.vic-resp svg{flex:0 0 15px;margin-top:2px;color:var(--wp--preset--color--vic-teal-osc)}
.vic-resp strong{color:var(--wp--preset--color--vic-cuerpo)}

/* ── Portada: tira de condiciones bajo el hero ──────────────── */
.vic-benef{
  display:grid;grid-template-columns:repeat(4,1fr);gap:0;
  border:1px solid var(--wp--preset--color--vic-linea);
  border-radius:28px;
  background:var(--wp--preset--color--vic-papel);
  overflow:hidden;
}
.vic-benef .b{
  display:flex;align-items:flex-start;gap:12px;
  padding:20px 22px;
  border-right:1px solid var(--wp--preset--color--vic-linea);
}
.vic-benef .b:last-child{border-right:0}
.vic-benef .ic{
  flex:0 0 36px;height:36px;display:flex;align-items:center;justify-content:center;
  border-radius:999px;
  background:var(--wp--preset--color--vic-soft);
  color:var(--wp--preset--color--vic-azul);
}
.vic-benef b{
  display:block;font-size:14.5px;font-weight:800;line-height:1.25;
  color:var(--wp--preset--color--vic-tinta);
}
.vic-benef span.d{
  display:block;font-size:12.5px;margin-top:3px;line-height:1.4;
  color:var(--wp--preset--color--vic-mute);
}

@media (max-width:900px){
  .vic-benef{grid-template-columns:repeat(2,1fr);border-radius:24px}
  .vic-benef .b{padding:16px 16px}
  .vic-benef .b:nth-child(2n){border-right:0}
  .vic-benef .b:nth-child(-n+2){border-bottom:1px solid var(--wp--preset--color--vic-linea)}
}
/* En dos columnas a 359px la celda deja ~110px de texto y "Envío sin costo
   desde $15,000" cae en cuatro renglones. Medido, no supuesto: en móvil va
   a una columna, con el icono al lado y el texto corrido. */
@media (max-width:640px){
  .vic-benef{grid-template-columns:1fr}
  .vic-benef .b{border-right:0;border-bottom:1px solid var(--wp--preset--color--vic-linea);padding:14px 16px}
  .vic-benef .b:last-child{border-bottom:0}
  .vic-benef .b:nth-child(-n+2){border-bottom:1px solid var(--wp--preset--color--vic-linea)}
  .vic-benef .ic{flex:0 0 32px;height:32px}
  .vic-benef b{font-size:14px}
  .vic-conf-f{padding:12px 14px;gap:10px}
  .vic-conf-f .ic{flex:0 0 30px;height:30px}
}

/* ── FAQ dentro de la ficha ───────────────────────────────────
   Mismo acordeón que la portada (.vic-acc, en vicorsa.css): aquí
   sólo se le da la caja, el ancho de lectura y el encabezado.
   Va cerrado: no cuesta alto de página y contesta antes de que la
   duda se vaya a WhatsApp. */
.vic-faq-ficha{max-width:1200px;margin:44px auto 0;padding:34px 28px 0;
  border-top:1px solid var(--vic-linea)}
.vic-faq-ficha h2{font-size:1.25rem!important;margin:0 0 6px!important;
  color:var(--vic-tinta);letter-spacing:-.02em}
.vic-faq-sub{margin:0 0 18px!important;font-size:13.5px;color:var(--vic-mute)}
.vic-faq-ficha .vic-acc{max-width:860px}
.vic-faq-pie{margin:18px 0 0!important;font-size:13.5px;color:var(--vic-mute)}
.vic-faq-pie a{color:var(--vic-azul);font-weight:700;text-decoration:none}
.vic-faq-pie a:hover{text-decoration:underline}
@media(max-width:600px){
  .vic-faq-ficha{margin-top:32px;padding:26px 16px 0}
  .vic-faq-ficha h2{font-size:1.1rem!important}
  .vic-faq-sub{font-size:12.5px;margin-bottom:14px!important}
  .vic-faq-pie{font-size:12.5px}
}

/* ═══════════════════════════════════════════════════════════
   SIN PRECIOS EN EL SITIO PÚBLICO (31-jul-2026)
   El precio se apaga en PHP (inc/precios.php): esto es sólo la
   red por si alguna plantilla del plugin lo pinta por otra vía.
   Ocultar por CSS NO es la defensa —el importe seguiría en el
   HTML— pero evita que un nodo suelto se cuele en pantalla.
   ═══════════════════════════════════════════════════════════ */
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.wp-block-woocommerce-product-price,
.wc-block-components-product-price,
.woocommerce ul.products li.product .price:empty{display:none!important}

/* Carrito: columnas de dinero y tabla de totales fuera.
   El botón de WhatsApp vive en .wc-proceed-to-checkout, que va DESPUÉS
   de la tabla dentro de .cart_totals — por eso se oculta la tabla y no
   el bloque entero, o se iría el botón con ella. */
.woocommerce-cart th.product-price,.woocommerce-cart td.product-price,
.woocommerce-cart th.product-subtotal,.woocommerce-cart td.product-subtotal,
.woocommerce-cart .cart_totals > h2,
.woocommerce-cart .cart_totals .shop_table{display:none!important}

/* ── El chip que ocupa el lugar del precio en la tarjeta ──── */
.vic-cotiza{display:inline-flex;align-items:center;gap:6px;margin:4px 0 0;
  max-width:100%;box-sizing:border-box;
  padding:5px 12px;border-radius:var(--vic-r-p,999px);
  background:var(--vic-soft,#E2EFF8);color:var(--vic-azul);
  font-size:12.5px;font-weight:700;letter-spacing:-.01em;white-space:normal}
.vic-cotiza::before{content:"";flex:0 0 auto;
  width:6px;height:6px;border-radius:50%;background:var(--vic-teal,#00C09D)}

/* ⚠️ En móvil la tarjeta deja 123px útiles y la píldora medía 139: se
   cortaba por la derecha (medido y visto a 359px, 31-jul). En vez de
   apretar la píldora hasta que quepa, en móvil se quita la cápsula y el
   texto ocupa el renglón del precio, que es justo lo que sustituye. */
@media(max-width:600px){
  .vic-cotiza{display:block;padding:2px 0;background:none;
    font-size:12px;line-height:1.25}
  .vic-cotiza::before{display:none}
}

/* ── La caja de cotización de la ficha ─────────────────────
   Ocupa el hueco del precio, así que carga el peso visual que
   tenía: es lo primero que se lee después del título. */
.vic-cotiza-caja{margin:14px 0 18px;padding:18px 20px;
  border:1px solid var(--vic-linea);border-radius:var(--vic-r,20px);
  background:var(--vic-papel,#fff);box-sizing:border-box}
.vic-cotiza-caja b{display:block;font-size:1.18rem;line-height:1.2;
  letter-spacing:-.02em;color:var(--vic-tinta)}
.vic-cotiza-caja > span{display:block;margin-top:6px;font-size:13.5px;
  line-height:1.45;color:var(--vic-mute)}
.vic-cotiza-caja a{display:flex;align-items:center;justify-content:center;gap:9px;
  width:100%;box-sizing:border-box;margin-top:14px;min-height:52px;padding:0 20px;
  border-radius:var(--vic-r-p,999px);background:var(--vic-azul);color:#fff;
  font-size:15px;font-weight:700;text-decoration:none;letter-spacing:-.01em}
.vic-cotiza-caja a:hover{background:var(--vic-azul-osc,#04578F);color:#fff}
.vic-cotiza-caja a svg{flex:0 0 auto}
.vic-cotiza-caja i{display:block;margin-top:10px;font-style:normal;
  font-size:12px;color:var(--vic-mute)}
@media(max-width:600px){
  .vic-cotiza-caja{padding:16px;margin:12px 0 16px}
  .vic-cotiza-caja b{font-size:1.05rem}
  .vic-cotiza-caja > span{font-size:12.5px}
  .vic-cotiza-caja a{min-height:48px;font-size:14.5px}
}

/* ── Piezas en la línea del panel lateral, donde iba el importe ── */
.vic-drawer .linea .der .sub .pz{font-size:13px;font-weight:700;
  color:var(--vic-mute);white-space:nowrap}

/* ── "Precio por WhatsApp" en el desplegable del buscador ──── */
.vic-item .pr.cotiza{font-size:11.5px;font-weight:700;color:var(--vic-azul);
  letter-spacing:-.01em;white-space:nowrap}

/* ── CTA para pacientes ────────────────────────────────────
   Tono deliberadamente sereno: no compite con el botón de pedido
   del comprador profesional, pero da salida a quien no lo es. */
.vic-paciente{display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  max-width:1200px;margin:34px auto 0;padding:20px 24px;box-sizing:border-box;
  border:1px solid var(--vic-linea);border-radius:var(--vic-r-l,32px);
  background:var(--vic-fondo,#EFF5F9)}
.vic-paciente .ic{flex:0 0 auto;display:flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:50%;background:var(--vic-papel,#fff);
  border:1px solid var(--vic-linea);color:var(--vic-azul)}
.vic-paciente .tx{flex:1 1 260px;min-width:0}
.vic-paciente .tx b{display:block;font-size:16px;letter-spacing:-.02em;
  color:var(--vic-tinta)}
.vic-paciente .tx span{display:block;margin-top:3px;font-size:13.5px;
  line-height:1.45;color:var(--vic-mute)}
.vic-paciente .bt{flex:0 0 auto;display:inline-flex;align-items:center;
  justify-content:center;min-height:46px;padding:0 22px;box-sizing:border-box;
  border-radius:var(--vic-r-p,999px);background:var(--vic-tinta);color:#fff;
  font-size:14.5px;font-weight:700;text-decoration:none;letter-spacing:-.01em}
.vic-paciente .bt:hover{background:var(--vic-azul);color:#fff}
@media(max-width:760px){
  .vic-paciente{margin-top:26px;padding:18px;gap:13px;border-radius:24px}
  .vic-paciente .tx{flex-basis:100%}
  .vic-paciente .tx b{font-size:15px}
  .vic-paciente .tx span{font-size:12.5px}
  .vic-paciente .bt{width:100%;min-height:48px}
}

/* ── La misma salida dentro del aviso de acceso ────────────
   Quien no es del sector salud tiene a dónde ir sin tener que
   declarar que sí lo es para poder cerrar el aviso. */
.vic-acceso-paciente{display:block;margin-top:14px;text-align:center;
  font-size:13.5px;font-weight:600;color:var(--vic-azul);text-decoration:none}
.vic-acceso-paciente:hover{text-decoration:underline}

/* ═══════════════════════════════════════════════════════════
   ENCABEZADO COMPACTO AL SCROLLEAR (31-jul-2026)
   El encabezado son TRES capas fijas: barra de atención
   (.vic-topbar, ~46px), fila de logo/menú/teléfono (.vic-nav-in,
   ~66px) y fila del buscador (.vic-busca-fila, ~58px). Juntas
   comían ~176px de pantalla en todo momento, en escritorio y en
   móvil. Al scrollear se quedan sólo los ~58px del buscador.

   El acceso a Inicio no se pierde: en la ficha y el catálogo están
   las migas de pan justo debajo, y en móvil la barra inferior.
   La clase la pone el JS sobre <html> con dos umbrales (120px para
   compactar, 40px para volver) — ver assets/js/buscador.js.
   ═══════════════════════════════════════════════════════════ */
.vic-topbar{transition:transform .26s ease}
.vic-nav{transition:background .3s,border-color .3s,top .26s ease}
.vic-nav-in{transition:height .26s ease,opacity .18s ease,
  padding-top .26s ease,padding-bottom .26s ease}

html.vic-compacta .vic-topbar{transform:translateY(-100%);pointer-events:none}

/* ── Compacto: UNA fila con buscador + logo a la derecha ─────
   Owen (31-jul): "que cuando aparezca así siga apareciendo el logo
   del lado derecho".

   ⚠️ La primera versión colapsaba `.vic-nav-in` a `height:0` y la barra
   quedaba visiblemente pegada abajo: **33px de aire arriba contra 17
   abajo**. No era culpa del padding — `.vic-nav` es un `wp-block-group`
   y su **blockGap seguía reservando el hueco** del hijo colapsado, que
   ningún `padding` toca. La solución no es compensar ese hueco sino
   quitarlo: en compacto el nav pasa a `display:flex` y el gap lo
   controlamos nosotros.

   El `padding-inline` replica el del contenido (max-width 1200 + 28px),
   así que la barra queda alineada con el texto de la página, no sólo
   centrada respecto a la ventana. */
html.vic-compacta .vic-nav{
  top:0!important;
  display:flex;align-items:center;gap:16px;
  padding-top:calc(env(safe-area-inset-top,0px) + 9px)!important;
  padding-bottom:9px!important;
  padding-inline:max(28px, calc((100% - 1200px) / 2 + 28px))!important;
}
/* de la fila del logo sólo sobrevive el logo */
html.vic-compacta .vic-nav .vic-lk,
html.vic-compacta .vic-nav .vic-acts{display:none!important}
/* el logo va a la IZQUIERDA, donde está siempre: mantenerlo en su
   lado evita que la marca «salte» de sitio al scrollear */
html.vic-compacta .vic-nav-in{
  order:0;flex:0 0 auto;width:auto;max-width:none;
  padding:0!important;margin:0!important;height:auto!important;
}
/* ⚠️ `min-width:0` es obligatorio: sin él el ítem flex no baja de su
   ancho de contenido (el botón lleva `width:100%`), y en móvil la barra
   empujaba el logo FUERA de la pantalla — se veía sólo la "Vi" cortada
   contra el borde derecho. Es el `min-width:auto` que traen por defecto
   los ítems flex. */
html.vic-compacta .vic-busca-fila{
  order:1;flex:1 1 auto;min-width:0;width:auto;max-width:none;
  padding:0!important;margin:0!important;
}
html.vic-compacta .vic-logo img{height:26px}

@media(max-width:760px){
  /* el logo lleva el tagline debajo: a 26px en una pantalla angosta se
     come el espacio del buscador sin aportar nada legible */
  html.vic-compacta .vic-nav{gap:12px;
    padding-inline:20px!important;padding-top:calc(env(safe-area-inset-top,0px) + 8px)!important;
    padding-bottom:8px!important}
  html.vic-compacta .vic-logo img{height:20px}
}
/* compacto siempre va sólido: flota sobre contenido, no sobre la foto */
html.vic-compacta .vic-nav{background:rgba(255,255,255,.94);
  backdrop-filter:blur(14px);border-bottom-color:var(--vic-linea)}
html.vic-compacta .vic-busca-grande{background:var(--vic-fondo);
  border-color:var(--vic-linea);color:var(--vic-mute)}
html.vic-compacta .vic-busca-grande kbd{background:var(--vic-papel);
  border-color:var(--vic-linea);color:var(--vic-mute)}
html.vic-compacta .vic-busca-fila{padding-top:10px}

@media(prefers-reduced-motion:reduce){
  .vic-topbar,.vic-nav,.vic-nav-in{transition:none!important}
}

/* ── El CTA de paciente dentro de la ficha ─────────────────
   Owen (31-jul) lo pidió justo debajo de la fila de Pedido mínimo,
   no al final de la página: el paciente que llega de Google se
   entera arriba, no después de scrollear la ficha entera.
   Deliberadamente SIN botón sólido: ahí arriba ya está el azul de
   "Pedir precio por WhatsApp" y dos botones llenos compiten. */
/* ⚠️ El margen SUPERIOR es explícito a propósito. Con `margin:0 0 18px` el
   bloque se apoyaba en el margen inferior del hermano de arriba; al
   reordenar la ficha quedó justo debajo del botón «Agregar», que tiene
   `margin-bottom:0`, y se pegó — medido: 0px de separación. Los 22px lo
   igualan al resto de la columna (22-26px entre bloques). */
.vic-paciente.en-ficha{margin:22px 0 18px;padding:14px 16px;gap:12px;
  border-radius:var(--vic-r,20px);flex-wrap:nowrap}
.vic-paciente.en-ficha .ic{width:36px;height:36px}
.vic-paciente.en-ficha .ic svg{width:17px;height:17px}
.vic-paciente.en-ficha .tx{flex:1 1 auto}
.vic-paciente.en-ficha .tx b{font-size:14.5px}
.vic-paciente.en-ficha .tx span{font-size:12.5px;margin-top:2px}
.vic-paciente.en-ficha .bt{background:none;color:var(--vic-azul);
  min-height:0;padding:0;font-size:13.5px;text-decoration:underline;
  text-underline-offset:3px;white-space:nowrap}
.vic-paciente.en-ficha .bt:hover{background:none;color:var(--vic-azul-osc,#04578F)}
@media(max-width:760px){
  .vic-paciente.en-ficha{flex-wrap:wrap;padding:13px 14px;gap:10px}
  .vic-paciente.en-ficha .tx{flex-basis:calc(100% - 48px)}
  .vic-paciente.en-ficha .bt{width:auto;margin-left:48px}
}

/* ═══════════════════════════════════════════════════════════
   FOTOS REALES DE PRODUCTO (31-jul-2026)
   Llegaron las primeras de Emilio y salían MINÚSCULAS: medido,
   48x48px dentro de una caja de 655, y al 20% de opacidad.

   No era culpa de la foto. `tienda.css:243` y `vicorsa.css:222`
   encogen la imagen al 30-38% con `max-width:160px/74px` y
   `opacity:.2` — reglas escritas cuando la ÚNICA imagen posible era
   el emblema de VICORSA haciendo de marcador, que efectivamente debe
   verse chico y desvaído. Al llegar fotos de verdad, esas reglas las
   aplastaban igual.

   La corrección es acotar aquello al marcador (`.woocommerce-placeholder`)
   y dejar que la foto real llene su caja. `object-fit:contain` porque
   una caja de medicamento no se puede recortar: el nombre y los mg
   tienen que leerse enteros.
   ═══════════════════════════════════════════════════════════ */
.woocommerce-product-gallery img:not(.woocommerce-placeholder),
.wp-block-woocommerce-product-image-gallery img:not(.woocommerce-placeholder),
.woocommerce ul.products li.product .vic-pr-img img:not(.woocommerce-placeholder){
  width:100%!important;max-width:none!important;height:100%!important;
  opacity:1!important;object-fit:contain!important;margin:0!important}

/* La caja de la tarjeta pasa a CUADRADA.
   Era panorámica (16/10 en escritorio, 2/1 en móvil) porque el marcador
   era un emblema ancho. Una caja de medicamento en 2/1 con `contain`
   quedaba a la mitad del ancho disponible — medido: 83px de foto en una
   caja de 166. Las fotos que manda Emilio son 1254x1254, así que 1:1
   las muestra completas y sin bandas. */
.woocommerce ul.products li.product .vic-pr-img{aspect-ratio:1!important}
/* un poco de aire para que la caja no toque el borde de la tarjeta */
.woocommerce ul.products li.product .vic-pr-img img:not(.woocommerce-placeholder){
  padding:10px;box-sizing:border-box}