/* ---------- tarjeta de producto ---------- */
.nb-product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--nb-space-2)}
.nb-product-card{display:grid;grid-template-rows:auto auto 1fr auto auto auto;min-width:0;
  border:1px solid var(--nb-line);border-radius:var(--nb-radius-md);
  background:var(--nb-surface);overflow:hidden;transition:border-color .18s ease}
.nb-product-card:hover{border-color:var(--nb-volt)}
/* La foto viene de la tienda fuente con fondo blanco quemado: sobre el blanco de
   la pagina ya no necesita placa (la ficha si la conserva, ver mas abajo). */
/* Altura FIJA, no `aspect-ratio`.
   Con `aspect-ratio` el alto del recuadro es un alto derivado, y contra un alto
   derivado el `max-height:100%` de la foto no resuelve: se ignora, la foto sale
   a su tamaño intrinseco (324px del thumbnail de Woo) dentro de un hueco de
   ~180px y `overflow:hidden` le come la base. Se veian monitores sin pie.
   La pista de que era esto y no el CSS de WooCommerce: el hero y las tarjetas
   de la portada, que ya usaban alturas absolutas, salian enteros.
   Con una altura en `rem` el porcentaje resuelve y ademas todas las tarjetas
   miden igual, que es lo que se quiere en una grilla. */
/* El alto de la foto va en `rem`, NUNCA en porcentaje.
   Costo tres intentos: una `<img>` es un elemento reemplazado con relacion de
   aspecto propia, asi que dentro de un grid NO se estira (el `stretch` por
   defecto no la toca) y su area nunca le da un alto definido. Sin alto
   definido del padre, tanto `height:100%` como `max-height:100%` caen a `auto`:
   la foto salia a 270.8px dentro de una caja de 208px y `overflow:hidden` le
   comia la base, o sea monitores sin pie. Medido en el navegador, no a ojo.
   El hero y las tarjetas de la portada nunca fallaron porque ya usaban
   `max-height` en `rem`. Misma receta aca: alto util = alto de la caja menos
   los dos paddings (13 - 2.2 = 10.8rem). Si cambia uno, cambian los dos. */
.nb-product-card__media{display:grid;place-items:center;height:13rem;padding:1.1rem;
  overflow:hidden;background:var(--nb-bg)}
.nb-product-card__media img{max-width:100%;max-height:10.8rem;width:auto;height:auto;
  object-fit:contain;object-position:center}
.nb-product-card__category,.nb-product-card__availability,.nb-product-card__title,
.nb-product-card__price,.nb-product-card>.nb-button{margin-inline:var(--nb-space-2)}
.nb-product-card__category{margin-top:var(--nb-space-2);color:var(--nb-text-dim);
  font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
.nb-product-card__title{font:600 .98rem/1.3 var(--nb-heading);margin-block:.35rem}
.nb-product-card__availability{font-size:.82rem;color:var(--nb-text-dim)}
/* Última unidad (10/10/2026): se distingue por peso y tinta, sin color de alarma. */
.nb-product-card__availability--ultima{color:var(--nb-text);font-weight:600}
.nb-product-card__price{font-family:var(--nb-heading);font-weight:800;font-size:1.15rem;
  color:var(--nb-precio);font-variant-numeric:tabular-nums;margin-block:.3rem}
.nb-product-card>.nb-button{margin-bottom:var(--nb-space-2);margin-top:.4rem}
.nb-product-card__media--vacia{display:block;width:100%;height:100%;background:var(--nb-surface-2)}

/* ---------- archivo y buscador ---------- */
.nb-catalog-page{padding-block:var(--nb-space-4) var(--nb-space-5)}
.nb-catalog-page>header{margin-bottom:var(--nb-space-3);padding-bottom:var(--nb-space-2);
  border-bottom:1px solid var(--nb-line)}
.nb-catalog-page h1{margin:0;font-size:clamp(1.9rem,4vw,3rem);font-weight:800;
  letter-spacing:-.03em}
.nb-commerce-notice{padding:var(--nb-space-2);border-left:3px solid var(--nb-volt);
  background:var(--nb-surface);color:var(--nb-text);margin-bottom:var(--nb-space-2)}
.woocommerce-result-count,.woocommerce-ordering{color:var(--nb-text-dim);font-size:.85rem}
.woocommerce-ordering select{background:var(--nb-bg);color:var(--nb-text);
  border:1px solid var(--nb-line);border-radius:var(--nb-radius-sm);padding:.4rem .6rem}
.woocommerce-pagination ul{display:flex;flex-wrap:wrap;gap:.4rem;list-style:none;
  margin:var(--nb-space-3) 0 0;padding:0}
.woocommerce-pagination a,.woocommerce-pagination span{display:inline-flex;min-width:2.6rem;
  min-height:2.6rem;align-items:center;justify-content:center;border:1px solid var(--nb-line);
  border-radius:var(--nb-radius-sm);background:var(--nb-surface);font-weight:600}
.woocommerce-pagination .current{background:var(--nb-volt);color:var(--nb-carbon);
  border-color:var(--nb-volt)}

/* ---------- ficha de producto ---------- */
.nb-product-detail{padding-block:var(--nb-space-4) var(--nb-space-5)}
.nb-product-detail__layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(20rem,.8fr);
  gap:clamp(2rem,5vw,4rem);min-width:0}
.nb-product-detail__gallery .woocommerce-product-gallery__image{display:grid;place-items:center;
  min-height:28rem;padding:8%;background:var(--nb-placa);border-radius:var(--nb-radius-md)}
.nb-product-detail__gallery img{max-width:100%;height:auto;object-fit:contain}
.nb-product-detail__summary{align-self:start}
.nb-product-detail__summary h1{margin:.4rem 0 0;font-size:clamp(1.6rem,3vw,2.4rem);
  font-weight:800;letter-spacing:-.03em;line-height:1.1}
.nb-product-detail__price{font-family:var(--nb-heading);font-weight:800;
  font-size:clamp(2rem,4vw,2.75rem);line-height:1;letter-spacing:-.035em;
  color:var(--nb-precio);font-variant-numeric:tabular-nums;margin-block:var(--nb-space-2)}
/* Rebaja (17/10/2026): precio nuevo grande y sin subrayado, precio viejo tachado y legible, pastilla por nivel. */
.nb-product-card__price ins,.nb-product-detail__price ins{text-decoration:none}
.nb-product-card__price del{color:var(--nb-text-dim);font-weight:500;font-size:.95rem;text-decoration-thickness:2px;text-decoration-color:#d6303f}
.nb-product-detail__price{display:flex;align-items:center;flex-wrap:wrap;gap:.9rem}
.nb-product-detail__price ins{order:1;font-size:2.6rem}
.nb-product-detail__price del{order:2;color:var(--nb-text-dim);font-weight:500;font-size:1.35rem;text-decoration-thickness:2px;text-decoration-color:#d6303f}
.nb-product-detail__price .nb-rebaja{order:3}
.nb-product-card{position:relative}
.nb-rebaja{display:inline-block;font-family:var(--nb-heading);font-weight:800;letter-spacing:.03em;border-radius:var(--nb-radius-sm);background:var(--nb-pill);color:var(--nb-pill-ink)}
.nb-rebaja--n1{font-size:.9rem;padding:.2rem .6rem}
.nb-rebaja--n2{font-size:1rem;padding:.25rem .65rem;background:var(--nb-volt);color:var(--nb-carbon)}
.nb-rebaja--n3{font-size:1.25rem;padding:.3rem .8rem;background:var(--nb-volt);color:var(--nb-carbon);box-shadow:0 0 0 2px var(--nb-carbon)}
.nb-product-card .nb-rebaja{position:absolute;top:.6rem;left:.6rem;z-index:3}
.nb-card__media .nb-rebaja{position:absolute;top:0;left:0;z-index:2}
.nb-promo__price .nb-rebaja{position:static}
/* Estado de la unidad (24/10/2026): se lee ANTES que el precio. Contorno y tinta, no
   relleno: que no se confunda con la pastilla de rebaja ni parezca alarma. */
.nb-condicion{display:inline-block;vertical-align:middle;margin-right:.45rem;padding:.12rem .5rem;
  border:1.5px solid var(--nb-text);border-radius:var(--nb-radius-sm);background:var(--nb-bg);
  color:var(--nb-text);font:700 .7rem/1.3 var(--nb-heading);letter-spacing:.08em;text-transform:uppercase}
.nb-product-detail h1 .nb-condicion{font-size:.8rem;vertical-align:.25em}
.nb-product-card .nb-condicion,.nb-card__media .nb-condicion{position:absolute;top:.6rem;right:.6rem;margin:0;z-index:3}
.nb-card__media .nb-condicion{top:0;right:0}
.nb-product-detail__condicion{margin:.4rem 0 0;font-size:.88rem;color:var(--nb-text)}
.nb-product-card--rebaja-n3{box-shadow:0 0 0 2px var(--nb-volt),0 6px 18px rgba(9,13,16,.25)}
.nb-product-detail__sku{font-size:.8rem;color:var(--nb-text-dim);margin:.4rem 0 0;
  font-variant-numeric:tabular-nums}
.nb-product-detail__intro{color:var(--nb-text);margin-top:var(--nb-space-2);max-width:60ch;
  white-space:pre-line}
.nb-product-detail__availability{color:var(--nb-text-dim);font-size:.9rem;
  margin-block:0 var(--nb-space-3)}
.nb-product-detail__availability--ultima{color:var(--nb-text);font-weight:600;
  border-inline-start:3px solid var(--nb-volt);padding-inline-start:.6rem}
.nb-product-detail__cart{display:flex;align-items:center;gap:.6rem;
  margin-block:0 var(--nb-space-2)}
.nb-product-detail__cart #nb-cantidad{width:4.5rem;min-height:44px;
  border:1px solid var(--nb-line);border-radius:var(--nb-radius-sm);
  background:var(--nb-surface-2);color:var(--nb-text);padding:.4rem .5rem;
  text-align:center}
.nb-product-detail__related h2{font-size:1.4rem;font-weight:700;letter-spacing:-.02em;
  margin-bottom:var(--nb-space-3);padding-bottom:.7rem;border-bottom:1px solid var(--nb-line)}
.woocommerce-breadcrumb{font-size:.82rem;color:var(--nb-text-dim);margin-bottom:var(--nb-space-3)}
.woocommerce-breadcrumb a:hover{color:var(--nb-text)}
.nb-product-detail__related{padding-top:var(--nb-space-5)}
.nb-empty-state{max-width:48rem;padding-block:clamp(4rem,12vw,10rem);text-align:center}
.nb-empty-state__code{color:var(--nb-text-dim);font:800 clamp(4rem,16vw,10rem)/.8 var(--nb-heading)}

/* WooCommerce flota `result-count` a la izquierda y `ordering` a la derecha.
   Como .nb-product-grid es `display:grid`, crea un contexto de formato nuevo
   y ESQUIVA esos flotantes: en telefono quedaba de 174px dentro de 342, con
   los titulos cayendo una palabra por linea y recortados por el overflow.
   El tema no maqueta con floats; se apagan. Especificidad 0,2,0 para ganarle
   a `.woocommerce .woocommerce-result-count`. */
.woocommerce .woocommerce-result-count,
.woocommerce .woocommerce-ordering{float:none}
.nb-catalog-page .woocommerce-result-count{margin-block:0 var(--nb-space-1)}
.nb-catalog-page .woocommerce-ordering{margin-block:0 var(--nb-space-2)}
/* Cinturon y tirantes: si mañana aparece otro flotante, la grilla igual baja. */
.nb-product-grid{clear:both}
/* Los titulos traen codigos largos sin espacios ("R-AG620-G2"): sin esto se
   salen de la tarjeta y el overflow los corta a la mitad de una palabra. */
.nb-product-card__title,.nb-product-card__category{overflow-wrap:anywhere}
/* Ficha: especificaciones (atributos de la fuente) y descripción (09/09/2026) */
.nb-product-detail__ficha{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--nb-space-4);margin-top:var(--nb-space-4)}
.nb-product-detail__ficha h2{font-size:1.1rem;margin:0 0 .6rem}
.nb-product-detail__specs table{width:100%;border-collapse:collapse;font-size:.95rem}
.nb-product-detail__specs th,.nb-product-detail__specs td{text-align:left;padding:.45rem .6rem;border-bottom:1px solid var(--nb-line-soft);vertical-align:top}
.nb-product-detail__specs th{width:36%;font-weight:600;color:var(--nb-text-dim)}
.nb-product-detail__specs td p{margin:0}
.nb-product-detail__description p{margin:0 0 .7rem;line-height:1.55}
@media (max-width:48rem){.nb-product-detail__ficha{grid-template-columns:minmax(0,1fr)}}
@media (max-width:640px){
  /* En 390×844 la foto conserva protagonismo, pero deja entrar precio y pastilla
     en el primer pantallazo. Alto, padding y tope de la imagen quedan en rem. */
  .nb-product-detail__gallery .woocommerce-product-gallery__image{min-height:18rem;padding:1rem}
  .nb-product-detail__gallery img{max-height:16rem;width:auto}
  /* Sin cambiar el HTML ni el escritorio: la intro baja después del precio y
     la disponibilidad para que la decisión de compra aparezca primero. */
  .nb-product-detail__summary{display:flex;flex-direction:column}
  .nb-product-detail__summary .nb-rotulo{order:-5}
  .nb-product-detail__summary h1{order:-4}
  .nb-product-detail__sku{order:-3}
  .nb-product-detail__price{order:-2}
  .nb-product-detail__condicion,.nb-product-detail__availability{order:-1} /* el estado, pegado al precio */
}