.elementor-331 .elementor-element.elementor-element-b4e78a0{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-widget-theme-archive-title .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-331 .elementor-element.elementor-element-82f478d{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;text-align:start;}.elementor-331 .elementor-element.elementor-element-82f478d .elementor-heading-title{color:var( --e-global-color-cb8cfe8 );}.elementor-331 .elementor-element.elementor-element-d3f0ab0{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-widget-wc-archive-products.elementor-wc-products ul.products li.product .woocommerce-loop-product__title{color:var( --e-global-color-primary );}.elementor-widget-wc-archive-products.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{color:var( --e-global-color-primary );}.elementor-widget-wc-archive-products.elementor-wc-products ul.products li.product .woocommerce-loop-product__title, .elementor-widget-wc-archive-products.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-wc-archive-products.elementor-wc-products ul.products li.product .price{color:var( --e-global-color-primary );font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-wc-archive-products.elementor-wc-products ul.products li.product .price ins{color:var( --e-global-color-primary );}.elementor-widget-wc-archive-products.elementor-wc-products ul.products li.product .price ins .amount{color:var( --e-global-color-primary );}.elementor-widget-wc-archive-products{--products-title-color:var( --e-global-color-primary );}.elementor-widget-wc-archive-products.products-heading-show .related-products > h2, .elementor-widget-wc-archive-products.products-heading-show .upsells > h2, .elementor-widget-wc-archive-products.products-heading-show .cross-sells > h2{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-wc-archive-products.elementor-wc-products ul.products li.product .price del{color:var( --e-global-color-primary );}.elementor-widget-wc-archive-products.elementor-wc-products ul.products li.product .price del .amount{color:var( --e-global-color-primary );}.elementor-widget-wc-archive-products.elementor-wc-products ul.products li.product .price del {font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-wc-archive-products.elementor-wc-products ul.products li.product .button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-wc-archive-products.elementor-wc-products .added_to_cart{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-wc-archive-products .elementor-products-nothing-found{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-331 .elementor-element.elementor-element-c23669b.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-331 .elementor-element.elementor-element-c23669b.elementor-wc-products ul.products li.product .woocommerce-loop-product__title{color:var( --e-global-color-cb8cfe8 );}.elementor-331 .elementor-element.elementor-element-c23669b.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{color:var( --e-global-color-cb8cfe8 );}.elementor-331 .elementor-element.elementor-element-c23669b.elementor-wc-products ul.products li.product .price{color:var( --e-global-color-accent );}.elementor-331 .elementor-element.elementor-element-c23669b.elementor-wc-products ul.products li.product .price ins{color:var( --e-global-color-accent );}.elementor-331 .elementor-element.elementor-element-c23669b.elementor-wc-products ul.products li.product .price ins .amount{color:var( --e-global-color-accent );}.elementor-331 .elementor-element.elementor-element-c23669b.elementor-wc-products ul.products li.product .price del{color:var( --e-global-color-cb8cfe8 );}.elementor-331 .elementor-element.elementor-element-c23669b.elementor-wc-products ul.products li.product .price del .amount{color:var( --e-global-color-cb8cfe8 );}.elementor-331 .elementor-element.elementor-element-c23669b.elementor-wc-products ul.products li.product span.onsale{display:block;}@media(max-width:1024px){.elementor-331 .elementor-element.elementor-element-c23669b.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}}@media(max-width:767px){.elementor-331 .elementor-element.elementor-element-c23669b.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}}/* Start custom CSS for container, class: .elementor-element-b4e78a0 *//* ===========================================================
   BERNALO · TIENDA · 1/2 · TÍTULO
   Clase: bn-tienda-titulo
   Ponla en el contenedor del título (o en el widget del título):
   Editar → Avanzado → Clases CSS → bn-tienda-titulo

   Pegar en Apariencia → Personalizar → CSS adicional.

   Distinto al de categorías: allá el título va sobre banda verde;
   aquí va en blanco, grande, con una regla de báscula debajo.
   =========================================================== */

.bn-tienda-titulo {
  --bn-green: #2B3D2A;
  --bn-ink: #1A2419;
  --bn-muted: #687365;
  --bn-border: #DCE1D9;
  --bn-sans: "Archivo", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  position: relative;
  margin: 0px 0 26px !important;
  padding: 0 0 22px !important;
  background: transparent !important;   /* quita la banda oscura del tema */
  font-family: var(--bn-sans) !important;
}

/* Regla de báscula debajo del título */
.bn-tienda-titulo::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: 0; height: 14px; opacity: .5;
  background:
    repeating-linear-gradient(90deg, var(--bn-ink) 0 1px, transparent 1px 56px) bottom / 100% 14px no-repeat,
    repeating-linear-gradient(90deg, var(--bn-border) 0 1px, transparent 1px 11px) bottom / 100% 7px no-repeat;
}

/* Sirve con la clase en el contenedor o directo en el título */
.bn-tienda-titulo h1,
.bn-tienda-titulo h2,
.bn-tienda-titulo .elementor-heading-title,
.bn-tienda-titulo .woocommerce-products-header__title,
.bn-tienda-titulo .page-title,
h1.bn-tienda-titulo,
h2.bn-tienda-titulo {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  font-family: var(--bn-sans) !important;
  font-size: clamp(2.4rem, 5vw, 4rem) !important;
  font-weight: 800 !important;
  font-stretch: 112%;
  font-variation-settings: "wdth" 112;
  line-height: 1.02 !important;
  letter-spacing: -0.02em;
  color: var(--bn-ink) !important;
}

/* Bajada opcional: agrega un párrafo dentro del contenedor */
.bn-tienda-titulo p {
  max-width: 52ch;
  margin: 12px 0 0 !important;
  font-size: clamp(1rem, 1.3vw, 1.1rem);
  line-height: 1.6;
  color: var(--bn-muted) !important;
}

@media (max-width: 768px) {
  .bn-tienda-titulo { margin-top: 90px !important; }
}
@media (max-width: 480px) {
  .bn-tienda-titulo { margin: 70px 0 20px !important; padding-bottom: 18px !important; }
}/* End custom CSS */
/* Start custom CSS for wc-archive-products, class: .elementor-element-c23669b */img{
    mix-blend-mode: multiply;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-d3f0ab0 *//* ===========================================================
   BERNALO · ESTILOS PARA LA TIENDA (WooCommerce) — VERSIÓN CON CLASE
   Todo está limitado a la clase .bn-tienda: solo aplica dentro del
   contenedor de Elementor al que le pongas esa clase
   (Editar Contenedor → Avanzado → Clases CSS → bn-tienda).
   Mismo estilo del hero: Archivo, verde #2B3D2A, radio 10px.

   DÓNDE PEGARLO
   Opción A (recomendada): Apariencia → Personalizar → CSS adicional.
   Opción B: Elementor → Configuración del sitio → CSS personalizado (requiere Elementor Pro).

   Solo afecta lo que esté dentro de ese contenedor: si quieres el
   mismo estilo en las categorías o en la búsqueda, ponle la clase
   bn-tienda también a esos contenedores.
   =========================================================== */

:root {
  --bn-green: #2B3D2A;
  --bn-green-hover: #1F2D1F;
  --bn-ink: #1A2419;
  --bn-muted: #5B6858;
  --bn-soft: #F1F3EF;
  --bn-border: #D5DCD2;
  --bn-sans: "Archivo", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* Carga Archivo desde Google Fonts.
   Si el tema ya la carga, puedes borrar estas dos líneas. */
@import url("https://fonts.googleapis.com/css2?family=Archivo:wdth,wght@100..125,400..800&display=swap");

/* ---------- 1. Encabezado de la tienda ---------- */
.bn-tienda .woocommerce-products-header__title,
.bn-tienda .woocommerce-products-header .page-title,
.bn-tienda .woocommerce .products-header h1 {
  font-family: var(--bn-sans) !important;
  font-size: clamp(2.2rem, 4.4vw, 3.4rem) !important;
  font-weight: 800 !important;
  font-stretch: 112%;
  font-variation-settings: "wdth" 112;
  line-height: 1.02 !important;
  letter-spacing: -0.015em;
  color: var(--bn-ink) !important;
  margin-bottom: 8px !important;
}

/* Fila de "Mostrando 1–10 de 44" + .elementor-331 .elementor-element.elementor-element-d3f0ab0 de orden */
.bn-tienda .woocommerce .woocommerce-result-count {
  font-family: var(--bn-sans);
  font-size: .95rem;
  color: var(--bn-muted) !important;
  margin: 0 0 24px !important;
}
.bn-tienda .woocommerce .woocommerce-ordering select,
.bn-tienda .woocommerce .woocommerce-ordering .orderby {
  font-family: var(--bn-sans) !important;
  font-size: .95rem !important;
  color: var(--bn-ink) !important;
  padding: 12px 18px !important;
  background: var(--bn-soft) !important;
  border: 1.5px solid transparent !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  outline: none;
  transition: border-color .2s ease;
}
.woocommerce .woocommerce-ordering select:focus { border-color: var(--bn-green) !important; }

/* ---------- 2. Grilla de productos ---------- */
.bn-tienda .woocommerce ul.products {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.bn-tienda .woocommerce ul.products::before,
.woocommerce ul.products::after { content: none !important; }

.bn-tienda .woocommerce ul.products li.product {
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column;
  text-align: left !important;
  position: relative;
}

/* ---------- 3. Foto del producto ---------- */
.bn-tienda .woocommerce ul.products li.product a img,
.bn-tienda .woocommerce ul.products li.product .attachment-woocommerce_thumbnail {
  width: 100% !important;
  aspect-ratio: 1 / 1;
  object-fit: contain !important;
  padding: 12% !important;
  margin: 0 !important;
  background: var(--bn-soft);
  border: 1.5px solid transparent;
  border-radius: 10px !important;
  box-shadow: none !important;
  mix-blend-mode: multiply;   /* funde el fondo blanco de la foto con la tarjeta */
  transition: border-color .2s ease, transform .3s ease;
}
.woocommerce ul.products li.product:hover a img { border-color: var(--bn-green); }

/* ---------- 4. Nombre, precio y botón ---------- */
.bn-tienda .woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--bn-sans) !important;
  font-size: 1.02rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  color: var(--bn-ink) !important;
  padding: 0 !important;
  margin: 14px 0 8px !important;
}
.woocommerce ul.products li.product a:hover .woocommerce-loop-product__title { color: var(--bn-green) !important; }

.bn-tienda .woocommerce ul.products li.product .price {
  font-family: var(--bn-sans) !important;
  font-size: 1.12rem !important;
  font-weight: 700 !important;
  font-variation-settings: "wdth" 112;
  color: var(--bn-ink) !important;   /* reemplaza el verde brillante del tema */
  margin: 0 0 14px !important;
}
.bn-tienda .woocommerce ul.products li.product .price del {
  font-size: .86rem !important;
  font-weight: 400 !important;
  color: var(--bn-muted) !important;
  opacity: 1 !important;
  margin-right: 6px;
}
.bn-tienda .woocommerce ul.products li.product .price ins {
  text-decoration: none !important;
  color: var(--bn-ink) !important;
  background: transparent !important;
}

/* Botón: igual al secundario del hero */
.bn-tienda .woocommerce ul.products li.product .button,
.bn-tienda .woocommerce ul.products li.product .added_to_cart {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  margin-top: auto !important;
  min-height: 44px;
  padding: 0 18px !important;
  background: #ffffff !important;
  color: var(--bn-ink) !important;
  border: 1.5px solid var(--bn-green) !important;
  border-radius: 10px !important;
  font-family: var(--bn-sans) !important;
  font-size: .9rem !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: background-color .2s ease, color .2s ease;
}
.bn-tienda .woocommerce ul.products li.product .button:hover,
.bn-tienda .woocommerce ul.products li.product .button:focus {
  background: var(--bn-green) !important;
  color: #ffffff !important;
}
.woocommerce ul.products li.product .button.loading::after { color: inherit; }
.woocommerce ul.products li.product .added_to_cart { margin-top: 8px !important; }

/* ---------- 5. Etiqueta de oferta ---------- */
.bn-tienda .woocommerce ul.products li.product .onsale {
  position: absolute !important;
  top: 10px !important;
  left: 10px !important;
  right: auto !important;
  margin: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  width: auto !important;
  height: auto !important;
  padding: 5px 12px !important;
  background: var(--bn-green) !important;
  color: #ffffff !important;
  border-radius: 999px !important;
  font-family: var(--bn-sans) !important;
  font-size: .75rem !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  text-transform: none;
  z-index: 2;
}

/* ---------- 6. Paginación ---------- */
.bn-tienda .woocommerce nav.woocommerce-pagination ul {
  border: 0 !important;
  display: flex;
  gap: 8px;
  justify-content: center;
  margin-top: 40px !important;
}
.woocommerce nav.woocommerce-pagination ul li { border: 0 !important; margin: 0 !important; }
.bn-tienda .woocommerce nav.woocommerce-pagination ul li a,
.bn-tienda .woocommerce nav.woocommerce-pagination ul li span {
  min-width: 42px;
  padding: 10px 14px !important;
  background: var(--bn-soft) !important;
  color: var(--bn-ink) !important;
  border-radius: 10px !important;
  font-family: var(--bn-sans) !important;
  font-weight: 600 !important;
}
.bn-tienda .woocommerce nav.woocommerce-pagination ul li span.current,
.bn-tienda .woocommerce nav.woocommerce-pagination ul li a:hover {
  background: var(--bn-green) !important;
  color: #ffffff !important;
}

/* ---------- 7. Avisos de WooCommerce ---------- */
.bn-tienda .woocommerce-message,
.bn-tienda .woocommerce-info,
.bn-tienda .woocommerce-error {
  font-family: var(--bn-sans);
  border-top-color: var(--bn-green) !important;
  border-radius: 10px;
}
.bn-tienda .woocommerce-message .button,
.bn-tienda .woocommerce-info .button {
  background: var(--bn-green) !important;
  color: #ffffff !important;
  border-radius: 10px !important;
  font-family: var(--bn-sans) !important;
}

/* ---------- 8. Responsivo ---------- */
@media (max-width: 1024px) {
  .woocommerce ul.products { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 768px) {
  .woocommerce ul.products { grid-template-columns: repeat(2, 1fr) !important; gap: 14px !important; }
}
@media (max-width: 480px) {
  .woocommerce ul.products li.product .button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .bn-tienda .woocommerce ul.products li.product a img,
  .woocommerce ul.products li.product .button { transition: none !important; }
}/* End custom CSS */