:root{--vb-ritmo:clamp(28px,3.5vw,48px)}
/* VERBLEIT — tarjetas de producto.
   Aplica en la home, la tienda y las páginas de categoría. */

.woocommerce ul.products,
ul.products {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px 24px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.woocommerce ul.products::before,
.woocommerce ul.products::after { content: none; }

.woocommerce ul.products li.product,
ul.products li.product {
  /* Columna flexible: deja empujar el botón al fondo y así todas las
     tarjetas terminan a la misma altura pese a títulos de largo distinto. */
  display: flex;
  flex-direction: column;
  width: auto !important;
  margin: 0 !important;
  padding: 0;
  border: none;
  background: #fff;
  border-radius: 4px;
  overflow: hidden;
  transition: box-shadow .2s ease, transform .2s ease;
}

.woocommerce ul.products li.product:hover {
  box-shadow: 0 6px 24px rgba(55, 52, 53, .13);
  transform: translateY(-3px);
}

/* --- Imagen ---------------------------------------------------------- */
/* Las fotos vienen sobre fondo claro y con encuadres distintos.
   Un alto fijo con object-fit:contain las iguala sin recortar producto. */
.woocommerce ul.products li.product a img,
ul.products li.product a img {
  width: 100%;
  height: 230px;
  object-fit: contain;
  background: #f7f7f7;
  padding: 18px;
  margin: 0 0 14px;
  display: block;
  border-radius: 4px 4px 0 0;
}

/* --- Título ---------------------------------------------------------- */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
ul.products li.product .woocommerce-loop-product__title {
  font-family: "Akrobat", "Arial Narrow", Helvetica, sans-serif;
  font-weight: 700;
  font-size: 1.02rem;
  line-height: 1.25;
  color: #373435;
  padding: 0 16px;
  margin: 0 0 .5rem;

  /* Dos líneas fijas: el precio y el botón quedan a la misma altura
     en toda la fila aunque los nombres varíen mucho de largo. */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 2.5em;
}

.woocommerce ul.products li.product a:hover .woocommerce-loop-product__title {
  color: #EE5F21;
}

/* --- Precio ---------------------------------------------------------- */
.woocommerce ul.products li.product .price,
ul.products li.product .price {
  font-family: "Akrobat", "Arial Narrow", Helvetica, sans-serif;
  font-weight: 800;
  font-size: 1.22rem;
  color: #373435;
  padding: 0 16px;
  margin: 0 0 14px;
}

.woocommerce ul.products li.product .price del {
  color: #6C6D70;
  font-weight: 400;
  font-size: .9em;
  margin-right: .4em;
}

.woocommerce ul.products li.product .price ins {
  text-decoration: none;
  color: #EE5F21;
}

/* --- Botón ----------------------------------------------------------- */
.woocommerce ul.products li.product .button,
ul.products li.product .button {
  /* margin-top:auto es lo que alinea todos los botones al fondo. */
  margin: auto 16px 16px !important;
  display: block;
  text-align: center;
  font-family: "Akrobat", "Arial Narrow", Helvetica, sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: .88rem;
  color: #fff;
  background: #EE5F21;
  border: none;
  border-radius: 2px;
  padding: .8em 1em;
  transition: background .16s ease;
}

.woocommerce ul.products li.product .button:hover {
  background: #d4501a;
  color: #fff;
}

.woocommerce ul.products li.product .button:focus-visible {
  outline: 3px solid #FDBD2F;
  outline-offset: 2px;
}

/* Etiqueta de oferta */
.woocommerce ul.products li.product .onsale {
  background: #FDBD2F;
  color: #373435;
  font-family: "Akrobat", "Arial Narrow", Helvetica, sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  border-radius: 2px;
  padding: .35em .8em;
  min-height: 0;
  min-width: 0;
  line-height: 1.4;
  top: 10px;
  right: 10px;
  left: auto;
  margin: 0;
}

/* --- Adaptable ------------------------------------------------------- */
@media (max-width: 1024px) {
  .woocommerce ul.products, ul.products { grid-template-columns: repeat(3, 1fr); }
  .woocommerce ul.products li.product a img { height: 200px; }
}

@media (max-width: 640px) {
  .woocommerce ul.products, ul.products {
    grid-template-columns: repeat(2, 1fr);
    gap: 18px 14px;
  }
  .woocommerce ul.products li.product a img { height: 150px; padding: 10px; }
  .woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: .9rem;
    padding: 0 10px;
  }
  .woocommerce ul.products li.product .price { font-size: 1.05rem; padding: 0 10px; }
  .woocommerce ul.products li.product .button {
    margin: auto 10px 10px !important;
    font-size: .8rem;
    padding: .7em .5em;
  }
}

@media (prefers-reduced-motion: reduce) {
  .woocommerce ul.products li.product { transition: none; }
  .woocommerce ul.products li.product:hover { transform: none; }
}

/* --- Portada ---------------------------------------------------------- */
/* El tema imprime el título de la página sobre el hero. En la portada
   sobra: ya está el logo arriba y el titular del hero abajo, y además
   generaba un segundo <h1> que competía con el real. */
.home .page-header,
.home .entry-header,
.home .entry-title,
.home .page-title {
  display: none !important;
}

/* El titular del hero pide un poco más de aire en pantallas estrechas:
   a 360 px la línea llegaba al borde. */
@media (max-width: 420px) {
  .vb-hero__title { font-size: 1.85rem; }
}

/* En móvil las columnas son estrechas y dos líneas truncan demasiados
   nombres de producto; con tres se distinguen mejor las variantes. */
@media (max-width: 640px) {
  .woocommerce ul.products li.product .woocommerce-loop-product__title {
    -webkit-line-clamp: 3;
    line-clamp: 3;
    min-height: 3.75em;
  }
}

/* --- Ficha de producto ------------------------------------------------ */
.single-product .product_title {
  font-family: "Akrobat", "Arial Narrow", Helvetica, sans-serif;
  font-weight: 800;
  line-height: 1.05;
  color: #373435;
  font-size: clamp(1.5rem, 4vw, 2.25rem);
  margin-bottom: .4em;
}

.single-product .summary .price {
  font-family: "Akrobat", "Arial Narrow", Helvetica, sans-serif;
  font-weight: 800;
  color: #373435;
}

.single-product .summary .price ins { text-decoration: none; color: #EE5F21; }
.single-product .summary .price del { color: #6C6D70; font-weight: 400; }

.single-product .single_add_to_cart_button {
  font-family: "Akrobat", "Arial Narrow", Helvetica, sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  background: #EE5F21;
  border: none;
  border-radius: 2px;
  padding: .9em 2em;
}
.single-product .single_add_to_cart_button:hover { background: #d4501a; }
.single-product .single_add_to_cart_button:focus-visible {
  outline: 3px solid #FDBD2F;
  outline-offset: 2px;
}

/* En móvil la imagen cuadrada deja mucho aire cuando el producto es
   alargado, y el título empujaba el precio fuera de la primera pantalla. */
@media (max-width: 640px) {
  .single-product .woocommerce-product-gallery__image img {
    max-height: 300px;
    object-fit: contain;
  }
  .single-product .product_title { font-size: 1.4rem; }
}
/* WooCommerce Blocks pisa el color del botón pese a la prioridad del
   enqueue; hace falta subir la especificidad. */
.single-product .summary .single_add_to_cart_button,
.single-product .summary button.single_add_to_cart_button,
.woocommerce .single-product .summary .button.alt {
  background-color: #EE5F21 !important;
  color: #fff !important;
}
.single-product .summary .single_add_to_cart_button:hover,
.woocommerce .single-product .summary .button.alt:hover {
  background-color: #d4501a !important;
}
/* El precio lo pinta el tema con su propio color; hace falta ganar
   especificidad como en el botón. */
.woocommerce div.product .summary p.price,
.woocommerce div.product .summary span.price,
.single-product .summary .price .woocommerce-Price-amount {
  color: #373435 !important;
}

/* Sin descripción corta, el resumen dejaba un vacío grande antes de
   las pestañas. Se recupera cuando haya texto real. */
.single-product .woocommerce-product-details__short-description:empty { display: none; }
.single-product div.product .summary { margin-bottom: 1.5rem; }
.site-header .custom-logo,
header .custom-logo {
  max-height: 64px;
  width: auto;
}
/* El tema imprime el título de la página; en las que ya traen su propio
   encabezado queda duplicado. */
.page-id-24 .page-header,
.page-id-24 .entry-header,
.page-id-24 .entry-title {
  display: none !important;
}
/* Con 10 categorías, en pantallas anchas caben en dos filas y se ven
   todas; el desplazamiento lateral se queda solo para móvil. */
@media (min-width: 1024px) {
  .vb-filtros__cats { flex-wrap: wrap; overflow-x: visible; }
}
@media (min-width: 1024px) {
  .vb-filtros__cats {
    flex-wrap: wrap !important;
    overflow-x: visible !important;
  }
}
/* --- Carrusel de destacados, versión a sangre --------------------------- */
/* Sin recuadro ni separación entre tarjetas: es lo que hace que la foto
   se vea grande. El aire que sobraba venía del marco gris y del hueco
   entre tarjetas, no del tamaño de la imagen. */

.vb-dest {
  /* Ancho completo, como el hero y el banner. */
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: var(--vb-ritmo) 0;
}

/* El encabezado y el botón sí se mantienen dentro del ancho de lectura. */
.vb-dest .vb-sec__hd,
.vb-dest .vb-sec__cta {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
}

.vb-dest__pista .woocommerce ul.products,
.vb-dest__pista ul.products {
  display: flex !important;
  grid-template-columns: none !important;
  gap: 0;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
  padding: 0;
  margin: 0;
}

.vb-dest__pista ul.products::-webkit-scrollbar { display: none; }

.vb-dest__pista ul.products li.product {
  flex: 0 0 25vw;
  scroll-snap-align: start;
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  /* Línea fina de separación, como en las tiendas de moda. */
  border-right: 1px solid #ececec;
}

.vb-dest__pista ul.products li.product:hover {
  box-shadow: none !important;
  transform: none !important;
}

/* --- Imagen ------------------------------------------------------------ */
.vb-dest__pista ul.products li.product a img {
  height: clamp(260px, 26vw, 380px);
  padding: 20px;
  background: #fff;
  border-radius: 0;
  margin-bottom: 18px;
}

/* --- Texto ------------------------------------------------------------- */
.vb-dest__pista ul.products li.product .woocommerce-loop-product__title {
  padding: 0 20px;
  font-size: .95rem;
  min-height: 2.4em;
}

.vb-dest__pista ul.products li.product .price {
  padding: 0 20px;
  font-size: 1.1rem;
  margin-bottom: 16px;
}

.vb-dest__pista ul.products li.product .button {
  margin: auto 20px 24px !important;
}

@media (max-width: 1024px) {
  .vb-dest__pista ul.products li.product { flex: 0 0 40vw; }
}

@media (max-width: 640px) {
  .vb-dest__pista ul.products li.product { flex: 0 0 62vw; }
  .vb-dest__pista ul.products li.product a img {
    height: 230px;
    padding: 14px;
  }
  .vb-dest__pista ul.products li.product .woocommerce-loop-product__title,
  .vb-dest__pista ul.products li.product .price { padding: 0 14px; }
  .vb-dest__pista ul.products li.product .button { margin: auto 14px 18px !important; }
}

/* --- Pie de página ---------------------------------------------------- */
/* El pie mínimo del tema se oculta: sus enlaces legales ya están dentro
   de la columna "Atención al cliente" del pie nuevo. */
#site-footer.site-footer { display: none !important; }

.vb-pie {
  /* Negro más profundo que el gris del manual: como fondo de pie,
     #373435 se ve lavado. */
  background: #1a1a1a;
  color: #fff;
  padding: clamp(40px, 5vw, 64px) 24px 0;
  font-family: "Akrobat", "Arial Narrow", Helvetica, sans-serif;
}

.vb-pie__cols {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.6fr 1fr 1.2fr 1.2fr;
  gap: 40px;
  padding-bottom: 40px;
}

.vb-pie__logo img {
  max-width: 200px;
  height: auto;
  /* El logo es para fondo claro; sobre el gris oscuro se aclara. */
  /* Sin filtro: el logo va con sus colores originales, por decisión de Miguel. */

}

.vb-pie__anios {
  font-size: 1.05rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #EE5F21;
  margin: 1.1rem 0 .5rem;
}

.vb-pie__lema {
  font-size: .95rem;
  line-height: 1.55;
  color: #c9c8c7;
  margin: 1rem 0 0;
  max-width: 34ch;
}

.vb-pie__tit {
  font-size: .95rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: #fff;
  margin: 0 0 1rem;
}

.vb-pie__lista {
  list-style: none;
  margin: 0;
  padding: 0;
}

.vb-pie__lista li { margin-bottom: .6em; }

.vb-pie__lista a,
.vb-pie__contacto li {
  font-size: .95rem;
  line-height: 1.4;
  color: #c9c8c7;
  text-decoration: none;
  transition: color .15s ease;
}

.vb-pie__lista a:hover { color: #EE5F21; }
.vb-pie__lista a:focus-visible {
  outline: 2px solid #FDBD2F;
  outline-offset: 2px;
  color: #fff;
}

.vb-pie__redes {
  list-style: none;
  margin: 1.6rem 0 0;
  padding: 0;
  display: flex;
  gap: 12px;
}

/* Círculo blanco para que los colores de marca se lean sobre el pie
   oscuro: el negro de TikTok desaparecería sobre fondo negro. */
.vb-pie__redes a {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  background: #fff;
  border-radius: 50%;
  transition: transform .15s ease;
}
.vb-pie__redes svg { width: 20px; height: 20px; display: block; }
.vb-pie__redes a:hover { transform: scale(1.08); }
.vb-pie__redes a:focus-visible { outline: 2px solid #FDBD2F; outline-offset: 3px; }

.vb-red--facebook  svg { fill: #1877F2; }
.vb-red--instagram svg { fill: #E1306C; }
.vb-red--tiktok    svg { fill: #010101; }

/* Dirección con icono, enlazada a Google Maps. */
.vb-pie__ubic { display: flex; gap: 8px; align-items: flex-start; }
.vb-pie__ubic svg {
  width: 16px; height: 16px;
  flex: 0 0 16px;
  margin-top: 3px;
  color: #EE5F21;
}

.vb-pie__legal {
  border-top: 1px solid rgba(255,255,255,.1);
  padding: 20px 0 24px;
}

.vb-pie__legal p {
  max-width: 1200px;
  margin: 0 auto;
  font-size: .85rem;
  line-height: 1.5;
  color: #96948f;
  text-align: center;
}

@media (max-width: 900px) {
  .vb-pie__cols { grid-template-columns: 1fr 1fr; gap: 32px; }
  .vb-pie__marca { grid-column: 1 / -1; }
}

@media (max-width: 560px) {
  .vb-pie__cols { grid-template-columns: 1fr; gap: 28px; }
  .vb-pie__anios {
  font-size: 1.05rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #EE5F21;
  margin: 1.1rem 0 .5rem;
}

.vb-pie__lema { max-width: none; }
}
/* Las fotos de producto quedaban con mucho aire lateral: se reduce el
   relleno y se sube el alto para que la pieza ocupe más del recuadro. */
.vb-dest__pista ul.products li.product a img {
  padding: 6px;
  height: 250px;
}
.vb-dest__pista ul.products li.product a img {
  padding: 6px;
  height: 250px;
}
/* Fondo gris en el bloque de la imagen, a sangre dentro de la tarjeta,
   como en las tiendas de moda. La foto crece y el gris la enmarca. */
.vb-dest__pista ul.products li.product a img {
  height: clamp(300px, 30vw, 440px) !important;
  padding: 26px !important;
  background: #f2f2f2 !important;
  margin-bottom: 20px !important;
}

.vb-dest__pista ul.products li.product {
  border-right: 1px solid #fff;
}

@media (max-width: 640px) {
  .vb-dest__pista ul.products li.product a img {
    height: 280px !important;
    padding: 18px !important;
  }
}
/* === Mosaico de categorías, v2 ========================================= */
/* A sangre, 5 visibles + botón para desplegar las otras 5.               */
/* Reemplaza por completo el bloque .vb-mos anterior: hay que borrar el   */
/* anterior de verbleit-estilos.css antes de pegar este.                  */

.vb-mos{
  width:auto;
  margin-inline:calc(50% - 50vw);   /* rompe el ancho del contenido */
  padding:var(--vb-ritmo) 0 clamp(20px,2.5vw,32px);
}
.vb-mos__interior{
  padding-inline:clamp(16px,2.5vw,48px);
}
.vb-mos__titulo{
  font-family:"Akrobat","Arial Narrow",Helvetica,sans-serif;
  font-weight:800;
  text-transform:uppercase;
  font-size:clamp(1.5rem,3vw,2.25rem);
  line-height:1;
  letter-spacing:.01em;
  color:#373435;
  margin:0 0 1.6rem;
}
.vb-mos__rejilla{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:16px;
  list-style:none;
  margin:0;
  padding:0;
}
.vb-mos__item{grid-column:span 2;}
.vb-mos__item--ancho{grid-column:span 3;}

/* Las cinco de abajo sólo aparecen al desplegar. */
.vb-mos__item--oculto{display:none;}
.vb-mos.is-abierto .vb-mos__item--oculto{display:block;}

.vb-mos__enlace{
  position:relative;
  display:block;
  height:100%;
  overflow:hidden;
  border-radius:3px;
  background:#373435;
  color:#fff;
}
.vb-mos__enlace,
.vb-mos__enlace:link,
.vb-mos__enlace:visited,
.vb-mos__enlace:hover,
.vb-mos__enlace:focus{text-decoration:none;color:#fff;}
.vb-mos__enlace:focus-visible{outline:3px solid #FDBD2F;outline-offset:3px;}

.vb-mos__figura{
  margin:0;
  aspect-ratio:16/9;
  overflow:hidden;
}
.vb-mos__item--ancho .vb-mos__figura{aspect-ratio:2/1;}
.vb-mos__figura img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
  transition:transform .5s ease;
}
.vb-mos__enlace:hover .vb-mos__figura img,
.vb-mos__enlace:focus-visible .vb-mos__figura img{transform:scale(1.05);}

.vb-mos__enlace::after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:72%;
  background:linear-gradient(to top,
    rgba(31,29,30,.88) 0%,
    rgba(31,29,30,.62) 38%,
    rgba(31,29,30,0)  100%);
  pointer-events:none;
}
.vb-mos__texto{
  position:absolute;
  left:clamp(16px,2vw,32px);
  right:clamp(16px,2vw,32px);
  bottom:clamp(16px,2vw,28px);
  z-index:1;
}
.vb-mos__nombre{
  display:block;
  font-family:"Akrobat","Arial Narrow",Helvetica,sans-serif;
  font-weight:800;
  text-transform:uppercase;
  font-size:clamp(1.05rem,1.6vw,1.6rem);
  line-height:1.05;
  letter-spacing:.01em;
  margin:0 0 .25em;
  text-shadow:0 1px 2px rgba(0,0,0,.35);
}
.vb-mos__bajada{
  display:block;
  font-family:"Akrobat","Arial Narrow",Helvetica,sans-serif;
  font-weight:400;
  font-size:clamp(.85rem,1.05vw,1.05rem);
  line-height:1.3;
  margin:0 0 .9em;
  max-width:38ch;
  text-shadow:0 1px 2px rgba(0,0,0,.35);
}
.vb-mos__boton{
  display:inline-block;
  font-family:"Akrobat","Arial Narrow",Helvetica,sans-serif;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.05em;
  font-size:.78rem;
  color:#373435;
  background:#fff;
  padding:.62em 1.5em;
  border-radius:2px;
  transition:background .16s ease,color .16s ease;
}
.vb-mos__enlace:hover .vb-mos__boton,
.vb-mos__enlace:focus-visible .vb-mos__boton{background:#EE5F21;color:#fff;}

/* Botón de desplegar */
.vb-mos__mas{text-align:center;margin-top:12px;}
.vb-mos__masbtn{
  font-family:"Akrobat","Arial Narrow",Helvetica,sans-serif;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.05em;
  font-size:.9rem;
  color:#373435;
  background:transparent;
  border:2px solid #373435;
  border-radius:2px;
  padding:.8em 2.4em;
  cursor:pointer;
  transition:background .16s ease,color .16s ease,border-color .16s ease;
}
.vb-mos__masbtn:hover{background:#EE5F21;border-color:#EE5F21;color:#fff;}
.vb-mos__masbtn:focus-visible{outline:3px solid #FDBD2F;outline-offset:3px;}

@media (max-width:900px){
  .vb-mos__rejilla{grid-template-columns:repeat(2,1fr);gap:12px;}
  .vb-mos__item{grid-column:span 1;}
  .vb-mos__item--ancho{grid-column:span 2;}
}
@media (max-width:560px){
  .vb-mos__rejilla{grid-template-columns:1fr;}
  .vb-mos__item,
  .vb-mos__item--ancho{grid-column:span 1;}
  .vb-mos__item--ancho .vb-mos__figura{aspect-ratio:16/9;}
}
@media (prefers-reduced-motion:reduce){
  .vb-mos__figura img{transition:none;}
}

/* --- Título de Productos destacados, igual que el resto de secciones --- */
.vb-dest h2{
  font-family:"Akrobat","Arial Narrow",Helvetica,sans-serif;
  font-weight:800;
  text-transform:uppercase;
  font-size:clamp(1.5rem,3vw,2.25rem);
  line-height:1;
  letter-spacing:.01em;
  color:#373435;
  margin:0 0 .5rem;
}
.vb-dest .vb-sec__hd p{
  font-family:"Akrobat","Arial Narrow",Helvetica,sans-serif;
  font-weight:400;
  color:#6C6D70;
  margin:0;
}

/* --- Botón de Productos destacados: mayúsculas y sin subrayado del tema --- */
.vb-dest .vb-btn{
  font-family:"Akrobat","Arial Narrow",Helvetica,sans-serif;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.vb-dest .vb-btn,
.vb-dest .vb-btn:link,
.vb-dest .vb-btn:visited,
.vb-dest .vb-btn:hover,
.vb-dest .vb-btn:focus{text-decoration:none;}

/* === Home (página 18): base, hero a sangre, secciones y botón ========== */
/* Migrado desde el <style> incrustado en el contenido del post.          */
/* Las variables suben a :root para que resuelvan en todo el documento:   */
/* antes vivían en .vb-home y no alcanzaban a reglas de fuera.            */

:root{
  --nar:#EE5F21;
  --neg:#373435;
  --gri:#6C6D70;
  --lin:#E4E4E4;
}

.vb-home{
  line-height:1.6;
  color:var(--neg);
}
.vb-home *{box-sizing:border-box}

/* Hero a sangre. Fusiona lo que estaba repartido en dos bloques:
   fondo y layout interno por un lado, ancho completo por el otro. */
.vb-hero{
  position:relative;
  width:100vw;
  margin-left:calc(50% - 50vw);
  margin-bottom:3.5rem;
  overflow:hidden;
}

/* --- secciones --- */
.vb-sec__hd{margin:0 0 1.75rem}
.vb-home .vb-sec__hd h2{
  font-size:clamp(1.3rem,2.4vw,1.75rem);
  margin:0 0 .35rem;
  color:var(--neg);
}
.vb-sec__hd p{margin:0;color:var(--gri);font-size:.98rem}
.vb-sec__cta{text-align:center;margin:2.25rem 0 0}

/* --- botón --- */
.vb-btn{
  display:inline-block;background:var(--nar);color:#fff;text-decoration:none;
  padding:.85rem 2.25rem;border-radius:3px;font-weight:700;letter-spacing:.03em;
  transition:background .2s ease}
.vb-btn:hover,.vb-btn:focus{background:#c94d18;color:#fff}
.vb-btn:focus-visible{outline:3px solid var(--neg);outline-offset:2px}

/* === Banda de línea Enduro (cierre del home) ============================ */
/* A sangre, misma técnica que el hero. La imagen es 1920x700, así que la  */
/* proporción se fija para que no salte el layout mientras carga.         */

.vb-banda{
  position:relative;
  width:100vw;
  margin:0;
  margin-left:calc(50% - 50vw);
  overflow:hidden;
}
.vb-banda__enlace{display:block;line-height:0;}
.vb-banda__enlace:focus-visible{outline:3px solid #FDBD2F;outline-offset:-3px;}
.vb-banda img{
  width:100%;
  height:auto;
  aspect-ratio:1920/700;
  object-fit:cover;
  display:block;
}

/* --- Variante cabecera: la banda abre la página y hace de título ------- */
/* Se oculta el .page-header del tema porque no hay hook para insertar    */
/* la banda por encima; el banner cumple esa función.                     */
.vb-banda--cabecera{margin:0 0 3rem;}

/* La banda de cabecera se ancla a la ventana en vez de calcular el       */
/* desborde con 50% - 50vw: ese cálculo depende del contenedor y falla    */
/* cuando la banda va dentro de un bloque con padding propio.            */
.vb-banda--cabecera{
  position:relative;
  left:50%;
  right:50%;
  width:100vw;
  margin-left:-50vw;
  margin-right:-50vw;
}

/* --- Título sobrepuesto en la banda ------------------------------------ */
/* Velo en degradado porque los cuatro paneles tienen zonas claras y      */
/* oscuras: sin él, el rótulo blanco se pierde en la tierra del fondo.    */
.vb-banda__enlace{position:relative;}
.vb-banda__enlace::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to bottom,
    rgba(55,52,53,.55) 0%,
    rgba(55,52,53,0) 45%,
    rgba(55,52,53,0) 100%);
  pointer-events:none;
}
.vb-banda__titulo{
  position:absolute;
  top:clamp(24px,5vw,64px);
  left:0;
  right:0;
  z-index:1;
  text-align:center;
  font-family:"Akrobat","Arial Narrow",Helvetica,sans-serif;
  font-weight:800;
  text-transform:uppercase;
  font-size:clamp(1.6rem,4vw,3rem);
  line-height:1;
  letter-spacing:.03em;
  color:#fff;
  text-shadow:0 2px 14px rgba(0,0,0,.45);
  margin:0;
  padding:0 24px;
}

/* El título se alinea con el contenido de 1200px de la página, no con    */
/* el borde de la ventana, para que quede a plomo con los demás títulos.  */
.vb-banda__titulo{
  top:clamp(20px,3vw,40px);
  left:50%;
  right:auto;
  transform:translateX(-50%);
  width:min(1200px,100%);
  max-width:1200px;
  text-align:left;
  padding:0 24px;
}

/* Rótulo en caja blanca, igual que los nombres del mosaico: no depende   */
/* del contraste de la foto, así que el velo deja de hacer falta.         */
.vb-banda__enlace::after{display:none;}
.vb-banda__titulo{
  display:inline-block;
  width:auto;
  max-width:calc(100% - 48px);
  color:#373435;
  background:#fff;
  padding:.4em .8em;
  border-radius:2px;
  text-shadow:none;
  font-size:clamp(1.3rem,3vw,2.25rem);
}

/* El título va como encabezado antes de la banda, sobre fondo blanco,    */
/* igual que "Productos destacados". Deja de ser sobrepuesto.             */
.vb-banda__titulo{
  position:static;
  display:block;
  transform:none;
  max-width:1200px;
  width:auto;
  margin:0 auto 1.25rem;
  padding:0 24px;
  background:none;
  color:#373435;
  text-align:left;
  font-size:clamp(1.3rem,2.4vw,1.75rem);
}

/* El título se alinea con el borde de la banda, no con el contenido. */
.vb-banda__titulo{
  max-width:none;
  margin-left:0;
  margin-right:0;
  padding-left:0;
}

/* Aire entre la banda del home y el pie. */
.vb-banda{margin-bottom:3.5rem;}

/* Bajada del título de la banda: más pequeña, en gris, en su propia línea. */
.vb-banda__sub{
  display:block;
  margin-top:.35rem;
  font-family:inherit;
  font-weight:400;
  text-transform:none;
  letter-spacing:0;
  font-size:.62em;
  color:#6C6D70;
}

/* 100vw incluye el ancho de la barra de scroll vertical, así que los     */
/* bloques a sangre sobresalen ~15px y aparece scroll horizontal. Se      */
/* corta en el body, que es donde nace el desborde.                       */
body{overflow-x:hidden;}

/* ===== VERBLEIT — miniaturas de color por variación ===================== */
.vb-sw { margin: 0 0 1.25rem; }

.vb-sw__titulo {
  display: block;
  margin-bottom: .5rem;
  font-size: .95rem;
  color: #373435;
}

.vb-sw__fila {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}

.vb-sw__item {
  padding: 3px;
  border: 2px solid #e3e3e3;
  border-radius: 6px;
  background: #fff;
  line-height: 0;
  cursor: pointer;
  transition: border-color .15s ease;
}

.vb-sw__item img {
  display: block;
  width: 64px;
  height: 64px;
  object-fit: cover;
  border-radius: 3px;
}

.vb-sw__item:hover { border-color: #6C6D70; }
.vb-sw__item.is-activa { border-color: #EE5F21; }

.vb-sw__item:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(238, 95, 33, .35);
}

.vb-sw-oculta { display: none !important; }

@media (max-width: 480px) {
  .vb-sw__item img { width: 56px; height: 56px; }
}

@media (prefers-reduced-motion: reduce) {
  .vb-sw__item { transition: none; }
}
/* ===== fin miniaturas de color ========================================= */

/* Ajustes miniaturas de color */
form.variations_form .vb-sw__item.is-activa { border-color: #EE5F21; }
.vb-sw-oculta .reset_variations { display: inline !important; }
.vb-sw__item img { width: 80px; height: 80px; }

form.variations_form .vb-sw__item:focus { outline: none; }
form.variations_form .vb-sw__item:focus-visible { outline: 2px solid #EE5F21; outline-offset: 2px; }

/* ===== VERBLEIT — galería vertical con flechas ========================== */

.woocommerce div.product div.images.woocommerce-product-gallery {
  display: grid;
  grid-template-columns: 88px 1fr;
  grid-template-rows: auto;
  gap: 1rem;
  align-items: start;
}

/* Imagen principal: columna derecha */
.woocommerce-product-gallery .flex-viewport,
.woocommerce-product-gallery > .woocommerce-product-gallery__wrapper {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
}

/* Miniaturas: columna izquierda, en vertical */
.woocommerce-product-gallery ol.flex-control-thumbs {
  grid-column: 1;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  width: 88px;
  margin: 0;
  padding: 0;
  list-style: none;
  float: none;
}

.woocommerce-product-gallery ol.flex-control-thumbs li {
  width: 100%;
  margin: 0;
  padding: 0;
  float: none;
  list-style: none;
}

.woocommerce-product-gallery ol.flex-control-thumbs img {
  width: 100%;
  height: auto;
  display: block;
  opacity: 1;
  border: 2px solid #e3e3e3;
  border-radius: 6px;
  cursor: pointer;
  transition: border-color .15s ease;
}

.woocommerce-product-gallery ol.flex-control-thumbs img:hover { border-color: #6C6D70; }
.woocommerce-product-gallery ol.flex-control-thumbs img.flex-active { border-color: #EE5F21; }

/* Flechas sobre la imagen principal */
.woocommerce-product-gallery ul.flex-direction-nav {
  grid-column: 2;
  grid-row: 1;
  align-self: center;
  z-index: 5;
  display: flex;
  justify-content: space-between;
  margin: 0;
  padding: 0 .75rem;
  list-style: none;
  pointer-events: none;
}

.woocommerce-product-gallery ul.flex-direction-nav li { margin: 0; list-style: none; }

.woocommerce-product-gallery ul.flex-direction-nav a {
  pointer-events: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 1px 4px rgba(55, 52, 53, .18);
  color: #373435;
  font-size: 0;
  text-decoration: none;
  transition: background .15s ease;
}

.woocommerce-product-gallery ul.flex-direction-nav a:hover { background: #fff; }
.woocommerce-product-gallery ul.flex-direction-nav a::before { font-size: 18px; line-height: 1; }
.woocommerce-product-gallery ul.flex-direction-nav a.flex-prev::before { content: "\2190"; }
.woocommerce-product-gallery ul.flex-direction-nav a.flex-next::before { content: "\2192"; }

/* En móvil las miniaturas vuelven abajo, en horizontal */
@media (max-width: 768px) {
  .woocommerce div.product div.images.woocommerce-product-gallery {
    grid-template-columns: 1fr;
  }
  .woocommerce-product-gallery .flex-viewport,
  .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper,
  .woocommerce-product-gallery ul.flex-direction-nav {
    grid-column: 1;
    grid-row: 1;
  }
  .woocommerce-product-gallery ol.flex-control-thumbs {
    grid-column: 1;
    grid-row: 2;
    flex-direction: row;
    flex-wrap: wrap;
    width: auto;
  }
  .woocommerce-product-gallery ol.flex-control-thumbs li { width: 72px; }
}
/* ===== fin galería vertical ============================================ */

.woocommerce div.product .woocommerce-product-gallery ol.flex-control-thumbs li { width: 88px; flex: 0 0 auto; }
.woocommerce div.product .woocommerce-product-gallery ol.flex-control-thumbs li img { width: 88px; height: auto; }

form.variations_form .vb-sw__fila { display: grid; grid-template-columns: repeat(5, 88px); gap: .5rem; }
@media (max-width: 480px) { form.variations_form .vb-sw__fila { grid-template-columns: repeat(4, 1fr); } }

.vb-sw__fila.esta-colapsada .vb-sw__item:nth-child(n+6) { display: none; }
.vb-sw__mas { margin-top: .6rem; padding: .35rem .75rem; border: 1px solid #6C6D70; border-radius: 4px; background: transparent; color: #373435; font-size: .85rem; cursor: pointer; }
.vb-sw__mas:hover { border-color: #EE5F21; color: #EE5F21; }
@media (max-width: 480px) { .vb-sw__fila.esta-colapsada .vb-sw__item:nth-child(n+5) { display: none; } }

/* ===== VERBLEIT — página de contacto =================================== */

.vb-contacto {
  max-width: 1120px;
  margin: 0 auto;
  padding: 2.5rem 1.25rem 3.5rem;
}

/* Cabecera con banner */
.vb-contacto__cab {
  display: grid;
  grid-template-columns: 1fr minmax(0, 420px);
  align-items: center;
  gap: 2.5rem;
  margin-bottom: 3rem;
}

.vb-contacto__cab-texto { min-width: 0; }

.vb-contacto__eyebrow {
  display: flex;
  align-items: center;
  gap: .6rem;
  margin: 0 0 .6rem;
  color: #6C6D70;
  font-size: .8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .12em;
}

.vb-contacto__eyebrow::before {
  content: "";
  width: 28px;
  height: 3px;
  background: #EE5F21;
  border-radius: 2px;
}

.vb-contacto__titulo {
  margin: 0 0 .75rem;
  color: #373435;
  line-height: 1.15;
}

.vb-contacto__titulo em {
  font-style: normal;
  color: #EE5F21;
}

.vb-contacto__lead {
  margin: 0;
  max-width: 62ch;
  color: #6C6D70;
  font-size: 1.05rem;
  line-height: 1.6;
}

.vb-contacto__banner {
  position: relative;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  margin: 0;
  border-radius: 10px;
  clip-path: polygon(8% 0, 100% 0, 100% 100%, 0 100%);
}

.vb-contacto__banner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 38%;
  display: block;
}

.vb-contacto__banner::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 14%;
  background: #EE5F21;
  clip-path: polygon(0 0, 100% 0, 42% 100%, 0 100%);
  z-index: 1;
}

/* Títulos de sección con barra */
.vb-contacto__h2 {
  display: flex;
  align-items: center;
  gap: .7rem;
  margin: 0 0 1.25rem;
  color: #373435;
  font-size: 1.25rem;
}

.vb-contacto__h2::before {
  content: "";
  width: 4px;
  height: 1.15em;
  background: #EE5F21;
  border-radius: 2px;
  flex: none;
}

/* Botones de motivo */
.vb-contacto__botones {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  margin-bottom: 3.5rem;
}

.vb-contacto__btn {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: .4rem;
  padding: 1.25rem 3rem 1.25rem 1.25rem;
  border: 1px solid #e3e3e3;
  border-radius: 10px;
  background: #fff;
  color: #373435;
  text-decoration: none;
  transition: background .15s ease, border-color .15s ease,
              color .15s ease, transform .15s ease;
}

.vb-contacto__btn::after {
  content: "";
  position: absolute;
  right: 1.1rem;
  top: 50%;
  width: 26px;
  height: 26px;
  margin-top: -13px;
  border: 1px solid currentColor;
  border-radius: 50%;
  opacity: .55;
  background:
    linear-gradient(currentColor, currentColor) center / 8px 1.5px no-repeat;
}

.vb-contacto__btn:hover,
.vb-contacto__btn:focus-visible {
  background: #EE5F21;
  border-color: #EE5F21;
  color: #fff;
  transform: translateY(-2px);
}

.vb-contacto__btn:hover::after,
.vb-contacto__btn:focus-visible::after { opacity: 1; }

.vb-contacto__btn:focus-visible {
  outline: 3px solid #FDBD2F;
  outline-offset: 3px;
}

.vb-contacto__icono {
  width: 28px;
  height: 28px;
  margin-bottom: .35rem;
  color: #EE5F21;
}

.vb-contacto__btn:hover .vb-contacto__icono,
.vb-contacto__btn:focus-visible .vb-contacto__icono { color: #fff; }

.vb-contacto__btn-tit {
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.25;
}

.vb-contacto__btn-txt {
  font-size: .85rem;
  line-height: 1.4;
  opacity: .78;
}

/* Datos de la empresa */
.vb-contacto__datos {
  padding: 2rem 1.75rem;
  border-radius: 12px;
  background: #f7f7f7;
}

.vb-contacto__lista {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.5rem 2.5rem;
  margin: 0;
  padding: 0;
}

.vb-contacto__fila {
  position: relative;
  margin: 0;
  padding-left: 2.4rem;
}

.vb-contacto__fila::before {
  content: "";
  position: absolute;
  left: 0;
  top: .1rem;
  width: 22px;
  height: 22px;
  border: 2px solid #EE5F21;
  border-radius: 4px;
}

.vb-contacto__fila dt {
  margin: 0 0 .2rem;
  color: #6C6D70;
  font-size: .78rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.vb-contacto__fila dd {
  margin: 0;
  color: #373435;
  font-size: 1rem;
  line-height: 1.5;
}

.vb-contacto__fila dd a { color: #EE5F21; }

@media (max-width: 900px) {
  .vb-contacto__cab { grid-template-columns: 1fr; gap: 1.75rem; }
  .vb-contacto__banner { clip-path: none; }
  .vb-contacto__botones { grid-template-columns: repeat(2, 1fr); }
  .vb-contacto__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .vb-contacto__botones,
  .vb-contacto__lista { grid-template-columns: 1fr; }
  .vb-contacto { padding: 1.75rem 1rem 2.5rem; }
  .vb-contacto__datos { padding: 1.5rem 1.25rem; }
}

@media (prefers-reduced-motion: reduce) {
  .vb-contacto__btn { transition: none; }
  .vb-contacto__btn:hover { transform: none; }
}

/* --- Ajustes de presentación --- */

/* Quitar subrayado heredado del tema en las tarjetas */
.vb-contacto__btn,
.vb-contacto__btn:hover,
.vb-contacto__btn * { text-decoration: none; }

/* Tarjeta destacada en naranja fijo */
.vb-contacto__btn--activa {
  background: #EE5F21;
  border-color: #EE5F21;
  color: #fff;
}
.vb-contacto__btn--activa .vb-contacto__icono { color: #fff; }

/* Título y descripción en dos líneas, flecha alineada */
.vb-contacto__btn {
  padding: 1.5rem 3.25rem 1.5rem 1.4rem;
  min-height: 165px;
}

/* Flecha: punta en vez de guion */
.vb-contacto__btn::after {
  background: none;
  border-width: 1.5px;
}
.vb-contacto__btn::before {
  content: "";
  position: absolute;
  right: 1.72rem;
  top: 50%;
  width: 7px;
  height: 7px;
  margin-top: -4px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(-45deg);
  opacity: .55;
  z-index: 1;
}
.vb-contacto__btn:hover::before,
.vb-contacto__btn--activa::before { opacity: 1; }

/* Banner: diagonal más marcada */
.vb-contacto__banner { aspect-ratio: 16 / 9; }
.vb-contacto__banner::before {
  width: 22%;
  clip-path: polygon(0 0, 100% 0, 55% 100%, 0 100%);
}
/* ===== fin página de contacto ========================================== */
/* Banner ya compuesto: sin diagonal de CSS */
.vb-contacto__banner {
  aspect-ratio: 1909 / 824;
  clip-path: none;
  border-radius: 8px;
}
.vb-contacto__banner::before { display: none; }
.vb-contacto__banner img { object-position: center center; }
/* Iconos del bloque de datos */
.vb-contacto__fila::before { display: none; }

.vb-contacto__fila-ico {
  position: absolute;
  left: 0;
  top: .05rem;
  width: 24px;
  height: 24px;
  color: #EE5F21;
}

.vb-contacto__datos-lead {
  margin: -.5rem 0 1.75rem;
  color: #6C6D70;
  font-size: .95rem;
}
/* ===== Selector de color: columna lateral con paginación ================ */
.woocommerce div.product .vb-sw__item.is-activa { border-color: #EE5F21; }
.vb-sw__item--oculta { display: none !important; }

/* Miniaturas en la columna izquierda de la galería */
.woocommerce div.product .woocommerce-product-gallery .vb-sw-lateral {
  grid-column: 1;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .6rem;
  width: 88px;
  z-index: 2;
}
.woocommerce div.product .vb-sw-lateral .vb-sw__fila {
  display: grid;
  grid-template-columns: 88px;
  gap: .5rem;
}
.woocommerce div.product .vb-sw-lateral .vb-sw__item { box-sizing: border-box; width: 88px; }
.woocommerce div.product .vb-sw-lateral .vb-sw__item img { width: 78px; height: 78px; }
.woocommerce div.product .vb-sw-lateral .vb-sw__nav { margin: 0; }
.woocommerce div.product .vb-sw-lateral .vb-sw__flecha span { display: inline-block; transform: rotate(90deg); }

/* Respaldo: variable con galería propia, los colores siguen a la derecha */
form.variations_form .vb-sw__fila { grid-template-columns: repeat(4, 88px); justify-content: start; }
form.variations_form .vb-sw__nav { margin-top: .6rem; }

/* Flecha: especificidad alta para ganarle al rosado de Hello Elementor */
.woocommerce div.product .vb-sw__flecha {
  width: 38px;
  height: 38px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #6C6D70;
  border-radius: 50%;
  background: transparent;
  color: #373435;
  font-size: 1.4rem;
  line-height: 1;
  cursor: pointer;
  transition: border-color .15s ease, color .15s ease;
}
.woocommerce div.product .vb-sw__flecha:focus {
  background: transparent;
  border-color: #6C6D70;
  color: #373435;
  outline: none;
}
.woocommerce div.product .vb-sw__flecha:hover {
  background: transparent;
  border-color: #EE5F21;
  color: #EE5F21;
}
.woocommerce div.product .vb-sw__flecha:focus-visible {
  outline: 3px solid #FDBD2F;
  outline-offset: 2px;
}
/* Móvil: foto arriba, colores en fila debajo */
@media (max-width: 767px) {
  .woocommerce div.product div.images.woocommerce-product-gallery:has(.vb-sw-lateral) {
    grid-template-columns: 1fr;
  }
  .woocommerce div.product .woocommerce-product-gallery:has(.vb-sw-lateral) > .woocommerce-product-gallery__wrapper {
    grid-column: 1;
    grid-row: 1;
  }
  .woocommerce div.product .woocommerce-product-gallery .vb-sw-lateral {
    grid-column: 1;
    grid-row: 2;
    flex-direction: row;
    width: 100%;
  }
  .woocommerce div.product .vb-sw-lateral .vb-sw__fila {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    flex: 1 1 0;
    min-width: 0;
  }
  .woocommerce div.product .vb-sw-lateral .vb-sw__item { width: 100%; }
  .woocommerce div.product .vb-sw-lateral .vb-sw__item img { width: 100%; height: auto; aspect-ratio: 1; }
  .woocommerce div.product .vb-sw-lateral .vb-sw__flecha span { transform: none; }
}
/* ===== fin selector ==================================================== */
/* ===== Contacto (página 26): sin título del tema ======================= */
.page-id-26 .page-header,
.page-id-26 h1.entry-title { display: none; }

.page-id-26 .vb-contacto__eyebrow { font-size: 1rem; }
.page-id-26 .vb-contacto__eyebrow::before { width: 34px; }
/* Banner: sin franjas claras del archivo */
.page-id-26 .vb-contacto__banner {
  aspect-ratio: 1867 / 824;
  clip-path: polygon(13.3% 0, 100% 0, 100% 100%, 2% 100%);
}
.page-id-26 .vb-contacto__banner img { object-position: left center; }
/* ===== fin contacto ==================================================== */
/* === Carrito: aviso "añadido al carrito" (2026-09-17) === */
body .woocommerce-message {
  border-top: 0;
  border-left: 4px solid #EE5F21;
  background: #FFF6F1;
  color: #373435;
  border-radius: 6px;
}
body .woocommerce-message::before {
  color: #EE5F21;
}
body .woocommerce-message:focus,
body .woocommerce-message:focus-visible {
  outline: none;
}
body .woocommerce-message a.button.wc-forward {
  background: #EE5F21;
  color: #fff;
  border-radius: 4px;
  font-weight: 600;
}
body .woocommerce-message a.button.wc-forward:hover {
  background: #D4501A;
  color: #fff;
}
@media (max-width: 600px) {
  body .woocommerce-message a.button.wc-forward {
    float: none;
    display: block;
    width: 100%;
    text-align: center;
    margin: .75em 0 0;
  }
}

/* === Carrito (bloque WooCommerce) 2026-09-17 === */
body .wc-block-cart__submit-button,
body .wc-block-components-checkout-place-order-button {
  background: #EE5F21;
  color: #fff;
  border-radius: 4px;
  font-weight: 700;
  text-decoration: none;
}
body .wc-block-cart__submit-button:hover,
body .wc-block-components-checkout-place-order-button:hover {
  background: #D4501A;
  color: #fff;
}
body .wc-block-cart-item__image img {
  width: 100%;
  max-width: 96px;
}
body .wc-block-components-product-name {
  color: #373435;
  text-decoration: none;
  font-weight: 600;
}
body .wc-block-components-product-name:hover {
  color: #EE5F21;
  text-decoration: underline;
}
body .wc-block-components-product-metadata__description {
  display: none;
}
body .wc-block-components-totals-item__label {
  color: #6C6D70;
}

/* === Mini carrito en el menú (2026-09-18) === */
body .vb-mc-item {
  display: flex;
  align-items: center;
}
body .vb-mc-enlace {
  display: inline-flex;
  align-items: center;
  gap: .45em;
  position: relative;
  color: #373435;
  text-decoration: none;
  line-height: 1;
}
body .vb-mc-enlace:hover {
  color: #EE5F21;
}
body .vb-mc-icono {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  display: block;
}
body .vb-mc-datos {
  display: inline-flex;
  align-items: center;
  gap: .45em;
  font-size: .85em;
}
body .vb-mc-cantidad {
  position: absolute;
  top: -6px;
  left: 14px;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  border-radius: 9px;
  background: #EE5F21;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 17px;
  text-align: center;
}
body .vb-mc-total {
  white-space: nowrap;
  font-weight: 600;
}
body .vb-mc-vacio .vb-mc-cantidad {
  display: none;
}
body .vb-mc-vacio .vb-mc-total {
  display: none;
}
@media (max-width: 767px) {
  body .vb-mc-total {
    display: none;
  }
}
/* Carrito (bloque): mostrar solo el total por línea, sin repetir el precio unitario */
.wp-block-woocommerce-cart .wc-block-cart-items__row .wc-block-cart-item__prices { display: none !important; }

/* Checkout: mostrar solo el total por línea, sin repetir el precio unitario */
.wp-block-woocommerce-checkout .wc-block-components-order-summary-item__individual-prices { display: none !important; }